2009-04-17 3 views
5

Я использовал только p и span элементов для этого ... но я всегда нажимаю, чтобы использовать справа элементов, и это то, о чем я не думал раньше, в отношении отзывов.Каков наилучший способ разметки отзывов в XHTML?

Это то, что я имел в виду ...

<div class="testimonial"> 
<blockquote>I love your products!</blockquote> 
<span>Jim Testimonial-giver</span> 
</div> 

это выглядит как самый лучший способ сделать это? Есть ли наилучшая практика?

Я смотрел на то, как W3C markup testimonials на их сайте, и они использовали ...

<blockquote> 
<p> 
    <a id="aptest" name="aptest">Applied Testin.....</a> 
    <br /> 
    <span class="QuoteAttr">-- Shane P. M...</span> 
</p> 
</blockquote> 

Должен ли я просто скопировать, как W3C сделал это, в конце концов они не должны быть правильными?

+0

ИМХО, ваш путь проще и чище. держи это так. – bchhun

+3

Кому-то в W3C нужно сделать рефакторинг ... –

ответ

8

Используйте cite tag:

<div class="testimonial"> 
<blockquote>i love your products</blockquote> 
<cite>Jim Testimonial-giver</cite> 
</div> 

Кроме того, я бы, вероятно, сделать это следующим образом:

<blockquote class="testimonial"> 
    i love your products 
    <cite>Jim Testimonial-giver</cite> 
</blockquote> 

Просто, чтобы сделать его немного более семантические и четко связать цитату с цитатой. Divs должен быть необходим только для структурных вещей.

+0

Спасибо, Рекс ... Я не могу поверить, что забыл элемент цитирования! – alex

+0

Как вы думаете, есть ли их группа, они должны войти в неупорядоченный список? – alex

+0

@alex Я люблю неупорядоченные списки :) Я склоняюсь к да себе, но я бы не хмурился, не используя их в этом конкретном случае. –

4

Mozilla.org style guide, кажется, предпочитает использовать q для цитаты и <cite> для автора, завернутый в <blockquote> или <div> с соответствующим классом. HTML 5, похоже, сильно хмурится, используя <cite> для имен людей; он говорит, что он должен использоваться только для названий работ.

После этой модели, возможно, что-то вроде этого:

<blockquote class="testimonial"> 
    <q>I love your products!</q> 
    <cite>Jim Testimonial-giver</cite> 
</blockquote> 

Или, если вы не хотите использовать <cite>, то:

<blockquote class="testimonial"> 
    <q>I love your products!</q> 
    <span class="quote-attribution">Jim Testimonial-giver</span> 
</blockquote> 
+0

Это немного извините, но я не соглашусь здесь - элемент q не поддерживается в IE, и поскольку нет необходимости различать содержимое q и любого другого элемента (это единственный и первичный - блок текста в blockquote), кажется лишним. –

+0

Элемент q поддерживается в IE 8.Это зависит от того, хотите ли вы вставить кавычки или нет, и хотите ли вы, чтобы они отображались в более ранних версиях IE. Самое приятное в элементе q заключается в том, что вы можете получить правильно вложенные интеллектуальные кавычки, если вы установите свои: до и: после селекторов. –

+0

+1 для цитирования (hah) отличный ресурс, который я искал (руководство по стилю Mozilla), хотя ссылка не работает :( – steve

1

В течение долгого времени я использовал Tantek Çelik's slide в качестве ссылки когда дело дошло до цитат.

Но видя комментарии Алекс и Рекс М, я думаю об этой реализации для отзывы:

<ul id="testimonials"> 
    <li> 
    <blockquote> 
     i love your products 
    </blockquote> 
    <cite>&mdash;Jim Testimonial-giver</cite> 
    </li> 
    <li> 
    <blockquote> 
     i love your products even more 
    </blockquote> 
    <cite>&mdash;Joe Testimonial-giver</cite> 
    </li> 
    [...] 
</ul> 
Смежные вопросы