Tiempo de lectura aprox: 5 minutos, 30 segundos
Hacer que WordPress esté listo para móvil.
Resulta interesante que la evolución de los dispositivos móviles (teléfonos «inteligentes», móviles o celulares, tabletas) ha llevado a que debamos estar listos para estos.
Y esta moda llega hasta el punto de que si no lo estamos, nuestro sito web es como si no existiera.
La mayoría de los temas actuales para WordPress, ya están preparados (hasta un punto) para manejar esta situación.
Hacer que WordPress esté listo para móvil.
Como en todos los casos en que se plantea un «problema» en informática, no hay una única solución.
Dependiendo de «el punto de arranque» hay que abordar la solución de una manera u otra y hay que hacer unos u otros cambios.
De forma genérica, a la capacidad de hacer que una página web, o un sitio entero, sea adecuado para ser visitado desde distintos dispositivos, lo conocemos como «responsivo».
Un sitio es «responsivo» si puede verse igual (o muy parecido) con una pantalla de 5 pulgadas o una de 25 pulgadas.
También se aplica para la visión en «vertical» u «horizontal».
Tema responsivo
Gran parte de los temas modernos, está preparado desde el inicio de su instalación, para hacer que el sitio resulte responsivo.
En la mayoría de los casos, esto se hace con una mezcla de tecnologías, se usa javascript para conocer el dispositivo en donde se visualiza el sitio.
A continuación se realiza una comunicación con el servidor que se conoce como tecnología AJAX y el servidor realiza los ajustes necesarios o simplemente, el javascript decide cambiar el aspecto cambiando la presentación, o sea, el CSS.
En otros casos, el código de presentación CSS está escrito de tal forma que reconoce el tamaño de la pantalla del dispositivo de visualización y decide usar un tipo u otro de presentación.
Pero ¿qué pasa si el tema que llevas usando años y que te encanta para tu bitácora, no es responsivo?
Plugins al rescate
En algunos casos, el tema que se está usando no es responsivo, pero eso no significa que debas tirar la toalla y buscar desesperadamente un nuevo tema.
Si, es cierto que usar un Tema responsivo, es más rápido y necesita menos intervención de la potencia del servidor, pero hay casos en que se justifica.
Yo te presento unas cuantas soluciones, tu escoge la que te parezca oportuna.
WPtouch
Este plugin se ha instalado y funciona satisfactoriamente en más de 500.000 sitios web.
Pero antes de lanzar las campanas al vuelo, una advertencia:
Este plugin no se ha probado con las últimas 3 versiones mayores de WordPress. Puede que ya no tenga soporte ni lo mantenga nadie, o puede que tenga problemas de compatibilidad cuando se usa con las versiones más recientes de WordPress.
Hay que avisar, aunque yo he hecho pruebas y funciona, puede que en algún momento deje de hacerlo.
Afortunadamente, este plugin tiene traducción completa al español, por lo que resulta fácil manejar su ajuste.
Una de las cosas interesantes es que puedes definir en qué momento se produce la magia; puedes decidir cuál es el tamaño de la pantalla que se considera un dispositivo móvil.
El plugin se encarga de detectar cuándo un visitante está usando un móvil y le ofrece una visión optimizada del sitio.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/wptouch/)
WordPress Mobile Pack
Este plugin transforma tu sitio en una aplicación de Web Progresiva para móvil.
Es compatible con dispositivos Android e iOS y con los navegadores más populares como Google Chrome o Safari.
Claro que preguntarás ¿Qué es eso de Web Progresiva? vale, pues algunas características que te darán una idea son:
- La aplicación carga de forma casi instantánea, independientemente de la conexión que tengas.
- La función de mensajes «push» permiten que el usuario del móvil siga un enlace y vuelva a tu página ágilmente, aún cuando el navegador esté apagado.
- Las animaciones, el desplazamiento vertical u horizontal se presentan y realizan su función suavemente.
- La conexión se realiza siempre bajo protocolo https
- La página se hace «responsiva».
Como casi siempre, existe una versión de pago llamada WordPress Mobile Pack PRO que ofrece un conjunto mayor de posibilidades y de configuraciones.
Es un producto interesante, aunque a mi entender es demasiado pesado.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/wordpress-mobile-pack/)
Any Mobile Theme Switcher
Al igual que el primero de la lista, este plugin no se ha probado con las últimas 3 versiones mayores de WordPress. Puede que ya no tenga soporte ni lo mantenga nadie, o puede que tenga problemas de compatibilidad cuando se usa con las versiones más recientes de WordPress.
Este es un plugin que me llamó la atención por dos razones:
La primera es su función para presentar un tema distinto del tema principal o, de pantalla grande, del tema móvil, de forma que los sitios parecen distintos, si quieres.
La segunda, es que puedes escoger el tema que quieres usar para cada dispositivo, de forma independiente.
Los dispositivos reconocidos y que pueden tener «su propio tema» son:
- Iphone / Ipod
- Ipad
- Palm Os
- Android
- Android Tab
- Windows Mobile
- Blackberry
- Opera Mini
- Otros dispositivos móviles
La desaparición de alguno de estos dispositivos en el mercado activo, ha hecho obsoleto en cierta medida este plugin, pero lo cierto es que aún existen muchos usuarios con estos dispositivos.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/search/Any-Mobile-Theme-Switcher/)
Smush – Compress, Optimize and Lazy Load Images
Este es un plugin distinto, no convierte temas ni manipula el tema en forma alguna, simplemente hace su trabajo optimizando las imágenes de tu sitio.
Al estar optimizadas, las imágenes cargan mucho más rápido en los dispositivos, entre ellos, los móviles.
Además, ofrece lo que se conoce como «Lazy Load» o «Carga perezosa» o «Carga en diferido» que no es otra cosa que detectar cuándo una imagen debe estar en la pantalla y enviarla, mientras tanto, el tema se limita a guardar el sitio dónde estará.
La utilidad para los dispositivos móviles, es que al detectar el tamaño de la pantalla, te permite fijar las reglas para enviar un tamaño máximo de imagen comprimida, en función de las dimensiones de la pantalla.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/wp-smushit/)
Max Mega Menu
Una de las partes más olvidadas cuando se hacen arreglo para encajar un tema en un dispositivo móvil, es el menú.
Casi siempre se presta mucha atención a las imágenes y elementos decorativos o incluso a los colores, pero resulta muy desagradable a un usuario, encontrar que los menús de las páginas resultan demasiado grandes para la pantalla y son ilegibles u ocupan tres líneas.
Tiene muchas opciones para la re-colocación de los menús, creación de menú de hamburguesa, menús persistentes, etcétera, y por suerte, este plugin está disponible en español.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/megamenu/)
Favicon by RealFaviconGenerator
Este es un caso interesante, aunque todos los temas modernos traen un apartado en su personalización de apariencia para insertar el icono del sitio, algunos van un paso más allá y usan este icono para construir un «favicon».
Otros directamente, te permiten definir el «favicon» para tu sitio, que normalmente se llama favicon.ico.
El favicon no es otra cosa que un icono que identifica a tu sitio, si bien es cierto que suele ser una imagen de pequeñas dimensiones, el que se usa en las pestañas del navegador suele tener como máximo un tamaño de 32 pixel por 32 pixel.
Este plugin puede usar imágenes mucho mayores, digamos de 200px por 200px, para crear el «favicon» de tu sitio.
La razón de mencionar este plugin en este grupo, es que una vez activado y personalizado, detecta el tipo de dispositivo que accede a tu sitio y cambia la cabecera html de forma dinámica, para ofrecer el mejor y optimizado favicon.ico.
De esta forma, el usuario de dispositivo móvil puede identificar fácil y rápidamente tu sitio, con independencia de la url que maneje o de si se encuentra entre una lista de sitios visitados.
Puedes descargarlo desde el repositorio de WordPress: (https://es.wordpress.org/plugins/favicon-by-realfavicongenerator/)
Bonus track
Jejeje ? Permitidme la referencia a la música (me encanta) aunque ya no se vendan y pocos sepan lo que son los Álbumes, los CD y, mucho menos, los vinilos.
Si quieres comprobar si tu sitio está preparado para los dispositivos móviles (antes o después de tomar medidas) tienes un servicio de prueba llamado «Google Mobile Frienly Test»
Este servicio te dirá si tu sitio está optimizado para móviles y, genera un reporte de los fallos (si los hay) para que puedas corregirlos.
Conclusión
Con la esperanza de que esto te sirva para sacar el mejor partido de tu WordPress, al tiempo que aumentas tus visitantes de dispositivos móviles y por tanto, más ventas o lectores o lo que proceda para aumentar tu beneficio.
Mi recomendación es: ¡Quédate En Casa!, aprende, juega, experimenta y, sobre todo, ¡divertirte!
¡Gracias por leernos!
¡Tus comentarios y preguntas nos ayudan a mejorar, por favor comenta!