Различия современных веб-стандартов

Федеральное бюджетное государственное образовательное учреждение

Высшего профессионального образования

«ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ УПРАВЛЕНИЯ»

ИНСТИТУТ ИНФОРМАЦИОННЫХ СИСТЕМ УПРАВЛЕНИЯ

Кафедра информационных систем

Специальность: «Прикладная информатика»

КУРСОВАЯ РАБОТА

 

«Современные веб-стандарты»

 

По дисциплине «Стандартизация и сертификация информационных систем»

 

Проверил: Выполнили:

Бакст Л. А. Сорокина Ю. С.

Хуснетдинова В. Р.

Москва 2012

Содержание Введение

Актуальность темы

Разработка web-страниц - это один из наиболее востребованных разделов современных информационных технологий. Она призвана обеспечивать наиболее эффективное использование Интернет-ресурсов.

Прежде разработчики редко заботились об использовании веб-стандартов при создании сайтов. Основной проблемой тогда была неприменимость данного подхода в связи с отсутствием программ, обеспечивающих адаптацию и правильное отображение веб-страниц в различных системах. На сегодняшний день практически во всех браузерах для Windows, Linux, Mac OS X (MS InternetExplorer 6+, Netscape 6+, Opera 7+, Firefox, Safari, Konqueror, Galeon и др.) достаточно хорошо реализованы web-стандарты. Это побуждает разработчиков веб-страниц применять технологии веб-стандартов.

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

 

Цeлью рaбoты cтaлo выявлeниe ocoбeннocтeй современных веб-стандартов. Для дocтижeния пocтaвлeннoй цeли нaм прeдcтoялo рeшить cлeдующиe взaимocвязaнныe зaдaчи:

· рaccмoтрeть функции и виды современных веб-стандартов;

· выявить особенности подхода в использовании веб-стандартов и его преимущества;

· прoaнaлизирoвaть, используются ли веб-стандарты известнейшими сайтами и браузерами;

· прoaнaлизирoвaть, используются ли веб-стандарты известнейшими сайтами и браузерами в России;

· oпрeдeлить ocнoвныe нaпрaвлeния и тeндeнции рaзвития и использования веб-стандартов.

 

Методы
Лoгикa иccлeдoвaния oбуcлoвилa cтруктуру рaбoты, cocтoящeй из ввeдeния,

Основная часть

Что такое веб-стандарты?

Давайте подробнее рассмотрим понятие веб-стандартов.

Веб-стандарты – это открытые, незащищенные какими-либо патентами спецификации и рекомендации W3C.

W3C – Консорциум Всемирной паутины (World Wide Web Consortium) – организация, разрабатывающая и внедряющая технологические стандарты для сети Интернет.

Спецификации W3C (за исключением редких частных случаев) не обладают статусом стандартов ISO или ГОСТ. Их несоблюдение не может повлечь за собой какие бы то ни было санкции в отношении веб-разработчиков или производителей браузеров со стороны гипотетических контролирующих органов — штрафы, отзывы лицензий и прочее подобное.

Веб-стандарты допускают функциональную совместимость между всеми браузерами, на каждой операционный системе и даже на каждом доступном электронном устройстве.

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

Можно сказать, что философия современных веб-стандартов основывается на трех китах:

· разделении содержания, представления и поведения на уровне конечного кода веб-страниц, отправляемого сервером клиенту;

· семантичности разметки;

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

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

Принято считать, что веб-документ составляют четыре материи: содержание, структура, представление и поведение.

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

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

Представление — гораздо более независимая от структурированного содержания категория. Оно описывает особенности отображения или воспроизведения контента. Примерами различных представлений могут служить внешние виды веб-страницы на большом экране монитора настольного компьютера или ноутбука, на маленьком экране мобильного устройства, на листе бумаги после распечатки. Помимо перечисленных нами визуальных представлений, могут быть и другие их виды: аудиальные (воспроизведение текста страницы речевым браузером), тактильные (печать этого документа на специальном брайлевском принтере или вывод контента веб-страницы на механическую строку Брайля для незрячих людей). Чрезвычайно важно понимать, что структурированное содержание единственно, тогда как его представления множественны. Одна и та же веб-страница может выглядеть (или, в более широком смысле, быть воспроизведена) совершенно по-разному в различных условиях.

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

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

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

Валидность — соответствие кода формальным требованиям спецификаций. В идеале необходимо стремиться доводить код до полностью валидного состояния. Валидность труднее обеспечить, если речь заходит об экспериментальных технологиях (например, HTML5 и CSS3). Общепринятой можно признать практику стремиться достигать абсолютной валидности кода разметки, а к таблицам стилей относиться более либерально, ограничиваясь обеспечением их синтаксической корректности. «Фундамент» HTML5 — словарь и грамматика языка разметки — относительно небольшая часть всей спецификации, которая уже в деталях проработана и не будет претерпевать принципиальных изменений. Многие свойства и значения, предусматриваемые в CSS3, разработчики пока вынуждены применять с вендорными префиксами, что автоматически делает таблицы стилей невалидными. Можно отметить, что валидность кода разметки куда как более важна, чем валидность таблиц стилей, ибо код разметки описывает самоценную сущность — структурированное содержание, а код таблиц стилей — всего лишь представление, которое не может существовать без содержания, и вариантов которого для одного и того же содержания теоретически может быть бесконечно много.

Применение веб-стандартов

Современные web-стандарты позволяют разделить структуру документа, его оформление и поведение. За структуру отвечает XHTML или HTML (XHTML — eXtensibleHyperTextMarkupLanguage — расширенный язык разметки гипертекста). Внешний вид описывается на языке CSS (CSS — CascadingStyleSheets — каскадные таблицы стилей). «Оживить» же страницу позволяет JavaScript, обращающийся к ее отдельным элементам в соответствии с DOM (DOM — DocumentObjectModel — объектная модель документа). JavaScript (под именем ECMAScript) был стандартизован Европейской ассоциацией по стандартизации информационных и вычислительных систем (ранее называвшейся Европейской ассоциацией производителей компьютеров — ECMA); XHTML, CSS, DOM являются рекомендациями (фактически, тоже стандартами) Консорциума World-WideWeb (W3C).

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

Можно сверстать страницу, которая будет проходить проверку валидатором на соответствие спецификации XHTML 1.0 Transitional, но при этом код не будет иметь ничего общего с версткой не то что хорошего, но даже минимально приемлемого уровня.

Впрочем, сказанное справедливо даже для XHTML 1.0 Strict и HTML5 — свободы там ощутимо меньше, но ее все равно более чем достаточно. Не применяйте тегов <h1>…<h6> для обособления заголовков; отделяйте абзацы текста друг от друга тегом <br>, не используя для этих целей элементы <p>; горизонтальные отступы создавайте при помощи последовательностей из множества неразрывных пробелов; вставляйте картинки, не являющиеся частью контента, а служащие декоративными элементами, всегда при помощи тега <img> вместо того, чтобы делать их фоновыми рисунками; старайтесь как можно чаще использовать inline-стили — и цель будет достигнута. Любой приверженец веб-стандартов с не слишком крепкими нервами упадет в обморок от вашего кода.

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

Сегодня, в период, который увлеченные натуры называют эпохой Web 2.0, эта проблема особенно актуальна в связи с тем, что «автономные» сайты почти вымерли — все вокруг считают священным долгом понавешать себе на страницы всякие счетчики, виджеты социальных сетей, разнообразные информеры, рекламные блоки… И, мягко говоря, далеко не все эти произведения сторонних разработчиков идеальны. А перфекционистов, готовых пожертвовать каким-нибудь красивым виджетом в пользу абсолютного совершенства верстки, — единицы.

Различия современных веб-стандартов

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

HTML и XHTML

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

Сейчас можно уже говорить о неких единых принципах работы с текстом как при его оформлении в текстовом процессоре (не важно, MS Word, OpenOffice или каком-то ином), так и при гипертекстовой разметке. И в том, и в другом случае при грамотной работе задачи написания и верстки полностью разделены и, вообще говоря, независимы.

Итак, мы используем только структурные теги (или, как их еще называют, теги логической разметки) и только по их прямому назначению. Абзацы текста создаются с помощью тега <p>, и никак иначе. Заголовки (и только заголовки) — тегами <h1>, <h2>... <h6>. <div> — это крупный раздел, блок на странице. Никаких <b>, <i>, <u>, тем более, <font...>!

Вторая особенность — более жесткие и единообразные правила XHTML по сравнению с HTML. Это, с одной стороны, упрощает их изучение, с другой — подталкивает к более аккуратной работе.

Напомним основные отличия:

· все теги и имена атрибутов записываются строчными буквами (значения атрибутов могут содержать и заглавные);

· все значения атрибутов заключаются в кавычки;

· все атрибуты должны иметь значения;

· все теги должны быть закрыты (в том числе, <p>, <li>, <td> и т. п.), «пустые» теги закрываются наклонной чертой в конце тега (например, <br />);

· все специальные символы должны быть закодированы (знак «<», не являющийся частью тега, записывается как «&lt;», «>» — «&gt;», «&» — «&amp;» и т. д.)

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

CSS

(добавить)

JavaScript

(добавить)

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

Лет 15 тому назад для того, чтобы сделать шрифт надписи покрупнее и покрасить буквы красным, любой веб-мастер написал бы прямо в HTML-коде вот что: <fontsize="+1" color="#ff0000">очень важная надпись</font>. И оказался бы совершенно прав, ибо других способов добиться желаемого не существовало в принципе. Сегодня же за такое сразу выдают чугунную медаль за профнепригодность.

Лет 10 тому назад реализация эффекта «перекатывания» кнопок меню навигации не обходилась без JavaScript. Спецификация CSS2 уже даже была рекомендацией W3C, но это мало кого трогало — в распространенных на тот момент браузерах она толком не работала.

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