Contenidos
Diseño de páginas web
Las páginas web son como cualquier otro documento. Se componen de varias partes esenciales que contribuyen al conjunto. En el caso de las páginas web, estas partes son las imágenes y los vídeos, los titulares, el contenido del cuerpo, la navegación y los créditos. La mayoría de las páginas web contienen al menos tres de estos elementos, y muchas contienen los cinco. Algunas páginas web pueden tener también otras áreas, pero estas cinco son las más comunes.
Las imágenes son un elemento visual de casi todas las páginas web. Atraen la mirada y ayudan a dirigir a los lectores a partes específicas de la página. Pueden ilustrar un punto y proporcionar un contexto adicional para el tema de la página. Los vídeos hacen lo mismo, añadiendo un elemento de movimiento y sonido a la presentación.
Después de las imágenes, los titulares son el siguiente elemento más destacado en la mayoría de las páginas web. La mayoría de los diseñadores web utilizan algún tipo de tipografía para crear titulares más grandes y destacados que el texto que los rodea. Además, un buen SEO requiere que se utilicen las etiquetas de titulares HTML para representar los titulares en el HTML, así como visualmente.
Página web o página de Internet
Además de definir partes individuales de tu página (como “un párrafo” o “una imagen”), HTML también cuenta con una serie de elementos a nivel de bloque que se utilizan para definir áreas de tu sitio web (como “la cabecera”, “el menú de navegación”, “la columna de contenido principal”). Este artículo analiza cómo planificar la estructura básica de un sitio web y cómo escribir el HTML para representar esta estructura.
Secciones básicas de un documentoLas páginas web pueden tener y tendrán un aspecto bastante diferente entre sí, pero todas suelen compartir componentes estándar similares, a menos que la página muestre un vídeo o un juego a pantalla completa, forme parte de algún tipo de proyecto artístico o simplemente esté mal estructurada:
Enlaces a las secciones principales del sitio; suelen estar representados por botones de menú, enlaces o pestañas. Al igual que la cabecera, este contenido suele ser consistente de una página web a otra: tener una navegación incoherente en tu sitio web sólo hará que los usuarios se sientan confundidos y frustrados. Muchos diseñadores web consideran que la barra de navegación forma parte de la cabecera en lugar de ser un componente individual, pero esto no es un requisito; de hecho, algunos también argumentan que tener las dos separadas es mejor para la accesibilidad, ya que los lectores de pantalla pueden leer las dos características mejor si están separadas.
Nombres de los elementos del sitio web
Los elementos se utilizan para crear la estructura de una página web y sirven para presentar la información de diversas maneras. JAWS interactúa con estos elementos para proporcionar la información que necesita para acceder al contenido de la página. Algunos de los elementos más comunes de las páginas web que encontrará son:
JAWS proporciona comandos fáciles de usar y recordar llamados Teclas Rápidas de Navegación para moverse rápidamente a varios elementos de una página web. Pulse una sola letra en su teclado y muévase hacia un elemento. Por ejemplo, puede pulsar la T para las tablas, la F para los controles de formularios, la V para los enlaces visitados, la H para los títulos, etc. Añada SHIFT a cualquier tecla rápida de navegación para pasar al elemento anterior de ese tipo.
Por ejemplo, un usuario vidente puede recorrer visualmente los encabezados de una página hasta encontrar el que desea y luego centrarse en el texto de esa sección. Del mismo modo, utilizando JAWS, puede pulsar H para desplazarse rápidamente por todos los encabezados de una página hasta localizar el que desee y, a continuación, empezar a leer con las teclas de FLECHA.
JAWS puede mirar una página web y compilar listas de párrafos, enlaces, encabezados, campos de formulario y otros elementos para que puedas encontrar rápidamente lo que necesitas y desplazarte a la información. Pulse INSERT+F3 para abrir el cuadro de diálogo Características virtuales de HTML. Este cuadro de diálogo le permite elegir entre una serie de listas que contienen información sobre diferentes tipos de elementos de la página actual. Seleccione un elemento y pulse ENTER para ver una lista de todos esos elementos.
Menú del sitio web
Tenga en cuenta que la página de inicio no siempre es la primera página en la que aterrizan los visitantes cuando entran en su sitio web (especialmente si tiene una estrategia inteligente de marketing y SEO basada en la educación). Por lo tanto, todas las páginas de su sitio web deberían llevar a los visitantes a saber más sobre usted y a actuar, no sólo la página de inicio.
Aunque los sliders eran muy populares hace varios años, no suelo recomendar el uso de sliders en el diseño de sitios web modernos. Consulte este artículo para conocer muchas razones por las que los sliders no hacen un gran trabajo para que los visitantes tomen acción.
A menudo escuchamos a los clientes llamar a estos “pestañas” en la parte superior del sitio, pero los menús diseñados para parecer pestañas son básicamente inexistentes en 2018. En lugar de llamar a estas “pestañas”, en su lugar nos escuchará referirse a los elementos del menú como “enlaces” o “páginas” en el menú.
Ten en cuenta que la navegación puede incluir menús de navegación primarios y secundarios. Se utilizan dos menús de navegación separados cuando puede haber mucha navegación necesaria, y se quiere tener claro qué enlaces son los más importantes.