You don't have access to this class

Keep learning! Join and start boosting your career

Aprovecha el precio especial y haz tu profesión a prueba de IA

Antes: $249

Currency
$209
Suscríbete

Termina en:

2 Días
6 Hrs
39 Min
39 Seg

Semántica del HTML

16/35
Resources

It is important to verify that a title is as title h1, subtitles as h2 or h3, images as <img> and paragraphs as <p>. This is known as semantic HTML and it is essential because visually it seems that the text has these attributes, but when analyzing the code it is not so.

In this way it is possible to indicate the structure to the algorithms so that they can understand the content and help to position in case of a match with a search query. To verify this we only have to place ourselves in the url to analyze and with left click (or opposite to the main one by default in your mouse) we say inspect.

HTML_Semantico.jpg

This is how it looks when inspecting the code, if you want to know a little more in detail, other types of tags that may appear and know what they mean this post may be useful: List of HTML5 Elements.

HTML_Semantico2.jpg

With the Chrome extension Minion SEO you can also get a status, install it, open the url you want to analyze and simply click on the extension icon, select Analyze SEO on the page and when scrolling on the report. There you will see the tags with the associated content.

Contribution created with the contributions of: Sandra Liliana Delgado Gomez.

Contributions 17

Questions 5

Sort by:

Want to see more contributions, questions and answers from the community?

Aquí es importante verificar que un título este como título <h1> , los subtítulos igual <h2>…. Las imágenes como <img> y párrafos como <p> esto es lenguaje html, dado que en algunas ocasiones visualmente parece que lo tuviera pero al analizar el código no lo es así.

Esto es importante para indicarle la estructura a los algoritmos y así pueda comprender el contenido y ayudarle a posicionar en caso de hacer match con alguna consulta de búsqueda.

Para verificar esto solamente debemos ubicarnos en la url a analizar y con click izquierdo (o contrario al principal por defecto en su mouse) le decimos inspeccionar

.
Así se ve al inspeccionar el código, si se quiere conocer un poco más a detalle otro tipo de etiquetas que les puedan aparecer y saber que significan este post puede ser de utilidad: Lista de Elementos HTML5

.

.
Con la extensión de Chrome Minion SEO también se puede obtener un estado, la instalan, abren la url que quieren analizar y simplemente dan click sobre el icono de la extensión y seleccionan Analizar SEO en la página y al hacer scroll en el informe verán las etiquetas con el contenido asociado según etiqueta

Hasta el momento este curso me fascina pero me gustaría que nos enseñe a profundizar de cómo hacerlo nosotros mismos sin ningún tercero

Les recomiendo la extensión para el navegador llamada Detailed SEO Extension, que permite analizar estos atributos y jerarquías.

100 % recomiendo el curso de Accesibilidad Web, ahí aprenderás mucho de HTML semántico. De una vez te recomiendo la extensión NoCoffee que te permite simular problemas de visión en tu navegador (Así podrás probar si la página es clara o usable para una persona con problemas de visión)

RESUMEN: Que una pagina sea semántica quiere decir que su contenido esta bien estructurada tiene los H1, donde debe ir y no debe tener mas de uno, utiliza las etiquetas adecuadas, como en las imágenes usa <img>, en los párrafos <p>.

A que se debe esto, esto se debe a que muchas webs usan los <divs>, que generalmente sirven para todo, como una salida fácil para agregar algún contenido, eso no afecta a la experiencia de las personas, ellos seguiran viendo el contenido tal cual, pero los motores de búsqueda no interpretan el contenido, no saben a que te refieres, no se dan cuenta si es un párrafos, titulo o subtitulo, por lo tanto no te posicionan bien

Recomendado el curso de Accesibilidad Web 👍

Dos años después de publicado este curso con el ejemplo de almacenes brisa, el mismo sitio sigue con las misma observaciones.

Si se muestra el texto alt= almohadas

yo uso SEO meta en 1 click que es una extensión de Google hay muchas extensiones que te dicen los H1 metadescripciones y demás factores

Existe una extensión de google chrome genial para visualizar la Jerarquía de Títulos. Se llama Web Developer. Desplegamos las opciones de la extension, y simplemente de damos click en (View Document Outline)

Les recomiendo la extensión SEO META in 1 Click

El curso 15 de profundidad y niveles de paginación no deja ingresar, esta cómo dañado

baia baia 🤔

Hay alguna herramienta para poder crawlear y encontrar masivamente este tipo de errores? ya que hacerlo manualmente pagina por pagina seria algo muy dificil de llevar a cabo en un sitio grande.

Creo que la imagen si tiene una etiqueta alt? O me equivoco?

Como acotación, en otro curso de SEO se mencionaba que es recomendable usar sólo un título con h1.

En resumen, NO se deben colocar textos en imágenes, a menos que NO queramos que se indexen y que Google los rastree. Y la verdad, todos los que buscamos lo mejor para nuestras páginas o marcas queremos que Google tome en cuenta nuestro contenido y sepa lo que vendemos o hacemos.