вторник, 17 марта 2015 г.

Ресайзинг сайта

   Для того, чтобы сайт был сразу же заточен под мобильные устройства будем использовать отдельное свойство bootstrap'a, которое нужно подключить к сайту через тэг <head>. Например,
<meta name="viewport" content="width=device-width, initial-scale=1">

Рассмотрим отдельные свойства:
1. width=device-width
самый главный и важный параметр, который рассказывает браузеру, что веб-сайт адаптируется к его размеру. Если вы используете этот параметр на "недружественных сайта" (иначе говоря, кривых), то сайт будет увеличен относительно левого угла, поэтому придется уменьшать размер, чтобы пользователи смогли нормально просматривать сайт. 
2. initial-scale=1
Этот параметр задает уровень увеличения, который обычно обозначает, что 1 пикселю из CSS и 1 пикселю параметра viewport соответствует один реальный физический пиксель ( обычно не всегда так бывает!). Хороший сайт должен включать данный парметр по умолчанию.
3. maximum-scale=1
Максимальное увеличение. Обычно равно 1, можно увеличить параметр на сайтах, где нужно всматриваться в изображения и т.д.
4. user-scalable=no
Параметр отвечает за отключиние увеличения на мобильных устройствах. Отличный параметр для того, чтобы не путать пользователей сайта увеличить экран там, где это не нужно делать.

Комментариев нет:

Отправить комментарий