HTML Комментарии Markup

Question

Я сейчас в процессе создания своего собственного блога, и мне нужно разметить комментарии, но что это лучший способ его пометить?

информация мне нужно представить это:

1. Лица Имя
2. Gravatar Иконка
3. Комментарий Дата
4. Прим

будет много appriciated Любая идея-х.

PS: Меня интересует только семантическая разметка html.

Answer 1

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

Тег blockquote предназначен для представления цитаты, взятой из другого источника, и тег cite предназначен для представления источника информации (например, журнал, газета и т. Д.).

Я думаю, что аргумент, безусловно, может означать, что вы можете использовать семантический HTML с именами классов, если они имеют смысл. В этой статье на Plain Old Semantic HTML содержится ссылка на использование имен классов - http://www.fooclass.com/plain_old_semantic_html

Answer 2

Вот один из способов вы можете сделать это с помощью следующего CSS плавать изображение слева от содержимого:

.comment { 
 
    width: 400px; 
 
} 
 

 
.comment_img { 
 
    float: left; 
 
} 
 

 
.comment_text, 
 
.comment_meta { 
 
    margin-left: 40px; 
 
} 
 

 
.comment_meta { 
 
    clear: both; 
 
}

<div class='comment' id='comment_(comment id #)'> 
 
    <div class='comment_img'> 
 
    <img src='https://placehold.it/100' alt='(Commenter Name)' /> 
 
    </div> 
 
    <div class='comment_text'> 
 
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p> 
 
    <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p> 
 
    </div> 
 
    <p class='comment_meta'> 
 
    By <a href='#'>Name</a> on <span class='comment_date'>2008-08-21 11:32 AM</span> 
 
    </p> 
 
</div>

Answer 3

Я не знаю, что есть разметка, которая будет обязательно должны содержать структуру комментариев без использования div или классов, но вы можете использовать списки определений. Вы можете использовать несколько DT и DD-тегов в контексте списка определений - http://www.w3.org/TR/html401/struct/lists.html#edef-DL

<dl> 
    <dt>By [Name] at 2008-01-01<dt> 
    <dd><img src='...' alt=''/></dd> 
    <dd><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Sed mauris. Morbi quis tellus sit amet eros ullamcorper ultrices. Proin a tortor. Praesent et odio. Duis mi odio, consequat ut, euismod sed, commodo vitae, nulla. Suspendisse potenti. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam pede.</p> 

    <p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas rhoncus accumsan velit. Donec varius magna a est. </p> 
    </dd> 
</dl> 

Update: О, я бы с подходом, как это, что это может быть трудно однозначно идентифицировать элементы с помощью CSS для стилизации. Вы можете использовать JavaScript (jQuery будет здесь отлично), чтобы находить и применять стили. Без полной поддержки селектора CSS в браузерах (IE) было бы более жестким к стилю.

Answer 4

я, возможно, думал о чем-то вроде этого:

<ol class="comments"> 
    <li> 
     <a href=""> 
      <img src="" alt="" /> 
     </a> 
     <cite>Name<br />Date</cite> 
     <blockquote>Comment</blockquote> 
    </li> 
</ol> 

Это очень семантический без использования Div, и только один класс. В списке показан порядок, в котором были сделаны комментарии, ссылка на сайт лиц и изображение для их gravatar, тег cite на сайт, который сказал комментарий и blockquote, чтобы держать то, что они сказали.

Что думают люди?

Answer 5

Я вижу вашу точку зрения. Хорошо, после прочтения этой статьи, почему бы вам не попробовать что-то подобное?

<blockquote 
    cite="http://yoursite/comments/feederscript.php?id=commentid" 
    title="<?php echo Name . " - " . Date ?>" > 
    <?php echo Comment ?> 
</blockquote> 

с некоторыми проницательными CSS, чтобы он выглядел красиво.

feederscript.php было бы чем-то, что могло бы читать из базы данных и эха только для вызванного комментария.