Избавляемся о ошибок xHTML-валидации при использовании JavaScript, Flash, <noindex>, CSS

Я являюсь сторонником веб-стандартов, но, к сожалению, по тем или иным причинам не всегда их соблюдаю (кстати сказать, когда я верстал таблицами, то о стандартах и понятия не имел :). Как вы наверняка уже знаете, в настоящее время в Рунете проходит конкурс сайтов WebHiTech, целью ...

Комментарии (33)

  1. Поздравляю с XHTML1.0 (хехе, коллега), но по прежнему некоторые баги валидатор заметил
    По теме — http://kurapov.name/technology/web/interfaces/xhtml

  2. Артём Курапов, какие, например, баги?

  3. 106: лишний открывающийся span
    108: лишний закрывающийся span ( если они перекрёстные, то в xhtml это запрещено)
    411: пустые b
    583: пустые li

    Ещё что-то про использование знаков тэга в яваскрипте было.. Поставьте плагин для FF, там можно на лету смотреть. Онлайн-валидатор от W3C в этом смысле более жесток.

  4. На счет span — я уже говорил в статье, что это плагины. В данном случае плагин подсветки, и поделать тут ничего не могу. А вот на счет пустых b и li — валидатор не считает это ошибками.

  5. Спасибо, пригодится…

  6. Отдельное спасибо за noindex и за JS.
    CDATA что-то никогда и не применял в JS скриптах.. :)

  7. Автору респект, полезная статья!

  8. Dimox, < ![CDATA[...]]> нужен только в том случае, если внутри скрипта/CSS встречаются символы < , >, &. В противном случае, можно обойтись и без CDATA.

    По поводу NOINDEX в CDATA — это не более, чем самообман: все мы прекрасно знаем, что NOINDEX нет в DTD, сам тэг как был, так и остался, только валидатор мы жестоко обманули. Но документ-то от этого валиднее не стал. Плюс к тому же, налепили абсолютно левый del (ИМХО, span здесь лучше, ибо у него нет дополнительной семантики), и всё ради какого-то поисковика. Есть ли смысл в таком обмане? Не лучше ли оставить, как есть, тем более, что браузер игнорирует неизвестный тэг? Ведь, по большому счету, можно взять абсолютно невалидную туфту (я утрирую, но тем не менее) и засунуть ее в CDATA. Валидатор скажет, что всё ОК, но мы-то знаем, что это не так, и проблемы, связанные с невалидностью, останутся.

    PS — пока не забыл: если будете отдавать контент как application/xhtml+xml, нормальный браузер (типа FireFox) скрипт вообще не увидит, ибо для него внутри тэга SCRIPT бует находится комментарий, который он проигнорирует. Поэтому так:

    
    <script type="text/javascript">/*<![CDATA[*/
    ...
    /*]]>*/
    </script>
    

    либо, если нужно сильно извратиться

    
    <script type="text/javascript">
    <!--//--><![CDATA[//><!--
    ...
    //--><!]]>
    
  9. PS — Dimox, а что за плагин для подсветки вы используете, если не секрет? Если хотите, могу его подправить. В качестве альтернативы могу предложить WP Codebox Эрика Вонга или свою версию плагина, в которой исправлены ошибки, присутствующие в WP CodeBox.

  10. А почему сразу не в Strict ?

  11. Денис, а в чём глубокий смысл Strict, если страница отдаётся как text/html?

  12. Dimox, < ![CDATA[...]]> нужен только в том случае, если внутри скрипта/CSS встречаются символы < , >, &. В противном случае, можно обойтись и без CDATA.

    Я когда-то читал об этом, но в голове данный момент не осел :) По крайней мере, для всех скриптов блога пришлось применять CDATA.

    сам тэг как был, так и остался, только валидатор мы жестоко обманули

    Не отрицаю. Ну и пусть :)

    PS — пока не забыл: если будете отдавать контент как application/xhtml+xml, нормальный браузер (типа FireFox) скрипт вообще не увидит, ибо для него внутри тэга SCRIPT бует находится комментарий, который он проигнорирует.

    Окей, учту. Спасибо.

    PS — Dimox, а что за плагин для подсветки вы используете, если не секрет?

    CodeColorer. Жаль, что давно не обновляется.

    В качестве альтернативы могу предложить WP Codebox Эрика Вонга или свою версию плагина, в которой исправлены ошибки, присутствующие в WP CodeBox.

    К сожалению, это проблематично. Тогда придется редактировать кучу постов.

  13. Dimox, подправленная версия CodeColorer.

    Тогда придется редактировать кучу постов.

    :-) могу поправить плагин, чтобы он понимал синтаксис CodeColorer.

  14. Владимир, хотел бы уточнить пару вопросов: что вы подправили в CodeColorer и в чем смысл перехода на Codebox?

  15. что вы подправили в CodeColorer

    Обновил движок (GeSHi), добавил парочку языков и подкорректировал, хм, грамматику в существующих (это касается (X)HTML — распознавание условных комментариев и т.п.). Ну и генерируемая разметка теперь валидна, судя по тестам.

    чем смысл перехода на Codebox?

    Судя по коду, CodeColorer тот же CodeBox — у Эрика и Дмитрия в коде плагина так много общего. Но у CodeBox функциональность больше :-)

    А “портят” наши страницы в основном следующие 4 вещи

    Как вчера оказалось, этих вещей пять. Пятая — кривая реализация функции wpautop. Для тех, кто пользуются WYSIWYG, это не сильно заметно. А в обыкновенном редакторе это всё видно.

    Например,

    
    <div>
        <strong>Strong</strong>
        <div>Nested div</div>
    </div>
    

    будет «любезно» преобразован в

    
    <div>
        <strong>Strong</strong></p>
        <div>Nested div</div>
    </div>
    

    Об этом (и как это исправить) я еще напишу.

  16. Обновил движок (GeSHi), добавил парочку языков и подкорректировал, хм, грамматику в существующих (это касается (X)HTML — распознавание условных комментариев и т.п.). Ну и генерируемая разметка теперь валидна, судя по тестам.

    Ясно. Тогда большое спасибо за обновление и буду ждать вашу версию CodeBox, которая без проблем встанет вместо CodeColorer.

    Как вчера оказалось, этих вещей пять. Пятая — кривая реализация функции wpautop.

    Я вообще не знаю, что это такое, впервые вижу :) Именно в расчете на то, что возможны еще какие-то причины, я в статье использовал слова «в основном» ;)

  17. Самое опасное в плане баговости на валидаторе — это размещение сторонних счетчиков, кнопочек, баннеров и прочих пузомерок.

    Они на 99% невалидны, поэтому приходится постоянно что-то дописывать/переписывать самому. Ручками и трезвой головой.

    А я в конкурсе рискнул поучаствовать. Отправил заявку, но пока тишина…

  18. С Ноиндексом все понятно, а вот с флеш проблема.
    Да вообще забить на валидность — главное, чтобы отображалось корректно.

  19. [m.k], в чем с флеш проблема?

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