Введение в язык HTML - Исправление ошибок

Written on . Posted in HTML, CSS, JavaScript

ОГЛАВЛЕНИЕ

Страница 11 из 11

Исправление ошибок

Избегайте вложенных tag-ов

Рассмотрим отрывок HTML файла: 

    <B>Это пример с <DFN>перекрывающихся</B> HTML tag-ов.</DFN>

Слово ``перекрывающиеся'' (overlapping) содержится внутри и <B> и <DFN> tag-ов. Как просмотрщик форматирует это? Вы не узнаете это, пока не посмотрите, разные просмотрщики по разному реагируют на подобные конструкции. В общем, избегайте перекрывающихся tag-ов.

Вложенные ссылки и символьные tag-и, но больше ничего

Вполне возможно вставлять ссылки (anchors) внутрь другого HTML элемента: 

    <H1><A HREF = "Destination.html">Мой заголовок</A></H1>

Не вставляйте заголовки или другие HTML внутрь ссылки: 

    <A HREF = "Destination.html">
    <H1>Мой заголовок</H1>
    </A>

Хотя большинство современных просмотрщиков справятся с этим примером, но это запрещено официальной спецификацией HTML и HTML+, и не будет работать с будущими просмотрщиками.

Символьные tag-и модифицируют представление других tag-ов: 

    <UL><LI><B>Элемент списка (фонт - bold)</B>
        <UL>
        <LI><I>Элемент списка (фонт - italic)</I>
    </UL>

Однако, избегайте вставки других типов HTML элементов. Например, соблазнительно вставить заголовок внутрь списка для увеличения размера фонта: 

    <UL><LI><H1>Болшой заголовок</H1>
        <UL>
        <LI><H2>Что-то немного меньшее</H2>
    </UL>

Хотя некоторые просмотрщики, такие как, NCSA Mosaic for the X Window System, благополучно форматируют эту конструкцию, непредсказуемо (потому что это не определено), как это обработает другой просмотщик. Для совместимости с другими просмотрщиками, избегайте подобных конструкций.

В чем разница между вложением <B> внутрь tag-а <LI> как противоположности вложению <H1> внутрь <LI>? Опять таки, это вопрос из SGML. Семантическое значение <H1> в тои, что оно является главным заголовком документа за которым должно следовать содержание. Так что, нет смысла искать <H1> внутри списка.

Символы форматирования также обычно не аддитивны. Вы можете ожидать, что: 

    <B><I>некоторый текст</I></B>

будет выводиться фонтом bold-italic. Некоторые просмотрщики делают это; другие интерпретирую только tag последнего уровня вложенности (здесь, это italics).

Проверьте свои ссылки

Если <IMG> tag ссылается на несуществуюшее изображение, вместо него подставляется "пустое" (dummi). Если это произошло, проверьте что ссылаетесь ли Вы на реально существующее изображение, что ссылка корректна с точки зрения правил URL и что атрибуты доступа к файлу установлены правильно (можно читать всем).

Большой пример

Перед вами пример более серьезного документа: 

    <HEAD>
    <TITLE>Большой пример</TITLE>
    </HEAD>
    <BODY>
    <H1>Большой пример</H1>
    Это простой документ. Это первый параграф. <P>
    Это второй параграф, который показывает специальные эффекты. Это слово выводится фонтом
    <I>italics</I>. Это слово выводится фонтом <B>bold</B>.
    Это встроенное изображение в формате GIF: <IMG SRC = "myimage.gif">. 
    <P>
    Это третий параграф, демонстрирующий ссылки. Это гипертекстовая ссылка
    слова <A HREF = "subdir/myfile.html">foo</A>
    с документом "subdir/myfile.html". (Если Вы попробуете перейти по
    по этой ссылке то получите сообщение об ошибке.) <P> 
    <H2>Заголовок второго уровня</H2>
    Этот текст должен выводиться фонтом фиксированной ширины: <P>
    <PRE>
        On the stiff twig up there
        Hunches a wet black rook
        Arranging and rearranging its feathers in the rain ...
    </PRE>
    Это ненумерованный список с двумя элементами: <P>
    <UL>
    <LI> клюква
    <LI> черника
    </UL>
    Это конец моего документа. <P>
    <ADDRESS>Me (Адрес электронной почты защищен от спам-ботов. Для просмотра адреса в вашем браузере должен быть включен Javascript.)</ADDRESS>
    </BODY>

В дополнении к уже обсуждавшимся tag-ам, в этом примере также используются <HEAD> ... </HEAD> и <BODY> ... </BODY> tag-и, которые разделяют в документе вводную информацию о нем и основной текст документа. Эти таги ничего не меняют в представлении форматированного документа, но являются очень полезными для некоторых целей (например, NCSA Mosaic for Macintosh 2.0, позволяет Вам просматривать только заголовки частей документа, чтобы решить, нужно ли Вам загружать оставшиеся части) и мы очень рекомендуем Вам использовать эти tag-и.

Перевод выполнен Антониной Ю. Кубарчук при содействии Д.Босенко.

html форум