Los dispositivos móviles, como teléfonos inteligentes y tabletas, representan más de la mitad de todo el tráfico de Internet. Sin embargo, según una investigación realizada por BrightEdge en 2014, más de una cuarta parte de los sitios web que las personas visitan no están configurados correctamente para estos dispositivos, lo que les cuesta un promedio de 68 por ciento de pérdida en el tráfico. La modificación adecuada de su propio sitio web para navegadores móviles requiere planificación y pruebas. Sin embargo, la codificación en sí misma generalmente no es muy difícil, especialmente si ya está familiarizado con CSS. Si usa una plataforma como WordPress, no necesita saber nada de código.
Plataformas comunes
Desde la llegada del iPhone, los desarrolladores detrás de plataformas de sitios web como WordPress, Joomla y Drupal tienen diseño móvil integrado. Drupal, por ejemplo, viene con temas amigables para dispositivos móviles en su instalación original. Cada una de estas plataformas tiene temas móviles que están diseñados para iniciarse tan pronto como su sitio web detecte que un navegador móvil está accediendo a ellos. Otros temas ya son compatibles con dispositivos móviles y responderán a los gestos táctiles tal como responden a los clics del mouse, sin cambiar significativamente el diseño o el diseño de su sitio web en diferentes dispositivos.
Uso de CSS y HTML
Para Los sitios web HTML usan un archivo de hoja de estilo en cascada o CSS para presentar la versión móvil de sus páginas cuando un navegador móvil accede a ellas. Si bien es posible codificar CSS para detectar dispositivos específicos, un enfoque más común es especificar diseños basados en el tamaño de la pantalla en píxeles. Si lo desea, puede tener un estilo para pantallas grandes, uno para tabletas y otro para teléfonos móviles. El uso de CSS tiene la ventaja adicional de tener que escribir el código una sola vez, en el archivo CSS. Cada una de sus páginas solo necesita una sola línea de código para dibujar sus estilos de CSS.
Funciones interactivas de pantalla táctil
Si ha configurado una página web para que sea una experiencia interactiva para los visitantes que usan JavaScript o HTML5 , es vital que sepa cómo responderá su sitio web a los eventos táctiles, no solo en un navegador móvil, sino también en un número creciente de equipos de escritorio con pantalla táctil. En la mayoría de los casos, debe considerar agregar eventos táctiles y gestos a su código de diseño. En JQuery, por ejemplo, el equivalente a un clic del mouse en una pantalla táctil es un evento de toque, que se activa cuando un usuario toca y luego levanta un dedo de la pantalla. Dependiendo de su página, también puede deshabilitar la configuración predeterminada en el navegador móvil, como pellizcar para hacer zoom o arrastrar para desplazarse, usando eventos "preventDefault".
Pruebas y verificación
La mejor manera de probar su nuevo sitio web móvil es usar su propio dispositivo móvil. Examine el estilo y el diseño de la página, navegue con toques y gestos, y observe de cerca sus imágenes para asegurarse de que se vean nítidas. También puede usar el navegador web de su computadora para emular una pantalla móvil. En Google Chrome, por ejemplo, presione "F12" para abrir la Consola del desarrollador. Haga clic en el icono "Configuración" y luego en la pestaña "Emulación" para seleccionar un dispositivo como un Google Nexus o un iPad de Apple.
[Cómo convertir un sitio web para un navegador móvil] URL: http://www.ordenador.online/computadora/Internet/246134.html