¿Cómo se ve el Blog en móviles?



Cada vez más usuarios utilizan el móvil para navegar por Internet y visitar sus páginas favoritas. Si bien es un dispositivo con el que suelen realizarse "visitas de paso", tiene gran importancia de cara a la opinión y "estatus" que sobre la imagen de una página se puede hacer un usuario.
Las búsquedas en móvil también tienen posicionamiento y es importante para tus contenidos y su presencia en Internet que adaptes tu Blog a este tipo de presentación.
Veamos algunas claves para poder mejorar la presentación de datos en esta clase de dispositivos.
¿Diseño Responsive o diseño ad-hoc?:

El diseño adaptativo es aquel que cuenta con la capacidad de adaptar su presentación a cualquier dispositivo sea cual sea su tamaño y resolución. Para entender mejor el concepto puedes leer esta guía que despejará todas tus dudas: Qué es responsive Design.


El diseño ad-hoc o "a medida", ha sido utilizado durante los primeros años de vida de los smartphones para pasar posteriormente a decantarse por el adaptativo.
Con la aparición de nuevas formas de programar páginas web, los diseñadores consiguieron darle un aspecto mucho más creativo a sus páginas utilizando el mismo código fuente.
En el diseño adaptativo la página adapta sus estilos al dispositivo en el que se va a dibujar, en el diseño ad-hoc se hacen redirecciones a páginas diseñadas expresamente para móviles donde se modifican los estilos para presentarse de una manera uniforme.


En Blogger por ejemplo dispones de un diseño estándar con la plantilla para móviles que está desarrollado de una manera prefijada para todos los blogs. En la redirección a la plantilla para móviles, se aplica una presentación uniforme donde más o menos pueden cambiar los colores pero en escasa medida el diseño completo.Visualiza tu página en distintos dispositivos:

Vamos a utilizar una magnífica herramienta online llamada MobileTestme que ofrece la posibilidad de probar tu página en algunos de los principales dispositivos móviles más populares del momento: desde un IPhone 5 pasando por un Nexus7 hasta un Galaxy Y.
1) Conéctate a http://mobiletest.me/ y verás una pantalla como la que te muestro a continuación:


2) Haz clic sobre el modelo de móvil sobre el que deseas ver cómo queda tu página (por ejemplo en la pantalla inferior selecciono el Iphone 5):


3) Me aparece la pantalla para introducir la dirección de mi sitio web y visualizar cómo queda en el móvil seleccionado. Introduzco la dirección de mi web en la caja donde pone "Tyoe a website address and hit go" y pulso sobre el botón verde donde pone "Go":


4) Veo cómo queda la presentación en el móvil:


Adicionalmente puedes cambiar entre la visualización en vertical o en horizontal. Pulsa en "Options" y selecciona "Portrait" (orientación vertical) o "Landscape" (en horizontal).


Cómo mejorar tu presentación para móviles:

Aplicar mejoras en la parte móvil puede ser complejo si no se tienen suficientes conocimientos técnicos. No obstante existen infinidad de plantillas en Internet que puedes aprovechar para rediseñar tu Blog y aplicarle un buen diseño adaptable.
Te dejo algunas guías que pueden ayudarte a conseguirlo:


En esta guía aprenderás a realizar las personalizaciones básicas de tu plantilla en Blogger.
Te explico paso a paso cómo realizar un rediseño básico de tu Blog y qué claves y datos a tener en cuenta debes contemplar para poder hacerlo. Podrás aprender cómo modificar la plantilla y aplicar la que desees que se encuentre en el mercado y tenga un diseño adaptable (responsive design).


Esta otra guía va a ayudarte a conocer todas las claves de la creación de plantillas para móviles en Blogger. En ella revisarás las opciones para un diseño ad-hoc y contarás con los comandos existentes en Blogger para seleccionar distintos estilos que puedan hacer adaptable (responsive) el diseño de tu plantilla. Te servirá tanto para el diseño ad-hoc como para combinarlo con una utilización de estilo responsive.


Si quieres adentrarte un poco más en la programación de plantillas responsive esta es tu guía.
Aprenderás cómo funciona el diseño adaptable y te familiarizarás con el "mundo de las media queries" para ver cómo se aplican las distintas hojas de estilo en función de la resolución del dispositivo donde se muestra tu web.
Y para cualquier duda o sugerencia como siempre me tienes a tu servicio en los comentarios.
Fuente: este post proviene de Diarios de la nube, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
Modificado:
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

Etiquetas: generalpropuestas

Recomendamos

Relacionado

general

El enorme incremento en el uso de dispositivos móviles o tabletas como medio para navegar por Internet es un factor fundamental a tener en cuenta a la hora de crear páginas web o blogs. Si bien inicialmente ha tendido a ser un factor "olvidado" hoy día se ha tornado fundamental. El cliente, el usuario, ya no utiliza exclusivamente un ordenador de sobremesa o portátil para visualizar las ...

general propuestas

Hoy día una web o un Blog no sólo se visualiza en ordenadores, ahora es necesario cuidar también su presentación en dispositivos móviles. Los usuarios utilizan pantallas de toda clase y tamaño para adentrarse en nuestros contenidos, debemos cuidar la manera en que mostramos la información para que sea fácilmente accesible desde cualquier aparato. Una parte fundamental de cualquier web o Blog son s ...

Diseño Web (cat) elegir web tipos de paginas web ...

Bienvenid@ a un nuevo post de Coach2Coach. Consejos sobre Diseño Web Antes de crear o diseñar una web, necesitas tener muy claras una serie de cosas, como los objetivos que persigues con ella, o las páginas que quieres añadir. En el post que escribí no hace mucho sobre cuánto cuesta una web, tienes más detalles. Antes de decidir, te aconsejo que leas el post y pienses bien lo que es imprescindibl ...

general seo

Desde Adsense y Google Webmaster Tools se está advirtiendo a todos los propietarios de páginas web que desde el 21 de Abril de 2015 se "expandirá el uso de la optimización para móviles como señal de clasificación", y añade, "Este cambio afectará a las búsquedas desde dispositivos móviles en todos los idiomas del mundo y tendrá un impacto significativo en los resultados de búsqueda ...

videos y tutoriales

Qué es la optimización móvil ¿Quieres saber qué es la optimización móvil? Pues bien, el uso de dispositivos móviles, es decir, teléfonos inteligentes o tabletas, para navegar por Internet ha aumentado enormemente en los últimos años y sigue en aumento. Esto hace que la optimización de sitios web para dispositivos móviles sea cada vez más recomendable para cada webmaster. El objetivo es la presenta ...

landing page moviles

Las páginas web desde ordenador se van quedando atrás. En España ya hay más visitas desde smartphones que desde PC’s de escritorio. En los últimos cinco años ha habido un enorme incremento del tráfico desde dispositivos móviles. Si queremos definir una estrategia de marketing online ésta tiene que estar adaptada a móvil. Si tu empresa todavía no ha optado por adaptar tu sitio web a móvil es que s ...

propuestas

La utilización de los códigos QR para almacenar información de cualquier clase se ha ido expandiendo con el paso del tiempo hasta el punto de convertirse en algo habitual. Cualquier empresa que se precie, tiene sus código de identificación QR para almacenar datos útiles para los clientes que lo necesiten. Su expansión se debe a su enorme capacidad de alcance, dado que en apenas unos pocos bits de ...

responsive design tips gadget ...

Cuando cambié el diseño del blog, el gadget de fotos de Instagram que podéis encontrar en la parte baja del blog ya venía incluido en la plantilla pero el otro día, mientras cambiaba y personalizaba la plantilla del blog de mi amiga Sara, el suyo no lo tenía y me interesaba mucho instalárselo. Investigando un poco fui a dar con la página web LightWidget, que nos ofrece una herramienta completament ...

Smartphones

Cómo activar el modo oscuro en móviles Xiaomi Cada vez son más los usuarios que demandan la opción de usar el modo oscuro en sus apps favoritas, incluso a nivel de sistema para que la pantalla se apague cuando estamos navegando por el menú tradicional. Hace poco te contamos cómo activar el modo oscuro en móviles vivo y hoy retomamos el tema con otro de los fabricantes líderes del mercado: ¿sabes c ...

propuestas

Al navegar por Internet con nuestro móvil, muchas veces nos encontramos con pequeños bloqueos, interrupciones en el dibujado de la página porque se están cargando anuncios, o imágenes... en diversas ocasiones percibimos la navegación como algo poco fluido o inmediato. La iniciativa de código abierto AMP (Accelerated Mobile Pages) viene a crear un nuevo "ecosistema" de programación que pe ...