First pass for becoming html5

Fantomas42 · Feb 13, 2015 · 5283235 · 5283235
1 parent 912a558
commit 5283235
Show file tree

Hide file tree

Showing 6 changed files with 131 additions and 127 deletions.
diff --git a/zinnia/templates/zinnia/_entry_detail_base.html b/zinnia/templates/zinnia/_entry_detail_base.html
@@ -1,7 +1,7 @@
 {% load i18n zinnia %}
-<div id="entry-{{ object.pk }}" class="hentry{% if object.featured %} featured{% endif %}">
+<article id="entry-{{ object.pk }}" class="hentry{% if object.featured %} featured{% endif %}">
   {% block entry-header %}
-  <div class="entry-header">
+  <header class="entry-header">
     {% block entry-title %}
     <h2 class="entry-title">
       <a href="{{ object.get_absolute_url }}" title="{{ object.title }}" rel="bookmark">
@@ -27,7 +27,7 @@ <h2 class="entry-title">
       {% endwith %}
       {% endblock entry-authors %}
       {% block entry-published %}
-      <abbr class="published" title="{{ object.creation_date|date:"c" }}">{{ object.creation_date|date:"DATE_FORMAT" }}</abbr>
+      <time class="published" datetime="{{ object.creation_date|date:"c" }}">{{ object.creation_date|date:"DATE_FORMAT" }}</time>
       {% endblock entry-published %}
       {% block entry-categories %}
       {% with categories=object.categories.all %}
@@ -43,10 +43,10 @@ <h2 class="entry-title">
     {% endblock entry-info %}
     {% block entry-last-update %}
     <p class="entry-last-update">
-      {% trans "Last update on" %} <abbr class="updated" title="{{ object.last_update|date:"c" }}">{{ object.last_update|date:"DATE_FORMAT" }}</abbr>.
+      {% trans "Last update on" %} <time class="updated" datetime="{{ object.last_update|date:"c" }}">{{ object.last_update|date:"DATE_FORMAT" }}</time>.
     </p>
     {% endblock entry-last-update %}
-  </div>
+  </header>
   {% endblock entry-header %}
 
   {% block entry-body %}
@@ -97,7 +97,7 @@ <h2 class="entry-title">
   {% endblock entry-body %}
 
   {% block entry-footer %}
-  <div class="entry-footer">
+  <footer class="entry-footer">
     {% block entry-tags %}
     <p class="entry-tags">
       <strong>{% trans "Tags" %}</strong> :
@@ -163,6 +163,6 @@ <h2 class="entry-title">
       {% endblock entry-trackbacks %}
     </p>
     {% endblock entry-discussions %}
-  </div>
+  </footer>
   {% endblock entry-footer %}
-</div>
+</article>
diff --git a/zinnia/templates/zinnia/base.html b/zinnia/templates/zinnia/base.html
@@ -23,63 +23,63 @@
 {% endblock breadcrumbs %}
 
 {% block sidebar %}
-<div id="widget-welcome" class="widget">
+<aside id="widget-welcome" class="widget">
   <h3>{% trans "Welcome!" %}</h3>
   <p>
     {% trans "This simple theme is the default appearance of Zinnia." %}
   </p>
   <p>
     {% trans "Don't hesitate to override the template <strong>zinnia/base.html</strong> to start <a href='http://docs.django-blog-zinnia.com/en/latest/how-to/customize_look_and_feel.html'>customizing your Weblog</a>." %}
   </p>
-</div>
-<div id="widget-categories" class="widget">
+</aside>
+<aside id="widget-categories" class="widget">
   <h3>
     <a href="{% url 'zinnia:category_list' %}">{% trans "Categories" %}</a>
   </h3>
   {% get_categories %}
-</div>
-<div id="widget-authors" class="widget">
+</aside>
+<aside id="widget-authors" class="widget">
   <h3>
     <a href="{% url 'zinnia:author_list' %}">{% trans "Authors" %}</a>
   </h3>
   {% get_authors %}
-</div>
-<div id="widget-calendar" class="widget">
+</aside>
+<aside id="widget-calendar" class="widget">
   <h3>{% trans "Calendar" %}</h3>
   {% get_calendar_entries %}
-</div>
-<div id="widget-tags" class="widget">
+</aside>
+<aside id="widget-tags" class="widget">
   <h3>
     <a href="{% url 'zinnia:tag_list' %}">{% trans "Tags" %}</a>
   </h3>
   {% get_tag_cloud %}
-</div>
-<div id="widget-recents" class="widget">
+</aside>
+<aside id="widget-recents" class="widget">
   <h3>{% trans "Recent entries" %}</h3>
   {% get_recent_entries %}
-</div>
-<div id="widget-comments" class="widget">
+</aside>
+<aside id="widget-comments" class="widget">
   <h3>{% trans "Recent comments" %}</h3>
   {% get_recent_comments %}
-</div>
-<div id="widget-linkbacks" class="widget">
+</aside>
+<aside id="widget-linkbacks" class="widget">
   <h3>{% trans "Recent linkbacks" %}</h3>
   {% get_recent_linkbacks %}
-</div>
-<div id="widget-randoms" class="widget">
+</aside>
+<aside id="widget-randoms" class="widget">
   <h3>{% trans "Random entries" %}</h3>
   {% get_random_entries %}
-</div>
-<div id="widget-populars" class="widget">
+</aside>
+<aside id="widget-populars" class="widget">
   <h3>{% trans "Popular entries" %}</h3>
   {% get_popular_entries %}
-</div>
-<div id="widget-archives" class="widget">
+</aside>
+<aside id="widget-archives" class="widget">
   <h3>{% trans "Archives" %}</h3>
   {% get_archives_entries_tree %}
-</div>
+</aside>
 {% if user.is_authenticated %}
-<div id="widget-tools" class="widget">
+<aside id="widget-tools" class="widget">
   <h3>{% trans "Tools" %}</h3>
   <ul>
     {% if perms.zinnia %}
@@ -104,6 +104,6 @@ <h3>{% trans "Tools" %}</h3>
       </a>
     </li>
   </ul>
-</div>
+</aside>
 {% endif %}
 {% endblock sidebar %}
diff --git a/zinnia/templates/zinnia/entry_detail_base.html b/zinnia/templates/zinnia/entry_detail_base.html
@@ -39,7 +39,7 @@
 {% endblock entry-content %}
 
 {% block entry-widgets %}
-<div class="entry-widgets">
+<aside role="complementary" class="entry-widgets">
   {% block entry-next-entry %}
   {% with next_entry=object.next_entry %}
   {% if next_entry %}
@@ -90,11 +90,11 @@ <h3>{% trans "Similar entries" %}</h3>
     {% get_similar_entries %}
   </div>
   {% endblock entry-similar-entries %}
-</div>
+</aside>
 {% endblock entry-widgets %}
 
 {% block entry-pingbacks %}
-<div id="pingbacks">
+<section id="pingbacks">
   <h3>{% trans "Pingbacks" %}</h3>
   {% if object.pingback_count %}
   {% with pingback_list=object.pingbacks %}
@@ -133,12 +133,12 @@ <h3>{% trans "Pingbacks" %}</h3>
   <p>{% trans "Pingbacks are closed." %}</p>
   {% endif %}
   {% endblock pingbacks-status %}
-</div>
+</section>
 {% endblock entry-pingbacks %}
 
 {% block entry-trackbacks %}
 {% if object.trackback_count or object.trackbacks_are_open %}
-<div id="trackbacks">
+<section id="trackbacks">
   <h3>{% trans "Trackbacks" %}</h3>
   {% if object.trackback_count %}
   {% with trackback_list=object.trackbacks %}
@@ -178,12 +178,12 @@ <h3>{% trans "Trackbacks" %}</h3>
   </p>
   {% endif %}
   {% endblock trackbacks-status %}
-</div>
+</section>
 {% endif %}
 {% endblock entry-trackbacks %}
 
 {% block entry-comments %}
-<div id="comments">
+<section id="comments">
   <h3>{% trans "Comments" %}</h3>
   {% if object.comment_count %}
   {% with comment_list=object.comments %}
@@ -231,7 +231,7 @@ <h3>{% trans "Comments" %}</h3>
   <p>{% trans "Comments are closed." %}</p>
     {% endif %}
   {% endif %}
-</div>
+</section>
 {% endblock entry-comments %}
 
 {% block entry-comments-form %}

diff --git a/zinnia/templates/zinnia/skeleton.html b/zinnia/templates/zinnia/skeleton.html
@@ -1,12 +1,10 @@
 {% load i18n staticfiles %}
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-<html xml:lang="{{ LANGUAGE_CODE }}" lang="{{ LANGUAGE_CODE }}" version="-//W3C//DTD XHTML 1.1//EN" xmlns="http://www.w3.org/1999/xhtml">
+<!doctype html>
+<html lang="{{ LANGUAGE_CODE }}">
   <head>
+    <meta charset="utf-8">
     <title>{% block title %}{% endblock title %}{% block title-page %}{% endblock title-page %} - Zinnia's Weblog</title>
-    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
-    <meta http-equiv="cache-control" content="public" />
     <meta name="robots" content="follow, all" />
-    <meta name="language" content="{{ LANGUAGE_CODE }}" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta name="description" content="{% block meta-description %}{% trans "Just another Zinnia weblog." %}{% endblock meta-description %}{% block meta-description-page %}{% endblock meta-description-page %}" />
     <meta name="keywords" content="{% block meta-keywords %}django, blog, weblog, zinnia{% endblock meta-keywords %}" />
@@ -25,19 +23,21 @@
   </head>
   <body class="zinnia {% block theme-class %}default{% endblock theme-class %} {% block color-class %}blue{% endblock color-class %} {% block sidebar-class %}right-sidebar{% endblock sidebar-class %} {% block body-class %}{% endblock body-class %}">
     <div class="container">
-      <div id="header">
-        <ul class="top-navigation">
-          <li>
-            <a href="{% url 'zinnia:sitemap' %}" title="{% trans "Sitemap" %}" class="sitemap">
-              {% trans "Sitemap" %}
-            </a>
-          </li>
-          <li>
-            <a href="{% url 'zinnia:entry_latest_feed' %}" title="{% trans "RSS feed of latest entries" %}" class="feeds">
-              {% trans "RSS feed" %}
-            </a>
-          </li>
-        </ul>
+      <header id="header" role="banner">
+        <nav>
+          <ul class="top-navigation">
+            <li>
+              <a href="{% url 'zinnia:sitemap' %}" title="{% trans "Sitemap" %}" class="sitemap">
+                {% trans "Sitemap" %}
+              </a>
+            </li>
+            <li>
+              <a href="{% url 'zinnia:entry_latest_feed' %}" title="{% trans "RSS feed of latest entries" %}" class="feeds">
+                {% trans "RSS feed" %}
+              </a>
+            </li>
+          </ul>
+        </nav>
         <form method="get" action="{% url 'zinnia:entry_search' %}">
           <p>
             <input type="text" name="pattern" placeholder="{% trans "Keywords..." %}" {% if pattern %}value="{{ pattern }}"{% endif %} />
@@ -53,9 +53,9 @@ <h1>
           <p>{% trans "Just another Zinnia weblog." %}</p>
         </blockquote>
         {% block breadcrumbs %}{% endblock breadcrumbs %}
-      </div>
+      </header>
       {% block slider %}{% endblock slider %}
-      <div id="content" class="hfeed">
+      <div id="content" class="hfeed" role="main">
         {% block content %}
         <div class="links">
           <h2>{% trans "Useful links" %}</h2>
@@ -78,13 +78,13 @@ <h2>{% trans "Search" %}</h2>
         </div>
         {% endblock content %}
       </div>
-      <div id="sidebar">
+      <div id="sidebar" role="complementary">
         {% block sidebar %}
         {% endblock sidebar %}
       </div>
-      <div id="footer">
+      <footer id="footer" role="contentinfo">
         <p>{% blocktrans %}Powered by <a href="http://www.djangoproject.com">Django</a> and <a href="https://github.com/Fantomas42/django-blog-zinnia">Zinnia {{ ZINNIA_VERSION }}</a>.{% endblocktrans %}</p>
-      </div>
+      </footer>
     </div>
   </body>
 </html>
diff --git a/zinnia/templates/zinnia/tags/breadcrumbs.html b/zinnia/templates/zinnia/tags/breadcrumbs.html
@@ -1,11 +1,13 @@
-<ul class="breadcrumbs">
-  {% for crumb in breadcrumbs %}
-  <li>
-    {% if crumb.url %}
-    <a href="{{ crumb.url }}" title="{{ crumb.name }}">{{ crumb.name }}</a>
-    {% else %}
-    {{ crumb.name }}
-    {% endif %}
-  </li>
-  {% endfor %}
-</ul>
+<nav>
+  <ul class="breadcrumbs">
+    {% for crumb in breadcrumbs %}
+    <li>
+      {% if crumb.url %}
+      <a href="{{ crumb.url }}" title="{{ crumb.name }}">{{ crumb.name }}</a>
+      {% else %}
+      {{ crumb.name }}
+      {% endif %}
+    </li>
+    {% endfor %}
+  </ul>
+</nav>