Шаблон для сайта html5

категория: HTML
Давно хотел написать шаблон html5 для главной страницы сайтов, в Django - это главный родитель типа base.html, а все остальные шаблоны просто его расширяют. Писать одни и те же теги довольно нудно, люблю писать сниппеты или использовать чужие для своей любимой IDE, на данный момент это Sublime Text 2. Естественно, это просто пример и он будет меняться. Делайте все под себя и будет вам счастье. Приступим к наброскам, все нюансы будут описаны ниже:
<!DOCTYPE html>
<html lang="ru-RU">
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html;
                      charset=utf-8" />
    <meta name="Copyright" content="" />
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    <!--[if lt IE 9]>
    <script src="" type="text/javascript">
      document.createElement("nav");
      document.createElement("header");
      document.createElement("footer");
      document.createElement("section");
      document.createElement("aside");
      document.createElement("article");
    </script>
    <![endif]-->
  </head>
  <body>
    <header id="page_header">
      <h1></h1>
      <nav>
        <ul>
          <li><a href="#"></a></li>
          <li><a href="#"></a></li>
        </ul>
      </nav> 
    </header>
    <section>
      <article>
      </article>
    </section>
    <footer id="page_footer">
    </footer>
  </body>
</html>
Директива doctype помогает валидаторам понять какие правила нужно применять для проверки валидности содержимого и заставляет IE6-8 перейти в "режим соответствия стандартам". meta name="keywords" - ключевые слова для поисковиков. meta name="description" - краткое описание страницы для поисковиков. Дальше идет подключение css и библиотеки jQuery. В тегах <!--[if lt IE 9]><![endif]--> пишем скрипт для браузера Internet Explorer 6 и выше, чтоб он распознавал теги html5. header - заголовок, nav - главное меню, section - оболочка для блока, article - основное информационное наполнение сайта, footer - подвал сайта. Если что-то не понятно - задавайте вопроссы.


blog comments powered by Disqus