2009-06-22 3 views
6

Это вики сообщества, в которой задается вопрос: «Как только семантика может получить нашу HTML-разметку благодаря HTML 5?» Ниже вы можете найти исходный код образца HTML 5. Цель состоит в том, чтобы сделать очень удобную, доступную, стильную веб-страницу, используя как можно меньше классов и идентификаторов.Как мы можем получить семантику с HTML 5?

Также, когда вы планируете начать реализацию HTML 5? Ожидаете ли вы еще 10 лет, пока проект не будет завершен, или вы станете «ранним усыновителем», теперь, когда поддержка браузера быстро растет?

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="UTF-8" /> 
     <title>Site Name &bull; Page Title</title> 
    </head> 
    <body> 
     <nav> 
      <h1><a href="/">Site Name</a></h1> 
      <ul> 
       <li><a href="#">Nav Link</a></li> 
       <li><a href="#">Nav Link</a></li> 
       <li><a href="#">Nav Link</a></li> 
      </ul> 
     </nav> 
     <header> 
      <p>Welcome to the site!</p> 
      <a href="#">Call to action!</a> 
     </header> 
     <section> 
      <aside> 
       <!-- Sidebar --> 
      </aside> 
      <article> 
       <header> 
        <h2>Article Name</h2> 
        <p>Posted by <cite>Kerrick Long</cite> on <time datetime="2009-06-21">June 21</time>.</p> 
       </header> 
       <p>Lorem ipsum dolor sit amet...Aliquam erat volutpat.</p> 
       <figure> 
        <img src="/images/eclipse.jpg" width="640" height="480" alt="Solar Eclipse" /> 
        <label>Here we can see the solar eclipse that happened <time datetime="2009-05-28">recently</time>.</label> 
       </figure> 
       <p>Lorem ipsum dolor...</p> 
      </article> 
     </section> 
     <footer> 
      <p>&copy; <time datetime="2009-01-01">2009</time>, <cite>Site Owner</cite></p> 
     </footer> 
    </body> 
</html> 
+0

Вы забыли закрыть тег тела в конце! –

+0

он не забыл, точно. отсутствие отступов означало, что он был исключен из кодового блока –

+0

Я исправил проблемы с отступом, спасибо, что дал мне знать! :-) – Kerrick

ответ

5

Это не будет более 10 лет. Этот период времени для «окончательного завершения», все браузеры поддерживают все части спецификации. Это должно стать кандидатом в конце этого года, в начале следующего и, мы надеемся, утвердим в 2011/22.

Я поэтапно поменяю его, где я могу, прямо сейчас. Насколько я использую, зависит от аудитории, но поскольку доля IE постоянно падала, то, что они не поддерживают, больше не является убийцей, тем более, что «HTML5 shiv» Джона Ресига позволяет семантическим тегам играть даже в IE6 с включенным js.

Что еще более важно, я начинаю переносить свое мышление на строки HTML5, используя классы сегодня для того, что завтра станет тегами HTML5 (div class = "nav"). Таким образом, я буду более привык думать в терминах HTML5, когда появится такая возможность.

+0

Хорошо, тогда эти даты делают его довольно удивительным! Я думаю, что у вас есть правильная идея, когда дело доходит до перехода. – Kerrick

2

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

+1

Даже если ваши пользователи находятся на IE6, не означает, что вы можете ' t напишите код выше. Используя аккуратный javascript-hack, вы можете предоставить IE6-пользователям тот же семантический HTML: document.createElement («header»); Затем вы можете настроить свой CSS как обычно. (: – peirix

0

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

(Может быть, если бы люди могли каким-то образом убедить меня, что веб может быть больше данных, как и, следовательно, совместимость улучшится, то я мог бы быть несколько убежден, но это звучит немного слишком оптимистичную)

2

Я иду использовать его, как только браузер поддерживает его. Сайты, которые я делаю, являются главным образом хобби-проектами, в основном посещаемыми пользователями Firefox. (80% моего трафика использует последнюю версию FF).

0

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

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

+0

Пока единственная часть HTML 5, которую вы принимаете, это семантические теги, простой Javascript может поддерживать старые браузеры: document.createtag ('header'); document.createtag ('footer'); document.createtag ('раздел'); document.createtag ('в сторону'); document.createtag ('нав'); document.createtag ('статья'); document.createtag ('фигура'); document.createtag ('time'); – Kerrick

+0

Это может принести много для браузеров, поддерживающих javascript, да, но ничего не делает, скажем, для RSS-читателей или мобильных браузеров. Опять же, я надеюсь, что кто-то мудрее меня создает библиотеку для преобразования информации, богатой HTML5, к тому, что больше всего подходит для фактического пользователя agen т. – SingleNegationElimination

1

Имейте в виду, что элемент cite не подходит для имени человека: HTML5 гласит: «Имя человека не является названием произведения - даже если люди называют его человеком частью работы - и поэтому элемент не должен использоваться для обозначения имен людей ». Кроме того, трейлинг-косая черта в <meta charset="UTF-8" /> не требуется.

+0

Конечная косая черта - неплохая идея. С первого взгляда вы сразу же не ожидаете конца тега. Кроме того, все примеры используют его, http://www.w3schools.com/html5/tag_meta.asp – bobobobo

+0

Если вы серьезно относитесь к написанию HTML, я уверен, что вы это узнаете из-за того, что это метатег , независимо от какой-либо конечной косой черты. – Ms2ger

+0

Вы должны прочитать [это] (http://wiki.whatwg.org/wiki/Cite_element). – Knu

0

Люди продолжают упоминать javascript-решение для старых браузеров, таких как ie6, но что, если они не поддерживают javascript?

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

Вы всегда могли бы пойти ремень и подтяжки для старых браузеров

<nav><div id="nav"> some nav stuff</div></nav> 

Но что чувствует себя грязным мне?

Смежные вопросы