Texto en un sitio Web - Diferencias tags strong, em, b, i, u

Los elementos lógicos han dominado el marcado HTML desde XHTML 1.0, eliminando muchos elementos en formato físicos como font, u, s, entre otros más.

Texto en un sitio Web - Diferencias tags strong, em, b, i, u | Aprender HTML | Los elementos lógicos han dominado el marcado HTML desde XHTML 1.0, eliminando muchos elementos en formato físicos como font, u, s, entre otros más
COMPÁRTELO:

Antes o después, todo creador Web descubre que diseñar para la red es muy distinto a desarrollar algo que va a ser impreso.

Antes de liberar a su creador gráfico de páginas Web interior, deberá superar unos cuantos obstáculos conceptuales.

Consideremos la diferencia entre una página hecha con HTML y una generada en un procesador de texto.

Estos programas muestran el aspecto exacto del documento antes de imprimirlo, sabe qué tamaño tendrán los encabezados, qué fuente usan , si el texto envuelve de una línea a otra, etc.  Si ve algo que no le gusta, lo cambia mediante los menús y comandos de formato.

El procesador de texto, en otras palabras, le ofrece un control absoluto sobre cada detalle de su página.

La Web es un lugar más libre. Al crear un documento HTML no tiene ni idea de cómo se verá esa página en el ordenador de otro.

Esa persona puede tener su navegador configurado para no mostrar imágenes, o enseñar caracteres de tamaño grande en lugar de hacerlo con dimensiones estándar, o puede haber reducido la ventana y haberla colocado en una esquina de su escritorio.

Además, los visitantes que acceden a su sitio mediante teléfonos obtendrán otra visualización (y completamente distinta). En resumen, no puede controlar los detalles de presentación en la Web de la manera en que puede hacerlo en un formato impreso.

Sin embargo, es posible ofrecer toda la información  que un navegador Web necesita para presentar sus páginas adecuadamente.

Esto se hace estructurando las páginas de modo que los navegadores traten los elementos de la página de forma coherente, independientemente de la configuración del navegador de sus visitantes.

Estructura lógica frente a formato físico

Antes de comenzar a crear páginas Web con marcado HTML, deberá comprender otro concepto: la diferencia entre estructurar un documento (dividir su contenido en componentes distintos como encabezados, párrafos, listas, etc.) y darle formato (hacer que esos elementos sean atractivos aplicando cursivas, cambiando el tamaño de texto, añadiendo color, etc.)

Los administradores Web novatos que no entienden esta diferencia a menudo terminan dando formato cuando deberían estar estructurando, lo que resulta en páginas desordenadas y un HTML complicado de mantener.

En los inicios de la Web, este lenguaje usaba dos tipos de elementos para enfatizar la diferencia entre la estructura del documento y su formato:

  • Elementos lógicos: En ocasiones llamados semánticos, definen los componentes individuales que forman la página Web. Identifican  lo que es un encabezado, un párrafo, una lista, etc. En otras palabras nos habla sobre la estructura de la página. Los elementos lógicos, sin embargo, no definen el formato de estos componentes (qué apariencia tendrán en la pantalla).
  • Elementos físicos: En ocasiones llamados tipográficos, tratan sobre el formato. Algunos ejemplos incluyen elementos que aplican al texto cursiva, negrita, subrayado y distintas fuentes. No nos dicen nada sobre la manera en la que la página está estructurada; en su lugar, indican a los navegadores cómo dar formato al contenido.

Los elementos lógicos han dominado el marcado HTML desde que se inventó XHTML 1.0 reforzó su dominio y eliminó muchos de sus elementos físicos (como <font> para cambiar el tipo de letra y <u> para subrayar texto.)

HTML5 va un paso más allá; cambia la definición de dos elementos físicos que los programadores Web más tozudos no querían abandonar: <b> y <i>. Ahora, <b> ya no significa texto en negrita, sino texto desplazado estáticamente, e <i> ya no hace mención al texto en cursiva, sino texto en voz alternativa, como palabras extranjeras o términos técnicos.

Evidentemente, los navegadores Web no se ven afectados

Siempre muestran texto <b> en negrita y texto <i> en cursiva, a menos que use una hoja de estilo que indique lo contrario.

Pero el cambio de definición refuerza una modificación fundamental en la forma de pensar: los elementos HTML deben escribir la función lógica de las partes textuales, no su presentación tipográfica.

Seguramente se pregunte por qué los gurús de HTML tenían tanto interés en eliminar el formato de los documentos HTML. Veamos algunos motivos:

  • El formato incrustado es problemático: Tras ver el marcado de una página HTML, no querrá dar marcha atrás. Para facilitar los cambios tendrá que abrirse paso entre las etiquetas de formato que controlan márgenes, colores, fuentes y alineación.
  • Los documentos lógicos son adaptables: Al eliminar el formato de una página, aumenta su flexibilidad. Puede usar hojas de estilo para alterar el aspecto de su página Web y modificarlas cuando desee. Si tiene que mostrar la página Web de otra forma en otro dispositivo diferentes (o navegador), también es posible hacerlo.
  • Los documentos lógicos transmiten significado: Los elementos lógicos permiten que los programas externos analicen el HTML de una página. Por ejemplo, alguien podría crear un programa de búsqueda automática que analizara páginas Web y extrajera solo los encabezados de nivel superior para elaborar un minimalista resumen de página. Un programa podría buscar en Amazon.com para encontrar sólo reseñas de libros. alguien podría realizar una lista de correo basura leyendo elementos <address>. Un programa comparable que se encontrara solo con elementos físicos no produciría resultados tan interesantes.
  • Los documentos lógicos son accesibles: El software de lectura de pantalla y otras herramientas automáticas funcionan mucho mejor con las páginas estructuradas de manera lógica. Por ejemplo, un lector de pantalla puede guiar a una persona ciega por la página anunciando títulos o enlaces, sin necesidad de leerlo todo en voz alta.

NOTA:
La visión de una Web en la que los elementos indican qué contiene una página (precios, tallas, direcciones de correo, etc.) en lugar de qué aspecto tiene, se llama Web semántica. Según los visionarios que construyeron Internet, ésta podría conducir a una edad de oro del acceso a la información y a las búsquedas superinteligentes.

🤖

ChatGPT Gratis
Realiza preguntas sobre cualquier tema

¡Participa!

¡Compártelo en tus Redes Sociales!
Compartir en:

CITAR ARTÍCULO


Para tareas, investigaciones, tesis, libros, revistas, blogs ó artículos académicos

Referencia en Formato APA:

Delgado, Hugo. (2013).
Texto en un sitio Web - Diferencias tags strong, em, b, i, u.
Recuperado 27 de marzo, 2024, de
https://disenowebakus.net/el-texto-en-un-sitio-web.php

Profesor en la Universidad de Guadalajara

Hugo Delgado Desarrollador y Diseñador Web en Puerto Vallarta

Profesional en Desarrollo Web y Posicionamiento SEO desde hace más de 15 años continuos.
Contamos con más de 200 constancias y reconocimientos en la trayectoria Académica y Profesional, incluidos diplomados certificados por Google.

CONTINÚA APRENDIENDO

Menú categoría


Aprender HTML

TAMBIÉN MERECE LA PENA VISITAR:

Temas relacionados - Tags

Texto en la Web HTML Web Semántica

¿Te gustaría aprender más sobre Diseño Web?

Conoce todos los cursos y tutoriales que tenemos para ti completamente gratis
Aprender Diseño Web

¿Todavía no encuentras lo que necesitas?

Usa nuestro buscador interno para descubrir más información
Contenido relacionado:

8 Comentarios en "Texto en un sitio Web - Diferencias tags strong, em, b, i, u"

  1. Avatar usuario
    Jose

    Web semántica. Según los visionarios que construyeron Internet, ésta podrí­a conducir a una edad de oro del acceso a la información y a las búsquedas superinteligentes.

  2. Avatar usuario
    Eliazar Gonzalez Zepeda

    Si una pagina web esta correctamente estructurada y el texto que contiene es coherente y fácil de entender entonces significa que es una pagina que se preocupa por llegar a sus usuarios finales que son los que le darán el retoque a esta.

  3. Avatar usuario
    Ana Nazmin Rodriguez

    Al momento de diseñar una pagina web no se debe de olvidar tener en cuenta dos aspectos, la estructura que llevara la pagina y el formato de la letra. La estructura hará que la pagina se visualice de manera mas ordenada y estética en conjunto con el formato que se le dará a letra, utilizando la tipografí­a y colores adecuados para que llame la atención al usuario.

  4. Avatar usuario
    Edson Rodriguez

    Es importante que el sitio web este bien estructurado, como saber que formato de texto se usara para que sea interesante para el lector, asi como tambien saber acerca de las dos partes que integran la pagina web.

  5. Avatar usuario
    Jonelly Berzaid Toledo Fletes

    Los textos y el formato suelen ser uno de los factores más importantes en nuestro sitio web, ya que tiene que se el contenido original y de calidad esto nos permitirá conseguir un buen posicionamiento en los buscadores, y por ende nuestro website tendra más cantidad de visitantes.Una forma que brinda buenos resultados y causa iniciativa al visitante a leer mas nuestro artí­culos. como dato importante es nunca caer en párrafos que sean demasiado extensos ya que esto es tedioso y aburrido para el lector

  6. Avatar usuario
    Andrea Gutiérrez Alcalde

    Los elementos HTML deben tener la función lógica de las partes textuales, no su presentación tipográfica. Debemos cuidar los textos que usaremos para la creación de nuestro proyecto y el texto también que haremos visible para el cliente. Nos podemos apoyar en hojas de estilo para el formato del texto y recordar las letras que definan cualquier acción en HTML.

  7. Avatar usuario
    Cinthya Yadira Dí­az Villaseí±or

    Es necesario saber distinguir las dos partes que integran una página web, la primera es la estructura que tendrá el contenido y la segunda el formato tipográfico que este tiene. En la actualidad, y con HTML 5, se busca separar estas dos partes, y utilizar por lo tanto HTML solo para la creación de la estructura de la página y utilizar hojas de estilo para el formato del texto, de esta manera se consigue tener páginas más ordenadas y con los formatos visuales deseados.

  8. Avatar usuario
    Monserrat Carballo Coronado

    Es importante que un sitio web este bien estructurado, desde el texto, tipo de letra, colores hasta las imágenes. Ya que le dan un formato mas visual.

 

Deja tu Comentario

PATROCINADOR

Tu negocio también puede aparecer aquí. Más información
Anunciate aquí

Tu navegador ha bloqueado la publicidad.
Por favor 🙏 permite visualizar los anuncios para poder acceder, gracias.