БИЗНЕС В ИНТЕРНЕТЕ

БИЗНЕС ИДЕИ,
ИНТЕРНЕТ БИЗНЕС

Разделы сайта

Как создать сайт

 
Как создать сайт / Инструменты для создания сайта

Зачем нужны каскадные таблицы стилей CSS?

В настоящее время создание web-страниц немыслимо без использования каскадных таблиц стилей CSS (Cascading Style Sheets). Реализация CSS применяется во всех современных браузерах (Microsoft Internet Explorer, Opera, Mozilla Firefox) и инструментальных средств разработки web-страниц, таких как Macromedia Dreamweaver, Microsoft FrontPage. Поистину появление CSS совершило целую революцию во всемирной паутине, взяв на себя логическое представление и форматирование страниц. Вот почему каскадные ьаблицы стилей приобрели огромную популярность среди дизайнеров и разработчиков.

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

Если взглянуть на код HTML страницы, которая бы не использовала CSS, можно обнаружить, что объем разметки занимает иногда большую часть кода, нежели сами материалы сайта.

К примеру, взгляните на этот код, который может повторяться во многих частях сайта:

<span><font size="14" face="Times New Roman, Times, serif" color="#009999"> О сайте </font></span>

<span><font size="14" face="Times New Roman, Times, serif" color="#009999"> Контакты</font></span>

<span><font size="14" face="Times New Roman, Times, serif" color="#009999"> Скачать </font></span>

Не проще ли задать через CSS-стиль подобных элементов, и применять его в соответствующих HTML-тегах. Создадим таблицу стилей, для этого наберем следующий код и сохраним его в файл style1.css в корневой папке сайта.

razdel {
font-family: Times New Roman;
font-size: 11;
font-color: "#009999";
}

В HTML останется прописать лишь следующее.
В разделе HEAD прописываем:

<link rel=”stylesheet” type=”text/css” href=”style1.css media=”all” />

В теле страницы прописываем:
<span class=”razdel”>О сайте</span>
<span class=”razdel”>Контакты</span>
<span class=”razdel”>Скачать</span>

Не используя в полной мере каскадные таблицы стилей, у сайта возникает несколько проблем:
1) Излишний объем кода HTML значительно увеличивает размер web-страницы, а следовательно и ее загрузку.
2) Отсутствие структурированнной разметки затрудняет индексирование поисковыми машинами содержимого web-страниц.
3) В настоящее время современные браузеры лучше понимают CSS, нежели теги внешнего представления HTML. Если у вас скачут строки, не задается высота или ширина строки таблицы, задайте ее через CSS и в 50% случае это поможет!
4) Управление внешним представлением страницы только посредством HTML ухудшает обслуживание сайта, внесение изменений в код страниц. Достаточно, посмотреть на приведенный выше пример. Мы просто измениняем один стиль, тогда изменится представление всех трех элементов, нежели вносить изменения в каждый элемент. А если подобных элементов будет, как зачастую бывает около 50-ти, тогда без CSS просто не обойтись.

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

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

2) Простота применения стилей
Научиться работать со стилями достаточно легко. Если вы хоть раз создали страницу с использованием стилей, то вы уже никогда не откажетесь от их использования. Достаточно просто предварительно cоздать таблицу стилей, где можно прописать все стили, а затем ссылаться на них в тегах HTML. В настоящее время очень много материала на тему стилей в Интернете и в книжных магазинах. Нужно всего лишь запомнить правила оформления стилей, а сами стили запомняться в процессе работы. Вы можете для вызова того или иного стиля воспользоваться электронными справочными системами визуальных редакторов (Macromedia Dreamwaver), или же просто купить в книжном магазине справочник по стилям.

3) Возможность применения стилей к нескольким страницам.
Чтобы применить одну таблицу стилей к нужным страницам вашего сайта, достаточно сохранить таблицу стилей в отдельном файле, а страницах сайта в разделе head сделать ссылку на этот отдельный файл.

<link rel=”stylesheet” type=”text/css” href=”style1.css media=”all” />

4) Каскадирование.
CSS предоставляет возможность разрешения конфликтов правил, называемых каскадированием.
Допустим мы создали отдельным файлом каскадную таблицу стилей для всех страниц сайта. Однако впоследствии захотели, чтобы некоторые страницы сайта все-таки имели определенные специальные правила, применяемые к этим страницам. Для этого мы создаем дополнительную таблицу, импортируемые в эти страницы. В результате каскадирования мы переопределяем основные правила на специальные для нужных нам страниц.

<link rel=”stylesheet” type=”text/css” href=”style1.css media=”all” />

  Бесплатное создание сайтов
Как создать свой сайт
Уроки по HTML
Уроки Macromedia Dreamveawer
Уроки Adobe Photoshop
Уроки CorelDraw
Рекомендации по созданию сайтов.
Типичные ошибки при создании сайтов
Использование каскадных таблиц CSS
Работа с текстом и со шрифтами
Выбор цвета
Как правильно делать ссылки
Как лучше делать рекламые баннеры
 


Copyright © 2008 by Максим Муромский. Все права защищены.
Разрешена републикация материалов только с указанием прямой ссылки на сайт Идеи бизнеса, малый бизнес
Политика конфиденциальности



Rambler's Top100 Яндекс цитирования