WordPress Alicante

Los números

• Apuntados a la charla: 38 personas.
• Asistentes: 32 personas.
• Se realizó el pasado 22 de octubre.

Es la primera vez en la que los asistentes reales prácticamente coinciden con los apuntados a la meetup así que gracias a todos por el esfuerzo de asistencia.

IMPORTANTE: Os recordamos que en la herramienta Slack tenemos un canal registrado para organizarnos y poder compartir la gestión de la meetup, concretamente el canal que usamos es #wpalicante de Slack WordPress España. Si quieres echar una mano, aportar ideas y formar parte más activa de esta comunidad sigue las instrucciones que aparecen en la siguiente página -> http://wp-es.es/slack/

La charla

De la mano de Antonio Sánchez, desarrollador WordPress de la meetup de WordPress Murcia, nos visita en esta ocasión para compartir con nosotros toda su sabiduría respecto del tema Storefront, que está preparado especialmente para trabajar con Woocommerce. Antonio no sólo ha investigado a fondo este tema sino que ha programado incluso un plugin para poder controlar de una forma más visual los Hooks y Filtros: Storefront Visual Hook Guide.

De la mano de este espectacular anfitrión hacemos un repaso por todo lo acontecido en la meetup. Os compartimos también la presentación sobre Storefront y plugin Visual Guide con toda la información que Antonio ha preparado para vosotros.

Os escribimos a continuación algunas notas interesantes sobre la meetup.

Generalidades del tema

• Storefront es un tema gratuito.
• Woocommerce es un plugin igualmente gratuito para gestionar una tienda online. Al tener opción de controlar envíos es ideal para venta física, es decir, de objetos que haya que enviar a los compradores.
• Glosario:

• • Templates: Archivos para modificar características de la web, como títulos.
  • Hooks: zonas dentro del código donde poder poner y quitar funcionalidades (ganchos).
  • Filtros: A diferencia de los Hooks, son selecciones de información que afectan a toda la web.
  • Etiquetado schema.org: Es lo que utiliza Google para mostrar datos enriquecidos.

• En la presentación tenéis una serie de plugins gratuitos que mejoran el tema.
  • Se han descartado aquellos plugins que están desactualizados o que el propio Storefront ha ido embebiendo en su propio código a lo largo del tiempo por ser muy interesantes.
• Existe otro tema parecido a Storefront llamado Canvas pero es de pago.
• También tenéis en la presentación otros plugins de pago muy interesantes. La mayoría cuestán menos de 40$ aunque el primero Storefront Powerpack está sobre los 59$ aunque es cierto que es un compendio de muchas funcionalidades interesantes; tienes casi todo lo que necesitas de forma adicional en un solo plugin.

Trucos avanzados en Storefront

Aquí es donde os comentamos los detalles del plugin que Antonio ha confeccionado para agilizar el trabajo con Storefront. Este tema dispone tanto de filtros como de Hooks que a veces resulta difícil encontrar a lo largo del código, sobre todo, resulta complejo saber cuáles estamos utilizando y dónde, sobre todo para los hooks.

Así que el plugin Storefront Visual Hook Guide permite:

• Ver al inicio de la web todos los filtros utilizados
• Ver cada una de las zonas de la web dispuestas con Hooks de forma visual sobre las propias pantallas. Así podemos localizarlas rápidamente y ver dentro de cada una qué funcionalidades tenemos operativas y en qué orden.
• Cuando desplegamos un Hook y vemos su contenido, si queremos modificar alguna funcionalidad tenemos que:
  • • Seleccionar el texto de la función que queremos que se realice en la web
    • Pegar dicho texto en el functions.php (preferiblemente del tema hijo y así no perderemos los cambios introducidos.
    • El número que aparece al final de la función que estamos copiando nos indica la prioridad de ejecución así que en el fondo estaremos indicando con ese número qué información se muestra antes y cuál después. Por defecto la prioridad que se asigna es 10.
    • Para añadir acciones se utiliza la función add_action
    • Para eliminar accciones se utiliza la función remove_action
    • Cada una de estas funciones tiene tres parámetros:
      • Sección afectada: por ejemplo Homepage. Esto nos lo dice el Hook sobre el que estemos trabajando.
      • Función: la funcionalidad que estamos añadiendo o eliminando
      • Prioridad: la posición en la que se muestra esta funcionalidad con respecto al resto de funcionalidades añadidas.
    • La funcionalidad añadida puede mostrar algún elemento concreto, pero también puede contener shortcodes utilizando la función do_shortcode. Por ejemplo, podríamos mostrar el carrito de woocommerce al final de Homepage gracias al shortcode que nos proporciona el propio plugin, de la siguiente forma:

  function Muestra_Carrito{ echo do_shortcode (‘[woocommerce_checkout]’); } add_action (‘homepage’,’Muestra_Carrito’,60)

• Antonio tiene previsto mejorar el plugin para añadir también los estilos CSS y que se muestren igualmente sobre la pantalla para poder modificarlos más fácilmente.
• Hay otros temas que también disponen de Hooks por lo que este plugin también será útil en esos casos, como Astra o Genesis.

Otros temas tratados en la meetup

• Weeglot:
  • Plugin de pago que traduce sorprendentemente bien las páginas, teniendo en cuenta que las traducciones muchas veces dependen del contexto y es muy difícil conseguir automatizarlas, por lo que siempre es aconsejable revisarlas tras el uso de un plugin de traducción. Aun así, éste lo resuelve bastante bien.
  • Es un plugin para webs de alto nivel, porque al conseguir traducciones de calidad no es barato. Es decir, para una empresa que factura y necesita llegar al extranjero es ideal, no para una web de andar por casa que hagamos personal.
  • No consume casi recursos porque tira de su API para hacer las traducciones.
  • Para tiendas de webs de afiliación sí vale. Es compatible con el plugin de Amazon afiliados.
• FacetWP:
  • Es un plugin de filtros avanzados para WordPress.
  • Dispone de un add-on llamado Map Facet para mostrar localizaciones sobre un mapa.
  • Si queréis echarle un vistazo, disponéis en su propia página de una demo State Parks donde ver cómo funciona.
  • Sólo da problemas si se utilizan CDNs porque carga javascripts pero en el resto de casos funciona de maravilla.
• Cuando cambias un tema y tenías widgets en un área específica de ese tema, estos se pierden. Pero realmente no se pierden del todo sino que se quedan como Widgets inactivos. Así que no tienes más que arrastrarlos de ahí a la nueva área de widgets donde quieras que aparezcan y arreglado.
• Cuando movemos widgets entre zonas se puede hacer con el clásico drag&drop o activando el modo de accesibilidad que aparece en la parte superior cuando despliegas las Opciones de pantalla. Con esto lo que conseguimos es que cada widget tenga un botón de Editar para decirle exactamente dónde ha de colocarse (a base de desplegables). Esto es útil cuando la pantalla de widgets es muy grande y hay que hacer mucho scroll para arrastrar un widget desde la parte inferior de la pantalla hasta su posición correcta en el nuevo área.

Algunas fotos

 

Los números

• Apuntados a la charla: 49 personas.
• Asistentes: 27 personas.
• Se realizó el pasado 17 de septiembre.

IMPORTANTE: Os recordamos que hemos retomado la herramienta Slack para organizarnos como grupo y poder compartir la gestión de la meetup, concretamente el canal que usamos es #wpalicante de Slack WordPress España. Si quieres echar una mano, aportar ideas y formar parte más activa de esta comunidad sigue las instrucciones que aparecen en la siguiente página -> http://wp-es.es/slack/

La charla

Todavía con la resaca de la Wordcamp Valencia 2018, nuestros compañeros Flavia y Joaquín nos ponen un poco al día de lo que allí aconteció y nos traen su ponencia en tierras valencianas para los que no pudimos asistir.

En general, nos comentan que una Wordcamp es como una meetup pero a lo grande, donde se realizan interesantes ponencias y se ponen en común temas que preocupan a todos. Recordemos que WordPress se desarrolla bajo licencia GPL y eso significa que el software es libre y por tanto cualquier persona tiene acceso y puede modificarlo a su gusto. Hay una gran comunidad de personas involucradas que de forma desinteresada mantienen tanto plugins como temas y foros. Recordad que en el foro en español de wordpress podéis incluir cualquier duda o problema que os haya surgido y obtendréis respuesta en un breve plazo de tiempo de personas expertas que os ayudarán de forma desinteresada. Lo único que tenéis que hacer es registraros en la página para poder postear en el foro. Si sólo queréis buscar un problema que haya posteado otro usuario no necesitáis estar registrados.

Volviendo al tema que nos ocupa, os compartimos la presentación de nuestros ponentes con el resumen de todo lo explicado.

Os añadimos a continuación algunas notas adicionales que pueden resultar interesantes.

Generalidades del plugin

• Gravity Forms es un plugin que nació como generador de formularios y actualmente sirve para muchas más cosas, entre ellas para venta de monoproducto (mini tienda online) o encuestas y exámenes.
• Es de pago, aunque hemos de recordar que lo que se paga es el soporte, no el software en sí mismo, que está bajo licencia GPL, igual que cualquier otro software asociado a WP.
• Es muy intuitivo porque está formado por multitud de «cajas» que se utilizan con el simple gesto de pinchar y y soltar donde te interese usarlo (drag&drop).
• Hay unas cajas de Campos de Entrada que se utilizan para montar una plantilla que otro usuario puede rellenar y de los campos mostrados se monta una entrada en la web de forma automática. Esto sirve para que dicho usuario pueda añadir entradas a la web sin tener que darle permisos de editor. La entrada se generaría en estado Borrador y luego tú puedes aceptarla y publicarla o descartarla.
• Permite lógica condicional que se utiliza para decidir si mostrar unos campos u otros en función de una condición. Por ejemplo, según la edad que pongas en el campo correspondiente te muestro un texto para los menores de edad y otro diferente para los mayores de edad.
• Dispone de add-ons, que son pequeños paquetes adicionales que puedes incluir en el paquete base del plugin para mejorarlo. Por ejemplo, hay uno para que el formulario se pueda guardar en pdf.
• Se pueden incluir acciones en el momento de CONFIRMACIÓN (al pulsar el botón ENVIAR en los formularios). Esto implica que en ese momento se puede
  • Mostrar un mensaje en el propio formulario.
  • Enviar al usuario a una nueva página con resumen o agradecimiento.
  • Enviar al usuario a otra página de la web.
• Todos los formularios se guardan en tu propia BBDD, por lo que no sólo tienes respaldo de todos los formularios generados sino que al estar en tu propio servidor puedes cumplir la GDPR.
• La pequeña tienda online que se puede montar conecta con las principales pasarelas de pago en el mercado.

Caso práctico

Joaquín y Flavia nos muestran a continuación un caso práctico para ver cómo se puede mejorar un formulario que hayamos creado con este plugin, basado en el siguiente ejercicio. Primero Joaquín desarrolla un formulario para un hotel que pide poder hacer reservas de habitaciones con fecha inicio, fecha fin y tipo de habitación permitiendo además enviar a otro usuario un ticket regalo con una noche de hotel gratis.

Paso 1: Joaquín en acción

Joaquín se pone manos a la obra y prepara el formulario sin tener en cuenta el continente, sólo el contenido. Para ello necesita igualmente añadir determinadas mejoras sobre el plugin original para poder realizar las siguientes acciones. En la presentación tenéis los enlaces a todos los elementos creados así como los trozos de código necesarios:

• Queremos que el cupón que se genere de regalo tenga un identificador único. Para ello necesitamos un plugin que lo genere: GP Unique ID.
• Hemos de añadir algo de código en el functions.php. Para ello tenemos dos opciones:
  • Escribir directamente en ese archivo, con el consiguiente riesgo en caso de que haya algún error en el código añadido, y más si hemos añadido más código con anterioridad.
  • Utilizar snippets, que son trozos de código que se añaden a functions.php a través de un plugin. Esto permite habilitar o deshabilitar rápidamente cada trozo de código. Además, podemos tener colecciones de snippets que podemos incluir en otras instancias de WP a nuestro gusto, creando una especie de biblioteca de códigos interesantes. El plugin es code snippet.
• Cálculos en campos. En nuestro caso era necesario calcular el número de noches entre dos fechas. Esto se añade con un snippet.
• Necesitamos poner algunos campos como ReadOnly, por ejemplo el que guarda el número de noches calculado. Si lo dejamos tocar sin cambiar las fechas calcularíamos luego mal el precio total de la reserva. Para ello se utiliza el plugin Disable Gravity Forms Fields.
• Se plantea rellenar el formulario en tres «pasos» o apartados dentro de la misma hoja, uno para los datos personales, otro para la reserva y el último de pago. Se permite para ello pasar datos de un apartado al siguiente, por ejemplo el nombre del usuario para luego poner texto al usuario con algún comentario personalizado con su nombre. Esto se lleva a cabo con códigos que Gravity Forms asigna al contenido de cada campo de forma temporal hasta que pulsas ENVIAR. Así que podemos usar esos códigos para hacer referencia a los datos ya rellenados por el usuario.

Paso 2: Flavia imprime su toque personal en el proyecto

Una vez que Joaquín ha montado el esqueleto del formulario, Flavia nos aporta ahora una serie de mejoras de usabilidad avaladas por especialistas en la materia, en forma de vitaminas para nuestro formulario, como es:

• El usuario es vago por naturaleza así que es mejor quitar los campos que no sean realmente necesarios o juntar en uno solo aquellos que por separado queden muy complejos (o demasiados en número). Ejemplo: Podemos necesitar datos de facturación diferentes en función del país del usuario. Si ponemos un montón de campos a rellenar por cada país el formulario puede quedar impracticable. Es mejor poner un sólo campo tipo texto donde el usuario escriba todos los datos que necesita que aparezcan en la factura.
• Es más agradable a la vista separar los datos por grupos semánticos.
• Tanto si los grupos se escriben en una misma página/pestaña o se deja en varias (uno por página) hay que ser lo más específico posible respecto de la longitud del formulario para que el usuario sepa en todo momento cuánto le queda por rellenar.
  • Una opción es añadir una barra de progreso con porcentaje de avance, pero eso suele ser bastante abstracto.
  • Es mejor incluso poner pasos con una pestaña por paso, con su número de paso correspondiente y marcando claramente en qué paso te encuentras, por ejemplo, escribiendo la cabecera del paso actual en negrita y el resto de pasos agrisados.
• Los humanos leemos de izquierda a derecha y/o de arriba a abajo. Cuando estamos rellenando un formulario es más cómodo usar una de las dos direcciones, por tanto, como hacia abajo tendrá que ir seguro, es mejor no poner más de un campo por fila. Por tanto, pongamos todos los datos uno debajo de otro. Sólo utilizaremos la opción de poner algún campo a la derecha si queremos llamar la atención del usuario por alguna circunstancia. Por ejemplo, la típica confirmación de email. Lo ponemos a la derecha para que el usuario sea consciente de que no es una errata sino que estamos pidiendo el mismo campo dos veces a propósito.
• Hemos de dirigir la intención del usuario lo máximo posible. Si tenemos dos botones y nos interesa que pinche en uno de ellos, ése lo pondremos grande y que llame la atención, y el otro pequeño y con formato de enlace en vez de botón. Por ejemplo, botones SIGUIENTE y anterior. Al que queremos que pinche es a SIGUIENTE, dejando la opción «anterior» como botón secundario que no parezca ni siquiera un botón, sólo un enlace. Para ello se añade CSS adecuado (lo tenéis en la presentación).
• Hubo hace poco una tendencia al minimalismo en los formularios que llevó a que la descripción de un campo aparecía dentro del propio campo, donde el usuario tiene que escribir luego el dato. Esto hacía que en cuanto el usuario empieza a escribir la descripción desaparece y por tanto no se puede a posteriori confirmar si la información que hemos escrito es correcta porque no tenemos el detalle de lo que había que escribir allí.
  • Hay que volver a incluir cada campo con una cabecera previa que deje claro qué dato hay que incluir y no se pierda.
  • Además, no hay que usar la propiedad de valor determinado para una descripción porque eso se utiliza para otra cosa. Si se añade una descripción como valor predeterminado no se podrá saber qué campos ha rellenado el usuario y cuáles tienen nuestra descripción por defecto.
  • Sí hay que rellenar los valores predeterminados que sea posible con la intención que está esa opción, es decir, para que todos los campos que nos interese que tengan un valor razonable no se dejen a merced del usuario. Por ejemplo, en tipo de habitación, podemos marcar por defecto sencilla con vistas al mar, si es un hotel de costa. No marcaremos SUITE porque puede resultar excesivo económicamente hablando. Hay que rellenar con datos razonables.
• Se ha de mostrar la anchura del campo lo más ajustado posible al tamaño del texto que se ha de introducir, así el usuario tiene más o menos la idea de cuánto ha de escribir. Esto se realiza añadiendo CSS (en la presentación).
• Ya no se marca con asterisco los campos obligatorios. Estudios han demostrado que es más efectivo que el usuario considere todo como obligatorio y le indiquemos expresamente qué campos son opcionales escribiendo la palabra «opcional» al lado del campo que corresponda. Esto se puede realizar con el plugin «Gravity Forms: Remove required and add optional string to increase form submits».
• Mejor si los errores se informan en el momento de rellenar el campo, a esperar a pulsar el botón ENVIAR para que te salgan todos los problemas y tengas que ir buscando por todo el formulario dónde está el campo con error. Esto se arregla con el plugin «Real Time Validation for Gravity Forms».
• Hay que esforzarse por la integración de personas con visibilidad reducida. Para ello:
  • Señalar claramente los errores, no sólo con un campo en rojo, por ejemplo, sino también con simbología clara.
  • Añadir los mensajes lo más claro posible, sobre todo a la hora de indicar fallos.
  • El ancho del formulario debe estar entre los 500 y los 700 pixeles.

Otros plugins y aplicaciones surgidas durante la charla:

• Zapier: Aplicación web de automatización. Ejemplo, supongamos una web de catas, con cada entrada de formulario de catas añade un registro en una excel en drive porque nos manejamos mejor con la excel.
• GP Unique ID: para generar identificadores únicos.
• Code snippet: para guardar una colección de snippets (trozs de código para functions.php) que se pueden activar y desactivar rápidamente.
• Disable Gravity Forms Fields: Permite deshabilitar la edición de campos en Gravity Forms para que el usuario no los pueda modificar.
• Gravity Forms: Remove required and add optional string to increase form submits: Para quitar el asterisco de los campos obligatorios y añadir la palabra «opcional» a los que lo son.
• Real Time Validation for Gravity Forms: Añade validaciones a cada campo en tiempo real y sugerencia de solución.
• Ninja Forms: La alternativa gratuita a Gravity Forms para crear formularios. Es mejor que Contact Form7 porque éste último es más difícil de usar (a través de shortcodes) y no guarda los formularios que se generan.

Algunas fotos

 

Los números

• Apuntados a la charla: 42 personas.
• Asistentes: 26 personas.
• Se realizó el pasado 16 de julio de 2018.

IMPORTANTE: Conforme comentamos en la charla, vamos a retomar la herramienta Slack, concretamente el canal #wpalicante de Slack WordPress España para organizarnos mejor y poder compartir la gestión de la meetup. Para apuntarte al slack sigue las instrucciones que aparecen en la siguiente página -> http://wp-es.es/slack/

La charla

En esta ocasión tenemos la suerte de contar para la meetup con un invitado de primera categoría: Antonio Torres https://antonio-torres.es/, Director de Soporte Especializado en Profesional Hosting https://www.profesionalhosting.com/ , consultor y desarrollador web. En una charla tan densa como interesante nos ha comentado todos los entresijos sobre el rendimiento de la web hecha con WordPress, para que la optimicemos y conseguir así no sólo que los usuarios nos quieran más sino también que los buscadores nos posicionen mejor. En inglés se conoce como «Web Performance Optimization» o WPO.

Os compartimos la presentación que preparó nuestro ponente con el resumen de todo lo que explicó.

Os incluimos a continuación algunas notas adicionales que nos parecen interesantes y pueden valer en algunos conceptos como resumen y en otros como aclaración:

• Para la satisfacción del usuario es muy importante la velocidad de carga de la web.
• Google penaliza las webs lentas, con lo que conseguiremos peor posicionamiento en su buscador.
• %conversión: Es el éxito en el objetivo que tengamos para nuestra página (que el usuario haga una compra, que se quede leyendo…).
• La rapidez de la página en cargar también mejora el SEO.
• Para mejorar la velocidad hemos de revisar tanto el servidor donde alojamos la web como la programación de la misma.

Servidor:

• Cuidado con los hostings gratuitos porque suelen ser muy lentos.
• Mejor si el procesador es de alto rendimiento, Intel mejor que AMD al ser más estable, Intel I5 por ejemplo, con velocidad de procesador de 2,5GH o superior.
• Mejor si el disco duro es SSD Raid.
• Centro de datos en España (o donde nosotros tengamos nuestro mercado potencial) porque si está fuera la latencia de conexión es más elevada y eso empeora la experiencia del usuario.
• Latencia: tiempo que tarda en comunicarse tu conexión local con el servidor.
• Calidad y estabilidad del Centro de Datos: mejor que sea TIER III o IV. Si es inferior se podrá caer más veces a lo largo del año.
• Niveles TIER: Son cuatro categorías establecidas por el Uptime Institute para los centros de datos, que se corresponden a unas garantías sobre el material utilizado para asegurar que el sistema no se caerá ante las peores circunstancias al tener además mayor o menor redundancia de componentes.
• Configuración especial del servidor para WordPress. Si la compañía tiene servidores especializados en WordPress mejor.
• Compatibilidad PHP7 y MySQL 5.6. Si puede cambiar entre PHP7 y PHP5 mejor que mejor.
• Sistemas de caché basados en RAM.

Páginas para medir velocidad y rendimiento web

Al final lo importante es medir siempre con la misma herramienta para ver los progresos que hagamos si estamos realizando mejoras. Si vamos saltando de una herramienta a otra no podremos comparar. Se revisan las siguientes:

• PageSpeed Insights: Es la peor aunque al ser la de Google nos interesa hacerle un poco de caso sin obsesionarse. Como encima se hace desde EEUU va a medir mayor latencia que la que de verdad vamos a tener con nuestros clientes. Entre un 60 y un 80% ya es aceptable.
• Pingdom.com: Es mejor que el anterior.
• WebPage Test: Es el mejor. Puedes indicarle dónde está el servidor y realiza tres testeos.
• GtMetrix: También puede ser aceptable porque puedes elegir origen (aunque no dentro del país, al menos se puede acercar al continente) y realiza varias mediciones diferentes.

Conceptos interesantes:

• First Byte: Primera carga. Es el tiempo que tarda un sitio web en enviar el primer byte. Se disminuye usando caché o mejorando el código.
• Speed Index: o Índice de velocidad. Cuánto tardas en cargar la parte visible de la web. Es una fórmula compleja que no necesitamos entender, pero sí saber que cuanto más bajo mejor y que debería ser inferior a 3500.

Programación:

Para la programación, cuidado con instalar demasiados plugins o elegir un tema muy pesado.

En caso de tener problemas con plugins, podemos utilizar otro (plugin, por supuesto) para saber cuál es el que nos está causando problemas:

• P3 (Plugin Performance Profiler): Cuidado porque no se mantiene desde hacer tres años, es decir desde el 2015, así que aunque es bueno y merece todavía la pena puede que empiece a fallar al no estar testeado con las últimas actualizaciones de WP. Analiza todos los plugins instalados y da información de cada uno para encontrar cuál nos está dando problemas.

Otra cosa que se puede hacer es minimizar o incluso desactivar el número de revisiones de los posts. En la presentación se indica cómo hacerlo.

Otros plugins interesantes para optimizar:

• WP-Optimize: Plugin para limpiar BDD. Se puede programar para hacerlo periódicamente. Hay que llevar cuidado con las opciones en letras rojas.
• WP Rocket: Plugin de caché. ES el mejor pero es de pago. Otra buena opción gratuita es W3 Total Caché aunque es más complejo de configurar.
• Autoptimize: plugin para automatizar la optimización. Ayuda bastante.

Otros conceptos y herramientas:

• Lazy Load: Una forma de carga de lal web donde sólo se carga la parte de la página que está a la vista. Cuando haces scroll es cuando se carga el resto, así se consigue mayor velocidad de carga.
• Mod PageSpeed Google: Herramienta de Google muy buena para optimización de webs. No es local sino que se instala a nivel de servidor y lo activas. Hay que ir a buscarlo por tanto al cpanel del servidor. Debería aparecer un icono llamado PageSpeed. Hay que tener cuidado porque se necesita más espacio por parte al menos de las imágenes que tengas cargadas en tu web ya que una de las cosas que hace esta herramienta es guardarse copias optimizadas en el servidor, lo cual ocupará más espacio del que actualmente tienes.
• CDN: Es muy útil si tenemos usuarios en países distintos a donde está el servidor. Se aconseja utilizar este protocolo si tienes más de un 20% de tráfico fuera del país de origen. Lo que se hace es replicar toda la información estática en máquinas de diferentes países para que la latencia se reduzca.
• HTTP/2: Es aconsejable tener activo en el servidor porque mejora sustancialmente la velocidad. En internet hay webs de test http2 para averiguar si nuestra web está utilizando este protocolo. Si no lo está, hay que hablar con nuestro hosting para que lo activen. Si tenemos esto activo ya no es necesario tener activo el Keep-Alive que se testea en muchas de las webs que miden el rendimiento.
• Caché AMP: Es un CDN en unas máquinas específicas. Google tiene una. Las webs que lo usan se identifican por un rayo con fondo azul cuando se buscan en Google. . El problema que hay que tener en cuenta es que se almacena en sus servidores (además de en el tuyo sobre el que tienes control) y eso por lo general no gusta.
• HTTPS: Es el “nuevo” protocolo seguro para páginas web porque añade una capa de encriptación al protocolo http que se utilizaba hasta ahora. Para conseguir que nuestra web utilice HTTPS es necesario conseguir un certificado firmado por una tercera entidad que verifique la identidad del sitio web. Hasta ahora había que pagar pero ahora existe una forma de obtenerlo gratuitamente gracias a Letsencrypt. Este se ha de instalar en el servidor así que lo tiene que prover el hosting.

Algunas fotos

 

Los números

• Apuntados a la charla
• Tuvimos entre 20-25 asistentes.

La Charla

Si quieres repasar todo lo que vimos, te dejamos enlace a la presentación. y el guión con los enlaces y los pasos de los que hablamos.

Algunas fotos

Celebrábamos el 15º cumpleaños de WordPress, trajimos una tarta realizada por Carmen Moreno, contratamos el catering de desayuno de ULab y nos reunimos con un montón  de amigos que vinieron a contarnos su proyecto web.

Los números

• Apuntados a la charla 64 personas
• Tuvimos entre 25-30 asistentes.

Queremos mejorar el número de apuntados vs asistentes y que se igualen lo más posible, por eso te recomiendo que leas el artículo que escribió el compañero Mau Gelves de la Meetup de Madrid sobre las responsabilidades mínimas del asistente a las meetups.

La Charla

Evento «Ven y Pregunta» – Consultoría

Este evento es especial, no sólo por celebrar los 15 añazos de WordPress sino porque también es el primero con el concepto «Ven Y Pregunta», es decir, donde los asistentes vienen a presentar sus proyectos y comentar sus inquietudes y entre todos se ve la forma de mejorarlo. Si tienes interés en este tipo de eventos, la idea es realizar uno cada 4 meses aproximadamente, así que pásate por la página y apúntate para el próximo.

En esta ocasión tuvimos a 3 ponentes:

• Mariluz Bolorinos, que presentó su canal de ocio familiar canalosera.com: Se trata de un proyecto familiar donde padre, madre e hijo (que empezó con 9 años aunque ya tiene 14) hablan de sus hobbies, desde cine o televisión hasta libros, tecnología o juegos de mesa. Todo tiene cabida en este canal, hasta algunos vídeos de humor. La complejidad de la web, que es lo que nos interesa, viene por los diferentes formatos que albergan en la misma, desde podcast a youtube, además de ser un multisite por albergar también otro blog que ahora mismo se mantiene por cariño ya que Mariluz no lo actualiza desde hace años: misbolorinos.com sobre abalorios realizados a mano. Se le sugiere por un lado que la pase a https, porque en breve google penalizará las webs que no estén en ese estándar de seguridad, y luego la posibilidad de usar custom post types para las diferentes tipologías de entrada que tiene.

• Los compañeros de la radio online edmradio.es: Se trata de una web de radio online muy completa, que dispone tanto de noticias como de programas temáticos y eventos. También permite la descarga o escucha de los diferentes programas en formato podcast. El pack lo completan un chatbot y un reproductor online para escuchar lo que está sonando en la parrilla en este momento. Precisamente es con este elemento con el que piden ayuda por un problema de incrustación de elemento según la plataforma. Se le sugieren algunas opciones que pasan, por supuesto, por algún plugin concreto.

• Manuel Duran, y su proyecto barcocompartido.com.

Tema Principal: RGPD

Una vez terminada la parte de consultoría entramos de lleno en el tema principal de la charla, que es la nueva ley de protección de datos para usuarios denominada RGPD.

Si quieres repasar todo lo que vimos y lo que no supimos de la RGPD, te dejamos enlace a la presentación y el guión de la charla sobre RGPD. Que además tiene toda la información de los plugins y enlaces de los que hablamos en el evento.

Algunos puntos importantes a tener en cuenta son:

• Esta ley tiene dos alcances principales: la primera capa de información que es más inmediata y consiste en que al usuario hay que decirle para qué necesitamos cada dato que se le pide y qué vamos a hacer con él. La segunda es más completa y se trata de dar información de Aviso Legal tanto sobre nosotros como sobre las cookies.
• En la primera capa de información hay que explicar si los datos que le pedimos al usuario los necesitamos para responder a sus comentarios, para noticias o eventos, para moderar los comentarios…
• En los comentarios se ha de poner un check que por defecto nace desmarcado de aceptación de condiciones. Es decir, el usuario tiene que aceptar expresamente las condiciones definidas, no puede ser una aceptación por omisión. El consentimiento hay que guardarlo.
• La IP del usuario no se puede  guardar a partir de esta ley. Google Analytics lo guarda así que se debe anonimizar. Si lo tenemos con un plugin, éste tiene que poder hacerla anónima.
• El Plugin GDPR soluciona casi todo lo necesario para la ley. Sólo le falta la parte de cookies, cuyo aviso no se activa hasta que el usuario da el consentimiento, aunque sí guarda dicho consentimiento. En este plugin además a nivel de cookies hay que llevar cuidado porque te vienen marcadas por defecto las obligatorias. Eso hay que quitarlo para que nazca todo desmarcado.
• A nivel de la segunda capa, el Aviso Legal tiene que estar visible en algún sitio del footer (pie) o en el menú.
• Para saber qué cookies tenemos en nuestra web, ya que hay plugins que pueden estar añadiendo más que desconozcamos, pulsamos en el botón derecho del ratón sobre la web y vamos a la opción Inspect Element–>Applications–>Storage–>Cookies. En cada página puede estar cargando distintas, así que habría que mirarlo en todos los tipos de página que tengamos.
• También hay información en Storage–>Local storage. Ahí aparecen una especie de cookies pero en vez de fichero se guarda la información en Base de Datos del navegador en local.
• Plugin WP GDPR Compliance añade el check de aceptación en todos los comentarios y formularios. Podéis ver un texto de aceptación válido en la página luislobelda.com.
• Plugin WP Comment Policy Checkbox : Es el que pone en los comentarios el check para aceptar la política de privacidad de la web y guarda el consentimiento en base de datos.
• Hay muchas webs que usan Google Fonts para enseñar fuentes chulas. Como Google Fonts guarda la IP del usuario estaríamos incumpliendo la RGPD si usamos Google Fonts.Habría que descargar cada fuente que usemos y subirla a nuestra web para dejar de usar Google Fonts. Esto es complejo y tal vez no merezca la pena llegar a este punto cuando somos una web pequeña.
• Plugin FacetWP: Para woocommerce, te permite añadir fácilmente filtrado por tipología de artículos, creándote shortcodes que puedes poner donde quieras. Es de pago.
• Plugin WP FeatherLight: plugin de galería muy ligero.

Algunas fotos