Табличная страница с элементами HTML5?

Question

Могу ли я использовать элементы HTML5 для выделения кода на странице, которая использует таблицу для форматирования? Для примера:

<section id="posts"> 
    <tr id="posts-title-row"> 
    <header><td id="posts-title"> 
     <h2>Latest Posts</h2> 
    </td></header> 
    </tr> 
    <tr id="posts-row"> 
    <article><td> 
     <p>Maecenas faucibus mollis interdum.</p> 
    </td></article> 
    <article><td> 
     <p>Maecenas faucibus mollis interdum.</p> 
    </td></article> 
    <article><td> 
     <p>Maecenas faucibus mollis interdum.</p> 
    </td></article> 
    </tr> 
</section> 

В общем, я понимаю, что это очень плохая форма, но пока клиенты электронной почты (особенно Gmail). Поддержка CSS3 форматирование писем, нет немного другой варианта, за исключением того, чтобы использовать таблицы для форматирования HTML электронные письма (например, информационные бюллетени). Однако для моего собственного семантического душевного спокойствия я бы хотел использовать раздел> < article> и < header> тип элементов для упорядочивания вещей.

Answer 1

Если это семантика вы заботитесь о вы могли бы просто использовать ARIA roles определены для <section> и <article> на существующих элементах:

<table id="posts" aria-role="region"> 
    <tr id="posts-title-row"> 
     <td id="posts-title" aria-role="banner"> 
      <h2>Latest Posts</h2> 
     </td> 
    </tr> 
    <tr id="posts-row"> 
     <td aria-role="article"> 
      <p> 
       Maecenas faucibus mollis interdum. 
      </p> 
     </td> 
     <td aria-role="article"> 
      <p> 
       Maecenas faucibus mollis interdum. 
      </p> 
     </td> 
     <td aria-role="article"> 
      <p> 
       Maecenas faucibus mollis interdum. 
      </p> 
     </td> 
    </tr> 
</table> 

Answer 2

Вы можете, но у вас есть элементы не в том месте. Они должны находиться внутри <td>. Кроме того, необходимо, чтобы обернуть всю таблицу в <table>

<section id="posts"> 
    <table> 
     <tr id="posts-title-row"> 
      <td id="posts-title"> 
      <header> 
       <h2>Latest Posts</h2> 
      </header></td> 
     </tr> 
     <tr id="posts-row"> 
      <td> 
      <article> 
       <p> 
        Maecenas faucibus mollis interdum. 
       </p> 
      </article></td> 
      <td> 
      <article> 
       <p> 
        Maecenas faucibus mollis interdum. 
       </p> 
      </article></td> 
      <td> 
      <article> 
       <p> 
        Maecenas faucibus mollis interdum. 
       </p> 
      </article></td> 
     </tr> 
    </table> 
</section> 

Answer 3

Ну, вы можете использовать теги HTML5 с таблицей форматирования до тех пор, как ваш адрес электронной почты службы принять его. Тем не менее, вы можете попробовать использовать CSS (обратите внимание, что я не сказал CSS3), чтобы дать стиль вашей странице. И всегда помните встроенные стили!

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

Удачи вам!