Programación

Cómo utilizar el marcado Schema.org en su sitio web y por qué debería hacerlo

Cómo utilizar el marcado Schema.org en su sitio web y por qué debería hacerlo / Programación

Los motores de búsqueda son increíblemente poderosos. 7 Alternativas de búsqueda de Google y sus características de marca. 7 Alternativas de búsqueda de Google y sus características de marca. ¿Es usted un usuario insensible de Google? Prueba estos motores de búsqueda alternativos. Desde la privacidad hasta ayudar a causas benéficas, estos motores de búsqueda podrían darle algunas razones para cambiar la forma en que navega. Lee mas . Pueden interpretar el lenguaje a menudo poco claro que utilizamos para descubrir lo que estamos buscando, determinar el mejor recurso para responder nuestras preguntas y mostrarlo en fracciones de segundo.

Google incluso se está volviendo realmente bueno respondiendo preguntas en la página de resultados de búsqueda, obviando la necesidad de hacer clic en cualquier cosa. Incluso personaliza los resultados de búsqueda Cómo deshabilitar la personalización de Google de los resultados de búsqueda Cómo deshabilitar la personalización de Google de los resultados de búsqueda Leer más. Y eso ayuda a las personas a encontrar la información que buscan más rápido..

Pero los motores de búsqueda no pueden hacerlo por sí solos: necesitan la ayuda de los propietarios y desarrolladores del sitio. Y el marcado de esquemas es una forma en la que puede ayudar en su propio sitio.

¿Qué es el marcado de esquema?

El marcado de esquema es una forma de resaltar partes específicas de datos estructurados.

¿Qué son los datos estructurados? Sus información que está organizada y etiquetada Para que pueda ser mejor entendido por las máquinas. En resumen, el marcado de esquema es información que ayuda a los motores de búsqueda a encontrar tipos específicos de información en su página web. Es más fácil mirar un ejemplo.

Google tiene su propio ejemplo interactivo de marcado de esquema que detalla una receta de pastel de manzana:

Más arriba, puede ver el JavaScript que define el tiempo de preparación, el tiempo total, el rendimiento de la receta y diversos datos nutricionales de la receta..

En este punto, debe señalarse que hay dos formas principales de marcar los datos estructurados: con JSON ¿Qué es JSON? Descripción de un laico ¿Qué es JSON? La visión general de un Layman Tanto si planea ser un desarrollador web como si no, es una buena idea al menos saber qué es JSON, por qué es importante y por qué se utiliza en toda la web. Leer más o con etiquetas HTML en línea. Google recomienda el método JSON, pero veremos ambos más adelante..

Aquí es cómo Google saca la información específica de nutrición:

Schema.org tiene miles de diferentes tipos de marcado que puede utilizar para mostrar mejor la información de su página en los motores de búsqueda. El tipo TechArticle, por ejemplo, incluye, entre muchas otras cosas, los siguientes atributos:

  • nivel de competencia
  • el recuento de palabras
  • audiencia
  • creador
  • fecha de creacion
  • fecha modificada
  • fecha de publicación
  • publicaciónPrincipios
  • typicalAgeRange

Hay un esquema completo para bibliotecas, empresas de alojamiento, apartamentos, eventos de artes visuales, canales de transmisión, métodos de entrega, estados del servidor de juegos y más.

La idea es asegurarse de que los motores de búsqueda sepan lo que realmente representa cada pieza de información en su página, para que pueda mostrar esas piezas de información a las personas que las buscan..

Los beneficios del marcado de esquema

DE ACUERDO. El marcado de esquema le dice a los motores de búsqueda lo que está en su página, ¿cuál es el problema??

Google lo pone así:

“Cuando la información es altamente estructurada y predecible, los motores de búsqueda pueden organizarla y mostrarla más fácilmente de manera creativa..”

Por ejemplo, puede ver las fechas de las próximas visitas de Slayer que se muestran directamente en los resultados de búsqueda:

O obtenga información específica sobre una película cuando la busque:

Google está mejorando todo el tiempo al encontrar esta información por sí solo, pero el uso correcto del marcado de esquema facilita el proceso y lo hace más probable que la información en su página se muestre..

Y cuando los motores de búsqueda saben exactamente qué hay en su página, pueden mostrarlo a las personas que lo están buscando dentro de los resultados de búsqueda. Y eso es bueno para todos..

Primeros pasos con datos estructurados

Ahora que ha visto los beneficios de usar el marcado de Schema.org, es hora de comenzar a sumergirse. Comenzaremos con la herramienta más sencilla: el resaltador de datos de Google.

Necesitará que su sitio esté conectado a la Consola de búsqueda de Google (anteriormente conocida como Herramientas para webmasters) Obtenga información más detallada de búsqueda para su sitio con las Herramientas para webmasters Consultas de búsqueda Obtenga información más detallada de búsqueda para su sitio con las herramientas para webmasters Consultas de búsqueda Cambios en la herramienta de consultas de búsqueda en Google Webmasters podría cambiar la forma en que realiza su investigación de temas. La generación de contenido en la web implica creatividad y enfoque en el usuario, y mucha investigación de palabras clave. Leer más). Si necesita ayuda para configurarlo, consulte el útil tutorial de Yoast.

Una vez que hayas hecho eso, inicia sesión en Search Console y haz clic en Apariencia de búsqueda> Resaltador de datos. Golpea el Empezar a resaltar botón en el lado derecho de la pantalla.

A continuación, deberá ingresar la URL de la página que desea etiquetar y seleccionar el tipo de marca que va a realizar. En este caso particular, utilizaremos el tipo de marca de artículos..

Porque estoy destacando un artículo en un sitio que publica muchos artículos, lo mantendré Etiqueta esta página y otras similares comprobado.

Ahora verá una pantalla dividida: su página a la izquierda y los campos de marcado disponibles a la derecha.

Es muy simple desde aquí. Simplemente comienza a resaltar! Cada vez que resalte texto (o haga clic en una imagen) aparecerá un pequeño menú donde podrá seleccionar el tipo de información que resaltó..

Aquí, he resaltado el título de la página. Todo lo que tengo que hacer es hacer clic. “Título” en el menu.

Ahora el título se rellena en el panel derecho..

Continuaré, destacando el autor, la fecha de publicación, la imagen principal y la categoría (resalté las etiquetas en la parte superior del artículo y las tres se importaron como categorías).

¡Y hemos terminado! Eso es todo al respecto.

Cuando golpeas Hecho, El resaltador de datos lo ayudará a aplicar este marcado a otras páginas similares en su sitio.

Añadiendo más detalles

El resaltador de datos solo le permite rayar la superficie del marcado de datos estructurados. Como viste anteriormente, solo pude agregar un puñado de atributos a ese artículo. El tipo de artículo de Schema.org contiene muchos más atributos que se pueden configurar.

¿Qué hacemos si queremos agregar más detalles al marcado de esquema??

Vas a tener que sumergirte en el código en este punto. Como mencioné anteriormente, hay dos formas principales de representar los datos estructurados: con JSON y con etiquetas HTML en línea. Porque las etiquetas HTML 17 Ejemplos de código HTML simple que puede aprender en 10 minutos 17 Ejemplos de código HTML simple que puede aprender en 10 minutos Si conoce las siguientes 17 etiquetas HTML (y las pocas adicionales que las acompañan), podrá para crear una página web básica desde cero o modificar el código creado por una aplicación como ... Leer más son un poco más intuitivos, los revisaremos primero..

Inline Schema.org HTML Markup

Como ejemplo, vamos a marcar una oración simple: “Yo vivo en denver.” En HTML, eso será representado simplemente, así:

Yo vivo en denver.

Para iniciar el marcado, debemos especificar que esta oración en particular es sobre una persona (mostrada por el tipo de elemento Persona). Así es como lo hacemos:

 
Yo vivo en denver.

Ahora un buscador sabrá que todo lo contenido en este

etiqueta tiene que ver con una persona.

A continuación, agregaremos un atributo de marcado: Localización de la casa. Schema.org define homeLocation como “Un lugar de contacto para la residencia de una persona.”

Necesitamos agregar ese atributo específico al HTML. Así es como lo hacemos:

 
vivo en Denver.

Ahora “Denver” se identifica como el Localización de la casa propiedad, y Google sabe que la persona identificada en este párrafo vive allí.

Si cambiamos la frase a “Vivo y trabajo en denver,” Podemos mostrar eso, también:

 
Yo vivo y trabajo en Denver.

Denver ahora se identifica como ambos Localización de la casa y ubicación de trabajo. (Gracias a Lloyd Bank y unor en Stack Exchange por describir este ejemplo).

Este es un caso bastante simple de marcado de esquema, pero entiendes la idea. Mediante el uso

y etiquetas, puede agregar atributos y propiedades a cualquier cosa en su página.

Schema.org marcado con JSON

Google recomienda usar JSON-LD (Notación de objetos de JavaScript para datos vinculados) para el marcado de esquema. La mayor ventaja de este método es que mantiene su HTML mucho más limpio. Si vuelves a editar una página y ves docenas de páginas de código con marcado, no serás feliz.

El marcado JSON aún requiere mucho espacio, pero está separado de su HTML, lo que facilita su mantenimiento.

Supongamos que tiene una librería llamada Harker's y ha incluido la siguiente información en su página de contacto:

Teléfono: 555-8710 Dirección: 749 Stoker St., Boulder, Colorado Horario: 10-9 de lunes a viernes, 11-8 sábado, 12-5 domingo

Así es como representarías eso con JSON-LD:

Esto va en el encabezado de su página. Como puede ver, esto ocupará mucho espacio, ya que este contenido casi seguramente también se mostrará en su página en HTML. Así que todo lo que quieras marcar será escrito dos veces..

Sin embargo, a pesar de esa duplicación, el método JSON es a menudo preferible, ya que separa el marcado del esquema y su HTML. Muchas prácticas recomendadas de HTML 9 errores que no debe cometer al crear una página web 9 errores que no debe cometer cuando construye una página web Estos errores siguientes de codificación HTML son fáciles de cometer, pero si los elimina antes o después, La página se verá mejor, será más fácil de mantener y funcionará como usted lo desee. Leer más parece un poco extraño hasta que te das cuenta de que hacen que los sitios sean más fáciles de mantener. Esto es lo mismo.

Adición de marcas de esquema a su sitio

Ahora que ha visto algunas formas diferentes de agregar notación de datos estructurados a su sitio, ¡puede comenzar! Es una buena idea comenzar con el Resaltador de datos y continuar desde allí. La documentación de Schema.org es el recurso definitivo, pero es un poco difícil de hojear.

No importa si desea ir a lo básico o comenzar a marcar todo lo que está a la vista, ahora tiene los recursos que necesita para comenzar.!

¿Ha utilizado el marcado Schema.org en su propio sitio? ¿Tiene algún consejo para propietarios de sitios o desarrolladores que quieran comenzar? Comparte tus pensamientos en los comentarios a continuación!

Crédito de la imagen: iinspiration via Shutterstock.com

.