w
Documentación Herramientas principales Open Graph Meta Generator

Guia de uso basico

Esta guia te acompana paso a paso para generar metaetiquetas Open Graph con nuestra herramienta.

Paso 1: Abrir la herramienta

Accede al Open Graph Meta Generator desde la pagina principal de herramientas o escribiendo la URL directamente.

Paso 2: Completar la informacion general

Tipo de pagina

Selecciona el tipo de contenido adecuado para tu pagina:

  • Website: Paginas web generales
  • Article: Entradas de blog, noticias, tutoriales
  • Book: Paginas de libros, libros electronicos
  • Profile: Perfiles personales o empresariales
  • Music: Pistas, albumes, listas de reproduccion
  • Video: Contenido de video, peliculas, programas de television

Titulo

Introduce un titulo atractivo para tu pagina:

  • Mantenlo por debajo de 60 caracteres para una visualizacion optima
  • Haz que sea descriptivo y atractivo
  • Incluye palabras clave relevantes de forma natural

Descripcion

Escribe una descripcion clara de tu contenido:

  • Apunta a 150-160 caracteres
  • Resume lo que los usuarios encontraran en la pagina
  • Hazla lo bastante atractiva como para fomentar los clics

URL de la pagina

Introduce la URL completa de tu pagina:

  • Usa URL absolutas (incluye https://)
  • Asegurate de que la URL sea accesible
  • Usa URL limpias y descriptivas

Nombre del sitio

Indica el nombre de tu sitio web o marca:

  • Aparecera en las publicaciones de redes sociales
  • Mantenlo coherente en todas las paginas
  • Usa tu nombre de marca oficial

Paso 3: Configurar la imagen

URL de la imagen

Proporciona la URL de la imagen para redes sociales:

  • Usa URL absolutas (incluye https://)
  • Asegurate de que la imagen sea accesible publicamente
  • Tamano recomendado: 1200x630 pixeles

Texto alternativo de la imagen

Agrega un texto alternativo descriptivo para accesibilidad:

  • Describe lo que aparece en la imagen
  • Mantenlo breve pero descriptivo
  • Es importante para los lectores de pantalla

Dimensiones de la imagen

Especifica el ancho y el alto de la imagen:

  • Ancho: normalmente 1200 pixeles
  • Alto: normalmente 630 pixeles
  • Estos datos ayudan a las plataformas sociales a optimizar la visualizacion

Paso 4: Configurar Twitter

Tipo de tarjeta

Elige el tipo adecuado de Twitter Card:

  • Summary: Tarjeta basica con titulo, descripcion y miniatura
  • Summary with Large Image: Tarjeta mejorada con imagen grande
  • App: Para promocionar aplicaciones moviles
  • Player: Para contenido de video o audio

Cuenta del sitio

Introduce el identificador de Twitter de tu sitio web:

  • Formato: @yourhandle
  • Aparecera en las publicaciones de Twitter
  • Es opcional, pero recomendable

Cuenta del creador

Introduce el identificador de Twitter del creador del contenido:

  • Formato: @authorhandle
  • Util para articulos y entradas de blog
  • Opcional

Paso 5: Generar y copiar las metaetiquetas

Una vez completada toda la informacion:

  1. Las metaetiquetas se generaran automaticamente en tiempo real
  2. Revisa el HTML generado en la seccion de salida
  3. Haz clic en el boton "Copy Meta Tags" para copiarlo al portapapeles
  4. La seccion de vista previa muestra como aparecera tu contenido en redes sociales

Paso 6: Implementarlo en tu sitio web

Agrega las metaetiquetas copiadas a la seccion HTML <head> de tu sitio web:

<head>
  <!-- Your existing head content -->

  <!-- Open Graph Meta Tags -->
  <meta property="og:type" content="website" />
  <meta property="og:title" content="Your Page Title" />
  <!-- ... other meta tags ... -->

  <!-- Twitter Meta Tags -->
  <meta name="twitter:card" content="summary_large_image" />
  <!-- ... other Twitter meta tags ... -->
</head>

Consejos rapidos

Para obtener mejores resultados:

  • Usa siempre imagenes de alta calidad y relevantes
  • Prueba tus metaetiquetas con herramientas de depuracion de redes sociales
  • Mantén titulos y descripciones dentro de los limites recomendados
  • Usa una imagen de marca coherente en todas las paginas

Errores comunes que debes evitar:

  • Usar URL relativas en lugar de URL absolutas
  • Olvidar incluir el texto alternativo de la imagen
  • Usar imagenes demasiado pequenas o demasiado grandes
  • No probar como se ven las etiquetas en distintas plataformas

Probar tus metaetiquetas

Despues de implementarlas, prueba tus metaetiquetas con:

Estas herramientas te mostraran exactamente como aparecera tu contenido al compartirse y te ayudaran a detectar cualquier problema.

Siguiente paso

Ahora que ya conoces lo basico, consulta la guia Advanced Features para conocer opciones mas avanzadas y posibilidades de personalizacion.

¿Te resultó útil esta página?