Hay que tener en cuenta que hay que captar la atención del lector en un breve espacio de tiempo, por lo que habrá que tener cuidado con el aspecto de la web, la velocidad de carga y todos los factores que hagan la visita más agradable a la web.
Podríamos seguir estas sugerencias:
Colocar un título corto, descriptivo y preciso.
Proporcionar pistas sobre el contenido en la parte superior de la página. No supongas que nadie va a desplazarse hasta la parte inferior.
Si la página ocupa más de tres "pantallas", dividirla en más de una página
Equilibrar el espacio en blanco, las imágenes grandes y pequeñas, los bloques de texto para dotar a la página de interés y variedad.
Usar un color para el texto y enlaces que complemente al del fondo, en lugar de que se confundan con él.
No crear dos enlaces con el mismo nombre que lleven a sitios diferentes o dos enlaces con diferentes nombres que lleven al mismo sitio
Ofrecer siempre una forma de retornar a través de un enlace a la página principal
Evitar generalidades como "¡Haga clic aquí!"
Emplear imágenes comprimidas en los formatos adecuados
Emplear vistas en miniatura como enlaces a imágenes mayores.
Recordar que el acceso a Internet se realiza por diferentes navegadores
Mantener nombres de archivos cortos
Informar a la gente del tamaño de los ficheros descargables
Obtener el permiso necesario para emplear texto o imágenes creados por otros
Crear un enlace con la dirección de correo del webmaster
En Internet existen numerosas páginas que nos dan consejos sobre como diseñar páginas web, ofrecen modelos de páginas e incluso se critican páginas para detectar los fallos más comunes. Ejemplos de estas páginas son las siguientes:
Guía de estilo de Webestilo.com:
Nos proporciona cómo crear páginas de visualización más rápida, más cómodas y fáciles de navegar.
La web ideal: Realiza análisis sobre nuestra web para detectar errores y solucionarlos. (los análisis son de pago) Usability Methods & Tools:
describe los métodos de usabilidad y herramientas de trabajo para el desarrollo de sitios Web. (en inglés) Think Tank: Web que revisa otras páginas webs acerca de su usabilidad. Contiene numerosos artículos y críticas. Muy recomendable su lectura.
Los diez errores más frecuentes en el diseño web: Artículo de Jakob Nielsen en 1999
II Creación de páginas web básicas
Existen multitud de programas de diseño web, que nos van a permitir, sin conocer el lenguaje HTML, llegar a diseñar todo tipo de páginas. De los más usados son Microsoft FrontPage, Macromedia Dreamweaver, Adobe Golive. Además, existe software gratuito con el cual también podemos hacer diseños similares.
Tenemos un manual de diseño web con Page Mill en http://www.ciberconta.unizar.es/LECCION/web/editor.htm
En esta lección aprenderemos a manejar el FrontPage, programa de Microsoft que va incluido dentro de la suite Microsoft Office, en concreto vamos a analizar la versión FrontPage 2000.
¿Cómo empezar a crear una página Web?
Para empezar debemos tener claros los conceptos de Web y Página para FrontPage2000. Si creamos un sitio web nos va a generar una carpeta en la cual se va a generar automáticamente una página principal (llamada index.htm) y dos carpetas llamadas images y _private, donde guardaremos archivos. Podemos elegir el tipo de web que deseamos a partir del asistente y especificamos la ubicación en el disco duro.
Si creamos una página web, nos creará una página independiente y no generará las carpetas que aparecen en el sitio web. ¿Cómo lo hacemos?
Hacemos clic en Archivo, Nuevo y seleccionamos Web o Página en función de lo que queramos crear. Si creamos un sitio web podemos disfrutar de las utilidades que nos proporciona FrontPage a través de la barra de vistas.
Es muy importante que tengamos muy claro los nombres que vamos a guardar nuestros archivos y tener cuidado al utilizar mayúsculas y minúsculas en los nombres ya que serán reconocidos como diferentes. En la gran mayoría de los casos la página principal de nuestro sitio web se denominará index.htm y será la que aparezca cuando el internauta escriba la dirección de nuestra web.
1) Vistas en FrontPage
Cuando abrimos FrontPage lo primero que nos encontramos es que tiene una apariencia similar a los programas de la familia Office, con barra de título, de menús, herramientas muy similares. La particularidad es que en la parte izquierda de la pantalla aparece lo que se llama la barra de vistas, que analizamos a continuación. Para activar dicha barra de vistas si no lo está pulsaremos el botón siguiente de la barra de herramientas: El botón de activar vistas es el que está a la izquierda de imprimir
Cada vista muestra diferentes tipos de información sobre el web y permite trabajar con el sitio web de diferentes formas.
Vista página: Muestra las páginas individuales con la que se está trabajando, permitiendo hacer cambios o ajustes
Vista carpetas: Contiene dos partes, con la lista detallada de páginas y ficheros de la carpeta seleccionada del sitio web. Se utiliza esta vista para la gestión de ficheros (cambiar nombres, crear carpetas,....)
Vista Informes: Se emplea como ayuda para la gestión de las páginas dentro de la web. FrontPage trabaja con un sitio web constituido por partes más pequeñas (archivos)
Vista Exploración: También conocida como mapa del sitio. Nos muestra la estructura de navegación del sitio web.
Vista Hipervínculos: Ofrece todos los hipervínculos de la web
Vista Tareas: Para mantener una lista de tareas en curso a medida que construye el sitio web. Es especialmente útil si en el sitio trabaja más de un desarrollador.
Si trabajamos en la edición de una página para añadir y modificar elementos (texto, imágenes, gráficos,...) utilizaremos la vista página, que a su vez tiene otras tres vistas:
1) Vista Normal: En esta opción vemos la página web en formato WYSIWYG ("What you see is what you get" , "Lo que ves es lo que obtienes". Para diseñar la página web colocamos el texto, imágenes y demás elementos de la misma forma que lo veremos en Internet.
2) Vista HTML: Podemos visualizar el código HTML si queremos retocarlo para hacer algo que no podamos con FrontPage o para insertar código HTML que hemos descargado de Internet. En esta vista es necesario conocer los fundamentos y la estructura del lenguaje HTML para poder intervenir en él sin errores.