Optimizar tu web para pantallas de telefonos y tablet

Si eres webmaster y tienes un proyecto de crear una pagina web tienes que tener en cuenta una cosa, y es que las personas ya pueden ingresar desde su tablet o telefono android o ios. Entones tienes que plantearte como puedo optimizar mi web a todas las pantallas de telefono y tablet ?.

El uso de una Meta etiqueta llamada viewport en tu codigo de tu pagina web solucionara todo tus problemas.

<meta name="viewport" content="aqui van las opciones que explicare mas adelante">

Bien ya sabes quien es nuestro salvador, pero ahora tenemos que darle el contenido o valores que van dentro de las dobles comillas, por ejemplo el ancho de nuestra web, el alto, si quieres que hagan zoom, en que escala de zoom quieres que vean tu pagina web.



Los valores son los siguientes:

1. width=device-width = se ajusta automaticamente al ancho de pantalla del telefono o tablet, o puedes darle un valor en pixeles ej: width=300.
2. initial-scale=1 = zoom ajustada pantalla del telefono, mas zoom colocas initial-scale=2, alejada colocas initial-scale=0.75.
3. maximum-scale=1 = el zoom maximo que pueden dar a tu pagina web.
4. maximum-scale=1 = el zoom minimo que pueden dar a tu pagina web.
5. user-scalable=yes = dejas que el usuario que visite tu web pueda hacer zoom (recomendable si no quieres que usen zoom colocas el valor no).

Lo mas recomendable para una pagina web seria esta linea, con esto dejamos el acho ajustado al telefono o tablet, un zoom razonable, y dejar que el usuario pueda hacer zoom aunque por defecto viene en yes.

<meta name="viewport" content="width=device-width, maximum-scale=1, user-scalable=yes">

Espero que te sirva este articulo y que tengas suerte en tu proyecto web,