Разработка сайтов для СРО

SEO-копирайтинг — текст для поисковой оптимизации. Продвижение сайта в поисковых системах. Оптимизация сайта для поисковых машин. Раскрутка сайта в ведущих поисковиках

Создание и раскрутка сайтов в Интернете

Что нужно для SEO?

Текст & Всемирная Паутина

Инструмент веб-строителя

HTML - язык гипертекста

Поисковая оптимизация

Что такое раскрутка сайта?

Контекстная реклама

Что такое обмен ссылками?

Почтовые рассылки

Соблюдайте правила

Что препятствует рейтингу?

Что такое CMS?

Краткий словарь терминов

Полезные книги

Карта сайта

Как повысить находимость сайта?

Основы кодирования

Основные конструкции CSS

Замечания о кодировании CSS

Виды селекторов CSS

Преимущества и недостатки CSS

 
Разработка сайтов под ключ

Ссылки по теме

CSS Blast галерея css-сайтов и проектов Web 2.0

XHTML, CSS, JavaScript, DOM. Советы, секреты, хитрости и тонкости

CSS, HTML в примерах и статьях

Учебники HTML и CSS

HTML справочник

Справочники HTML и CSS

Основные ошибки юзабилити

Для тех, кто делает сайты!

Справочник по CSS

CoffeeCup - HTML редактор

FCKEditor - текстовый редактор для браузера

NotPad++ - текстовый редактор

PSPad — текстовый редактор

CSE HTML Validator Lite — редактор-анализатор (валидатор)

W3C - стандарты HTML

W3C - стандарты CSS

Справочная информация

Lynx Viewer

 

Советую прочитать!

HTML и CSS на примерах. Ускорение работы сайта Web-конструирование. Элективный курс.
HTML и CSS Философия CSS-дизайна Настольная книга по CSS2
XHTML и CSS2

Каскадные таблицы стилей - CSS

Главная « CSS - каскадные таблицы стилей

версия для печати

Техника оформление текста с помощью CSS

CSS (каскадные таблицы стилей) приобрели популярность в конце 1996 года. Не смотря на относительно долгое существование этой технологии, ее практическое применение для Web-дизайна ограничивалось управлением шрифтами и цветом, по крайней мере, до недавнего времени.

Данное ограничение возникло из-за отсутствия совместимой поддержки таблиц стилей браузерами. Поскольку не все браузеры одинаково обрабатывали инструкции языка CSS (если вообще обрабатывали), дизайнеры не могли в полной мере воспользоваться реальными преимуществами таблиц стилей. Вместо этого, ответственность за отображение информации возлагалась на язык HTML.

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

Почему это так важно? Причин тому - множество:

  • Раздельное хранение представления и документа позволяет стилизовать этот документ для различных устройств, включая, монитор принтер, проектор и даже портативные устройства.

  • Раздельное хранение представления и документа означает уменьшение размера документа, что, в свою очередь, ускоряет загрузку и отображение страницы, доставляя удовольствие посетителям.

  • Язык CSS позволяет управлять как одним документом, так и миллионами документов. Для внесения изменения потребуется модифицировать необходимый стиль в одном CSS-файле, и это изменение автоматически отразится на всех связанных документах. В языке HTML это сделать невозможно.

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

  • Отделив представление от структуры и содержимого, легко добиться доступности документа. Документы, в которых не используются сложные таблицы и большое количество элементов языка HTML, отвечающих за представление, по сути являются более доступными, чем те документы, у которых перечисленные свойства присутствуют.

Очевидно, что язык CSS предоставляет множество возможностей.

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

Люди часто интересуются, почему стили называются каскадными? Каскад - это иерархия применения - красивое название для системы применения правил. Если внимательно посмотреть на ниже перечисленные типы таблиц стилей, то станут очевидными различные способы применения стиля к одному и тому же документу.

Что же получится в результате, если у нас будет встроенный стиль, внедренная таблица стилей и связанная таблица стилей?

Каскад определяет способ применения правил, в случае с типами таблиц стилей:

  • Пользовательский стиль переопределяет все остальные стили;

  • Встроенный стиль превосходит внедренный, связанный и импортированный стили;

  • Внедренный стиль имеет преимущественное значение перед встроенным стилем;

  • Связанные и импортированные стили рассматриваются, как равные по значимости, и применяются везде, где не были применены другие типы таблиц стилей.

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

Существует шесть типов таблиц стилей:

  • Стиль браузера - это стандартная таблица стилей, используемая браузером. Если никакие правила стиля не объявлены, применяются эти стандартные стили.

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

  • Встроенный стиль - стиль, который определяется непосредственно в элементе и применяется с использованием атрибута style. Такой подход полезен для стилей, единовременно применяемых к одному элементу, однако он не считается идеальным.

  • Внедренный стиль - этот стиль управляет представлением одного документа и размещается внутри элемента style HTML-документа.

  • Связанный стиль - это таблица стилей, которая связана с HTML-документом при помощи элемента link, размещенного в разделе документа head. Любой документ, связанный с данным типом таблицы стилей, получает все стили, определенные в ней, в чем и заключается преимущество управления языка CSS.

  • Импортированный стиль - этот тип похож на связанные стили, однако позволяет импортировать стили в связанную таблицу стилей или непосредственно в документ. Он полезен для реализации обходных путей и для управления множеством документов.

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

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

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


внимание!

Содержание — это та информация, которую получает пользователь.


внимание!

Структура — принцип организации этой информации.


внимание!

Представление — внешний вид, который воспринимает пользователь.

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

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

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


внимание!

Многие разработчики сайтов любят говорить о таких вещах, как «концепция», «стиль», «дизайн», «креатив» и т. д. Конечно, оригинальная концепция и великолепный стиль могут существенно улучшить эффективность сайта и его привлекательность для пользователя — но только при условии, что сайт предоставляет нужное и интересное содержание. В самом деле, первый вопрос, который должен задавать себе разработчик, - «Зачем пользователи будут заходить на мой сайт?» Если вовремя не задуматься над этим — может получиться красивый, но никому не нужный сайт.

Структура страницы — это взаимосвязь ее логических элементов: заголовков, обычного текста, перечней, гиперссылок и т. д. Пользователю удобнее воспринимать содержание, если оно организовано в стройную и логичную структуру. В самом деле, подумайте, как вы пользовались бы словарем, если бы слова в нем шли не по алфавиту, а в случайном порядке? Алфавитный порядок — один из типичных примеров того, как содержанию придается определенная структура. На веб-страницах для структурной организации используются элементы HTML.

Наконец, представление страницы — это та форма, в которой пользователь ее воспринимает. Большинство пользователей просматривают страницы на экранах компьютеров и других устройств. Значит, для них представление страницы — это то же самое, что ее внешний вид, оформление.

Если пользователь прослушивает веб-страницу с помощью речевого браузера или «прощупывает» ее браузером Брайля — значит, представлением является ровно то, что он слышит или нащупывает.


внимание!

Таблицы стилей CSS как раз и предназначены для описания представления страницы.

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


внимание!

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

 

Ресурсы, посвященные CSS-методам …

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

Чтобы вы увидели, насколько сложным может быть Web-дизайн на основе CSS, я с радостью рекомендую вам посетить сайт CSS Zen Garden (www.csszengarden.com). Это образец потрясающе разнообразного дизайна, основанного на одной разметке XHTML-документа.

Побочным продуктом создания этого сайта явилась книга «Философия CSS-дизайна», авторы Дейв Ши (Dave Shea) и Молли Хольцшлаг (Molly E. Holzschlag), в которой произведен критический обзор элементов в 36 случаях дизайна и продемонстрированы методы CSS, на которых эти случаи основывались.

Существует также ряд интернет-ресурсов, в которых предлагаются советы по работе с CSS, методы и учебные материалы.

  • A List Apart - очень хороший источник статей по CSS и другим вопросам Web-дизайна. Статьи на этом сайте пишутся признанными авторитетами во всех областях Web-дизайна.

  • Stopdesign - Дуг Боуман является одним из авторитетов в области Web-дизайна, основанного на стандартах. На его сайте предлагаются полезные учебные материалы и комментарии по использованию CSS в дизайне.

  • Mezzoblue - это персональный сайт Дейва Ши, который создал ресурс CSS Zen Garden и ухаживает за ним.

  • Meyerweb - король CSS, Эрик Мейер, публикует здесь свои тесты, хитрости и учебные материалы.

  • SimpleBits - это персональный и профессиональный сайт Дэна Цедерхолма, выдающегося Web-дизайнера и автора книги «Web Standards Solutions».

  • CSS-Discuss Wiki - это род Web-сайта, формируемого усилиями сообщества. Данный сайт является дополнением к популярному списку рассылки css-discuss (www.css-discuss.org), и он служит хранилищем методов CSS и идей, генерируемых сообществом css-discuss.


внимание!

Книги, которые следует прочитать:

  1. Мержевич В.В.: HTML и CSS на примерах.

  2. Мержевич В.В.: Ускорение работы сайта.

  3. Дуванов А.А.: Web-конструирование. Элективный курс.

 
Запомнить эту страницу в google.com Запомнить эту страницу в bobrdobr.ru Запомнить эту страницу в news2.ru Запомнить эту страницу в Memori.ru Добавить в МоёМесто.ru сохранить на RUmarkz Добавить страницу к Мистеру Вонгу Запомнить эту страницу в del.icio.us Запомнить эту страницу в technorati.com Запомнить эту страницу в linkstore.ru Добавить на Ваау!
Valid XHTML 1.0! Valid CSS!
Как повысить находимость сайта?

Свойства CSS

Свойства шрифта

Свойства блоков текста

Теги DIV и SPAN

 
Заголовки разделов текущей страницы…

Оглавление

Ресурсы, посвященные CSS-методам…

 

наверх

 
Контактная информация

Пишите:
Звоните: + 7 (916) 597-36-78

SEO-копирайтинг — текст для поисковой оптимизации. Продвижение сайта в поисковых системах. Оптимизация сайта для поисковых машин. Раскрутка сайта в ведущих поисковиках

Copyright (©) 2004— by Yuriy Korovenkov