7) Css спрайты. Data: uri.

CSS спрайты представляют собой несколько различных картинок объединенных в одно целое изображение. Это изображение устанавливается как фоновое (background) для div-блока, или любого другого элемента, с заданной высотой и шириной. С помощью параметра background-position мы позиционируем наше изображение так, чтобы оно выглядело как картинка.

Мучения со стандартным подходом применения CSS спрайтов, а именно трудности модернизации и в некоторых случаях сложности оптимальной компоновки заставили искать альтернативный вариант оптимизации загрузки изображений. Очередной раз почитывая хабра-статьи, наткнулся на интересный подход реализации спрайтов с применением data:URI. В ходе дискуссий и умозаключений были определены слабые и сильные стороны данного подхода. Одним из значительных недостатков нового подхода является сложность сборки конечного CSS. Однако, при использовании data:URI имеет место возможность автоматизации процесса. Соответственно, было принято решение создать программное обеспечение для автоматической сборки data:URI спрайтов. 

Data:URI CSS Sprites

Новый подход генерации CSS спрайтов на основе data:URI решили назвать Data URI Sprites — DURIS.ru. Название немного необычное — но зато уникальное и запоминается хорошо. Как выяснилось позже когда-то давно жил вазописец по имени Дурис.

«Зачем мне это надо?»

Современный подход создания CSS спрайтов — позволяет безболезненно вносить коррективы в изображения и верстку; — дает возможность свести к минимуму число запросов к серверу для получения информации, которая относится к оформлению страницы; — позволяет использовать полностью семантическую верстку; — устраняет проблемы масштабирования для фоновых изображений; — объединяет изображения разных типов и осей повторения. — все создается в автоматическом режиме;

Основные достоинства

Выделим два наиболее важных достоинства использования современного подхода генерации CSS спрайтов: 1) все фоновые изображения, вынесенные в дополнительный файл стилей, загружаются за одно подключение к серверу — это обстоятельство позволяет уменьшить нагрузку на сервер и ускорить отображение фоновых изображений.  2) сборка конечного файла CSS спрайтов производится автоматически — это позволяет безболезненно проводить модернизацию изображений.

Итого

Разработанный метод/алгоритм автоматической генерации CSS спрайтов основе data:URI уникален в своем роде и не имеет мировых аналогов. Это еще раз доказывает что славянский народ тоже умеет изобретать инновации, а не только хорошие/плохие велосипеды. На сайте выложен FAQ, в котором детально расписано что и как работает. Если что не понятно описано — задаем вопросы в комментариях.

8) Чем CSS 2 отличается от CSS 3. CSS хаки и условные комментария.Когда и почему нужно поддерживать ту или иную версию браузера.

Уровень 1 (css1)

Рекомендация W3C, принята 17 декабря 1996 года, откорректирована 11 января 1999 года^[2]. Среди возможностей, предоставляемых этой рекомендацией:

• Параметры шрифтов. Возможности по заданию гарнитуры и размера шрифта, а также его стиля — обычного, курсивного или полужирного.

• Цвета. Спецификация позволяет определять цвета текста, фона, рамок и других элементов страницы.

• Атрибуты текста. Возможность задавать межсимвольный интервал, расстояние между словами и высоту строки (то есть межстрочные отступы)

• Выравнивание для текста, изображений, таблиц и других элементов.

• Свойства блоков, такие как высота, ширина, внутренние (padding) и внешние (margin) отступы и рамки. Так же в спецификацию входили ограниченные средства по позиционированию элементов, такие как float и clear.