CSS для начинающих: история появления, плюсы и минусы

Prostoweb разбирался, что такое каскадные таблицы стилей (CSS), когда они появились и почему они сегодня так важны для создания современных интернет-проектов.

Что такое CSS ?

CSS(Cascading Style Sheets) с английского переводится как  каскадные таблицы стилей, - это язык, который используется как средство оформления web-страниц, а именно для работы с шрифтами, цветами, полями, таблицам, картинками, расположением элементов.

Основной целью, которая послужила для разработки языка CSS, являлось разделение разметки содержимого (которое написанного на HTML или другом языке программирования) и представления документа (написанного на CSS). Результат этого разделения помогает увеличить доступность документа, предоставить большую гибкость, а также уменьшить сложность и повторяемость в структурном содержимом, создает удобное описание дизайна и стилистики web-страницы и ее содержимого. Еще CSS дает возможность предоставить один документ в различных стилях или методах вывода (например, таких как экранное представление, чтение голосом, печать).

Типичный код СSS может выглядеть так:

#columns-3 {

   text-align: justify;

   -moz-column-count: 3;

   -moz-column-gap: 12px;

   -moz-column-rule: 1px solid #c4c8cc;

   -webkit-column-count: 3;

   -webkit-column-gap: 12px;

   -webkit-column-rule: 1px solid #c4c8cc;}

История создания и развития CSS

В 1990-х возникла необходимость стандартизировать web-инструменты, создать общие правила, с помощью которых программисты и web-дизайнеры могли бы создавать сайты. Как результат этой необходимости, появились языки HTML 4.01 и XHTML, а также стандарт CSS.

Первое упоминание о CSS было в 1994 году, когда Хоком Виум Ли предложил использовать CSS (Каскадные таблицы стилей) для стилистического оформления web-страниц. У него не сразу получилось продвинуть свою технологию, - только через пару лет ему удалось привлечь внимание к CSS. Итак, 17 декабря 1996 года опубликована первая спецификация (CSS1) и она была рекомендована к использованию Консорциумом Всемирной паутины (W3C).

После небольшого успеха  положение дел у технологии CSS пошли куда лучше и 12 мая 1998 года (через 2 года)  была принята рекомендация W3C для CSS2. Следующим этапом была CSS 2.1 - версия W3C от 8 сентября 2009 года, она была построена на базе CSS2, и была работой над исправлением существующих ошибок.

Сегодня актуальна версия CSS3, которая максимально расширена по сравнению с предыдущими версиями. CSS3 включают эффекты теней, а также скругленные углы у блоков. В CSS3 появилась возможность устанавливать изображения в качестве фона и использовать их как границы. Намного проще и удобнее стала работа с анимацией – теперь для ее создания достаточно возможностей самой CSS3, стало не нужно работать с языком Java Script.

Плюсы и минусы использования CSS

До того, как появился CSS, оформление web-страниц могло осуществляться  непосредственно внутри содержимого документа, появление же технологии CSS дало возможность разделению содержания и представления документа. Благодаря этой возможности стало реальным простое применение единого стиля оформления для большинства подобных документов, и стало доступно быстрое изменение их оформления. Использование CSS в разработке сайтов имеет свои плюсы и минусы.

Преимущества CSS:

  • Простота самого языка CSS вместе с принципом отделения оформления от содержания дает возможность сократить время на разработку и поддержку сайта.
  • Имеется несколько  вариантов дизайнов страницы для просмотра на разных устройствах. Например, дизайн на экране компьютера рассчитан на одну ширину, и будет полностью выводиться на экран, а на мобильных устройствах он будет подстраиваться к размерам экрана и некоторые элементы будут исключены от показа, также и при печати, будет печататься нужный текст, без лишнего (например, без шапки меню).
  • Уменьшается время загрузки страниц web-сайта за счет переноса правил представления данных в отдельный CSS-файл. Благодаря этому браузер  загружает только структуру документа, а также данные, хранимые на странице, а представление этих данных загружается браузером только один раз и может бать закеширован, - благодаря этому уменьшается трафик, время загрузки, а также  нагрузка на сервер.
  • Простота изменения дизайна. Один CSS управляет отображением множества HTML-страниц.  Когда возникает необходимость изменить дизайн сайта, то незачем  править каждую страницу. Для последующего изменения дизайна всего лишь нужно изменить CSS-файл, и как результат, изменение дизайна делается быстрее.
  • CSS предоставляет дополнительные возможности форматирования, о которых при использовании только самих атрибутов даже и не приходилось  мечтать.
  • Повышение совместимости с разными платформами за счет использования web-стандартов.

Недостатки CSS:

  • Различное отображение вёрстки в разных браузерах. Если браузеры устаревшие, то возможно, что одни и те же данные CSS по-разному ими интерпретируются.
  • Необходимость исправлять не только один CSS-файл, но и теги HTML. Часто встречается на практике необходимость исправлять не только один CSS-файл, но и теги HTML, которые связаны с селекторами CSS. Иногда это значительно увеличивает время редактирования, а также и тестирования.

Итак, CSS – это сильнейший инструмент и один из основных составляющих практически любого web-сайта. Без CSS  просто невозможно представить современную деятельность web-разработчиков. Сегодня  CSS – это общепринятый стандарт разработки, который принимается всеми без исключения компаниями-разработчиками, что явно показывает его значимость и необходимость.

Опубликовано на сайте: 27.06.2013

Автор: Игорь Лубенец

Источник: http://www.prostoweb.com.ua/

Заказать онлайн:

кредит на карту

кредит наличными

кредитку

кредит под залог

страховку


Полезное видео

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




Забавное видео

2-х летний малыш любит бросать. Смотрите, что получилось, когда родители купили ему баскетбольное кольцо! Посмотреть все видео малыша можно на канале BasketBoy TV