Consejos antes de publicar la página
Cómo subir las páginas a la Web
- ¡Hola!
- Hola, ¿te gusta mi barba?
- ¿Cómo dices?
- Me creció mientras te esperaba...
- Bueno, bueno, perdona. Ya te dije que hago lo que puedo... ¿Y tú has hecho algo? No me has enviado ningún ejemplo.
- Estooo, será mejor que empecemos.
- Sí, claro. Vamos a empezar hablando sobre cómo subir tu sitio a Internet. Después hablaremos de un par de problemillas que suelen aparecer al publicar las páginas web y cómo resolverlos. Esta vez será un tutorial cortito.
- Ok, me parece muy bien.
- Naturalmente, lo primero que necesitas es un espacio para subir tus páginas.
- Naturalmente. ¿Y dónde lo encuentro?
- Hay muchos servicios de alojamiento gratuito. Normalmente a cambio ponen publicidad en tu página, para poder costear el servicio. Estos anuncios no tienen por qué coincidir con la temática o los intereses de tu web, y no tienes control sobre ellos. Al final resulta que todos tus esfuerzos por conseguir visitas (¡que no son pocos!) los aprovecha mucho más la compañía que te da el hosting que tú, y con el precio que tiene el alojamiento web en realidad, realmente no vale la pena.
- Muy bien.
- La manera más fácil y más cómoda de subir tus ficheros a tu espacio web es con FTP. ¿Te acuerdas del FTP, no?
- Sí, protocolo de transferencia de ficheros. Para transferir ficheros, ¿no?
- Sí, muy bien. Te aconsejo que elijas un servicio que te permita subir tus archivos por FTP. Entonces, asumiremos que tienes acceso por FTP.
- Vale, ¿y eso qué significa?
- A ver cómo te lo explico... ¿Tú sabes qué es un servidor?
- ¿Un servidor de Internet? Es una computadora conectada a Internet, ¿no?
- Sí, una máquina especial conectada permanente a Internet. En cierto modo, se llama servidor porque está siempre a tu servicio. Tú le pides una página web y él te la da.
- Quién lo habría dicho...
- Sí. Entonces un servidor FTP es una máquina que te permite subir tus ficheros a Internet. Todo lo que necesitas es un nombre de usuario y una contraseña para poder conectarte. Y eso te lo da tu proveedor de hosting.
- Ah, vale.
- Ahora necesitas un cliente de FTP, es decir, un programa que te permita conectarte con el servidor y comenzar a transferir ficheros.
- Lógico. ¿De dónde lo saco?
- Lo más probable es que tu sistema operativo ya venga con uno (aunque casi nadie lo sabe). Pero será mejor uno que sea más sencillo de utilizar. Para Windows te recomiendo FileZilla. Es gratis y está muy bien. También es probable que tu editor de páginas web te permita realizar transferencias por FTP.
- Bueno, me bajaré el FileZilla ese.
- Buena idea. Ahora es muy sencillo. Configuras en el programa tu cuenta, te conectas y transfieres tus archivos desde tu computadora al servidor (o al revés), pulsando en las flechitas. Hay varios tutoriales sobre el uso de FileZilla en la red. Léete alguno, ¿lo harás?
- Sí, sí, lo prometo.
- Bien, un par de consejos sobre el FTP:
- Es muy recomendable que los nombres de tus archivos sólo tengan letras minúsculas, o números, nada de espacios ni símbolos raros ni eñes ni letras con acentos. Eso te hará la vida muuucho más fácil, créeme.
- Existen dos maneras de transferir ficheros por FTP: en modo ASCII o en modo binario. El modo ASCII es para ficheros de texto, por ejemplo, documentos HTML, hojas de estilo CSS, scripts de Perl, etc. En general, todo lo que haya sido creado con un editor de texto. El modo binario es para todos los demás ficheros, por ejemplo, imágenes, ejecutables, animaciones, archivos comprimidos, etc. Normalmente los clientes de FTP suponen cuál es el modo en que tienen que trasferir el fichero según su extensión, y lo hacen automáticamente, pero en todo caso si te encuentras con problemas podrían estar causados por esto. (Por ejemplo, un error muy típico es subir un script CGI Perl en modo binario desde Windows.)
- De acuerdo, no sé de qué estás hablando pero lo tendré en cuenta.
- ¡Ay, paciencia! ¿Qué no entiendes?
- Eso de "subir un script CGI Perl en modo binario desde Windows" te ha quedado muy esotérico...
- Bah, no te preocupes, ya te lo explicaré cuando hablemos de formularios.
- Ok, ok...
- Muy bien, pues eso es todo. Realmente no tiene mucho secreto.
- Bueno, eso espero. Supongo que será cuestión de acostumbrarse, como todo.
- Sí, claro. Bueno, ¿seguimos?
- Seguimos.
Acentos y símbolos especiales
- Bien. Al subir tus páginas a la Web es posible que te encuentres con un pequeño problema.
- ¡No me digas! ¿Cuál?
- Que desaparezcan todos los acentos. A veces pasa. La ñ se convierte en q, la í se convierte en m, el signo ¿ se convierte en ?, etc. Sería un poco largo de explicar ahora, tiene algo que ver con las codificaciones de caracteres, y todo eso. De todas formas, lo importante es que tiene fácil arreglo.
- Ah, bueno, entonces...
- ¿Te acuerdas de cuando hablamos sobre referencias a entidades de caracteres?
- Mmmm, la verdad es que no...
- Sí hombre, lo vimos en el tutorial cuarto. Son códigos especiales que empiezan con un & y terminan con un punto y coma, y te puse como ejemplo el código para el símbolo del copyright, ©
- Ah, sí, es verdad.
- Bien, pues con estos códigos podemos poner caracteres acentuados y otros símbolos especiales sin miedo a que desaparezcan al subir la página a la Web.
- ¿Quieres decir que hay un código para cada carácter acentuado?
- Sí, hay muchos códigos. Puedes ver la lista completa en la especificación de HTML. Pero si escribes en castellano con estos te valdrán:
á | á | Á | Á |
---|---|---|---|
é | é | É | É |
í | í | Í | Í |
ó | ó | Ó | Ó |
ú | ú | Ú | Ú |
ñ | ñ | Ñ | Ñ |
¿ | ¿ | ¡ | ¡ |
ü | ü | Ü | Ü |
< | < | > | > |
& | & |
- O sea que cada vez que quiera escribir á tengo que poner á ¿no?
- Bueno, en teoría no debería ser necesario, aunque como te he dicho es la mejor manera de asegurarte de que tu documento se verá lo mejor posible. De todos modos lo recomendable, si ves que tu servidor se come los acentos, es convertir los caracteres a sus referencias antes de subir el documento a la Web. O sea, escribes normalmente, conviertes los caracteres con el editor (con la función de reemplazar) y entonces lo subes.
- Ajá, entiendo.
- Además habría que decirle al navegador qué codificación de caracteres estamos usando, que es nuestro casos erá la ISO-8859-1...
- ¡Alto ahí! Tradúceme eso al castellano.
- Es algo un poco difícil de explicar, y es un poco lioso. ¿De verdad quieres que te lo explique?
- Sí, por favor.
- Muy bien. En primer lugar, existe una cosa llamada Conjunto Universal de Caracteres, o en inglés Universal Character Set (UCS). En teoría, contiene todos los posibles caracteres que se pueden escribir en todos los idiomas.
- Impresionante.
- ¿Verdad que sí? Bueno, en segundo lugar, existe otra cosa que se llama Conjunto de Caracteres del HTML, que son todos los caracteres que entiende un intérprete de HTML. Pues bien, resulta que el conjunto de caracteres del HTML es igual que el conjunto de universal caracteres.
- Entonces, ¿podría escribir mi documento HTML en hebreo, o en chino?
- Sí, perfectamente, pero antes tienes que avisar al navegador de que vas a utilizar cosas raras. Tienes que elegir una codificación de caracteres.
- Pero ¿por qué? Si me acabas de decir que el HTML lo entiende todo.
- Como sabes, la memoria de los ordenadores sólo acepta números. De modo que para almacenar la letra á, por ejemplo, lo que guarda él es el número 0225, que es el código de la letra á.
- Ya me estoy perdiendo, pero bueno. O sea, que cada letra corresponde a un número, ¿no?.
- Sí. Pero resulta que en el alfabeto griego, el número 0225 corresponde a la letra alpha. Entonces, si tú escribes tu documento en griego, y quieres que salgan letras griegas, tienes que decir que has utilizado la codificación griega de caracteres. Así, cuando al agente de usuario le llega el código 0225, no lo transforma en la letra á, sino en la letra griega alpha.
- O sea, que la codificación de caracteres le dice al agente de usuario a qué letra del conjunto universal de caracteres corresponde cada código numérico.
- Exactamente. En nuestro caso, como nosotros escribimos en castellano, y tenemos acentos, eñes y toda la pesca, tenemos que utilizar la codificación ISO-8859-1.
- ¿Y cuál es la codificación griega?
- La ISO-8859-7. ¿Y tú para qué quieres la codificación griega?
- No, nada, pura curiosidad.
- Bueno, el caso es que existen varias maneras de declarar la codificación, algunas mejores que otras. Lo mejor es configurar al servidor para que sea él el que anuncie la codificación usada. De hecho es muy probable que ya esté configurado para ello. Pero para estar completamente seguros, y como eso probablemente no podrás hacerlo tú ahora, lo puedes hacer en HTML sin mucho peligro. Simplemente has de poner este elemento META
en el HEAD
del documento, justo después de la etiqueta <head>
:
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
- ¡Qué cosas más raras me haces hacer!
- No es culpa mía. Bueno, como ves la cuestión de los caracteres especiales en la Web es bastante compleja. De momento nosotros nos vamos a parar aquí y no vamos a complicar las cosas más. ¿Seguimos?
- Sigamos, sigamos.
Ocultar las hojas de estilo a los navegadores antiguos
- Muy bien, para terminar, vamos a hablar un poco de otro problema con el que se pueden encontrar los que visiten nuestras páginas.
- ¿Y cuál es ese otro problema?
- Las hojas de estilo. En realidad, el problema son los navegadores que no implementan bien las hojas de estilo. Te dije en el tutorial anterior que algunos navegadores dan resultados solamente aceptables o muy malos, y que existían algunos trucos para ocultar las hojas de estilo a estos navegadores.
- Sí, recuerdo eso.
- En realidad, sólo con CSS1 no deberías tener demasiados problemas. Los tendrás sobre todo con Netscape Navigator 4. También con Internet Explorer 3, pero éste ya casi nadie lo usa. Es probable que el navegador aplique los estilos tan mal, que la página no se pueda usar o que simplemente quede horrible. Por ello es bastante normal usar el siguiente truco para evitar que estos navegadores lean una hoja de estilo:
<link rel="stylesheet" href="import.css" title="Hoja de Estilo" type="text/css" media="screen">
La hoja de estilo import.css
sólo tiene una línea, que es parecida a esta:
@import url("principal.css");
donde principal.css
es la auténtica hoja de estilo. Como NN4 e IE3 no entienden la regla @import
, no importarán ninguna de las reglas contenidas en principal.css
.
- Anda, qué ingenioso.
- Al hacer esto en estos navegadores tu página se mostrará muy sosa, en HTML puro sin colores ni adornos ni nada, pero por lo menos será perfectamente utilizable, que es lo importante.
- Sí, supongo que sí.
- De todos modos, aunque cada vez son menos los que usan estos navegadores, es posible crear una hoja de estilo sólo para Netscape Navigator 4, y vincularla al documento de este modo, con un pequeño script de javascript:
<script type="text/javascript">
<!--
if (document.layers) { // si está definido document.layers es NN4
document.write(\'<link rel="stylesheet" href="nn4.css" type="text/css" media="screen">\')
}
// -->
</script>
Resulta que en NN4 las hojas de estilo sólo están activadas si también lo está el javascript, así que esto siempre funcionará. Si recibes muchos visitantes que usen NN4 puedes plantearte esta opción.
- Sí, pero de qué me vale, si no lo entiende bien...
- Bueno, algo sí que entiende, aunque mal. Puedes ver una lista de las propiedades de CSS1 soportadas por varios navegadores confeccionada por Eric A. Meyer. Con esta tabla te puedes hacer una idea de las propiedades que puedes usar, pero en todo caso lo mejor es que pruebes tu página con unos cuantos navegadores.
- Sí, claro, cómo si no tuviera otra cosa que hacer...
- Ya lo sé, ya lo sé. Pero bueno, recuerda que lo importante es el contenido.
- Sí, y pasárselo bien.
- Sí, eso también. Bueno, cuando hablemos de posicionamiento CSS tendremos que ver más trucos de estos porque aún hay muchas diferencias de implementación entre los navegadores que más se usan actualmente. Pero de eso hablaremos en su momento...
- Ya, un año de estos, supongo...
- De momento te puedes hacer una idea del tipo de malabarismos que hay que hacer si visitas esta página de Johannes Koch.
- Eemmm, bueno, la verdad es que no entiendo casi nada...
- Normal, pero no te preocupes. Bueno, creo que ya está bien por hoy...
- ¿Ya? Pero si acabamos de empezar...
- ¿Qué más quieres? Tienes que practicar con el FTP. Puedes bajarte el WS_FTP y seguir el tutorial que te he dicho, o intentarlo con otro programa. Algunos de los editores que vienen en la página sobre editores vienen con una función de FTP incluida (como el Stone\'s Web Writer o el HTML Kit por ejemplo). Ya sabes cómo asegurarte de que salgan tus acentos, por lo menos si no escribes cosas en idiomas raros. Y también sabes cómo vincular tus hojas de estilo para que tu página sea utilizable en navegadores viejos.
- Sí... Entonces, ¿de qué vamos a hablar la próxima vez?
- De posicionamiento CSS. Es algo complicado pero ya va siendo hora de meterse en eso. Después podremos hablar un poco de javascript y de HTML dinámico, y también de formularios.
- Bueno, bueno, paso a paso.
- Sí. Espero que me enseñes tu página cuando la hayas publicado. Si tienes algún problema, pregunta en la lista, ¿ok?
- Ok. Bueno, hasta la próxima, ¡y feliz año nuevo!
- Hum... gracias, igualmente. Adiós.