Основные моменты адаптивной верстки

[vip]

Начинаю делать адаптивный сайт, начал изучать данную тему глубже и встали несколько вопросов, очевидных ответов на которые не нашел:

 

1) как лучше подключать media queries- внутри основного css файла, или подключать через <link>?

2) какой подход лучше использовать - от mobile first или наоборот?

3) минимально под какие разрешения надо делать отдельные стили?

[satantx]

1. Как нравится

2. mobile first — говорит само за себя. Но всё это должен дизайнер реализовывать, показывать как будет выглядеть сайт при разных разрешениях, второе дело — вёрстка.

3. Опять же, всё делается по ТЗ, но начнёте углубляться в тему, поймёте

[vip]

1. Как нравится

2. mobile first — говорит само за себя. Но всё это должен дизайнер реализовывать, показывать как будет выглядеть сайт при разных разрешениях, второе дело — вёрстка.

3. Опять же, всё делается по ТЗ, но начнёте углубляться в тему, поймёте

ну вот опять никакой конкретики:-)

 

1) есть ли какая то  тенденция, как делается в большинстве случаев?

2) Опять же, как делаете вы?

3) Я спросил, минимум под какие разрешения? В интернете в основном примеры с времен 4 iPhone.

Какя понимаю, в bootsrap 3 разрешения:

min-width: 768px

min-width: 992px

min-width: 1200px

Edited December 31, 2014 by vip

[psywalker]

Начинаю делать адаптивный сайт, начал изучать данную тему глубже и встали несколько вопросов, очевидных ответов на которые не нашел:

 

1) как лучше подключать media queries- внутри основного css файла, или подключать через <link>?

2) какой подход лучше использовать - от mobile first или наоборот?

3) минимально под какие разрешения надо делать отдельные стили?

1. Зачем через <link>? Подключайте в css-файле конечно и не засоряйте страницу, тем более если их будет не одна.

2. Если тренируетесь, то попробуйте разные подходы, но начните с mobile first, да.

3. Минимальное разрешение - 200px.

[cyklop77]

1. да хоть так, хоть так. всё равно запросов к серверу меньше не станет

[vip]

3. Минимальное разрешение - 200px.

 

Вы не совсем поняли вопрос, я имел в виду под какое минимальное количество диапазонов разрешений делается адаптивный сайт,

к примеру

от 200px- до 600px

от 601px- до 900px

от 901px- до 1200px

[psywalker]

 

3. Минимальное разрешение - 200px.

 

Вы не совсем поняли вопрос, я имел в виду под какое минимальное количество диапазонов разрешений делается адаптивный сайт,

к примеру

от 200px- до 600px

от 601px- до 900px

от 901px- до 1200px

 

Под разный делается, поэтому делайте для как можно меньшего. И т.к. далее вверх.

[ryter]

http://www.mydevice.io/devices/#sortTablets

[BeetleJuice]

 

3. Минимальное разрешение - 200px.

 

Вы не совсем поняли вопрос, я имел в виду под какое минимальное количество диапазонов разрешений делается адаптивный сайт,

к примеру

от 200px- до 600px

от 601px- до 900px

от 901px- до 1200px

 

Наверерное, все индивидуально. Вот сделал ты, например, под эти 3 разрешения, смотришь как оно все выглядит: на 200рх все нормально, на 300рх нормально, а на 400рх все разъехалось и нужно как-то перекомпоновать, значит имеет смысл еще диапазон добавить.

[vip]

Понятно.

от дизайна сайта зависит.