UPD. Для краткого введения в адаптивный дизайн рекомендую прочитать статью «Как сделать один сайт для всех устройств (Responsive Web Design)».

Перевод крайне ценной статьи «Responsive Web Design Techniques, Tools and Design Strategies» популярного интернет-издания для разработчиков Smashing Magazine.

Еще в январе мы опубликовали статью об адаптивном дизайне «Responsive Web Design: What It Is and How To Use It» (Адаптивный веб-дизайн: Что это такое и как им пользоваться). Адаптивный веб-дизайн продолжает привлекать к себе много внимания, но, учитывая, насколько он отличается от традиционных методов разработки сайтов, он может показаться заоблачно сложным для тех дизайнеров и разработчиков, которые его не пробовали.

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

Техники Responsive web design

1. CSS Transitions and Media Queries
CSS Transitions и Media Queries

Elliot Jay Stocks подробно рассказывает о методе сочетания CSS Media Queries и CSS transitions. Основная идея в следующем: разрабатывая адаптивный сайт с помощью Media Queries, вы постоянно изменяете ширину вашего браузера, чтобы посмотреть, как сайт ведет себя при этом. Но каждый раз, когда отрабатывает один из ваших Media Queries, виден жесткий переход между стилями (первый, например, для десктопов, второй — для планшетов). Почему бы не использовать CSS transitions для сглаживания этих жестких переходов с помощью анимации?

Краткое содержание. В обозримом будущем сайты/веб-приложения могут вытеснить или серьезно потеснить нативные приложения.

Приложения можно будет делать независимо от App Store, Android Маркет и других на HTML/CSS/JS.

Это станет возможно благодаря многим независимым факторам:

1. Недружелюбная политика экосистем

Официально попасть на iOS можно только через App Store

Из-за политики Apple, которая обязала отчислять 30 процентов дохода и решила не делиться информацией о подписчиках, из App Store ушел The Financial Times. Ранее The Wall Street Journal прекратил продажи подписок через магазин.

Как ни крути 30% — это много, а вкупе с довольно большим количеством постоянно меняющихся ограничений, магазины приложений не самое приятное явление для разработчика.

Если бы App Store был каталогом привилегированных гарантированно проверенных, качественных и безопасных приложений наряду с другими возможностями получить программу, то оплата таких услуг была бы оправдана.

Но сейчас это единственный официальный способ для разработчиков донести свое приложение до конечного потребителя. Фактически App Store аналогичен поисковику, который индексирует приложения и делает их видимыми для пользователей. Но поисковик в отличии от App Store не берет плату за это самое индексирование.

Недаром существует неофициальный альтернативный репозиторий под iOS для несогласных — Cydia.

2. Слишком большое количество экосистем

Вчера была опубликована хорошая статья «Веб-дизайн. Каждому устройству свое представление». Несмотря на неплохие размышления, к сожалению, вывод в ней довольно глупый. А именно:

«Нужно определить, какими устройствами могут пользоваться ваши посетители, проработать и создать для этих устройств представление вашего сайта, определить устройство посредством проверки заголовков браузеров, и отправить наиболее подходящее представление.»

Почему это глупо

Во-первых, никто не сможет предугадать, какими устройствами будут пользоваться ваши посетители. Нужно ориентироваться не на устройства, а на разрешения.



Это скриншот из презентации «Beyond the mobile web by yiibu» (очень рекомендую).

Во-вторых, если вы не facebook или yandex, скорее всего, вы не потянете создание и поддержку разных версий сайта для каждого устройства. Да и это не имеет особого смысла. Потому что ситуация становится похожа на реалии пятнадцатилетней давности. Тогда делали сайт «под браузер», а сейчас автор предлагает делать сайт «под устройство».

Как сделать один сайт для всех устройств

Andy Clarke показал сообществу сайт-демонстрацию возможностей CSS3 Animation и анонсировал animatable.com с помощью которого демонстрация была сделана.

С помощью Animatable анимацию можно создавать в пару кликов. Интерфейс очень похож на видеоредактор. В данный момент проект в разработке.

Демонстрация Mad Animation работает на webkit-браузерах — Chrome, Safari, браузерах для мобильных платформ (Android, BlackBerry, Apple iOS, WebOS). Они увидят всю красоту CSS (нужно кликнуть по «watch»):

HTML5 Boilerplate это удобный шаблон для HTML5 проектов, а так же квинтесенция полезных и удобных техник для создания качественных сайтов.

— появилась возможность собрать «HTML5 Boilerplate» под себя.
— уменьшен общий размер.
— на сайте появилась документация.
— …

Подробнее в блоге Пола Айриша или на сайте проекта HTML5 Boilerplate.

14—25 октября 2010 года в России будет проходить перепись населения. Студентов МИФИ 4-го и 5-го курсов принудительно заставляют в ней участвовать. В ответ на отказ одного из студентов участвовать в этом мероприятии (во-первых из-за полного отсутствия желания ходить по квартирам и «переписывать» людей, во-вторых из-за работы) заместитель декана ответил следующее:

«Информация для $student_name.

Участие студентов в переписи определено приказом ректора № 134 от 14.04.2010 г. Согласно Уставу, все студенты должны выполнять приказы ректора. О том, что они ознакомлены с Уставом и обязуются его выполнять, студенты расписывались при поступлении в МИФИ.

$student_name является студентом дневной формы обучения. На время переписи студенты освобождаются от занятий. При поступлении на работу должен был получить разрешение деканата. Такого разрешения, насколько я знаю, он не получал.»

Вопрос: Насколько это принуждение правомерно, и не идёт ли оно в разрез с какими-либо законами?

UPD. На перепись я так и не пошел. Те, кто пошли, очень сильно об этом потом жалели. С их слов более неадекватных людей, чем в Единой России, трудно найти.

Трудно передать тот абсурд, который творится в МИФИ.

4го марта в Национальный Исследовательский Ядерный Университет приезжает патриарх Кирилл. «Ученый совет НИЯУ-МИФИ единогласно принял решение о присуждении Святейшему Патриарху Кириллу звания Почетного доктора нашего университета honoris causa.» Новость на сайте МИФИ.

В связи с его приездом, вчера на входе университета тренировались звонари. С утра недалеко от главного входа МИФИ на клумбе водрузили двухметровый деревянный крест. А cамым лучшим студентам выдали бейджи-пропуски, предоставляющие почетную возможность послушать речь патриарха. Студенты несомненно рады.



P.S. Да, и еще. В главном корпусе нашего университета строят храм. Или уже построили.

UPD1. «Студенты МИФИ подготовили обращение в прокуратуру с требованием убрать православный крест с территории университета»