ETAPAS EN LA CREACION DE LA WEB Las etapas fundamentales para crear y colocar las páginas en Internet son: Planificar la creación de la Web. La primera etapa es pensar por anticipado y realizar un diseño preliminar. Creamos un directorio para guardar las paginas. Creamos una nueva carpeta (folder) para guardar los ficheros de nuestra página de forma ordenada en el disco duro de nuestro ordenador.. Creamos las páginas. Construimos las páginas incorporando el texto, las imágenes y los demás accesorios. Guardamos en el disco duro de nuestro ordenador los archivos creados . Es importante guardarlos ordenados y con nombres adecuados. Comprobamos que las páginas no tienen errores. A) Utilizamos la función de chequeo de Dreamweaver B) Vemos las páginas con los navegadores para comprobar que se ven como esperamos. Enviamos los ficheros al servidor de Internet. Mediante un programa FTP específico o utilizando el propio sistema que incorpora el DreamWeaver enviamos los ficheros al servidor de Internet al que accederan los visitantes. En las siguientes páginas crearemos una Web de Internet muy simple para explicar estos 6 pasos. A continuación veremos por tanto, los seis pasos para tener una Web en Internet que todo el mundo pueda visitar. ETAPA 1. PLANIFICACION Antes de crear la Web es interesante realizar una cierta planificación previa. Se trata de pensar y decidir por anticipado una serie de cuestiones fundamentales: Para qué es la Web. Qué personas serán los visitantes de la Web. Qué quiero comunicar. Qué contenidos colocaré en la Web. Qué estructura o partes tendrá la página. Cómo organizo el contenido de la Web. La estética. Qué colores, tipo de letra, tipo de imágenes... . Las mejores Web mantienen una misma estética o identidad visual en todas las páginas del sitio. Cómo coloco el contenido, qué colores e imágenes. 1. Para qué es la Web. Lo primero es pensar en los visitantes. Ver la Web desde la perspectiva de un visitante medio o mejor desde el punto de vista de los visitantes más novatos. Una cuestión fundamental es la usabilidad. Es decir que la página sea fácil de utilizar por el usuario. Algunos aspectos fundamentales de la usabilidad son: Que la página aparezca en poco tiempo. Por tanto las páginas no tienen que ser muy pesadas. Hay que mantener las páginas con pocos Kilobites incluyendo las imágenes y otros elementos. Fácil de leer. Lo normal es que intentemos que la página sea fácil de leer. Por lo tanto, hay que seleccionar un tipo de letra y sobre todo un color del fondo de la página que facilite la lectura. Debemos evitar, salvo imperativo estético las páginas con fondos negros o de colores brillantes que dificultan la lectura. Explicar desde el principio que podemos encontrar en una Web. Colocar en la portada explicaciones sencillas de los contenidos de la Web. Explicar lo que podemos encontrar en la Web y clasificar los contenidos de forma clara. Y explicar, la gente sabe leer pero no es adivina (por lo menos no todos). Estructura clara de la información. Ordenar la información en diferentes secciones y construir una estructura interna de navegación sencilla. Una buena costumbre es colocar enlaces a la portada o página principal y a las diferentes secciones desde las diferentes páginas. Por ejemplo en la parte superior de esta página se encuentra el enlace a la portada "Inicio" y al temario del curso. Enlaces significativos. Definimos de manera clara cada enlace, proporcionando información sobre lo que nos encontraremos al pulsar el enlace. Por ejemplo es mejor que que el enlace se denomine "Curso de Dreamweaver" que "Curso 1". Y mejor si se llama "Curso de Creación de paginas Web con Dreamweaver" por si el visitante no conoce el programa Dreamweaver. Que la página se pueda ver con los distintos navegadores y los distintos tipos de acceso a Internet. Por lo menos diseñar la página para que se vea sin problemas con los navegadores más utilizados. Un error frecuente es el de los programadores que emplean un navegador muy avanzado o poco conocido y construyen una página que ellos ven bien pero muchos mortales no pueden ver.. Qué contenidos. Para ser ordenados y productivos suele ser importante planificar los contenidos que colocaremos en la Web. Necesitaremos ciertos textos e imágenes para construir la página. Hay que tener en cuenta que las fotografías y contenidos suelen tener derechos de autor. Existen páginas donde podemos obtener imágenes de forma gratuita. Qué estructura tendrá la Web. Tenemos que decidir: La estructura de las páginas. Decidir cómo colocaremos el contenido, cómo lo repartimos entre las distintas partes de la página. Normalmente las páginas se estructuran en una serie de filas y columnas. Por ejemplo la siguiente portada de eresmas.com muestra una cabecera o parte superior donde va el anuncio (que pone haz clic aqui en este momento) la marca eresMas, la fecha y la entrada para usuarios. El cuerpo de la portada está dividido en tres columna dos estrechas a los lados y una central mucho más ancha. La columna de la izquierda está encabezada por la palabra consulta. Las secciones principales de la Web. Cómo ordenar las páginas de nuestro sitio en diferentes secciones. El esquema de navegación. Los enlaces que pondremos entre las páginas del sitio y el sistema de enlaces, botones o barra de navegación que usamos. Por ejemplo AulaFacil emplea unas flechas al final de la página que pulsandola conducen a la siguiente lección, así como enlaces a otras páginas. La estética. Una buena práctica cuando vamos a construir una página es visitar las más importantes del mismo tema. Si observamos las mejores páginas veremos que siguen unos ciertos patrones estéticos. Las mejores páginas suelen utilizar pocos colores distintos y los combinan de manera armoniosa. Tenemos que decidir los colores distintivos de nuestra Web. Al comenzar un error típico es emplear un número excesivo de colores y una combinación inadecuada. Por ejemplo en la portada de eresmas.com, tal como se muestra en la imagen superior, se utilizan básicamente dos colores, un naranja y un tono celeste. Y decidimos el tipo de letra y el tamaño. Por ejemplo muchos portales emplean tipos de letra pequeños y ciertos tipos de letra como verdana. ETAPA 2. DEFINIR UN SITIO CON DREAMWEAVER. Para poder gestionar de forma más rápida una Web de cierto tamaño además de guardar los ficheros en un directorio, es importante definir un Sitio. Al definir un sitio Dreamweaver sabe que esos ficheros corresponden a una misma Web. De esta forma se pueden realizar toda una serie de operaciones mucho más rápidamente y con menos errores. Por tanto, es altamente aconsejable cuando la Web es algo compleja crear previamente un Sitio para la misma. Pulsamos sobre Site en la Barra superior y seleccionamos New Site Aparece el cuadro "Site definition" o Definición del Sitio. A continuación empleamos este cuadro para ponerle nombre y crear el sitio. A) Ponerle nombre al Sitio. Este cuadro nos permite asignar un nombre al sitio o Web. En "Site Name" o Nombre del Sitio borramos lo que pone "Unnamed Site 1" y escribimos el nombre para nuestra Web. En nuestro ejemplo hemos elegido como nombre del sitio MisMascotas. Ahora necesitamos un directorio (carpeta o folder) dentro de nuestro disco duro para guardar laWeb. Si ya tenemos creado el directorio que queremos utilizar con el explorador de Windows nos saltamos el siguiente paso (B) B) Crear un directorio para guardar el Sitio. Pulsamos sobre la imagen de la carpeta que aparece al final de Local Root Folder. En el Cuadro que aparece pulsamos sobre la imagen amarilla de una carpeta tal como se muestra en la siguiente imagen para crear la nueva carpeta. Se crea una carpeta con el nombre "Nueva carpeta". Le cambiamos el nombre pulsando el final de "Nueva carpeta", lo borramos y escribimos el nombre que deseamos para la carpeta que guardará los archivos de nuestro Sitio. Escribimos MiWeb como nombre de la nueva carpeta. Y es importante pulsar Enter. C) Seleccionar un directorio como Sitio para la Web. Ya tenemos creado el directorio para guardar los ficheros. Ahora hay que seleccionarlo como el Sitio donde se colocará la Web. Pulsamos de nuevo sobre la carpeta amarilla del cuadro Site Definition. Y seleccionamos el directorio que deseamos asignar a nuestro Sitio haciendo doble clic sobre el mismo. Por ejemplo el que hemos creado MiWeb. Y pulsamos Guardar Aceptamos la creación de cache pulsando sobre "OK" o Aceptar en el Cuadro que aparece. El Cuadro Sitio o "Site" aparece y nos permite gestionar los ficheros que componen nuestra Web, en el disco duro del ordenador. ORGANIZANDONOS DESDE EL PRINCIPIO Los ordenadores (computadoras para los amigos de América) tienen tendencia a ser cuadriculados y nos entran ganas de tirarlo por la ventana cuando no conseguimos que la página funcione. Para evitar algunos de los problemas más usuales (lo sé por propia esperiencia) es preciso organizarse desde el principio. Un primer problema típico es el nombre que damos a los directorios o carpetas (folder). Algunos navegadores no admiten la "ñ" o los acentos o algunos símbolos. Por lo tanto la primera regla sería elegir un nombre sólo con las palabras del vocabulario Inglés y sin espacios. Lo mismo es válido para los nombres de los ficheros. Por tanto escribir nombres sin espacios, sin acentos, sin símbolos raros y sin ñ. Utilizar nombres que nos resulten fáciles de reconocer. Por ejemplo en vez de poner directorio4 escribimos cursodreamweaver como nombre del directorio. Y en vez de directorio5 imágenes y lo mismo para los ficheros. Utilizar la misma estructura del sitio en el disco duro de nuestro ordenador y en el servidor de Internet. Esta es una cuestión FUNDAMENTAL y una de las causas principales de problemas cuando se comienza a crear páginas Web. Por tanto, utilizaremos el mismo esquema de directorios en el disco duro de nuestro ordenador y en el servidor de Internet. Esta importante cuestión de como organizar los ficheros lo estudiamos a continuación. Los ficheros de la página Web Una página web está constituida por una serie de archivos. Los archivos más usuales son: Los archivos correspondientes a las páginas. Por ejemplo esta página que estas viendo es un fichero con terminación htm que incorpora el texto que estás leyendo. Además la página incluye una serie de instrucciones del lenguaje htm que permanecen ocultas y que hacen que por ejemplo el texto del titular superior aparezca en azul. Los archivos que guardan las imágenes. Las páginas Web suelen incorporar imágenes que se guardan en archivos inpedendientes. Por ejemplo en la esquina superior de la pantalla aparece una imagen naranja de AulaFacil que es un archivo independiente. Ficheros que incorporan multimedia y complementos dinámicos. Archivos que contienen los sonidos, video u otros accesorios multimedia. Por ejemplo los sonidos correspodientes al curso de Inglés de AulaFacil se encuentran guardados en distintos ficheros independientes. Los Archivos de programas. En los servidores de Internet se instalan programas para realizar diferentes actividades. Por ejemplo un programa CGI que recibe la información que los visitantes escriben en una encuesta que colocamos en la Web y la envia a una dirección de correo. Los ficheros correspondientes a bases de datos y páginas dinámicas. Las bases de datos permiten la interactividad de las páginas.