Desmitificar IndieWeb en un sitio de WordPress | consejos CSS

Bueno, shh. Abrí una pequeña caja de Pandora al compartir "¿Todavía estoy en IndieWeb?" de Miriam? con un breve mensaje lamentando mi propia dificultad para subirme al tren de IndieWeb. Pero es una buena caja de Pandora.

Creo que fue algo así como el día después de publicar este breve artículo que David Shanske se acercó y se ofreció a ayudarme a comprender IndieWeb y los componentes que incluye. ¡Y si no fuera ridículamente útil! Tanto es así que me gustaría vincularlo a una nueva publicación que David escribió después de nuestra conversación y luego resumir las cosas aquí lo mejor que pueda porque (1) es útil escribir las cosas y (2) tener una referencia para más adelante.

Sí, IndieWeb es confuso.

De hecho, David había ayudado a alguien a configurar su sitio de WordPress con los poderes de IndieWeb. Esta persona también tenía problemas para entender cómo encajaban las diferentes piezas. Así que David ya tenía esta idea en mente cuando Miriam y yo estábamos escribiendo.

"IndieWeb" es un término nuevo para mucha gente y aquí es donde se genera gran parte de la confusión. ¿Es un marco? ¿Una filosofía? ¿Un conjunto de normas? Dependiendo de quién sea, las expectativas cambian en cuanto a cómo es ser parte de él.

Es un poco de todo lo anterior. Y eso hay que consolidarlo un poco. No hay nada intrínsecamente confuso sobre IndieWeb en sí mismo una vez que lo ves a través de estos diferentes lentes. Después de leer la publicación de David, me di cuenta de que IndieWeb es más un conjunto de protocolos. Algo así como trabajar con datos estructurados u OpenGraph en marcado. No hay nada que instalar per se, pero existen estándares para incorporarlos a su trabajo.

Tu identidad potencia IndieWeb. En otras palabras, su sitio establece su identidad y puede usarse para hacer muchas cosas, como:

  • Notificar a otros sitios compatibles con IndieWeb cuando se mencionen
  • Recibe notificaciones de otros sitios de IndieWeb cuando te mencionen
  • Recuperar información de una mención y formatearla para mostrarla
  • Autentique su identidad a través de su propio sitio web (tiene un botón de inicio de sesión de Google allí pero conectado a su sitio)
  • …Entre otros.

Si eso suena como pingbacks, bueno, más o menos lo es. Pero mucho más robusto y mantenido.

Es diferente (y quizás más fácil) implementar la funcionalidad IndieWeb en WordPress que en un sitio estático.

La gran diferencia es que WordPress proporciona muchos de los requisitos necesarios para hacer cosas de IndieWeb-y. Me gusta como lo explica David:

La implementación de IndieWeb en WordPress es una [series] de bloques de construcción que puede elegir usar o no, lo que lo hace maravilloso, pero a veces confuso. WordPress tiene una filosofía de decisiones, no de opciones. Pero IndieWeb tiene que ver con las opciones... creando las funciones que funcionan para usted.

Estos componentes básicos son complementos que instala para agregar protocolos y tecnologías de IndieWeb a WordPress. Es genial que estén fácilmente disponibles porque requiere mucho trabajo. Sin embargo, al ejecutar un sitio estático, se ve obligado a establecer la mayor parte de esto usted mismo.

La publicación de David está 100% enfocada en la implementación de WordPress. Su millaje puede variar, pero definitivamente obtendrá una mejor idea de los protocolos disponibles y cómo encajan después de leer su artículo, y con suerte este también.

El complemento IndieWeb WordPress establece su identidad.

Pensé que estaba haciendo tantas cosas detrás de escena, pero es mucho más simple que esto:

El complemento solo maneja el establecimiento de su identidad como lo ve IndieWeb. Ofrece plantilla de tarjeta h y widget. H-Card es el marcado para marcar información sobre una persona o lugar. Así que es algo que mucha gente elige poner en su sitio de todos modos.

Entonces, realmente, es posible lograr el mismo tipo de cosas al etiquetar correctamente un tema de WordPress. La conveniencia aquí es que obtienes un pequeño modelo práctico que está marcado para admitir el h-card formato abierto y un widget para soltarlo en el área de widgets de un tema.

Aquí hay un ejemplo súper detallado de h-card marcado tomado de la documentación para Microformats2:

<div class="h-card">
  <img class="u-photo" alt="photo of Mitchell"
       src="https://webfwd.org/content/about-experts/300.mitchellbaker/mentor_mbaker.jpg"/>
  <a class="p-name u-url"
     href="http://blog.lizardwrangler.com/" 
    >Mitchell Baker</a>
 (<a class="u-url" 
     href="https://twitter.com/MitchellBaker"
    >@MitchellBaker</a>)
  <span class="p-org">Mozilla Foundation</span>
  <p class="p-note">
    Mitchell is responsible for setting the direction and scope of the Mozilla Foundation and its activities.
  </p>
  <span class="p-category">Strategy</span>
  <span class="p-category">Leadership</span>
</div>

¿Ves esos nombres de clase? cursos como .h-card, u-photo, p-nameetc. todos proporcionan un significado contextual a la identidad de una persona, que luego se analiza como JSON:

{
  "items": [{ 
    "type": ["h-card"],
    "properties": {
      "photo": ["https://webfwd.org/content/about-experts/300.mitchellbaker/mentor_mbaker.jpg"],
      "name": ["Mitchell Baker"],
      "url": [
        "http://blog.lizardwrangler.com/",
        "https://twitter.com/MitchellBaker"
      ],
      "org": ["Mozilla Foundation"],
      "note": ["Mitchell is responsible for setting the direction and scope of the Mozilla Foundation and its activities."],
      "category": [
        "Strategy",
        "Leadership"
      ]
    }
  }]
}

El complemento no envía, recibe ni analiza. En cambio, proporciona una forma para que un sitio de WordPress verifique su identidad en el marcado.

No todos los temas de WordPress admiten microformatos

Si te rascaste la cabeza la primera vez que viste "Microformatos" como yo, David lo define bien:

[…] Microformatos… una forma de marcar HTML para ayudar a identificar elementos. Es una de las muchas formas de hacerlo, pero es muy simple y legible, por lo que es popular en la comunidad IndieWeb.

El problema, continúa David, es que muchos temas no están marcados de forma compatible con los microformatos, algo que el complemento Microformats2 está diseñado para resolver. Dicho esto, David se apresura a decir que el complemento es extremadamente limitado en la forma en que logra esto, y recomienda etiquetar a mano un tema en su lugar.

Según David, el próximo lanzamiento importante del complemento Webmention probablemente incluirá formas más inteligentes de detectar contenido e imágenes que pueda estar usando y formatearlos para que sean compatibles con Microformats2.

Índice
  1. Sí, IndieWeb es confuso.
  2. Es diferente (y quizás más fácil) implementar la funcionalidad IndieWeb en WordPress que en un sitio estático.
  3. El complemento IndieWeb WordPress establece su identidad.
  4. No todos los temas de WordPress admiten microformatos
  • Las menciones web envían y reciben notificaciones.
  • Los enlaces semánticos recuperan y procesan datos.
    1. Brid.gy es un servicio de soporte de visualización de interacción.
  • ¡Hay mucho más!
    1. El feed actualizado
  • ¿Todo esto tiene sentido?
  • Las menciones web envían y reciben notificaciones.

    De acuerdo, entonces, si ha establecido su identidad a través de su sitio para ser visible y su sitio está etiquetado para h-card compatible con microformatos2. ¡Excelente! Aún necesita algo en el medio que funcione como un operador que envía y recibe notificaciones. En otras palabras, cuando otro sitio lo menciona, llamado Webmention, el sitio que lo menciona necesita una forma de admitir el envío de esa mención, y su sitio necesita una forma de aceptarla (o viceversa).

    Para eso está el complemento Webmention. Esta es también probablemente la fuente de la mayor parte de mi confusión IndieWeb. Pensé que estaba formateando datos y necesitaba un servicio adicional para enviarlos y recibirlos. ¡No! En realidad, está enviando y recibiendo los datos en lugar de crear la mención. Volviendo a David:

    En el momento de su creación, el plugin solo gestionaba la recepción y envío de menciones web, sin ocuparse de la visualización. Semantic Linkbacks, un complemento separado maneja esto no solo para webmentions, sino también para protocolos de pingback y trackback más antiguos.

    Por lo tanto, el complemento Webmention comunica notificaciones. Mientras tanto, otro complemento llamado Semantic Linkbacks es el que maneja los datos. ¿Y qué son los enlaces semánticos?

    Los enlaces semánticos recuperan y procesan datos.

    Semantic Linkbacks es otro complemento que maneja otra parte del proceso. No puedo explicarlo mejor de lo que ya lo hace David:

    Semantic Linkbacks toma una mención web, que es una notificación de que otro sitio se ha vinculado a algo en su sitio, busca el otro sitio e intenta mostrar la información. La forma en que se hace esto puede variar desde solo una foto de perfil (si puede encontrar una) hasta interpretarla como un comentario completo.

    Lo hace mediante microformatos.

    Esperaba que el complemento principal de IndieWeb ya hiciera esto, ya que maneja otras marcas. Pero solo proporciona la plantilla y el widget para obtener su identidad en su sitio. Una vez que el complemento Semantic Linkbacks detecta una mención web entrante, toma los datos, los formatea y luego intenta mostrarlos.

    Parece que el complemento se fusionará con (o será reemplazado por) una próxima versión del complemento Webmention:

    Dado que muchas personas no se sienten inclinadas o no se sienten cómodas cambiando un tema, la nueva versión de Webmentions incluirá varias formas diferentes de tratar de encontrar una imagen o un resumen para mostrar... desde OpenGraph (que Facebook y Twitter usan para mostrar las URL que se le proporcionan) para detectar la versión de la API REST de WordPress de una página y utilícela para obtener el nombre del autor y la imagen de perfil. Ninguno de ellos proporcionará tanto contexto como los microformatos, pero la experiencia seguirá siendo algo que valga la pena instalar.

    Ciertamente es bueno porque aprovecha la API REST de WordPress para la respuesta JSON y los formatos para mostrar.

    Brid.gy es un servicio de soporte de visualización de interacción.

    Una mención web puede ser una interacción, diciendo que a alguien le gusta tu publicación en Twitter o la retuitea.

    Diferenciar un me gusta de un reenvío de un comentario de todo tiene que suceder, y deberá implementar la API de Twitter (o lo que sea) para hacer esas distinciones.

    ¡Esto es algo que definitivamente puedes hacer! Pero si prefiere conectar y usar, uno de los miembros de la comunidad IndieWeb ha creado un servicio llamado Brid.gy. Creas una cuenta, conectas tu sitio y otorgas permisos de aplicación al servicio... ¡y listo!

    Lo que ha hecho Brid.gy es básicamente implementar las API para Twitter, Facebook, Instagram y otros, de modo que cuando detecta que una publicación en esos servicios interactúa con su publicación sindicada, se envía una Webmention a su sitio y pasa por el proceso de publicación. a su propio sitio.

    ¡Hay mucho más!

    Golpes rápidos:

    • IndieAuth: Es un protocolo basado en OAuth 2. El complemento establece un punto final en la API REST de WordPress que se puede usar para autenticar su identidad a través de su propio sitio alojado en sí mismo, básicamente su propio botón de inicio de sesión de Google, pero sin establecer ese punto final usted mismo o sin necesidad de hacerlo. confíe en una API alojada separada.
    • Micropub: Para aquellos que usan WordPress pero prefieren un editor diferente, pueden instalar el complemento Micropub. Esto agrega un punto final que le permite publicar contenido en su sitio y usar un editor compatible con Micropub para crear elementos en un feed de Microformats2, lo que le brinda más opciones para escribir contenido fuera del editor de bloques de WordPress.
    • Ubicación simplificada: David escribió este complemento y quedé muy impresionado cuando me lo demostró. La idea es que extraiga datos de su ubicación actual que se pueden usar para todo, desde mostrar el clima en el momento en que escribió un mensaje hasta crear un archivo completo de mensajes en un mapa integrado, según la ubicación del mensaje. Honestamente, me encantaría ver algo como esto directamente en WordPress.

    El feed actualizado

    Traté de hacer una ilustración que describiera las diferentes partes en mi última publicación, pero intentémoslo de nuevo con una comprensión actualizada de lo que está pasando:

    Describe el flujo entre un sitio compatible con IndieWeb y un sitio que lo menciona.
    (Talla real)

    ¿Todo esto tiene sentido?

    Felicitaciones a David por comunicarse y tomarse el tiempo para mostrarme cómo se ve la implementación de IndieWeb en WordPress. No puedo afirmar que entiendo completamente todos los matices, pero al menos siento que tengo una buena comprensión de los elementos (la filosofía, los protocolos y la tecnología) que se requieren para que esto suceda.

    ¡Me gustaría devolvértelo! ¿Te ayuda a aclarar las cosas? ¿Hay algo que te cuesta entender? ¿Crees que puedes configurar un sitio de WordPress con características de IndieWeb ahora? ¡Vamos a los comentarios!

    Si quieres conocer otros artículos parecidos a Desmitificar IndieWeb en un sitio de WordPress | consejos CSS puedes visitar la categoría Estilo.

    Deja un comentario

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

    Subir

    Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas