Ejemplos de elementos de diseño web
Contenidos
HTML se compone de etiquetas y atributos. Tanto las etiquetas como los atributos componen los elementos HTML. Las etiquetas de un elemento HTML indican al navegador lo que queremos que aparezca en una página web. Los atributos son cualidades de un elemento concreto. Añaden información a un elemento HTML, haciendo que las etiquetas HTML sean más potentes.
Hay dos tipos de etiquetas. Las que se cierran solas y las que no. La mayoría de los elementos se componen de etiquetas no autocierre. A continuación se muestra el formato general de las etiquetas no autocierre y sus atributos.
Es importante que escriba las etiquetas y sus atributos asociados en minúsculas. De lo contrario, el navegador no mostrará las páginas correctamente. Además, los lectores de pantalla encontrarán problemas al leer el HTML que se les proporcione. Comprenderás mejor las etiquetas y atributos HTML a medida que avances en este libro. No te preocupes si esto es nuevo para ti. En general, HTML es fácil de entender, y los editores de texto profesionales te ayudarán a generar determinados elementos HTML. Incluso incluyen sugerencias a medida que escribes, que te ayudan en la inclusión de atributos. Dicho esto, los navegadores son muy “flexibles” cuando se trata de código HTML; “intentarán” entender su código, pero éste puede no mostrarse en silencio si el HTML no está escrito correctamente. El resto de una página puede mostrarse como un encabezado entero si, por ejemplo, olvidamos cerrar el elemento heading. Comenzamos ahora nuestro viaje hacia la escritura de sitios y aplicaciones. En primer lugar, introduciremos los elementos HTML que ayudan a mostrar la información. En capítulos posteriores, introduciremos elementos HTML que muestran formularios y medios. A lo largo del camino, haremos todo lo posible por vincular los elementos que presentamos a un caso particular relacionado con la accesibilidad.
¿Cuántos elementos hay en una página web?
En el caso de las páginas web, estas partes incluyen imágenes y vídeos, titulares, cuerpo del contenido, navegación y 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.
¿Cómo se llama un elemento de una página web?
Un elemento es una parte de una página web. En XML y HTML, un elemento puede contener un dato, un fragmento de texto, una imagen o nada. Un elemento típico incluye una etiqueta de apertura con algunos atributos, contenido de texto adjunto y una etiqueta de cierre. Elementos y etiquetas no son lo mismo.
Lista de elementos web
Cuando entras en una página web, todos los elementos que ves delante de ti -los textos de los párrafos, los banners de la página y los enlaces de navegación- son elementos de la página web. El término elemento no es más que un nombre que se da a cualquier pieza de una página web. Muchos elementos HTML son en realidad invisibles para los visitantes y trabajan silenciosamente entre bastidores para proporcionar a los rastreadores web y a los motores de búsqueda información útil sobre el sitio.
Una sola página puede contener cientos o miles de elementos, pero al fin y al cabo, toda página HTML debe tener un mínimo de cuatro elementos críticos: los elementos HTML, head, title y body.
La etiqueta <html> mantiene cada elemento web en su sitio y cumple la función de portada del libro; todos los demás elementos HTML se encapsulan dentro del elemento <html>. La etiqueta también permite a los navegadores web saber: “¡Eh, soy una página web HTML!”, para que el navegador sepa cómo renderizarla. Recuerda cerrar tus documentos HTML con la correspondiente etiqueta </html> para indicar el final del documento HTML.
Ahora guarde su archivo seleccionando – Menú y luego Guardar. Haga clic en el cuadro desplegable Guardar como tipo y seleccione la opción Todos los archivos. Cuando se te pida que nombres tu archivo, nómbralo – index.html. Comprueba que lo has hecho todo correctamente y pulsa – Guardar. Ahora abre tu archivo en un nuevo navegador web para que puedas actualizar la página y ver los nuevos cambios.
Tipos de elementos web
La cabecera es la parte superior de un sitio web. Suele ser lo primero que ven los visitantes al entrar en un sitio y casi siempre contiene el logotipo de la marca y el menú del sitio web. Este menú es el mapa del sitio que ayuda a los visitantes a encontrar lo que buscan, ya sean detalles sobre su producto o información sobre su empresa.
Las cabeceras típicas incluyen sus páginas web más esenciales, que pueden variar en función del tipo de sitio web que esté creando. Si tiene una tienda en línea, por ejemplo, puede dividir su cabecera en categorías basadas en los tipos de artículos que vende. Por otro lado, si tiene un sitio web sin ánimo de lucro, una página de donaciones en la cabecera sería probablemente más apropiada. En pocas palabras, incluir las categorías adecuadas en la cabecera es esencial para ayudar a los visitantes a encontrar sus páginas más importantes y, en última instancia, puede marcar la diferencia entre un sitio web exitoso y uno fracasado.
Inmediatamente debajo de la cabecera hay algún tipo de imagen, serie de imágenes o, a veces, un vídeo. Juntos, el encabezado y la imagen principal conforman la sección superior de su sitio web -a menudo denominada above the fold- y son esenciales para crear una buena primera impresión. La imagen destacada, en particular, marca una notable diferencia en si los usuarios permanecen en su sitio web o lo abandonan segundos después de entrar.
Ejemplos de elementos 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 incluyen imágenes y vídeos, titulares, cuerpo del contenido, navegación y 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 concretas 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 o títulos 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 HTML de titulares mediante para representar los titulares en el HTML, así como visualmente.