Los teléfonos inteligentes pasaron rápidamente de una tecnología nueva y emocionante a una parte normal de la vida cotidiana. Hoy en día nos resulta extraño que alguien salga de casa sin su teléfono móvil. Desde las salas de espera de los hospitales hasta los vestíbulos de los teatros (cuando estaban abiertos), la gente mirando sus teléfonos es algo normal.
Para los propietarios de sitios web, eso significa que ya es hora de que tu sitio web brinde una buena experiencia móvil.
En 2016, por primera vez, el uso de Internet móvil superó el uso de computadoras. Y la tendencia sólo ha aumentado en los años posteriores. Más de la mitad de todo el tráfico de sitios web en todo el mundo ahora ocurre en teléfonos inteligentes.
Si bien la distribución del tráfico del sitio web para sitios web individuales variará, es probable que aproximadamente la mitad de todos sus visitantes vean tu sitio web en la pequeña pantalla de un teléfono. Tener un sitio web optimizado para dispositivos móviles ya no es opcional. Si tus visitantes móviles no tienen una buena experiencia en tu sitio, alejará una gran parte de tu tráfico (y perjudicará tu clasificación en los motores de búsqueda en el proceso).
Ya lo ha escuchado antes, pero lo decimos nuevamente: su sitio web debe estar optimizado para dispositivos móviles.
¿Mi sitio web ya es compatible con dispositivos móviles?
Si tu sitio web se creó o actualizó en los últimos años, es posible que el diseñador o el creador de sitios web que utilizó haya tenido la experiencia móvil en primer lugar. Antes de dedicar muchos recursos a preocuparse por cómo hacer que tu sitio web sea compatible con dispositivos móviles, comprueba cómo le va ahora a tu sitio web.
Google proporciona una herramienta de prueba compatible con dispositivos móviles. Coloca tu URL en el cuadro de búsqueda. No solo obtendrá una respuesta rápida sobre si tu sitio web es compatible con dispositivos móviles, sino también una captura de pantalla de cómo se ve la página en la pantalla de un teléfono inteligente y una lista de recomendaciones para mejorar la experiencia móvil.
Si la herramienta muestra que tu sitio web necesita mucho trabajo, entonces hacer que tu sitio web sea compatible con dispositivos móviles debe tratarse como una prioridad absoluta. Si lo haces, mejorarás la visibilidad de tu sitio web en los motores de búsqueda, garantizará que más visitantes se queden y te ayudará a aumentar las conversiones en tu sitio web.
Si la herramienta de Google le da el visto bueno, no es necesario que la actualización de tu sitio web para dispositivos móviles tenga el mismo nivel de prioridad. Pero aún puedes beneficiarse al considerar formas de mejorar la experiencia móvil para tus usuarios. Cada poquito ayuda.
12 pasos para hacer que tu sitio web sea compatible con dispositivos móviles
Aquí hay algunos pasos que puede seguir ahora para asegurarse de que su sitio web funcione tan bien para sus visitantes móviles como para sus usuarios de escritorio.
1. Haz que tu sitio web sea receptivo.
La mayoría de los expertos en diseño web están de acuerdo en que crear un sitio web receptivo es la mejor manera de crear un sitio que funcione bien en plataformas móviles y de escritorio. Esto se debe a que un sitio web receptivo incluye el mismo contenido e información en cualquier dispositivo en el que acceda, pero el sitio responde al dispositivo en el que se muestra y optimiza su apariencia en consecuencia.
En otras palabras, la forma en que una página se muestra y se organiza cambia según el tamaño de la pantalla del dispositivo. Una imagen que aparece junto a un bloque de texto en un escritorio puede aparecer encima cuando se carga en un teléfono inteligente, por ejemplo.
Con un diseño receptivo, puedes hacer que tu sitio web sea compatible con dispositivos móviles sin limitar la información a la que pueden acceder tus visitantes móviles; aún obtienen el mismo contenido que el resto de tus visitantes. Y el diseño receptivo también es bueno para SEO. Google lo recomienda directamente.
2. Haz que la información que la gente busca sea más fácil de encontrar.
La gente suele sacar sus teléfonos inteligentes en busca de algo específico: la respuesta a una pregunta, la dirección de un restaurante cercano o un número de teléfono de atención al cliente. En estos casos, quieren encontrar la información que necesitan de la forma más rápida y sencilla posible.
Piensa en qué información es más probable que busquen tus visitantes móviles cuando accedan a tu sitio web y colócala en un lugar obvio y fácil de encontrar en la página de inicio para móviles. También considera las preguntas frecuentes que las personas buscan con mayor frecuencia cuando visitan tu sitio web. Puede que no tenga sentido poner todas las respuestas al frente y al centro en la página de inicio de su dispositivo móvil, pero asegúrate de que sean fáciles de encontrar y navegar en un dispositivo móvil.
Si no estás seguro de lo que buscan los visitantes móviles cuando visitan tu sitio, utiliza tus análisis. En Google Analytics, puedes agregar Tráfico móvil como un segmento en la sección Comportamiento, lo que te permite ver cómo los visitantes móviles interactúan con tu sitio web.
Si tienes un sitio web de restaurante y los visitantes móviles realizan una búsqueda regular de su menú, rediseña tu sitio para que sea más fácil de encontrar. Si tus visitantes visitan con frecuencia la página con su información de contacto, tal vez agregues eso al final de tu página de inicio. Reducir los pasos que deben seguir para encontrar la información que buscan mejorará su experiencia general en tu sitio web.
3. Deshazte de los anuncios y las ventanas emergentes que bloqueen el texto.
A nadie le gusta en ningún contexto, pero cuando intentas leer texto en una pantalla pequeña y un anuncio grande o una ventana emergente bloquea tu vista de la página, es muy molesto.
La mayoría de tus visitantes no se tomarán el tiempo para intentar encontrar la X pequeña para minimizar la ventana emergente, simplemente harán clic y buscarán otro sitio web. Si deseas crear una experiencia de usuario positiva, evita permitir anuncios o ventanas emergentes que bloqueen el contenido de una página.
Si crees que son demasiado importantes para deshacerse de ellos por completo, al menos desactívalos para los usuarios de dispositivos móviles o configúralos para que solo aparezca una ventana emergente cuando se hayan desplazado hasta la parte inferior de la página, no cuando hayan aterrizado en él. Y asegúrate de que la X para cancelar el anuncio o la ventana emergente sea lo suficientemente grande como para que puedan encontrarlo y seleccionarlo fácilmente.
4. Haga de la velocidad del sitio web una prioridad.
Tal vez recuerde los días del acceso telefónico y tener que esperar con impaciencia a que los sitios web se carguen lentamente. Pero ahora que todo el mundo da por sentado las velocidades de Internet más rápidas, si su sitio web se carga al ritmo de los viejos tiempos no tan buenos, su audiencia no esperará.
La investigación de Google sobre las velocidades de carga de dispositivos móviles encontró que la mayoría de los sitios web tardan más de cinco segundos en cargarse por completo, pero pocos visitantes esperarán tanto antes de hacer clic.
Los propietarios de sitios web pueden implementar una serie de tácticas para mejorar la velocidad del sitio. Algunos de los principales pasos que puede seguir para mejorar tu velocidad en dispositivos móviles son:
Use AMP (páginas móviles aceleradas): AMP es un marco que Google recomienda para acelerar los tiempos de carga de sus páginas web en dispositivos móviles. Si tiene un sitio web de WordPress, puede comenzar con el complemento AMP.
Comprime tus imágenes y CSS: las partes de una página web que se cargan más lentamente son aquellas que son grandes y ocupan mucho espacio, como tus imágenes de alta resolución y CSS. Puede acelerar el tiempo de carga del sitio web comprimiendo el tamaño de los archivos de imagen para que se carguen más rápido sin afectar negativamente la calidad de lo que la gente ve en el sitio.
Verifica tu plan de alojamiento web: si tu sitio web ha superado el plan de alojamiento web con el que comenzó, o si eligiste un proveedor de alojamiento de poca reputación para comenzar, una consecuencia negativa podría ser tiempos de carga más lentos. Puede acelerar las cosas actualizándose a un plan de alojamiento web que se adapte a tus necesidades actuales.
5. Mantén tu diseño web simple.
Los sitios web complicados con mucho desorden son confusos en cualquier pantalla, pero hacen que sea especialmente difícil para los visitantes navegar por tu sitio en una pantalla pequeña.
Evita el desorden. Cíñete con un diseño limpio y minimalista que facilite a las personas encontrar lo que buscan. Y al tener menos archivos en cada página que deben cargarse, un diseño simple también contribuirá a tiempos de carga más rápidos.
Aplique este pensamiento a su menú también. Si tu sitio web tiene muchas páginas y categorías, puede tener sentido ofrecer un menú grande en las pantallas de escritorio. Pero en dispositivos móviles, desea reducirlo a las opciones más importantes. Algunos sitios web cambian para poner su menú detrás de un botón de hamburguesa en el móvil. De esa manera, no ocupará mucho espacio en la pantalla del dispositivo móvil, pero los visitantes pueden hacer clic para abrirlo si lo necesitan.
6. Haz que el tamaño de tus botones sea lo suficientemente grande para funcionar en dispositivos móviles.
Es bastante fácil hacer clic en un botón de cualquier tamaño con un mouse, pero cuando intenta «hacer clic» con los dedos en la pantalla de un teléfono inteligente pequeño, los botones pequeños son difíciles de manejar. Y eso es especialmente cierto si hay varios botones pequeños cerca uno del otro; presionar uno al intentar seleccionar otro causará molestias reales a tus visitantes.
La mejor manera de salvar a tus visitantes de esta frustración es usar botones más grandes. Y piensa en qué lugar de la pantalla los coloca. El experto en UX, Josh Clark, escribe: «Si bien un pulgar puede barrer la mayor parte de la pantalla en todos los teléfonos, excepto en los más grandes, solo un tercio de la pantalla es un territorio realmente sin esfuerzo: en la parte inferior, en el lado opuesto al pulgar».
Cada vez que agregas un botón a tu sitio (y para todos los que ya están allí), tómate un tiempo para probarlos tú mismo en todos los dispositivos móviles que puedas encontrar entre tus empleados y familiares. Asegúrate de que la selección de cada botón sea razonablemente fácil en todos los dispositivos y, si no lo es, actualízalo para que lo sea.
7. Utiliza tamaños de letra grandes.
Leer en una pantalla pequeña es mucho más difícil si la fuente es pequeña. Es mejor usar un tamaño de fuente de al menos 14px en sus páginas web, pero siga adelante y pruebe cómo se ve para ver si ampliarlo podría ser mejor aquí.
También es mejor ceñirse a las fuentes estándar. Cualquier fuente que el navegador de tu visitante necesite descargar ralentizará el tiempo que tarda tu sitio web en cargarse, lo cual es una mala noticia para los dispositivos móviles.
8. No utilices Flash.
Usar flash en todo tu sitio web es un error de SEO. Puede ralentizar el tiempo de carga de una página y hay muchos navegadores y dispositivos en los que simplemente no funciona en absoluto. Ni los dispositivos Android ni iOS son compatibles con flash, por lo que si crea un sitio web que depende de alguna manera de la experiencia de una animación flash, los usuarios de dispositivos móviles quedarán fuera.
La mayoría de los diseñadores ya saben que no deben usar flash en un sitio web, pero si el tuyo se creó hace unos años, es posible que aún tenga algunas características persistentes que usan la tecnología obsoleta. Elimina la tecnología por completo en tu sitio web y encuentre un diseño web sólido que funcione sin ella.
9. Incluya la metaetiqueta de la ventana gráfica.
La metaetiqueta de la ventana gráfica es una manera fácil de controlar cómo se muestra su sitio web en el móvil. Si tu página se abre con el mismo ancho en la pantalla pequeña de su teléfono que en su escritorio, tendrá que desplazarse torpemente de lado a lado para leer cada línea de texto y ver los diferentes lados de la página. La metaetiqueta de la ventana gráfica le dice a los navegadores que ajusten el ancho de su página a la pantalla del tipo de dispositivo del que proviene el visitante.
Agregar esto a su html es bastante simple. Simplemente pegue esto en el html de cada página:
<meta name = ”viewport” content = ”width = device-width, initial-scale = 1 ″>
10. Desactiva la autocorrección de formularios.
Todos lidiamos con las pequeñas molestias de la autocorrección todo el tiempo, pero aun así, los propietarios de sitios web a menudo no piensan en las pequeñas formas en que la autocorrección puede hacer que la interacción de un usuario con su sitio web sea inconveniente.
Si tienes formularios en tu sitio web que solicitan información sobre el nombre o la dirección, una pequeña forma de facilitar el suministro de esa información a tus visitantes móviles es desactivar la autocorrección para cada campo del formulario; de lo contrario, su teléfono intentará cambiar su nombre o el nombre de la calle a palabras más comunes y ralentizar el proceso de completar su formulario.
En el campo de entrada, asegúrate de incluir autocorrect = off en el html.
Y si aún no lo ha hecho, asegúrese de que sus formularios sean cortos. No exijas a los visitantes que proporcionen más información de la necesaria. No importa en qué dispositivo estén, si el formulario tarda demasiado en completarse o exige detalles que un visitante no quiere compartir, no se molestará.
11. Permita una forma de cambiar a la vista de escritorio.
Es posible que algunos de tus visitantes móviles prefieran ver la versión de escritorio de tu sitio web en lugar de la versión móvil (especialmente si va con una versión móvil de tu sitio web en lugar de un sitio adaptable).
Dales una forma de hacerlo si así lo prefieren. Desea que tus visitantes puedan interactuar con tu sitio web de la forma que tenga más sentido para ellos.
12. Realiza pruebas móviles con regularidad.
Lo mejor que puedes hacer para asegurarte de que tu sitio web ofrezca una buena experiencia móvil es probarlo tú mismo con regularidad en tu dispositivo móvil. De vez en cuando, abre tu sitio web en tu teléfono y tableta y dedica un tiempo a navegar para ver si algo es difícil de ver o de hacer. Pide a tus empleados que hagan lo mismo y considera la posibilidad de contratar usuarios para que realicen pruebas también (ya que lo verán todo con ojos nuevos).
Las pruebas periódicas son la mejor manera de detectar pequeños problemas que crean una peor experiencia para tus visitantes. Cuanto más rápido los notes, antes podrás actualizar tu sitio web para brindar una experiencia verdaderamente compatible con dispositivos móviles.
Haga que su sitio web sea compatible con dispositivos móviles, incluso si lo haces todo bien hoy, la apariencia y el funcionamiento de los dispositivos móviles cambiará continuamente y es posible que el sitio web optimizado para dispositivos móviles de hoy no funcione mañana. Sigue probando, sigue ajustando donde sea necesario y continúa pensando en tus usuarios móviles como una prioridad y debería estar bien.
Neothek ofrece servicios de web hosting, registro de dominios, correo electrónico, certificados SSL, diseño de páginas web y diseño gráfico.