Автор: Демьянчук Виталий
http://vitaweb.pp.ru

Все, наверное, когда-то учились в школе. Кто-то раньше закончил данное учебное заведение, кто-то позже. Наверняка, все из вас помнят ваши уроки русского языка. Как тяжело он порой нам давался, а мудрые учителя, как будто зная, что очень важно в жизни - уметь правильно писать, всегда пытались помочь нам освоить данную науку. Какие навыки наши учителя заложили в нас в первую очередь? Правильно! Уроки чистописания. Благодаря их помощи мы все имеем навыки чистописания. Мы можем писать правильно и выражаться так, как нам хочется. Как же это может быть связано с нашей темой? - спросите вы. Как правило, любой язык, который мы изучаем, содержит определённый набор правил, при помощи которых он фиксируется и закрепляется в письменности.

Эти правила чаще всего формируются нашей практикой использования какого-либо языка. Какие-то нормы закрепляются и фиксируются, а какие-то не предполагается использовать в связи с неустоявшейся практикой их употребления. Так, например, в русском языке мы имеем наличие определённых правил орфографии, графики и прочих составляющих языка. Не исключение веб-языки, которые тоже используются нами, но уже , скорее, для общения браузеров, предоставляя нам почву для употребления уже русского языка.

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

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

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

Можно выделить три типа возможных ошибок:

1) неверно прописаны основные теги
2) используются нестандартизированные теги
3) не указана рекомендация и тип языка.

Ошибка 1: нет описания для браузера, которое указывает на версию языка разметки

А верно будет вот так:

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

Ошибка 2: не прописаны или же прописаны неправильно обязательные атрибуты для тегов разметки

Типичные ошибки:

<script>var a=5;</script> <!-- Не указаны обязательные атрибуты для тега <script>: отсутствуют параметры type и language --> <img src="1.jpg"> <!-- Не указан обязательный атрибут alt --> <p>...В случае вот такого "столкновения"...</p> <!-- Мы не можем использовать служебные знаки синтаксиса HTML "кавычки" в качестве кавычек, которые используются в текстах, а также любые другие обозначения, которые используются в синтаксисе этого языка. Для этого компанией W3C были придуманы HTML-сущности, которые вставляют точно такие же текстовые элементы, как кавычки, угловые скобки и прочие элементы и не противоречат принципам языка HTML. Например, для кавычек нужно использовать &quot;--> <img src=1.jpg alt=рисунок> <!-- Типичная ошибка: не прописаны кавычки значений атрибутов --> <p><a></p></a> <!-- Частая ошибка. Иногда такой метод кодирования срабатывает, но он категорически не рекомендуется, т. к. вызывает неоднозначную трактовку у браузеров. Сейчас принят метод вложенности тегов друг в друга--> <!-- Тут стоит комментарий //--> <!-- Тоже одна из довольно частых ошибок, два двойных слеша в языке HTML не рекомендуется использовать, был принят комментарий без применения слешей--> <script language="javascript" type="text/javascript" scr="adr.js?a=mp&b=df;></script> <!-- Очень часто, практически всегда, программисты используют именно такую конструкцию вызова скрипта с определёнными параметрами, используя для связки переменных знак &, однако использование этого знака не регламентировано в языке. Вместо него нужно использовать знак HTML-сущности &amp;--> <script language="javascript" type="text/javascript">document.write('<a href="http://www.sait.templ">Адрес сайта</a>');</script> - <!-- В тексте данного кода тоже присутствует ошибка. Она довольно-таки частотная, вероятно, потому что любой браузер умеет интерпретировать её, но всё-таки данное написание не регламентировано W3C. Необходимо использовать знак \ для закрытия парных элементов кода-->

Давайте перепишем наши примеры на язык стандарта.

<script language="javascript" type="text/javascript">var a=5;</script> <!-- Мы прописали все необходимые параметры: тип и название языка--> <img src="1.jpg" alt="Изображение" > <!-- Мы прописали обязательный атрибут alt, каждое изображение должно быть описано этим атрибутом, сделано это для браузеров, не отображающих графику или в которых графика отключена, к тому же все значения атрибутов должны быть заключены в кавычки --> <p>...В случае вот такого &quot;столкновения&quot;...</p> <!-- Здесь мы поставили соответствующие знаки HTML-сущностей--> <p><a href="ssylka" >Ссылка</a></p><!-- все теги должны быть вложены в друг друга --> <!-- Тут стоит правильный комментарий --> <script language="javascript" type="text/javascript" src="adr.js?a=mp&amp;b=df;"></script><!-- вместо знака & мы устанавливаем HTML-сущность &amp;, которая выполняет все функции амперсанда в языках программирования--> <script language="javascript" type="text/javascript">document.write('<a href="http://www.sait.templ">Адрес сайта<\/a>');</script> - <!-- Вот здесь указано решение проблемы: в таких выражениях необходимо использовать знак косой черты, только таким образом можно показать браузеру правильность интерпретации вашего кода-->

Ошибка 3: Используются теги, нерегламентированные в языке разметки HTML 4.01

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

<noindex></noindex> <!--Нововведение "Яндекса": запрет индексации всего того, что находится между этими участками кода. Это один из тех случаев, когда регламентация не соответствует удобству использования--> <table><tr><td height="25" width="25">Таблица</td></tr></table> <!-- Атрибут height для таблицы не описан в спецификации. Скорее всего, это очередная разработка сторонней компании. Но на помощь нам приходит CSS (язык каскадных таблиц стилей), который мы можем использовать для создания параметра, совместимого со спецификацией. <body marginheight="0" marginwidth="0"> <!-- подобные атрибуты были разработаны сторонней фирмой и не относятся к спецификации языка HTML 4.01. Вместо использования этих атрибутов лучше обратиться к CSS, где эта проблема быстро решается. --> <table><tr><td background="im.gif" ></td> </tr></table> <!-- в спецификации языка HTML 4.01 отсутствует определение для атрибута background, в данном случае, опять же, выручает CSS-->

Согласно спецификации, писать эти примеры следует так:

<table><tr><td style="height:25px;" width="25">Таблица</td></tr></table> <!--В данном примере при помощи CSS мы смогли добиться идентичного результата работы параметра height. Мы использовали параметр style, который как раз и символизирует о работе кода CSS--> <body style="margin:0px;"> <!--В этом примере мы тоже использовали CSS, присвоив параметру style значение кода CSS--> <table><tr><td style="background-image:url(im.gif)"></td> </tr></table> <!-- В этом случае обойти ограничение нам позволяет значение тега style background-image -->

Мы с вами на небольших примерах разобрали основные ошибки, которые допускают веб-мастеры при проектировании сайта на HTML спецификации 4.01. Давайте, как мы когда-то учили русский язык, всё же выучим правильный HTML, ибо верно написанный код - это не только правильные показы страниц сайта, но и показатель грамотности их создателя. Удачи вам!

Источник: http://vitaweb.pp.ru