Закладки с меткой адаптивный дизайн

This site is a proof of concept for many of the ideas described in Rethinking the Mobile Web.

Статья про работу этой компании:
http://conversations.nokia.ru/2011/10/kak-podruzhitsya-s-brauzerom/

"Ведущие веб-разработчики из компании Yiibu получили задание сделать стартовую страницу минимум для 70 мобильных устройств Nokia. Но управляющие компанией Стефани и Брайан Ригеры решили превзойти все ожидания, сделав браузер доступным для более чем 250 мобильных телефонов Nokia, начиная с классической модели N70, выпущенной в 2005, и заканчивая новейшими сенсорными моделями на Symbian^3 и MeeGo."

- Mobile First
- Semantic
- Awesome Javascript

Интересный метод подключения стилей в контексте подхода “Mobile first” с применением Sass.
Изучить!

Статья начавшая эпоху адаптивного дизайна

Пять основных подходов преодоления проблемы с media queries (IE, старые браузеры и т.п.)

Рекомендации по мобильной разработке от W3C

Приводятся примеры браузеров, которые понимают media=handheld.
Приведен интересный вариант схемы подключения стилей.

iScroll was born because mobile webkit (on iPhone, iPod, Android and Pre) does not provide a native way to scroll content inside a fixed width/height element. This unfortunate situation prevents any web-app to have a position:absolute header and/or footer and a scrolling central area for contents.
БОНУС: смотрим 3D-лого на JS ;)

Подборка 15 CSS-фреймворков для адаптивного дизайна

Плавно переставляем элементы страницы при изменении размеров экрана

Автор приводит примеры адаптивного и раздельного дизайна с учетом платформы. Примеры не учитывают web-доступность.

9 JS-фреймворков для мобильной разработки

Генератор CSS-сетки для адаптивного дизайна

Автор термина "адаптивный дизайн", персональный блог

Официальные рекомендации от Google.
Основное: сайты д.б. адаптивными, т.е. "один сайт на все устройства" это предпочтительно.

Блог студии, специализирующейся на адаптивном дизайне

Фреймфорк для мобильной верстки

Описан ряд мета-тегов, значимых для мобильных устройств

Разделены понятия "реагирующий шаблон" и "адаптивный шаблон"

Руководство по разработке для Safari на iOS от Apple. Описание viewport.

Изложена схема формирования "умного CSS"

Автор сторонник подхода "каждому устройству - свой вариант сайта"

Автор делает упор на изменения в подходе к дизайну

Подробная статья про создание сайтов с учетом доступности. Ссылки на стандарты по доступности.

Автор разделяет адаптивную и мобильную верстку, причем выступает за последнюю. Также есть видеокурс.

Приводится деление мобильных устройств по классам

Статья охватывает практически все проблемы при адаптивной верстке и рассказывает про их причины.
Перевод:
http://www.beskrovnyy.com/verstka/skaz-o-dvux-vyuportax-chast-pervaya/
http://www.beskrovnyy.com/verstka/skaz-o-dvux-vyuportax-chast-vtoraya/

Про viewport от Opera

Набор подсказок, ссылки на CSS-каркасы, вопросы использования шрифтов, вспомогательные скрипты

Шаблоны для мобильной разработки от Nokia - CSS каркасы

Очень и очень интересная подборка