Difference between revisions of "comment-examples"

From Microformats Wiki
Jump to navigation Jump to search
(Undo revision 35033 by DardeLbosi (Talk) SPAM)
 
(17 intermediate revisions by 6 users not shown)
Line 60: Line 60:
  
 
* http://ryanedit.blogspot.com/2006/01/light-water-music-2.html
 
* http://ryanedit.blogspot.com/2006/01/light-water-music-2.html
** Information displayed: author, author-url, comment
+
** Information displayed: author, author-url, comment, permalink
  
 
* http://prototypen.com/blog/vjblog/archives/001318.html
 
* http://prototypen.com/blog/vjblog/archives/001318.html
Line 66: Line 66:
  
 
* http://www.itsjerrytime.com/?p=89
 
* http://www.itsjerrytime.com/?p=89
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, permalink
  
 
* http://bottomunion.com/blog/?p=469
 
* http://bottomunion.com/blog/?p=469
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, permalink
  
* http://www.rocketboom.com/rb_07_mar_26/
+
* http://www.rocketboom.com/rb_07_mar_26/comments/
 
** Information displayed: author, author-url, comment, published, comments-link
 
** Information displayed: author, author-url, comment, published, comments-link
 +
** This page does not contain any comments - just a link to another page which has comments on. This should probably not be included in the tally.
 +
*** Updated example to one that works.
  
 
* http://www.chesslodge.com/2007/03/chess-video-lesson-2/
 
* http://www.chesslodge.com/2007/03/chess-video-lesson-2/
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, permalink
  
 
* http://stevegarfield.blogs.com/videoblog/2007/04/sxsw_all_togeth.html
 
* http://stevegarfield.blogs.com/videoblog/2007/04/sxsw_all_togeth.html
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, permalink
  
* http://blip.tv/file/1425655/
+
* http://blog.blip.tv/blog/2008/09/12/bliptv-the-new-york-television-festival/
 
** Information displayed: author, author-url, comment, published
 
** Information displayed: author, author-url, comment, published
 +
** Nobody has commented on this page. This should probably not be included in the tally.
 +
*** Changed url to one that works
  
 
* http://uk.youtube.com/watch?v=KKTDRqQtPO8
 
* http://uk.youtube.com/watch?v=KKTDRqQtPO8
** Information displayed: author, author-url, comment, published, reply-url, vote
+
** Information displayed: author, author-url, comment, published, reply-url, vote, junk-report-link, inset-threaded-replies, pagination-links
  
 
* http://vimeo.com/162754
 
* http://vimeo.com/162754
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, inset-threaded-replies
  
 
* http://www.dailymotion.com/commented-week/lang/en/video/x7a2my_lewis-hamilton-champion-f1-2008_sport
 
* http://www.dailymotion.com/commented-week/lang/en/video/x7a2my_lewis-hamilton-champion-f1-2008_sport
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, author-image, pagination-links
  
 
* http://www.nbc.com/Saturday_Night_Live/video/clips/mccain-qvc-open/805381/
 
* http://www.nbc.com/Saturday_Night_Live/video/clips/mccain-qvc-open/805381/
** Information displayed: author, author-url, author-photo, comment, published
+
** Information displayed: author, author-url, author-image, comment, published, junk-report-link
  
 
* http://www.accidenthash.com/2007/04/02/gray-wet-yuck-monday/
 
* http://www.accidenthash.com/2007/04/02/gray-wet-yuck-monday/
** Information displayed: author, author-url, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published, permalink
  
 
* http://freakytrigger.co.uk/ft/2008/11/blondie-call-me/
 
* http://freakytrigger.co.uk/ft/2008/11/blondie-call-me/
** Information displayed: author, author-url, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published, permalink, pagination-links
  
 
* http://www.scissorkick.com/2008/09/midnight-lab-band/
 
* http://www.scissorkick.com/2008/09/midnight-lab-band/
** Information displayed: author, author-url, author-photo, comment, published, comment-link
+
** Information displayed: author, author-image, comment, published, permalink
 
 
* http://www.arjanwrites.com/arjanwrites/2008/10/free-download-j.html
 
** Information displayed: author, author-url, comment, published, comment-link
 
  
 
* http://www.arjanwrites.com/arjanwrites/2008/10/free-download-j.html#comments
 
* http://www.arjanwrites.com/arjanwrites/2008/10/free-download-j.html#comments
** Information displayed: author, author-url, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published
  
 
* http://loki23.blogspot.com/2008/09/flower-electronics.html#comments
 
* http://loki23.blogspot.com/2008/09/flower-electronics.html#comments
** Information displayed: author, author-url, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published, permalink
  
 
* http://videogum.com/archives/the-hunt-for-the-worst-movie-of-all-time/the-hunt-for-the-worst-movie-o-30_032141.html
 
* http://videogum.com/archives/the-hunt-for-the-worst-movie-of-all-time/the-hunt-for-the-worst-movie-o-30_032141.html
** Information displayed: author, author-url, author-photo, comment, published, comment-link, vote, reply-url
+
** Information displayed: author, author-url, author-image, comment, published, permalink, vote, reply-url, inset-threaded-replies, in-reply-to-link
  
 
* http://www.haloscan.com/comments/empirestatehuman/7424868678376349884/
 
* http://www.haloscan.com/comments/empirestatehuman/7424868678376349884/
** Information displayed: author, author-url, comment, published, comment-link, reply-link
+
** Information displayed: author, author-url, comment, published, permalink, reply-link
  
 
* http://www.3hive.com/2008/10/1000_robata.php#comments
 
* http://www.3hive.com/2008/10/1000_robata.php#comments
** Information displayed: author, author-url, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published, reply-link, inset-threaded-replies
  
 
* http://www.musicload.de/album/1884260_2/nik-p--dj-%C3%B6tzi/ein-stern-der-deinen-namen-tr%C3%A4gt/item.html
 
* http://www.musicload.de/album/1884260_2/nik-p--dj-%C3%B6tzi/ein-stern-der-deinen-namen-tr%C3%A4gt/item.html
Line 126: Line 127:
  
 
* http://strongwordsinc.com/2007/05/31/episode-20-tranforming-you-into-stds-since-1983/#comments
 
* http://strongwordsinc.com/2007/05/31/episode-20-tranforming-you-into-stds-since-1983/#comments
** Information displayed: author, author-url, author-photo, comment, published, comment-link
+
** Information displayed: author, author-url, comment, published, permalink
  
 
* http://ackegard.com/gallery/v/campaigns/calipolis/LK03_Kyri_climbs.jpg.html?g2_imageViewsIndex=1
 
* http://ackegard.com/gallery/v/campaigns/calipolis/LK03_Kyri_climbs.jpg.html?g2_imageViewsIndex=1
Line 132: Line 133:
  
 
* http://www.elfwood.com/art/n/e/nelson/pixy.jpg.html#addnewcmt
 
* http://www.elfwood.com/art/n/e/nelson/pixy.jpg.html#addnewcmt
** Information displayed: author, author-url, comment, published
+
** Information displayed: author, author-url, comment, published, pagination-links
 +
 
 +
* http://www.reddit.com/r/offbeat/comments/7d8k8/man_kills_whole_beehive_by_accident_pic/c06citf
 +
** Information displayed: author, author-url, comment, published, permalink, reply-link, in-reply-to-link, inset-threaded-replies, vote
 +
 
 +
* http://slashdot.org/comments.pl?sid=1030805
 +
** Information displayed: author, author-url, comment, published, permalink, reply-link, in-reply-to-link, inset-threaded-replies, title, vote, pagination-links
 +
 
 +
* http://twitter.com/t
 +
** Information displayed: comment, software-used, published, permalink, in-reply-to-link, pagination-links
 +
** [[DavidJanes]]: this is not an example of a comments system
  
 
=== Analysis ===
 
=== Analysis ===
Line 138: Line 149:
 
25 examples
 
25 examples
  
* author 100%
 
 
* comment 100%
 
* comment 100%
* published 100%
+
* author 96%
* author-url 92%  
+
* published 96%
* comment-link 40%
+
* author-url 84%
* author-photo 16%
+
* permalink 60%
* reply-url 12%
+
* pagination-links 24%
 
+
* inset-threaded-replies 20%
Other properties occuring less than 10%
+
* author-image 16%
 
+
* in-reply-to-link 16%
* vote
+
* reply-link 16%
 +
* vote 16%
 +
* junk-report-link 8%
 +
* reply-url 8%
 +
* rating 4%
 +
* software-used 4%
 +
* title 4%
  
 
=== Selected Examples ===
 
=== Selected Examples ===
Line 156: Line 172:
 
* http://ryanedit.blogspot.com/2006/01/light-water-music-2.html
 
* http://ryanedit.blogspot.com/2006/01/light-water-music-2.html
 
* issue: DL lists only allow DT/DD children; how do we do hAtom?
 
* issue: DL lists only allow DT/DD children; how do we do hAtom?
 +
** The first step in realising the solution is to create a separate <code>&lt;dl></code> element for each individual comment.
 +
*** The next step is to realise that these elements have been chosen poorly to being with. Each of the wrapping <code>&lt;dl></code> elements should be <code>&lt;div></code>s; the <code>&lt;dt></code> elements should probably be <code>&lt;address></code>; the comments themselves perhaps <code>&lt;blockquote></code> and the footers <code>&lt;div></code>.
  
 
<pre>
 
<pre>
Line 192: Line 210:
  
 
* http://prototypen.com/blog/vjblog/archives/001318.html
 
* http://prototypen.com/blog/vjblog/archives/001318.html
 +
 +
<pre>
 +
<div class="comments-head">
 +
    <a name="comments"></a>
 +
    Comments
 +
</div>
 +
<div class="comments-body">
 +
    <p>Is it right that this video ....</p>
 +
    <p>Thanks.</p>
 +
    <span class="comments-post">
 +
        Posted by: <a href="...">Marco Bakera</a>
 +
        at November  8, 2005 08:34 AM
 +
    </span>
 +
</div>
 +
<div class="comments-body">
 +
    <p>In the right column you find the ....</p>
 +
    <p>Attribution Noncommercial Share Alike...</p>
 +
    <span class="comments-post">
 +
        Posted by: <a href="...">fALk</a>
 +
        at November 30, 2005 12:12 PM
 +
    </span>
 +
</div>
 +
</pre>
  
 
==== Wordpress #1 ====
 
==== Wordpress #1 ====
  
* ...
+
* http://www.itsjerrytime.com/?p=89
 +
 
 +
<pre>
 +
<h3 id="comments">
 +
    67 Responses to &#8220;THE TEXAS CHAINSAW CUSTOMER&#8221;
 +
</h3>
 +
<ol class="commentlist">
 +
    <!-- comment #1 -->
 +
    <li class="alt" id="comment-3779">
 +
        <cite>a fan</cite> Says:
 +
        <br />
 +
        <small class="commentmetadata">
 +
            <a href="#comment-3779" title="">October 17th, 2006 at 7:42 pm</a>
 +
        </small>
 +
        <p>Sounds like a it&#8217;ll be good...  </p>
 +
    </li>
 +
   
 +
    <!-- comment #2 -->
 +
    <li class="" id="comment-3979">
 +
        <cite><a href='...' rel='external nofollow'>chase</a></cite> Says:
 +
        <br />
 +
        <small class="commentmetadata">
 +
            <a href="#comment-3979" title="">October 21st, 2006 at 5:25 pm</a>
 +
        </small>
 +
        <p>hurry, hurry, hurry &#8230;</p>
 +
    </li>
 +
</ol>
 +
</pre>
 +
 
 +
 
 +
==== Video site #1 ====
 +
 
 +
* http://vimeo.com/162754
 +
 
 +
<pre>
 +
<ul class="comments" id="comments_162754">
 +
    <!-- comment #1 -->
 +
    <li class="parent first">
 +
        <a name="comment_120581"></a>
 +
        <img src="..." alt="" class="portrait" />
 +
        <div class="rightside">
 +
        <div class="name">
 +
            <a href="/videowombat">FuzzyDave</a>
 +
            2 years ago
 +
        </div>
 +
        <div class="text">
 +
            Another great short...
 +
        </div>
 +
        <div class="clear"></div>
 +
    </li>
 +
 
 +
    <!-- comment #2 -->
 +
    <li class="reply">
 +
        <a name="comment_120724"></a>
 +
        <img src="..." alt="" class="portrait" />
 +
        <div class="rightside">
 +
            <div class="name">
 +
                <a href="/joshflowers">JoshFlowers</a>
 +
                2 years ago
 +
            </div>
 +
            <div class="text">
 +
                Odd, I just suggested ...
 +
            </div>
 +
        </div>
 +
        <div class="clear"></div>
 +
    </li>
 +
</ul>
 +
 
 +
</pre>
 +
 
 +
==== Video site #2 ====
 +
 
 +
* http://www.nbc.com/Saturday_Night_Live/video/clips/mccain-qvc-open/805381/
 +
* this site loads comments by AJAX

Latest revision as of 19:31, 10 December 2008

Tools

WordPress

    • comment_ID
    • comment_author
    • comment_author_IP
    • comment_author_email
    • comment_author_link
    • comment_type
    • comment_text
    • comment_excerpt
    • comment_date
    • comment_time

pMachine

    • body
    • date
    • name
    • location
    • url
    • email
    • profile_link
    • member_total_comments

Expression Engine

    • {author_id}
    • {comment}
    • {comment_id}
    • {ip_address}
    • {name}
    • {permalink}
    • {url}
    • {url_or_email}

Expression Engine includes many additional comments templates tags. This list excludes the following tags: tags used to display user data (instant message handles, location, occupation, etc.), tags which are used for navigation within EE-based blogs or websites, tags which deal with comment presentation (alternating background colors between comments), and custom member tags (which are defined by individual sites.)

Drupal

    • $comment->new
    • $comment->subject
    • $comment->cid
    • $comment->nid
    • $comment->timestamp
    • $submitted
    • $comment
    • $picture
    • $content
    • $links

Real world Examples

The following urls are examples of user/visitor comments primarily about media, but are all in the context of a blog post or article.

  • http://www.rocketboom.com/rb_07_mar_26/comments/
    • Information displayed: author, author-url, comment, published, comments-link
    • This page does not contain any comments - just a link to another page which has comments on. This should probably not be included in the tally.
      • Updated example to one that works.
  • http://twitter.com/t
    • Information displayed: comment, software-used, published, permalink, in-reply-to-link, pagination-links
    • User:DavidJanes: this is not an example of a comments system

Analysis

25 examples

  • comment 100%
  • author 96%
  • published 96%
  • author-url 84%
  • permalink 60%
  • pagination-links 24%
  • inset-threaded-replies 20%
  • author-image 16%
  • in-reply-to-link 16%
  • reply-link 16%
  • vote 16%
  • junk-report-link 8%
  • reply-url 8%
  • rating 4%
  • software-used 4%
  • title 4%

Selected Examples

Blogspot #1

  • http://ryanedit.blogspot.com/2006/01/light-water-music-2.html
  • issue: DL lists only allow DT/DD children; how do we do hAtom?
    • The first step in realising the solution is to create a separate <dl> element for each individual comment.
      • The next step is to realise that these elements have been chosen poorly to being with. Each of the wrapping <dl> elements should be <div>s; the <dt> elements should probably be <address>; the comments themselves perhaps <blockquote> and the footers <div>.
<dl id='comments-block'>
    <!-- comment #1 -->
    <dt class='comment-author blogger-comment-icon' id='c113756252571588387'>
        <a name='c113756252571588387'></a>
        <a href='...' rel='nofollow'>french/new/wave/nerd</a> said...
    </dt>
    <dd class='comment-body'>
        <p>that was tasty.<BR/><BR/>-taxiplasm</p>
    </dd>
    <dd class='comment-footer'>
        <span class='comment-timestamp'>
            <a href='...' title='comment permalink'>9:35 PM</a>
        </span>
    </dd>

    <!-- comment #2 -->
    <dt class='comment-author blogger-comment-icon' id='c113756977236111956'>
        <a name='c113756977236111956'></a>
        <a href='...' rel='nofollow'>JuanFalla</a> said...
    </dt>    <dd class='comment-body'>
        <p>I wish i had your music ability. nice...</p>
    </dd>
    <dd class='comment-footer'>
        <span class='comment-timestamp'>
            <a href='...' title='comment permalink'>11:36 PM</a>
        </span>
    </dd>
</dl>

MovableType #1

<div class="comments-head">
    <a name="comments"></a>
    Comments
</div>
<div class="comments-body">
    <p>Is it right that this video ....</p>
    <p>Thanks.</p>
    <span class="comments-post">
        Posted by: <a href="...">Marco Bakera</a>
        at November  8, 2005 08:34 AM
    </span>
</div>
<div class="comments-body">
    <p>In the right column you find the ....</p>
    <p>Attribution Noncommercial Share Alike...</p>
    <span class="comments-post">
        Posted by: <a href="...">fALk</a>
        at November 30, 2005 12:12 PM
    </span>
</div>

Wordpress #1

<h3 id="comments">
    67 Responses to “THE TEXAS CHAINSAW CUSTOMER”
</h3>
<ol class="commentlist">
    <!-- comment #1 -->
    <li class="alt" id="comment-3779">
        <cite>a fan</cite> Says:
        <br />
        <small class="commentmetadata">
            <a href="#comment-3779" title="">October 17th, 2006 at 7:42 pm</a> 
        </small>
        <p>Sounds like a it’ll be good...  </p>
    </li>
    
    <!-- comment #2 -->
    <li class="" id="comment-3979">
        <cite><a href='...' rel='external nofollow'>chase</a></cite> Says:
        <br />
        <small class="commentmetadata">
            <a href="#comment-3979" title="">October 21st, 2006 at 5:25 pm</a>
        </small>
        <p>hurry, hurry, hurry …</p>
    </li>
</ol>


Video site #1

<ul class="comments" id="comments_162754">
    <!-- comment #1 -->
    <li class="parent first">
        <a name="comment_120581"></a>
        <img src="..." alt="" class="portrait" />
        <div class="rightside">
        <div class="name">
            <a href="/videowombat">FuzzyDave</a>
            2 years ago
        </div>
        <div class="text">
            Another great short...
        </div>
        <div class="clear"></div>
    </li>

    <!-- comment #2 -->
    <li class="reply">
        <a name="comment_120724"></a>
        <img src="..." alt="" class="portrait" />
        <div class="rightside">
            <div class="name">
                <a href="/joshflowers">JoshFlowers</a>
                2 years ago
            </div>
            <div class="text">
                Odd, I just suggested ...
            </div>
        </div>
        <div class="clear"></div>
    </li>
</ul>

Video site #2