Hola, soy Sergio Luján Mora, profesor de informática de la Universidad de Alicante, y en este vídeo —que forma parte del curso “Introducción al desarrollo web”— te voy a explicar cómo puedes publicar un sitio web en Internet.

En el vídeo anterior, “Cómo se publica un sitio web en Internet, parte 1”, te expliqué que para que un sitio web se pueda usar, se debe copiar desde el servidor de desarrollo hasta el servidor de producción para que esté disponible para cualquier usuario en todo momento. La copia se suele realizar mediante FTP (File Transfer Protocol), el protocolo de transferencia de archivos. Para realizar la copia se necesita un programa específico que se llama cliente de FTP.

En este vídeo vamos a utilizar un cliente de FTP llamado FileZilla. Este programa es gratuito, así que lo puedes descargar y utilizar sin miedo a que te metan en la cárcel los hombres de negro. Como puedes ver, este programa está disponible para diferentes plataformas: Windows, Linux y Mac OS X. Además, como es un proyecto open source, también te puedes descargar el código fuente.

Lo primero que descargas no es el programa en sí, sino un administrador de descargas que te hará unas preguntas. Una vez instalado el programa, te recomiendo que consultes la documentación básica: “Instrucciones de uso básicas” y “Cómo configurar FileZilla y la red local”.

A continuación, te voy a mostrar un ejemplo real de uso. Este es el programa que voy a usar para realizar la transferencia de FTP. FileZilla permite cambiar el interfaz. Ahora mismo se muestra con la interfaz por defecto, pero en el menú “Edición” > “Opciones” existe una opción llamada interfaz, donde se puede cambiar la distribución de los paneles. La distribución por defecto se llama “Clásico”, pero se pueden usar otras. En mi caso, como dispongo de una pantalla panorámica Full HD, la voy a cambiar a la vista panorámica, que me resulta más adecuada.

En esta distribución, a la izquierda tenemos el sitio local, es decir, el disco duro de mi ordenador. En el primer panel aparece la estructura de directorios y a la derecha el contenido del directorio seleccionado. A la derecha, de forma análoga, aparece el sitio remoto, que corresponde al servidor FTP al que me voy a conectar. Ahora mismo aparece vacío porque no está establecida ninguna conexión.

Hay diferentes formas de establecer una conexión. Una de ellas es la conexión rápida, que requiere introducir cuatro datos: nombre del servidor, nombre del usuario, contraseña y puerto. Por tanto, necesito disponer de estos datos de mi servidor, en el cual voy a publicar mi página web.

El ejemplo lo voy a realizar con un sitio web alojado en Hostinger, una empresa que ofrece tanto hosting gratuito como de pago. La he elegido simplemente porque la conozco, no porque sea la mejor o la peor. El primer paso es obtener los datos de mi cuenta de FTP. En la opción de administración busco los datos de acceso, que se encuentran en la sección “Acceso FTP”. Allí se proporcionan los datos que necesito en FileZilla: servidor, nombre de usuario, contraseña y puerto. El puerto se puede dejar vacío, ya que por defecto se usa el 21.

Con estos datos vuelvo a FileZilla. Copio el nombre del servidor en el campo correspondiente, después el usuario, y por último la contraseña —que ya la tenía guardada en otro lugar—, y hago clic en Conexión rápida. Al establecer la conexión, en el panel inferior aparece el log de la conexión y se activan los paneles del sitio remoto. Si la conexión falla, se muestran mensajes de error.

Por ejemplo, si introduzco mal el usuario, la conexión no se podrá establecer. En ese caso, debo revisar el registro de la conexión para detectar el error. Una vez que vuelvo a poner los datos correctos, la conexión se establece de nuevo y puedo acceder al contenido del servidor remoto.

Al conectarme, aparece la estructura de directorios del servidor: el directorio raíz, que contiene dos carpetas (logs y public_html), y un archivo que indica “no cargar aquí”. Mi sitio web no se debe cargar en el directorio raíz, sino en la carpeta public_html. Si no lo supiera, el propio sitio de alojamiento me lo indica.

Antes de subir los ficheros, observo que ya hay algunos archivos en la carpeta: default.php y .htaccess. Si accedo a mi sitio web, aparece la página por defecto proporcionada por la empresa de hosting, que corresponde al fichero default.php.

Ahora voy a subir mi propio sitio web, que es muy sencillo: está compuesto de dos páginas y una carpeta img con una imagen. Para subir los archivos puedo seleccionarlos y hacer clic derecho en “Subir”, o simplemente arrastrarlos al panel del servidor remoto. Al hacerlo, FileZilla muestra en el log la información de la transferencia y en el panel de estado aparece que los ficheros se han subido correctamente.

Si ahora recargo mi sitio web, aparece mi página “Prueba de FTP”. Contiene una imagen, un enlace a la segunda página y, desde esta, un enlace de vuelta a la primera. Es un ejemplo muy básico.

¿Por qué aparece automáticamente mi página? Porque la he llamado index.html. Los servidores web están configurados para buscar por defecto ciertos archivos, como index.html. Si no lo encuentran, muestran la página por defecto, en este caso default.php. Si yo renombro index.html como principal.html, mi página dejará de mostrarse automáticamente; solo podría acceder a ella escribiendo su nombre exacto en la URL.

Recuerda que cuando trabajamos con FTP estamos transfiriendo archivos desde nuestro ordenador al servidor remoto. En cualquier momento puedes subir una nueva versión de tu sitio. Si un archivo ya existe, el programa te preguntará si deseas sobreescribirlo, cambiarle el nombre, etc., igual que ocurre al copiar archivos en tu propio ordenador.

Para finalizar, te invito a que veas la tercera parte de este vídeo, en la que se muestra el uso de un cliente FTP en línea, a través de una página web.

Ya para terminar, me gustaría recordarte algunos de los sitios web donde puedes encontrar más información sobre mí y mi trabajo, así como dos formas de contactar conmigo: a través de mi correo electrónico sergio.lujan@ua.es y mediante mi cuenta en Twitter @sergiolujanmora.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web”, disponible en la dirección idesweb.es. Muchas gracias por tu atención.