En la actualidad el uso de Internet móvil supera el uso de la computadora, esto no es una sorpresa para nadie. Los propietarios de sitios web ven la urgencia de tener un sitio web amigable para dispositivos móviles.
Si tus visitantes actualmente no tienen una buena experiencia cuando llegan a tu sitio web a través de sus móviles, estás alejando una gran parte de tu tráfico potencial y perjudicando tus clasificaciones en los motores de búsqueda. Para mejorar tienes que hacer que tu sitio web sea amigable para dispositivos móviles.
10 pasos para hacer que tu sitio web sea amigable con dispositivos móviles
Aquí te compartimos algunos pasos que puedes seguir para asegurarte de que tu sitio web funcione tan bien para tus visitantes móviles como para tus usuarios de escritorio.
1. Convierte tu sitio web en responsivo
Un sitio web responsivo incluye el mismo contenido y la misma información en cualquier dispositivo desde el cual se acceda, pero cambia la forma en que se muestra y la organiza en función del tamaño de la pantalla del dispositivo. Esta es la mejor opción para que tu sitio web sea amigable para dispositivos móviles, ya que no estás limitando la información a la que pueden acceder tus visitantes desde su dispositivo móvil, obtendrán el mismo contenido que el resto de tus visitantes. El diseño responsivo también es bueno para SEO, Google mencionó que es su formato preferido para sitios web móviles.
Sin embargo, construir un sitio web responsivo no es para principiantes. Necesitarás contratar a un profesional para que te ayude o buscar un contructor de sitios web que incluya plantillas amigables para dispositivos móviles.
2. Tu información debe ser más fácil de encontrar
A algunas personas que navegan por la web en sus dispositivos móviles no les molesta tomarse un tiempo para buscar o leer contenido al mismo ritmo que lo harían en una computadora, pero otros quieren encontrar la información que necesitan lo más rápido y fácil posible. Piensa en la información que es más probable que las personas en dispositivos móviles busquen cuando se dirijan a tu sitio web y ubícala en un lugar fácil de encontrar en la página de inicio del dispositivo móvil.
También considera las preguntas frecuentes que las personas más a menudo buscan cuando visitan tu sitio web. Puede que no necesites poner todas las respuestas al frente en la página de inicio, debes facilitar la búsqueda y navegación para un dispositivo móvil.
3. No uses Flash
Flash en gran medida cayó hace años porque es malo para el SEO. Puede ralentizar el tiempo de carga de una página y hay muchos navegadores y dispositivos donde simplemente no funciona en absoluto. Ni Android ni iOS admiten flash, por lo que si construyes un sitio web que dependa de alguna manera de la experiencia de una animación Flash, tus usuarios móviles quedarán fuera. En este punto, es mejor desechar completamente esta tecnología en tu sitio web y encontrar un sólido diseño web que funcione.
4. Incluye la Meta etiqueta Viewport
La meta etiqueta viewport es una manera fácil de controlar cómo se muestra tu sitio web en el dispositivo móvil. Si tu página se abre con el mismo ancho en la pantalla pequeña de tu teléfono que en tu escritorio, tendrás que hacer un desplazamiento incómodo de lado a lado para leer cada línea de texto y ver las diferentes caras de la página. La meta etiqueta viewport les dice a los navegadores que ajusten al ancho de tu página a la pantalla del tipo de dispositivo del que proviene el visitante.
Agregar esto a tu html es bastante simple. Simplemente pega esta línea en el html de cada página:
<meta name = «viewport» content = «width = device-width, initial-scale = 1»>
5. Desactiva la autocorrección para formularios
Algo en lo que es fácil no pensar es en las pequeñas formas en que la autocorrección puede hacer que la interacción de un usuario con tu sitio web sea más incómoda. Si tienes formularios en tu sitio web que solicitan información sobre el nombre o la dirección, una forma sencilla de facilitar esa información a los visitantes de tu dispositivo móvil es desactivar la autocorrección para cada campo de formulario; de lo contrario, el teléfono intentará cambiar el nombre o nombre de calle a palabras más comunes y ralentice el proceso de completar tu formulario. En el campo de entrada, asegúrate de incluir autocorrect = off en el html.
6. El tamaño de tus botones deben ser grandes y visibles 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 tratas de «hacer clic» con los dedos en la pantalla de un pequeño teléfono inteligente, es difícil lidiar con botones pequeños. Y eso es especialmente cierto si hay varios botones pequeños cerca uno del otro, esto puede ser una molestia para los visitantes de tu sitio web.
La mejor manera de salvar a tus visitantes de esta frustración es usar botones más grandes. Cada vez que agregues un botón a tu sitio web, tómate un tiempo para probarlos tú mismo en todos los dispositivos móviles que puedas encontrar.
7. Usa fuentes de tamaño grande
Leer en una pantalla pequeña es mucho más difícil si la fuente es pequeña. Lo mejor es usar un tamaño de letra de al menos 14px en tus páginas web, sin embargo debes comprobar y verificar como se ve la fuente.
También es mejor seguir con las fuentes estándar. Cualquier tipo de letra que deba descargar el navegador de tu visitante ralentizará la carga de tu sitio web, lo cual es una mala noticia en el dispositivo móvil.
8. Comprime tus imágenes y CSS
Las imágenes de alta resolución ralentizan tu sitio web, la velocidad es más importante en los dispositivos móviles. Eso significa que otro buen paso para hacer que tu sitio web sea compatible con dispositivos móviles es comprimir todo lo que ocupe mucho espacio. Es recomendable comprimir tus imágenes de alta resolución y tu CSS. Al comprimirlos, puedes asegurarte de que el tiempo de carga sea más rápido sin afectar negativamente la calidad de lo que las personas ven en tu sitio.
9. Permite una manera fácil de cambiar a la vista de escritorio
Es posible que algunos de tus visitantes de dispositivos móviles prefieran ver la versión de escritorio de tu sitio web. Asegúrate de darles una manera de hacerlo, para que tus visitantes puedan interactuar con tu sitio web de la forma que más les convenga.
10. Realiza regularmente pruebas móviles
Lo mejor que puedes hacer para asegurarte de que la experiencia móvil de tu sitio web sea buena, es probarla tú mismo regularmente en tu dispositivo móvil. De vez en cuando, entra a tu sitio web en tu teléfono y tablet y dedica un tiempo a navegar para ver si hay algo difícil de ver o difícil de hacer.
Incluso si ahora lo haces todo bien, la forma en que se ven y funcionan los dispositivos móviles cambian continuamente y el sitio web móvil de hoy en día tal vez no haga el trabajo mañana. Sigue probando, sigue retocando cuando sea necesario y continúa pensando en tus usuarios de dispositivos móviles como una prioridad.
Neothek ofrece servicios de diseño de páginas web, correo electrónico, web hosting, registro de dominios, certificados SSL y diseño gráfico.
En la actualidad el uso de Internet móvil supera el uso de la computadora, esto no es una sorpresa para nadie. Los propietarios de sitios web ven la urgencia de tener un sitio web amigable para dispositivos móviles.
Si tus visitantes actualmente no tienen una buena experiencia cuando llegan a tu sitio web a través de sus móviles, estás alejando una gran parte de tu tráfico potencial y perjudicando tus clasificaciones en los motores de búsqueda. Para mejorar tienes que hacer que tu sitio web sea amigable para dispositivos móviles.
10 pasos para hacer que tu sitio web sea amigable con dispositivos móviles
Aquí te compartimos algunos pasos que puedes seguir para asegurarte de que tu sitio web funcione tan bien para tus visitantes móviles como para tus usuarios de escritorio.
1. Convierte tu sitio web en responsivo
Un sitio web responsivo incluye el mismo contenido y la misma información en cualquier dispositivo desde el cual se acceda, pero cambia la forma en que se muestra y la organiza en función del tamaño de la pantalla del dispositivo. Esta es la mejor opción para que tu sitio web sea amigable para dispositivos móviles, ya que no estás limitando la información a la que pueden acceder tus visitantes desde su dispositivo móvil, obtendrán el mismo contenido que el resto de tus visitantes. El diseño responsivo también es bueno para SEO, Google mencionó que es su formato preferido para sitios web móviles.
Sin embargo, construir un sitio web responsivo no es para principiantes. Necesitarás contratar a un profesional para que te ayude o buscar un contructor de sitios web que incluya plantillas amigables para dispositivos móviles.
2. Tu información debe ser más fácil de encontrar
A algunas personas que navegan por la web en sus dispositivos móviles no les molesta tomarse un tiempo para buscar o leer contenido al mismo ritmo que lo harían en una computadora, pero otros quieren encontrar la información que necesitan lo más rápido y fácil posible. Piensa en la información que es más probable que las personas en dispositivos móviles busquen cuando se dirijan a tu sitio web y ubícala en un lugar fácil de encontrar en la página de inicio del dispositivo móvil.
También considera las preguntas frecuentes que las personas más a menudo buscan cuando visitan tu sitio web. Puede que no necesites poner todas las respuestas al frente en la página de inicio, debes facilitar la búsqueda y navegación para un dispositivo móvil.
3. No uses Flash
Flash en gran medida cayó hace años porque es malo para el SEO. Puede ralentizar el tiempo de carga de una página y hay muchos navegadores y dispositivos donde simplemente no funciona en absoluto. Ni Android ni iOS admiten flash, por lo que si construyes un sitio web que dependa de alguna manera de la experiencia de una animación Flash, tus usuarios móviles quedarán fuera. En este punto, es mejor desechar completamente esta tecnología en tu sitio web y encontrar un sólido diseño web que funcione.
4. Incluye la Meta etiqueta Viewport
La meta etiqueta viewport es una manera fácil de controlar cómo se muestra tu sitio web en el dispositivo móvil. Si tu página se abre con el mismo ancho en la pantalla pequeña de tu teléfono que en tu escritorio, tendrás que hacer un desplazamiento incómodo de lado a lado para leer cada línea de texto y ver las diferentes caras de la página. La meta etiqueta viewport les dice a los navegadores que ajusten al ancho de tu página a la pantalla del tipo de dispositivo del que proviene el visitante.
Agregar esto a tu html es bastante simple. Simplemente pega esta línea en el html de cada página:
<meta name = «viewport» content = «width = device-width, initial-scale = 1»>
5. Desactiva la autocorrección para formularios
Algo en lo que es fácil no pensar es en las pequeñas formas en que la autocorrección puede hacer que la interacción de un usuario con tu sitio web sea más incómoda. Si tienes formularios en tu sitio web que solicitan información sobre el nombre o la dirección, una forma sencilla de facilitar esa información a los visitantes de tu dispositivo móvil es desactivar la autocorrección para cada campo de formulario; de lo contrario, el teléfono intentará cambiar el nombre o nombre de calle a palabras más comunes y ralentice el proceso de completar tu formulario. En el campo de entrada, asegúrate de incluir autocorrect = off en el html.
6. El tamaño de tus botones deben ser grandes y visibles 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 tratas de «hacer clic» con los dedos en la pantalla de un pequeño teléfono inteligente, es difícil lidiar con botones pequeños. Y eso es especialmente cierto si hay varios botones pequeños cerca uno del otro, esto puede ser una molestia para los visitantes de tu sitio web.
La mejor manera de salvar a tus visitantes de esta frustración es usar botones más grandes. Cada vez que agregues un botón a tu sitio web, tómate un tiempo para probarlos tú mismo en todos los dispositivos móviles que puedas encontrar.
7. Usa fuentes de tamaño grande
Leer en una pantalla pequeña es mucho más difícil si la fuente es pequeña. Lo mejor es usar un tamaño de letra de al menos 14px en tus páginas web, sin embargo debes comprobar y verificar como se ve la fuente.
También es mejor seguir con las fuentes estándar. Cualquier tipo de letra que deba descargar el navegador de tu visitante ralentizará la carga de tu sitio web, lo cual es una mala noticia en el dispositivo móvil.
8. Comprime tus imágenes y CSS
Las imágenes de alta resolución ralentizan tu sitio web, la velocidad es más importante en los dispositivos móviles. Eso significa que otro buen paso para hacer que tu sitio web sea compatible con dispositivos móviles es comprimir todo lo que ocupe mucho espacio. Es recomendable comprimir tus imágenes de alta resolución y tu CSS. Al comprimirlos, puedes asegurarte de que el tiempo de carga sea más rápido sin afectar negativamente la calidad de lo que las personas ven en tu sitio.
9. Permite una manera fácil de cambiar a la vista de escritorio
Es posible que algunos de tus visitantes de dispositivos móviles prefieran ver la versión de escritorio de tu sitio web. Asegúrate de darles una manera de hacerlo, para que tus visitantes puedan interactuar con tu sitio web de la forma que más les convenga.
10. Realiza regularmente pruebas móviles
Lo mejor que puedes hacer para asegurarte de que la experiencia móvil de tu sitio web sea buena, es probarla tú mismo regularmente en tu dispositivo móvil. De vez en cuando, entra a tu sitio web en tu teléfono y tablet y dedica un tiempo a navegar para ver si hay algo difícil de ver o difícil de hacer.
Incluso si ahora lo haces todo bien, la forma en que se ven y funcionan los dispositivos móviles cambian continuamente y el sitio web móvil de hoy en día tal vez no haga el trabajo mañana. Sigue probando, sigue retocando cuando sea necesario y continúa pensando en tus usuarios de dispositivos móviles como una prioridad.
Neothek ofrece servicios de diseño de páginas web, correo electrónico, web hosting, registro de dominios, certificados SSL y diseño gráfico.
