Microformats Wiki - User contributions [en]

User:Noriyo

2007-12-31T11:14:33Z

Noriyo:

== Noriyo Asano ==
<div style="margin:0 0 1.5em 0;">
<ul>
<li>Location: Tokyo, Japan</li>
<li>Personal Site: IA Spectrum (http://www.iaspectrum.net/)</li>
</ul>
</div>
<div id="ccpublicdomainrelease" style="background: #f7f8ff; border: 1px solid #88a; padding: 5px; font-size: 80%;">http://creativecommons.org/images/public/norights-a.gifhttp://creativecommons.org/images/public/norights-a.gif
<div style="background:#fff;margin:0 88px;padding:2px"><div style="text-align: center; background: #ccf;">'''Released into public domain'''</div>I agree to release all my text and image contributions (past, present and future), into the [[#public-domain|public domain*]]. Please be aware that other contributors might not have done the same, so if you want to use pages with my contributions under public domain terms, please check past contributors' user pages."^ [http://creativecommons.org/licenses/publicdomain/ Creative Commons Public Domain License], the original at http://creativecommons.org/licenses/publicdomain/ or any later version published by Creative Commons; with either a waiver of rights, or an assertion that no rights attach to a particular work."</div></div>

User:Noriyo

2007-07-26T21:54:09Z

Noriyo:

== Noriyo Asano ==
<div style="margin:0 0 1.5em 0;">
<ul>
<li>Location: Tokyo, Japan</li>
<li>Personal Site: IA Spectrum (http://www.iaspectrum.net/)</li>
</ul>
</div>
<div id="publicdomainrelease" style="background: #f7f8ff; border: 1px solid #88a; padding: 5px; font-size: 80%;">http://upload.wikimedia.org/wikipedia/commons/thumb/6/62/PD-icon.svg/64px-PD-icon.svg.pnghttp://upload.wikimedia.org/wikipedia/commons/thumb/6/62/PD-icon.svg/64px-PD-icon.svg.png
<div style="background:#fff;margin:0 68px;padding:2px"><div style="text-align: center; background: #ccf;">'''Released into public domain'''</div>
I agree to release my text and image contributions, unless otherwise stated, into the [http://en.wikipedia.org/wiki/public_domain public domain]. Please be aware that other contributors might not do the same, so if you want to use pages with my contributions under public domain terms, please check the other contributors' user pages.</div></div>

posh-ja

2007-05-31T07:05:28Z

Noriyo: /* POSH関連ブックマーク */

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページ（日本語版）へようこそ。（[[posh|英語版]]）

__TOC__

== 起源 ==
'''POSH'''という用語は、[http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 2007年4月6日にmicroformatsのIRCチャネルにおいて]、<kwijibo>によって考案されました。POSHとは、[[plain-old-semantic-html]]の頭文字を取った略語です。John Allsopp、Tantek Çelik、Jeremy Keith、Chris Messinaらが[[events/2007-04-18-web-2-expo-dinner|2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinner]]で交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくは[[posh#History|POSHの歴史]]を参照してください。

== 理由 ==
[[semantic-html|意味的（セマンティック）なHTML]]という用語はやや仰々しく、それがどれほどシンプルなものであり昨今のウェブデザイナーたちの間でいかに確固たる支持を受けているかということも、意味的なマークアップを用いてウェブを真っ当に作ることだけにとどまらない大きなメリットをもたらすということも、いずれもうまく伝えられていません。私たちは、そのコンセプトの本質をうまく表現でき、簡単に動詞にも応用できるような（たとえば「to posh」「poshify」「poshed up」などという使い方ができるような）、覚えやすい用語を必要としていたのです。

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* POSHの最初のルールとして、まずあなたのPOSHを必ず[http://validator.w3.org 検証]しましょう。
* 次に、単なる表現上の目的で使われているTABLEや、スペーサーGIF画像、いわゆる[[presentational-html|表現的なHTML]]を取り除きましょう。
* さらに、（BタグやBRタグの濫用を典型とする）[http://tantek.com/log/2002/10.html#L20021022t1432 その場しのぎ（Bed and BReakfast）]のマークアップを修正しましょう。
* [http://tantek.com/log/2002/11.html#L20021128t1352 空っぽアンカー（Anorexic Anchors）]を取り除きましょう。
* よい[[semantic-class-names|意味的なクラス名]]を使いましょう。
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Ma.gnoliaの[http://ma.gnolia.com/groups/posh POSHグループ]をチェックしてみてください。

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

posh-ja

2007-05-31T07:01:53Z

Noriyo: /* POSHチェックリスト */

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページ（日本語版）へようこそ。（[[posh|英語版]]）

__TOC__

== 起源 ==
'''POSH'''という用語は、[http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 2007年4月6日にmicroformatsのIRCチャネルにおいて]、<kwijibo>によって考案されました。POSHとは、[[plain-old-semantic-html]]の頭文字を取った略語です。John Allsopp、Tantek Çelik、Jeremy Keith、Chris Messinaらが[[events/2007-04-18-web-2-expo-dinner|2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinner]]で交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくは[[posh#History|POSHの歴史]]を参照してください。

== 理由 ==
[[semantic-html|意味的（セマンティック）なHTML]]という用語はやや仰々しく、それがどれほどシンプルなものであり昨今のウェブデザイナーたちの間でいかに確固たる支持を受けているかということも、意味的なマークアップを用いてウェブを真っ当に作ることだけにとどまらない大きなメリットをもたらすということも、いずれもうまく伝えられていません。私たちは、そのコンセプトの本質をうまく表現でき、簡単に動詞にも応用できるような（たとえば「to posh」「poshify」「poshed up」などという使い方ができるような）、覚えやすい用語を必要としていたのです。

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* POSHの最初のルールとして、まずあなたのPOSHを必ず[http://validator.w3.org 検証]しましょう。
* 次に、単なる表現上の目的で使われているTABLEや、スペーサーGIF画像、いわゆる[[presentational-html|表現的なHTML]]を取り除きましょう。
* さらに、（BタグやBRタグの濫用を典型とする）[http://tantek.com/log/2002/10.html#L20021022t1432 その場しのぎ（Bed and BReakfast）]のマークアップを修正しましょう。
* [http://tantek.com/log/2002/11.html#L20021128t1352 空っぽアンカー（Anorexic Anchors）]を取り除きましょう。
* よい[[semantic-class-names|意味的なクラス名]]を使いましょう。
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

posh-ja

2007-05-29T09:01:18Z

Noriyo: /* 理由 */

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページ（日本語版）へようこそ。（[[posh|英語版]]）

__TOC__

== 起源 ==
'''POSH'''という用語は、[http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 2007年4月6日にmicroformatsのIRCチャネルにおいて]、<kwijibo>によって考案されました。POSHとは、[[plain-old-semantic-html]]の頭文字を取った略語です。John Allsopp、Tantek Çelik、Jeremy Keith、Chris Messinaらが[[events/2007-04-18-web-2-expo-dinner|2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinner]]で交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくは[[posh#History|POSHの歴史]]を参照してください。

== 理由 ==
[[semantic-html|意味的（セマンティック）なHTML]]という用語はやや仰々しく、それがどれほどシンプルなものであり昨今のウェブデザイナーたちの間でいかに確固たる支持を受けているかということも、意味的なマークアップを用いてウェブを真っ当に作ることだけにとどまらない大きなメリットをもたらすということも、いずれもうまく伝えられていません。私たちは、そのコンセプトの本質をうまく表現でき、簡単に動詞にも応用できるような（たとえば「to posh」「poshify」「poshed up」などという使い方ができるような）、覚えやすい用語を必要としていたのです。

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* The first rule of POSH is that you must [http://validator.w3.org validate] your POSH.
* Second, drop the use of TABLEs for purely presentational purposes, spacer GIFs, and [[presentational-html]] in general.
* Next, fix your [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and Breakfast] markup.
* Eliminate [http://tantek.com/log/2002/11.html#L20021128t1352 Anorexic Anchors].
* Use good [[semantic-class-names]].
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

posh-ja

2007-05-29T09:00:23Z

Noriyo: /* 理由 */

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページ（日本語版）へようこそ。（[[posh|英語版]]）

__TOC__

== 起源 ==
'''POSH'''という用語は、[http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 2007年4月6日にmicroformatsのIRCチャネルにおいて]、<kwijibo>によって考案されました。POSHとは、[[plain-old-semantic-html]]の頭文字を取った略語です。John Allsopp、Tantek Çelik、Jeremy Keith、Chris Messinaらが[[events/2007-04-18-web-2-expo-dinner|2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinner]]で交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくは[[posh#History|POSHの歴史]]を参照してください。

== 理由 ==
[[semantic-html|意味的（セマンティック）HTML]]という用語はやや仰々しく、それがどれほどシンプルなものであり昨今のウェブデザイナーたちの間でいかに確固たる支持を受けているかということも、意味的なマークアップを用いてウェブを真っ当に作ることだけにとどまらない大きなメリットをもたらすということも、いずれもうまく伝えられていません。私たちは、そのコンセプトの本質をうまく表現でき、簡単に動詞にも応用できるような（たとえば「to posh」「poshify」「poshed up」などという使い方ができるような）、覚えやすい用語を必要としていたのです。

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* The first rule of POSH is that you must [http://validator.w3.org validate] your POSH.
* Second, drop the use of TABLEs for purely presentational purposes, spacer GIFs, and [[presentational-html]] in general.
* Next, fix your [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and Breakfast] markup.
* Eliminate [http://tantek.com/log/2002/11.html#L20021128t1352 Anorexic Anchors].
* Use good [[semantic-class-names]].
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

posh-ja

2007-05-29T08:05:45Z

Noriyo:

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページ（日本語版）へようこそ。（[[posh|英語版]]）

__TOC__

== 起源 ==
'''POSH'''という用語は、[http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 2007年4月6日にmicroformatsのIRCチャネルにおいて]、<kwijibo>によって考案されました。POSHとは、[[plain-old-semantic-html]]の頭文字を取った略語です。John Allsopp、Tantek Çelik、Jeremy Keith、Chris Messinaらが[[events/2007-04-18-web-2-expo-dinner|2007年4月18日のWeb 2.0 Expo後に行われたMicroformats Dinner]]で交わした議論を通して、microformatsのよりどころでありそれが正しいサブセットともなっているPOSHの発想と、そのより幅広い目標を広めることの重要性があらためて注目されました。詳しくは[[posh#History|POSHの歴史]]を参照してください。

== 理由 ==
The term [[semantic-html]] is a mouthful, and belies both how simple it is, how well established it is among modern web designers, and the fact that it has benefits far beyond the obvious doing the right thing for the Web by using semantic markup. We need a simple short mnemonic term that captures the essence of the concept, and is easily verbed (to posh, poshify, poshed up).

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* The first rule of POSH is that you must [http://validator.w3.org validate] your POSH.
* Second, drop the use of TABLEs for purely presentational purposes, spacer GIFs, and [[presentational-html]] in general.
* Next, fix your [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and Breakfast] markup.
* Eliminate [http://tantek.com/log/2002/11.html#L20021128t1352 Anorexic Anchors].
* Use good [[semantic-class-names]].
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

Main Page-ja

2007-05-29T07:50:11Z

Noriyo: /* はじめに */

__NOTOC__
<h1>Microformats Wiki</h1>

'''こんにちは！''' microformats wikiにようこそ。もしこのページを見るのが初めてでしたら、[[introduction-ja|microformatsの手引き]]をご覧ください。

何か編集する前には必ず[[how-to-play-ja]]を読んでください。

新しいmicroformatsを提案する際は、必ず[[process]]を読んでからにしてください。

__TOC__

== はじめに ==

[[what-are-microformats|microformatsとは何でしょう]]？また[[what-can-you-do-with-microformats|microformatsで何ができますか]]？

まずは[http://microformats.org/about/ about page]、そして[http://microformats.org/ latest news]をご覧ください。また最新の[[press-ja|プレス]]や[[presentations-ja|プレゼンテーション]]、さらには[[podcasts|ポッドキャスト]]や[[screencasts|スクリーンキャスト]]もmicroformatsの基礎を理解する手助けになると思います。どれか個別のmicroformatについて手軽に確認したい場合は、[[cheatsheets|早見表（チートシート）]]が便利です。
よくある質問とその答えは[[faq|FAQ]]で、また[[glossary|用語集]]もあります。

microformatsを活用するには、[http://microformats.org/wiki/posh-ja <abbr title="Plain Old Semantic HTML">POSH</abbr>]について知るのもよいアイデアです。{{NewMarker}}

識者からもっと教わりたいことがあれば、[[events|microformatsのイベント]]もありますよ。

== 定義 ==

[http://microformats.org/discuss/ メーリングリスト]([[mailing-lists]])での一般的な定義は、「分散的開発を実現するために用いられる、セマンティクスをHTMLに埋め込む為のシンプルな仕様」です。もう少し細かく説明すると、microformatsは下記のように定義できます。
:分散的開発を実現するために用いられる
::Webにあるリソースそのものや、それを利用するツールやサービスを分散的に処理できるようにします。
:セマンティクスをHTMLに埋め込むための
::それぞれの分野に特化することで、各仕様が小さいものとなります。
:シンプルな仕様
:人間が解読できる(X)HTML/XMLドキュメントやAtom/RSSフィード、そしてプレーンなXMLでの提供
::現存するコンテンツの利用パターンを標準化することからはじめています。
::概略的で説明的なclass名を使い、ソースをみてもわかりやすくなっています。
::現存の相互運用できる規格に基づくことにより、汎用性が高まります。

シンプルに言うと、「microformatsは成文化したコンベンションのことです。」 -- [http://easy-reader.net Aaron Gustafson]

「ブラウザーでWeb巡回しかしないんだ。それはまた20世紀的だね。」 -- [http://diveintomark.org Mark Pilgrim]

== 協力の方法 ==

microformatsをより発展させるためには次のことができます。

*公開されてる [[to-do|to do list]]をチェックし、リストアップされてる事を終わらせるのを手伝ってください。
*[http://microformats.org/discuss mailing lists] と [[irc|IRC Channel]] に参加しマイクロフォーマットに関して質問したり学んだりすることができます。
*[[advocacy|Advocate]] the use of microformats.
*[[Main_Page-ja#.E4.BB.96.E8.A8.80.E8.AA.9E.E3.81.A7.E3.81.AEmicroformats_wiki|他言語でのmicroformats wiki]]を見てください。そして、世界中の人が利用しやすくするためにmicroformats wikiの翻訳を手伝ってください。

== 仕様 ==

以下はオープンスタンダードとなった[[microformats-ja|microformats]]の仕様です。([[implementations|実装]]や[[examples-in-the-wild|実世界での例]]もご覧ください)

* [[hcalendar-ja|hCalendar]] - [http://microformats.org/code/hcalendar/creator hcalendar creator](翻訳中！)
* [[hcard-ja|hCard]] - [http://microformats.org/code/hcard/creator hcard creator](翻訳中！)
* [[rel-license-ja|rel-license]](翻訳完了)
* [[rel-nofollow-ja|rel-nofollow]](翻訳完了)
* [[rel-tag-ja|rel-tag]](翻訳完了)
* [[vote-links-ja|Vote Links]](翻訳完了)
* [http://gmpg.org/xfn/ XFN] ([[xfn-implementations|XFNの実装]]もご覧下さい)
* [http://gmpg.org/xmdp/ XMDP]
* [[xoxo-ja|XOXO]](翻訳中！)

== ドラフト ==

* [[adr|adr]]
* [[geo|geo]]
* [[hatom|hAtom]]
* [[hresume|hResume]]
* [[hreview-ja|hReview]] - [http://microformats.org/code/hreview/creator hreview creator]
* [[rel-directory]]
* [[rel-enclosure]]
* [[rel-home]]
* [[relpayment-research | rel-payment]]
* [[robots-exclusion|Robots Exclusion]]
* [[xfolk|xFolk]]

== デザインパターン ==

{{design_patterns-ja}} 

== Exploratory Discussions ==
Per the microformats [[process]]:
実世界での[[examples|例]]の調査や分析、既に存在するフォーマット、またmicroformatsにできそうなもののブレインストーミングをまとめています。もし何かページを追加した場合、まず[[rejected-formats]]を見てから行ってください。
* alternates [[alternates-brainstorming|alternates brainstorming]], [[alternates-examples|alternates examples]]
*[[attention]]
* blog description [[blog-description-examples|blog description examples]]
* blog info [[blog-info-examples|blog info examples]]
* blog post [[blog-post-examples|examples]], [[blog-post-formats|blog post formats]], and [[blog-post-brainstorming|blog post brainstorming]] (yielded the [[hatom|hAtom]] draft)
* book [[book-examples|book examples]], [[book-formats|book formats]], and [[book-brainstorming|book brainstorming]]
* chat [[chat-examples|chat examples]], [[chat-formats|chat formats]], and [[chat-brainstorming|chat brainstorming]]
* citation [[citation|citation effort]], [[citation-examples|citation examples]], [[citation-formats|citation formats]], [[citation-brainstorming|citation brainstorming]], and [[citation-faq|citation FAQ]]
* code [[code-examples| code examples]], [[code-brainstorming|code brainstorming]]{{NewMarker}}
* comment [[comment-problem|comment problem]], [[comment-examples|comment examples]], and [[comments-formats|comment formats]] (Some stuff needs to be extracted from [[comments-formats]])
* [[collection-description|collection description]] {{NewMarker}}
* [[course-catalog]]; [[course-catalog-examples]] {{NewMarker}}
* [[currency]]; [[currency-examples]]; [[currency-brainstorming]]; [[currency-proposal]]; [[currency-issues]]
* [[depend-examples]]: examples of dependency graphs, especially as they relate to software {{NewMarker}}
* [[digital-signatures]]: incorporation of digital signatures in Microformatted data; ([[digitalsignature-examples|digital-signature examples]], [[digitalsignature-brainstorming|digital-signatures brainstorming]]) {{NewMarker}}
* directions [[directions-examples|directions examples]] {{NewMarker}}
* directory inclusion [[directory-inclusion-examples|directory inclusion examples]], [[directory-inclusion-formats|directory inclusion formats]]. (see also [[rel-directory]])
* distributed conversation [[distributed-conversation|distributed conversation overview]], [[distributed-conversation-brainstorming|distributed conversation brainstorming]], [[distributed-conversation-examples|distributed conversation examples]], and [[distributed-conversation-formats|distributed conversation formats]]
* forms [[forms-examples|forms examples]]
* genealogy [[genealogy-formats|genealogy examples]]
* group [[group-brainstorming|group brainstorming]] and [[group-examples|group examples]]
* hash [[hash-examples|hash examples]]
* items [[items-brainstorming|items brainstorming]] and [[items-examples|items examples]]
* job listing [[job-listing-examples|job listing examples]] and [[job-listing-brainstorming|job listing brainstorming]]
* last modified [[last-modified-examples|last modified examples]], [[last-modified-formats|last modified formats]], and [[last-modified-brainstorming|last modified brainstorming]]
* hListing [[hlisting-proposal|hListing proposal]], and [[hlisting-feedback|hListing feedback]]
** Also, listing [[listing-examples|examples]], [[listing-formats|formats]], and [[listing-brainstorming|brainstorming]]
* [[product|hProduct]] - [[product-brainstorming|hProduct brainstorming]] | [[product-examples|hProduct examples]]
* location [[location-formats|location formats]]. (see also [[adr]] and [[geo]])
* [[luna]] ([[geo]]-like co-ordinates, for places on The Moon) - see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* [[mars]] ([[geo]]-like co-ordinates, for places on the planet Mars)- see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* measures and measurement units [[measure]]
* [[media-info]] ([[media-info-examples|media-info examples]], [[media-info-formats|media-info formats]], [[media-info-brainstorming|media-info brainstorming]])
* meeting minutes [[meeting-minutes-examples|meeting minutes examples]], [[meeting-minutes-formats|meeting minutes formats]], and [[meeting-minutes-brainstorming|meeting minutes brainstorming]]
* metalink [[metalink-examples|metalink examples]] {{NewMarker}}
* microsummary [[microsummary-brainstorming|microsummary brainstorming]]
* [[mfo-examples|MFO examples]]
* music [[music-examples|music examples]]
* photo note [[photo-note-examples|photo note examples]]
*[[question-answer]], [[question-answer-brainstorming]]; [[question-answer-examples]] {{NewMarker}}
* recipe [[recipe-examples|recipe examples]], [[recipe-brainstorming]] {{UpdateMarker}}
* rel-product [[rel-product-brainstorming|rel-product brainstorming]]
* requirements testing [[requirements-testing|requirements testing overview]], and [[requirements-testing-examples|requirements testing examples]]
* [[rest-examples|REST examples]]
* resume [[resume-brainstorming|resume brainstorming]], and [[resume-formats|resume formats]]
* review [[review-examples|review examples]], and [[review-formats|review formats]] (yielded the [[hreview|hReview]] draft)
* search results [[search-results-example|search results example]]
* show [[show-brainstorming|show brainstorming]]
* showroll [[showroll-brainstorming|brainstorming]]
* [[species]] - for the marking up of the scientific names of living things: [[species-examples]]; [[species-brainstorming]] {{UpdateMarker}}
* table [[table-examples|examples]]
* tagspeak [[tagspeak-examples|tagspeak examples]]
* tagcloud [[tagcloud-examples|tagcloud examples]], and [[tagcloud-brainstorming|tagcloud brainstorming]].
* [[thoughts-on-extending-the-geo-microformat|thoughts on extending the geo microformat]], [http://microformats.telemetry.gr examples] {{NewMarker}}
* transit table [[transit-table-examples|transit table examples]]
* [[uid]]
* widget [[widget-examples|widget examples]], and [[widget-brainstorming|widget brainstorming]]
* [[wiki-formats|wiki formats]]
* work of art [[work-of-art|work of art overview]], [[workofart-examples|work of art examples]], [[workofart-formats|work of art formats]], and [[workofart-brainstorming|work of art brainstorming]]
*[[xmdp-brainstorming|XMDP brainstorming]] (see also [[xmdp-faq]])

== 例 ==
* [[examples-in-the-wild]]
* [[implementations]]
* [[zen-garden]]

== ツール、テストケース、リサーチ ==

事例やコードやテストケースを見るために最初に見るべき場所はmicroformatを使ったそれぞれのページです. 二つ以上のmicroformatを使うツールやサービスは少ししかありません. このセクションは複数のmicroformatに関連するエディター、パーサー、妥当性検証ソフト、テストケース、その他情報等のためのものです。

*[[accessibility]]
*[[faqs-for-rdf]]
*[[icalendar-implementations]]
*[[parsing-microformats]]
*[[selected-test-cases-from-the-web]]
*[http://hg.microformats.org/ Source code repository] -- [[mercurial-quick-start|HowTo: Download code from the repository]]
*[[vcard-implementations]], [[vcard-errata]], [[vcard-suggestions]]
*[[why-are-content-standards-hard]]
*[[profile-examples-in-wild|Profile examples, in the wild]]

== 共有ワークスペース ==

* [[buttons]]
* [[icons-ja]] {{NewMarker}}
* [[spread-microformats]] {{NewMarker}}
* [[demo|デモ]] - microformatを試すデモへのリンク集
* [[events]]
* [[to-do]]
* [[user-interface]]
* [[marked-for-deletion]]
* [[microformats-issues]] {{NewMarker}} - 一つ以上のmicroformatに関するissue

== 他言語でのmicroformats wiki ==

microformatsの記事を色々な言語で読んだり編集したりできます。

* 100以上の記事のある言語
** [[Main_Page|English (本家の英語)]]
** [[Main_Page-fr|Francais (フランス語)]] {{UpdateMarker-fr}}
* 10以上の記事のある言語
** [[Main_Page-pt-br| Português (ブラジル系ポルトガル語)]] {{NewMarker-pt-br}}
** [[Main_Page-ja|日本語]]
* 2以上の記事のある言語
** [[Main_Page-es|Espanol (スペイン語)]]
** [[Main_Page-de|Deutsch (ドイツ語)]]

==== 他の場所にあるmicroformatsの翻訳版 ====

いくつかのmicroformatsは、このWiki以外の場所にて翻訳が行われています。もしあなたがその翻訳に関わっていたら、ぜひこのmicroformats wikiで作業しないか考えて頂けると幸いです。
* [http://mikroformate.pbwiki.com/ Deutsch (German) mikroformate.pbwiki.com] {{NewMarker-de}}

=== 他の言語に翻訳するのをお手伝いください！ ===

読みたい記事があなたの読みたい言葉で存在していませんか？それならば是非microformats wikiを翻訳するのにご協力ください！microformats wikiの多言語化については現在も取り組んでいます。

翻訳に際し、まずは[http://en.wikipedia.org/wiki/Wikipedia:Multilingual_coordination Wikipediaにおける多言語版の位置づけ]、そして[http://meta.wikimedia.org/wiki/How_to_start_a_new_Wikipedia 新しいWikipediaを始めるには] をご覧下さい。
一般的なTIPSやアドバイス、このコミュニティの慣習が書いてあります。

実際に翻訳を始めるときは、まず、比較的静的であまり変化がないものを集めた[[stable-pages-ja|静的ページ]]に挙がっているものを少しずつ翻訳していくことから始めましょう。そして、(ページの変更を監視できる)[[Special:Watchlist|ウォッチリスト]]機能を使って英語版と歩調を合わせるとよいでしょう。

翻訳したページの名前: 翻訳したページのページ名は、英語版のページ名の末尾にハイフンに続いてRFC 3066の言語コード付けてください。例えば日本語版では、[[Main_Page]]は[[Main_Page-ja]]に、そして [[how-to-play]]は[[how-to-play-ja]]になります。

=== 要望のある言語はこちら ===

* Chinese: 微格式 (Microformats) (see [http://msittig.blogspot.com/2005/11/since-i-translated-schedule-of.html source of translation])
* Does somebody want to see a Dutch translation???

Main Page-ja

2007-05-29T07:32:27Z

Noriyo: /* はじめに */

__NOTOC__
<h1>Microformats Wiki</h1>

'''こんにちは！''' microformats wikiにようこそ。もしこのページを見るのが初めてでしたら、[[introduction-ja|microformatsの手引き]]をご覧ください。

何か編集する前には必ず[[how-to-play-ja]]を読んでください。

新しいmicroformatsを提案する際は、必ず[[process]]を読んでからにしてください。

__TOC__

== はじめに ==

[[what-are-microformats|microformatsとは何でしょう]]？また[[what-can-you-do-with-microformats|microformatsで何ができますか]]？

まずは[http://microformats.org/about/ about page]、そして[http://microformats.org/ latest news]をご覧ください。また最新の[[press-ja|プレス]]や[[presentations-ja|プレゼンテーション]]、さらには[[podcasts|ポッドキャスト]]や[[screencasts|スクリーンキャスト]]もmicroformatsの基礎を理解する手助けになると思います。どれか個別のmicroformatについて手軽に確認したい場合は、[[cheatsheets|早見表（チートシート）]]が便利です。
よくある質問とその答えは[[faq|FAQ]]で、また[[glossary|用語集]]もあります。

microformatsを活用するには、[http://microformats.org/wiki/posh-jp <abbr title="Plain Old Semantic HTML">POSH</abbr>]について知るのもよいアイデアです。{{NewMarker}}

識者からもっと教わりたいことがあれば、[[events|microformatsのイベント]]もありますよ。

== 定義 ==

[http://microformats.org/discuss/ メーリングリスト]([[mailing-lists]])での一般的な定義は、「分散的開発を実現するために用いられる、セマンティクスをHTMLに埋め込む為のシンプルな仕様」です。もう少し細かく説明すると、microformatsは下記のように定義できます。
:分散的開発を実現するために用いられる
::Webにあるリソースそのものや、それを利用するツールやサービスを分散的に処理できるようにします。
:セマンティクスをHTMLに埋め込むための
::それぞれの分野に特化することで、各仕様が小さいものとなります。
:シンプルな仕様
:人間が解読できる(X)HTML/XMLドキュメントやAtom/RSSフィード、そしてプレーンなXMLでの提供
::現存するコンテンツの利用パターンを標準化することからはじめています。
::概略的で説明的なclass名を使い、ソースをみてもわかりやすくなっています。
::現存の相互運用できる規格に基づくことにより、汎用性が高まります。

シンプルに言うと、「microformatsは成文化したコンベンションのことです。」 -- [http://easy-reader.net Aaron Gustafson]

「ブラウザーでWeb巡回しかしないんだ。それはまた20世紀的だね。」 -- [http://diveintomark.org Mark Pilgrim]

== 協力の方法 ==

microformatsをより発展させるためには次のことができます。

*公開されてる [[to-do|to do list]]をチェックし、リストアップされてる事を終わらせるのを手伝ってください。
*[http://microformats.org/discuss mailing lists] と [[irc|IRC Channel]] に参加しマイクロフォーマットに関して質問したり学んだりすることができます。
*[[advocacy|Advocate]] the use of microformats.
*[[Main_Page-ja#.E4.BB.96.E8.A8.80.E8.AA.9E.E3.81.A7.E3.81.AEmicroformats_wiki|他言語でのmicroformats wiki]]を見てください。そして、世界中の人が利用しやすくするためにmicroformats wikiの翻訳を手伝ってください。

== 仕様 ==

以下はオープンスタンダードとなった[[microformats-ja|microformats]]の仕様です。([[implementations|実装]]や[[examples-in-the-wild|実世界での例]]もご覧ください)

* [[hcalendar-ja|hCalendar]] - [http://microformats.org/code/hcalendar/creator hcalendar creator](翻訳中！)
* [[hcard-ja|hCard]] - [http://microformats.org/code/hcard/creator hcard creator](翻訳中！)
* [[rel-license-ja|rel-license]](翻訳完了)
* [[rel-nofollow-ja|rel-nofollow]](翻訳完了)
* [[rel-tag-ja|rel-tag]](翻訳完了)
* [[vote-links-ja|Vote Links]](翻訳完了)
* [http://gmpg.org/xfn/ XFN] ([[xfn-implementations|XFNの実装]]もご覧下さい)
* [http://gmpg.org/xmdp/ XMDP]
* [[xoxo-ja|XOXO]](翻訳中！)

== ドラフト ==

* [[adr|adr]]
* [[geo|geo]]
* [[hatom|hAtom]]
* [[hresume|hResume]]
* [[hreview-ja|hReview]] - [http://microformats.org/code/hreview/creator hreview creator]
* [[rel-directory]]
* [[rel-enclosure]]
* [[rel-home]]
* [[relpayment-research | rel-payment]]
* [[robots-exclusion|Robots Exclusion]]
* [[xfolk|xFolk]]

== デザインパターン ==

{{design_patterns-ja}} 

== Exploratory Discussions ==
Per the microformats [[process]]:
実世界での[[examples|例]]の調査や分析、既に存在するフォーマット、またmicroformatsにできそうなもののブレインストーミングをまとめています。もし何かページを追加した場合、まず[[rejected-formats]]を見てから行ってください。
* alternates [[alternates-brainstorming|alternates brainstorming]], [[alternates-examples|alternates examples]]
*[[attention]]
* blog description [[blog-description-examples|blog description examples]]
* blog info [[blog-info-examples|blog info examples]]
* blog post [[blog-post-examples|examples]], [[blog-post-formats|blog post formats]], and [[blog-post-brainstorming|blog post brainstorming]] (yielded the [[hatom|hAtom]] draft)
* book [[book-examples|book examples]], [[book-formats|book formats]], and [[book-brainstorming|book brainstorming]]
* chat [[chat-examples|chat examples]], [[chat-formats|chat formats]], and [[chat-brainstorming|chat brainstorming]]
* citation [[citation|citation effort]], [[citation-examples|citation examples]], [[citation-formats|citation formats]], [[citation-brainstorming|citation brainstorming]], and [[citation-faq|citation FAQ]]
* code [[code-examples| code examples]], [[code-brainstorming|code brainstorming]]{{NewMarker}}
* comment [[comment-problem|comment problem]], [[comment-examples|comment examples]], and [[comments-formats|comment formats]] (Some stuff needs to be extracted from [[comments-formats]])
* [[collection-description|collection description]] {{NewMarker}}
* [[course-catalog]]; [[course-catalog-examples]] {{NewMarker}}
* [[currency]]; [[currency-examples]]; [[currency-brainstorming]]; [[currency-proposal]]; [[currency-issues]]
* [[depend-examples]]: examples of dependency graphs, especially as they relate to software {{NewMarker}}
* [[digital-signatures]]: incorporation of digital signatures in Microformatted data; ([[digitalsignature-examples|digital-signature examples]], [[digitalsignature-brainstorming|digital-signatures brainstorming]]) {{NewMarker}}
* directions [[directions-examples|directions examples]] {{NewMarker}}
* directory inclusion [[directory-inclusion-examples|directory inclusion examples]], [[directory-inclusion-formats|directory inclusion formats]]. (see also [[rel-directory]])
* distributed conversation [[distributed-conversation|distributed conversation overview]], [[distributed-conversation-brainstorming|distributed conversation brainstorming]], [[distributed-conversation-examples|distributed conversation examples]], and [[distributed-conversation-formats|distributed conversation formats]]
* forms [[forms-examples|forms examples]]
* genealogy [[genealogy-formats|genealogy examples]]
* group [[group-brainstorming|group brainstorming]] and [[group-examples|group examples]]
* hash [[hash-examples|hash examples]]
* items [[items-brainstorming|items brainstorming]] and [[items-examples|items examples]]
* job listing [[job-listing-examples|job listing examples]] and [[job-listing-brainstorming|job listing brainstorming]]
* last modified [[last-modified-examples|last modified examples]], [[last-modified-formats|last modified formats]], and [[last-modified-brainstorming|last modified brainstorming]]
* hListing [[hlisting-proposal|hListing proposal]], and [[hlisting-feedback|hListing feedback]]
** Also, listing [[listing-examples|examples]], [[listing-formats|formats]], and [[listing-brainstorming|brainstorming]]
* [[product|hProduct]] - [[product-brainstorming|hProduct brainstorming]] | [[product-examples|hProduct examples]]
* location [[location-formats|location formats]]. (see also [[adr]] and [[geo]])
* [[luna]] ([[geo]]-like co-ordinates, for places on The Moon) - see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* [[mars]] ([[geo]]-like co-ordinates, for places on the planet Mars)- see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* measures and measurement units [[measure]]
* [[media-info]] ([[media-info-examples|media-info examples]], [[media-info-formats|media-info formats]], [[media-info-brainstorming|media-info brainstorming]])
* meeting minutes [[meeting-minutes-examples|meeting minutes examples]], [[meeting-minutes-formats|meeting minutes formats]], and [[meeting-minutes-brainstorming|meeting minutes brainstorming]]
* metalink [[metalink-examples|metalink examples]] {{NewMarker}}
* microsummary [[microsummary-brainstorming|microsummary brainstorming]]
* [[mfo-examples|MFO examples]]
* music [[music-examples|music examples]]
* photo note [[photo-note-examples|photo note examples]]
*[[question-answer]], [[question-answer-brainstorming]]; [[question-answer-examples]] {{NewMarker}}
* recipe [[recipe-examples|recipe examples]], [[recipe-brainstorming]] {{UpdateMarker}}
* rel-product [[rel-product-brainstorming|rel-product brainstorming]]
* requirements testing [[requirements-testing|requirements testing overview]], and [[requirements-testing-examples|requirements testing examples]]
* [[rest-examples|REST examples]]
* resume [[resume-brainstorming|resume brainstorming]], and [[resume-formats|resume formats]]
* review [[review-examples|review examples]], and [[review-formats|review formats]] (yielded the [[hreview|hReview]] draft)
* search results [[search-results-example|search results example]]
* show [[show-brainstorming|show brainstorming]]
* showroll [[showroll-brainstorming|brainstorming]]
* [[species]] - for the marking up of the scientific names of living things: [[species-examples]]; [[species-brainstorming]] {{UpdateMarker}}
* table [[table-examples|examples]]
* tagspeak [[tagspeak-examples|tagspeak examples]]
* tagcloud [[tagcloud-examples|tagcloud examples]], and [[tagcloud-brainstorming|tagcloud brainstorming]].
* [[thoughts-on-extending-the-geo-microformat|thoughts on extending the geo microformat]], [http://microformats.telemetry.gr examples] {{NewMarker}}
* transit table [[transit-table-examples|transit table examples]]
* [[uid]]
* widget [[widget-examples|widget examples]], and [[widget-brainstorming|widget brainstorming]]
* [[wiki-formats|wiki formats]]
* work of art [[work-of-art|work of art overview]], [[workofart-examples|work of art examples]], [[workofart-formats|work of art formats]], and [[workofart-brainstorming|work of art brainstorming]]
*[[xmdp-brainstorming|XMDP brainstorming]] (see also [[xmdp-faq]])

== 例 ==
* [[examples-in-the-wild]]
* [[implementations]]
* [[zen-garden]]

== ツール、テストケース、リサーチ ==

事例やコードやテストケースを見るために最初に見るべき場所はmicroformatを使ったそれぞれのページです. 二つ以上のmicroformatを使うツールやサービスは少ししかありません. このセクションは複数のmicroformatに関連するエディター、パーサー、妥当性検証ソフト、テストケース、その他情報等のためのものです。

*[[accessibility]]
*[[faqs-for-rdf]]
*[[icalendar-implementations]]
*[[parsing-microformats]]
*[[selected-test-cases-from-the-web]]
*[http://hg.microformats.org/ Source code repository] -- [[mercurial-quick-start|HowTo: Download code from the repository]]
*[[vcard-implementations]], [[vcard-errata]], [[vcard-suggestions]]
*[[why-are-content-standards-hard]]
*[[profile-examples-in-wild|Profile examples, in the wild]]

== 共有ワークスペース ==

* [[buttons]]
* [[icons-ja]] {{NewMarker}}
* [[spread-microformats]] {{NewMarker}}
* [[demo|デモ]] - microformatを試すデモへのリンク集
* [[events]]
* [[to-do]]
* [[user-interface]]
* [[marked-for-deletion]]
* [[microformats-issues]] {{NewMarker}} - 一つ以上のmicroformatに関するissue

== 他言語でのmicroformats wiki ==

microformatsの記事を色々な言語で読んだり編集したりできます。

* 100以上の記事のある言語
** [[Main_Page|English (本家の英語)]]
** [[Main_Page-fr|Francais (フランス語)]] {{UpdateMarker-fr}}
* 10以上の記事のある言語
** [[Main_Page-pt-br| Português (ブラジル系ポルトガル語)]] {{NewMarker-pt-br}}
** [[Main_Page-ja|日本語]]
* 2以上の記事のある言語
** [[Main_Page-es|Espanol (スペイン語)]]
** [[Main_Page-de|Deutsch (ドイツ語)]]

==== 他の場所にあるmicroformatsの翻訳版 ====

いくつかのmicroformatsは、このWiki以外の場所にて翻訳が行われています。もしあなたがその翻訳に関わっていたら、ぜひこのmicroformats wikiで作業しないか考えて頂けると幸いです。
* [http://mikroformate.pbwiki.com/ Deutsch (German) mikroformate.pbwiki.com] {{NewMarker-de}}

=== 他の言語に翻訳するのをお手伝いください！ ===

読みたい記事があなたの読みたい言葉で存在していませんか？それならば是非microformats wikiを翻訳するのにご協力ください！microformats wikiの多言語化については現在も取り組んでいます。

翻訳に際し、まずは[http://en.wikipedia.org/wiki/Wikipedia:Multilingual_coordination Wikipediaにおける多言語版の位置づけ]、そして[http://meta.wikimedia.org/wiki/How_to_start_a_new_Wikipedia 新しいWikipediaを始めるには] をご覧下さい。
一般的なTIPSやアドバイス、このコミュニティの慣習が書いてあります。

実際に翻訳を始めるときは、まず、比較的静的であまり変化がないものを集めた[[stable-pages-ja|静的ページ]]に挙がっているものを少しずつ翻訳していくことから始めましょう。そして、(ページの変更を監視できる)[[Special:Watchlist|ウォッチリスト]]機能を使って英語版と歩調を合わせるとよいでしょう。

翻訳したページの名前: 翻訳したページのページ名は、英語版のページ名の末尾にハイフンに続いてRFC 3066の言語コード付けてください。例えば日本語版では、[[Main_Page]]は[[Main_Page-ja]]に、そして [[how-to-play]]は[[how-to-play-ja]]になります。

=== 要望のある言語はこちら ===

* Chinese: 微格式 (Microformats) (see [http://msittig.blogspot.com/2005/11/since-i-translated-schedule-of.html source of translation])
* Does somebody want to see a Dutch translation???

posh-ja

2007-05-29T07:30:19Z

Noriyo:

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページへようこそ。

__TOC__

== 起源 ==
The acronym '''POSH''' was coined [http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 on 6 April 2007] on the microformats IRC channel, by <kwijibo> as a shorthand abbreviation for [[plain-old-semantic-html]]. A discussion on among John Allsopp, Tantek Çelik, Jeremy Keith, and Chris Messina at the [[events/2007-04-18-web-2-expo-dinner|Microformats Dinner 2007 April 18 following Web 2.0 Expo]] reraised the idea of POSH and the importance of promoting the broader goal of POSH, which microformats are built from and are a proper subset of. For more see [[posh#History|History]].

== 理由 ==
The term [[semantic-html]] is a mouthful, and belies both how simple it is, how well established it is among modern web designers, and the fact that it has benefits far beyond the obvious doing the right thing for the Web by using semantic markup. We need a simple short mnemonic term that captures the essence of the concept, and is easily verbed (to posh, poshify, poshed up).

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh-ja#POSH.E3.83.81.E3.82.A7.E3.83.83.E3.82.AF.E3.83.AA.E3.82.B9.E3.83.88|POSHチェックリスト]]を適用してください。[[posh-ja#POSH.E3.83.97.E3.83.AD.E3.82.BB.E3.82.B9|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]をお読みください。

== POSHプロセス ==
あなたがPOSHであるために、そしてあなたのウェブサイトをPOSHなものにするためには、何ができるでしょうか？

# POSHなコンテンツを公開する。[[posh-ja#POSH.E3.83.AA.E3.82.BD.E3.83.BC.E3.82.B9|POSHリソース]]に目を通し、あなたのウェブサイトでvalidな[[semantic-html|semantic (X)HTML]]を公開し、それに伴って[[semantic-class-names]]を使用するように心がけましょう。
# POSHを広める。このページへのリンクを貼って、他の人たちもPOSHになるように、そしてウェブサイトをPOSH対応させる（POSHify）ように勧めてみましょう。
# POSHを改善する。より多くの人が手軽にウェブサイトをPOSH対応させられるように、POSHリソースの収集をお手伝いください。

== POSHチェックリスト ==
* The first rule of POSH is that you must [http://validator.w3.org validate] your POSH.
* Second, drop the use of TABLEs for purely presentational purposes, spacer GIFs, and [[presentational-html]] in general.
* Next, fix your [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and Breakfast] markup.
* Eliminate [http://tantek.com/log/2002/11.html#L20021128t1352 Anorexic Anchors].
* Use good [[semantic-class-names]].
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

posh-ja

2007-05-29T07:15:40Z

Noriyo:

<h1>Plain Old Semantic HTML (POSH)</h1>

<abbr title="Plain Old Semantic HTML">POSH</abbr>のホームページへようこそ。

__TOC__

== 起源 ==
The acronym '''POSH''' was coined [http://rbach.priv.at/Microformats-IRC/2007-04-06#T091456 on 6 April 2007] on the microformats IRC channel, by <kwijibo> as a shorthand abbreviation for [[plain-old-semantic-html]]. A discussion on among John Allsopp, Tantek Çelik, Jeremy Keith, and Chris Messina at the [[events/2007-04-18-web-2-expo-dinner|Microformats Dinner 2007 April 18 following Web 2.0 Expo]] reraised the idea of POSH and the importance of promoting the broader goal of POSH, which microformats are built from and are a proper subset of. For more see [[posh#History|History]].

== 理由 ==
The term [[semantic-html]] is a mouthful, and belies both how simple it is, how well established it is among modern web designers, and the fact that it has benefits far beyond the obvious doing the right thing for the Web by using semantic markup. We need a simple short mnemonic term that captures the essence of the concept, and is easily verbed (to posh, poshify, poshed up).

== POSHとは？ ==
POSHとは、Webページを作成する際に[[semantic-html|意味的なHTML]]を用いることのベストプラクティスを簡潔にあらわしたものです。意味的なHTMLとは、HTML 4.01（またはXHTML 1.0）にある要素と属性のなかで、''[[semantic|表現的]]''ではなく''[[presentational|意味的]]''なものから成るサブセットのこと。POSHを習い理解する最も良い方法は、実践することです。あなたのWebサイトからいちページを選び、[[posh#The_POSH_Checklist|POSHチェックリスト]]を適用してください。[[posh#The_POSH_Process|POSHプロセス]]に則り、そのまま続けてください。POSHについてより詳しく学ぶには、[[posh#Resources|POSHリソース]]をお読みください。

== POSHプロセス ==
What can you do to be POSH and to make your websites POSH?

# Publish POSH content. Read POSH [[posh#Resources|resources]] and make sure your website publishes valid [[semantic-html|semantic (X)HTML]], and uses [[semantic-class-names]] accordingly.
# Spread POSH. Encourage others to be POSH and POSHify their websites by linking to this page.
# Improve POSH. Help us gather resources to enable more people to easily POSHify their websites.

== POSHチェックリスト ==
* The first rule of POSH is that you must [http://validator.w3.org validate] your POSH.
* Second, drop the use of TABLEs for purely presentational purposes, spacer GIFs, and [[presentational-html]] in general.
* Next, fix your [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and Breakfast] markup.
* Eliminate [http://tantek.com/log/2002/11.html#L20021128t1352 Anorexic Anchors].
* Use good [[semantic-class-names]].
* ...

== POSHリソース ==
=== POSHチュートリアル ===
Step by step tutorials to create POSH content or upgrade existing content to POSH.

* [http://westciv.com/style_master/house/tutorials/quick/validation/index.html Validating your css and html] A simple step by step guide to how and why you should validate your markup
* ...

=== POSH関連ブックマーク ===
* Check out the Ma.gnolia [http://ma.gnolia.com/groups/posh POSH Group]

=== POSH関連プレゼンテーション ===
Presentations which explain and advocate concepts and techniques for utilizing semantic HTML. If/when this section gets too big, we can move it to [[posh-presentations]].
* [http://tantek.com/presentations/2003SXSW/stylesheets.html CSS: Between the Style Sheets by Tantek Çelik (2003-03)], specifically, see slides 3-4,6 starting with "Leaving the [http://tantek.com/log/2002/10.html#L20021022t1432 ed & eakfast]", and slide 9 "CSS & the Semantic Spectrum" which provides an overview of the semantic spectrum of (X)HTML tags.
* [http://www.tantek.com/presentations/2004etech/realworldsemanticspres.html real world semantics] (2004-02-11)
* [http://tantek.com/presentations/20040928sdforumws/semantic-xhtml.html Semantic XHTML: Can your website be your API? - Using semantic XHTML to show what you mean] (2004-09-28)
* [http://tantek.com/presentations/2005/09/elements-of-xhtml/ The Elements of Meaningful XHTML] (2005-09-29, first version: [http://tantek.com/presentations/2005/03/elementsofxhtml/ 2005-03-13 at SXSW Interactive]).
* ...
* See also more microformats [[presentations]] in general.

=== POSH関連書籍 ===
Modern web design books which document good semantic HTML practices.
* <cite>[http://www.oreilly.com/catalog/wdnut3/ http://www.oreilly.com/catalog/covers/0596009879_thumb.gif] [http://www.oreilly.com/catalog/wdnut3/ Web Design in a Nutshell, Third Edition]</cite> by Jennifer Niederst Robbins See [http://jenville.com/ Jenville].
* <cite>[http://microformatique.com/book/ Microformats empowering your markup for Web 2.0]</cite> by John Allsopp. Chapter 3 is a detailed and practical overview of the appropriate use of structural, valid and semantic HTML.
* <cite>[http://htmlmastery.com/ http://htmlmastery.com/images/hm-cover-sm.gif][http://htmlmastery.com/ Semantics, Standards and Styling]</cite> by Paul Haine.

=== POSH関連雑誌 ===
Online (and off) magazines which frequently publish articles about semantic HTML. If/when this section gets too big, we can move it to [[posh-magazines]].

* [http://alistapart.com/ A List Apart: For People Making Websites] (see in particular [http://www.alistapart.com/topics/code/htmlxhtml/ HTML and XHTML Articles])
* [http://www.digital-web.com/ Digital Web Magazine]

=== POSH関連ブログ ===
Blogs that with some regularity post high quality discussions, insights, and in general have advanced the state of the art of POSH. If/when this section gets too big, we can move it to [[posh-blogs]].

* [http://dbaron.org/log/current David Baron's weblog]
* [http://zeldman.com/ Jeffrey Zeldman Presents]
* [http://meyerweb.com/ meyerweb.com - Eric Meyer]
* [http://microformatique.com/ Microformatique - John Allsopp]
* [http://simplebits.com/ SimpleBits - Dan Cederholm] (see in particular [http://simplebits.com/bits/simplequiz/ SimpleQuiz])
* [http://tantek.com/ Tantek Çelik]
* ...

=== POSH関連ブログ記事 ===
Blog posts that provide specific, modern, guidance, techniques and tips for using more and better semantic HTML. This list is ''incomplete''. We know there are lots more blog posts out there that fit the aforementioned description - please add them! If/when this section gets too big, we can move it to [[posh-blog-posts]].

* [http://tantek.com/log/2002/10.html#L20021022t1432 Bed and BReakfast markup (B&BR)] (2002-10-22) - avoiding nonsemantic uses of <nowiki>old and eak</nowiki> tags and using <nowiki><h3>adings and aragraphs</nowiki> instead.
* [http://tantek.com/log/2002/11.html#L20021128t1352 <nowiki><A>norexic </A>nchors</nowiki>] (2002-11-28) - use the "id" attribute on existing elements instead of adding empty <code><nowiki><a name="foo"></a></nowiki></code> elements. Use [[rel-bookmark]] for post permalinks within the document.
* [http://tantek.com/log/2002/12.html#L20021216t2238 A Touch of Class] (2002-12-16) - introduction to proper use of the HTML 'class' attribute.
* [http://tantek.com/log/2002/12.html#L20021231t1850 Dive into Semantic MARKup] (2002-12-31)
* [http://tantek.com/log/2003/01.html#L20030104t1249 Comment markup, presentation and plumbing] (2003-01-04) - how to markup a list of comments, including example use of the rare "hreflang" attribute.
* [http://meyerweb.com/eric/thoughts/2004/07/18/competent-classing Competent Classing by Eric Meyer] (2004-07-18)
* [http://tantek.com/log/2004/07.html#d20t2359 More about the 'class' attribute] (2004-07-20)
* [http://www.uie.com/articles/holzschlag_interview/ Web Standards in the Real World: An Interview with Molly Holzschlag] (2005-06-01)
* [http://westciv.typepad.com/dog_or_higher/2005/11/webpatterns_and.html Webpatterns and websemantics] (2005-11-18)
* [http://www.thefutureoftheweb.com/blog/2006/2/writing-semantic-html Writing Semantic HTML by Jesse Skinner] (2006-02-22)
* [http://www.thefutureoftheweb.com/blog/2007/1/who-will-read-your-semantic-html Who will read your Semantic HTML?] by Jesse Skinner (2007-01-04)
* [http://microformatique.com/?page_id=109 Semantics in HTML] by John Allsopp (2007-01-08 - 2007-03-12)
** [http://microformatique.com/?p=83 Part I - Traditional HTML Semantics] (2007-01-08)
** [http://microformatique.com/?p=97 Part II - standardizing vocabularies] (2007-02-20)
** [http://microformatique.com/?p=108 Part III - Towards a semantic web] (2007-03-12)
* [http://microformatique.com/?p=82 Built in HTML semantics] A list of the semantic elements and attributes of HTML by John Allsopp (2007-01-08)
* [http://tantek.com/log/2007/04.html#d20t0823 The Importance of Being POSH] by Tantek Çelik (2007-04-20)
* [http://factoryjoe.com/blog/2007/04/21/getting-back-to-posh-plain-ol-semantic-html/ Getting back to POSH (Plain ol’ Semantic HTML)] by Chris Messina (2007-04-21)
* [http://friedcellcollective.net/outbreak/2007/04/22/im-posh-are-you/ I’m POSH - are you?] (2007-04-23)
* [http://www.unintentionallyblank.co.uk/2007/04/24/plain-old-semantic-html/ The Internet’s Upper Class Or Why Your Site Should Be POSH] (2007-04-24)
* [http://nate.koechley.com/blog/2006/12/15/divitis_and_correct_div_usage/ On Appropriate Use of DIVs, or When Divitis Doesn’t Apply] by Nate Koechley, 2006-12-15
* [http://nate.koechley.com/blog/2006/12/22/note_on_structural_and_semantic_meaning/ Quick Comment: Choose Class/ID Names Based on Semantic and/or Structural Meaning] by Nate Koechley, 2006-12-22
* ...

See [http://technorati.com/search/%22semantic%20HTML%22 more blogs talking about "semantic HTML"] and [http://technorati.com/search/posh+semantic+HTML POSH].

===POSH関連ポッドキャスト===
* [http://www.netmag.co.uk/podcasts/07-05-03-net.mp3 A talk about POSH] in the .Net magazine podcast episode 8 (56 minutes; 26 Mb. Relevant section 30:10-42:40)

=== POSHにまつわる隠れた情報源 ===
The following sites have POSH related articles, tutorials etc. on them, but you have to dig for them from the home page. Help find the hidden POSH treasures in these sites and add ''direct'' links to POSH related articles, tutorials etc. to the specific sections above. You can leave the top level site links here until/unless you have dug thru the entire site and found all the treasures.
* [http://www.w3schools.com/ W3Schools Online Web Tutorials]
* [http://dev.opera.com/ Dev.Opera]

=== POSH Bling for your Blog ===
If you want to improve your existing blog, there are some pretty simple things you can do:

==== WordPress ====
* Use the [http://www.plaintxt.org/themes/sandbox/ Sandbox] or [http://getk2.com K2] themes that already support hAtom and hCard
* Add the [http://redmonk.net/archives/2007/04/18/wordpress-widget-hcard-about-box/ hCard About Widget] to your site

== POSHを広める ==
Now that you've poshified your website(s), what next? Well, help spread POSH to other websites!

* Promote POSH. Make a POSH button (perhaps using semantic HTML and CSS ;) linking to this page and put it on your site, in your blogroll, in your footer, etc. Maybe even come up with a nice POSH button graphic and share it with the microformats community with a liberal license (public domain, CC-by-3.0, MIT, etc.) Like these:
** [http://redmonk.net/archives/2007/04/25/the-new-question/ http://redmonk.net/wp-content/uploads/2007/04/are_you_posh.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
** [http://redmonk.net/archives/2007/04/26/chic/ http://redmonk.net/wp-content/uploads/2007/04/chic_fancy.png] - [http://creativecommons.org/licenses/by/3.0/ CC-by-3.0]
* Tell a friend. Talk to web design friends about POSH and convince and help them to poshify both their personal websites, and the websites they build for others. Blog about your experience with poshification and what steps you went through to poshify your websites. Write a [[posh-testimonial]]!
* Come up with more ideas to help spread POSH. Here are a few.
** Hold a PoshPit - a one or half day marathon session mixing semantic HTML experts with folks who maintain/run web sites in general and see how many websites you can collectively upgrade to POSH during the course of the day.
** ...

== POSHを改善する ==
As you read the [[posh#Resources|POSH resources]] documented here, what other POSH resources did you find? Add them to this page.

With your experience with both poshifying your sites and helping others do so, what have you learned? What kind of [[posh-issues|issues]] did you run into? What questions were commonly asked? What do you feel like you need to more easily and quickly help more people poshify their content?

== 歴史 ==
A brief history of references to "POSH" in this context and "plain old semantic HTML".

=== plain old semantic HTML ===
The earliest references to "plain old semantic HTML" that have been found so far are:
* [http://groups.google.com/group/comp.infosystems.www.authoring.site-design/msg/2373e9043c08cba4 1998-05-01: Kirrily 'Skud' Robert on comp.infosystems.www.authoring.site-design] - "The site is implemented in HTML 4.0 Transitional with style sheets; this means that anyone with an older browser won't get presentational markup, just plain old semantic HTML. "
* [http://www.highrankings.com/advisor/tables-seo/ 2006-09-21 Drew's comment by on "Tables and SEO"]: "I’d say it’s well worth it for a variety of reasons to only use tables when you’re presenting tabular data, and use plain old semantic HTML to mark up your content in all other cases." (retrieved by [[User:Tantek|Tantek]] 08:20, 20 Apr 2007 (PDT))
If you can find earlier references, please ''add'' them and include a brief quotation of the context of the reference to "plain old semantic HTML".

Main Page-ja

2007-05-29T06:44:30Z

Noriyo: /* はじめに */

__NOTOC__
<h1>Microformats Wiki</h1>

'''こんにちは！''' microformats wikiにようこそ。もしこのページを見るのが初めてでしたら、[[introduction-ja|microformatsの手引き]]をご覧ください。

何か編集する前には必ず[[how-to-play-ja]]を読んでください。

新しいmicroformatsを提案する際は、必ず[[process]]を読んでからにしてください。

__TOC__

== はじめに ==

[[what-are-microformats|microformatsとは何でしょう]]？また[[what-can-you-do-with-microformats|microformatsで何ができますか]]？

まずは[http://microformats.org/about/ about page]、そして[http://microformats.org/ latest news]をご覧ください。また最新の[[press-ja|プレス]]や[[presentations-ja|プレゼンテーション]]、さらには[[podcasts|ポッドキャスト]]や[[screencasts|スクリーンキャスト]]もmicroformatsの基礎を理解する手助けになると思います。どれか個別のmicroformatについて手軽に確認したい場合は、[[cheatsheets|早見表（チートシート）]]が便利です。
よくある質問とその答えは[[faq|FAQ]]で、また[[glossary|用語集]]もあります。

microformatsを活用するには、[http://microformats.org/wiki/posh <abbr title="Plain Old Semantic HTML">POSH</abbr>]について知るのもよいアイデアです。{{NewMarker}}

識者からもっと教わりたいことがあれば、[[events|microformatsのイベント]]もありますよ。

== 定義 ==

[http://microformats.org/discuss/ メーリングリスト]([[mailing-lists]])での一般的な定義は、「分散的開発を実現するために用いられる、セマンティクスをHTMLに埋め込む為のシンプルな仕様」です。もう少し細かく説明すると、microformatsは下記のように定義できます。
:分散的開発を実現するために用いられる
::Webにあるリソースそのものや、それを利用するツールやサービスを分散的に処理できるようにします。
:セマンティクスをHTMLに埋め込むための
::それぞれの分野に特化することで、各仕様が小さいものとなります。
:シンプルな仕様
:人間が解読できる(X)HTML/XMLドキュメントやAtom/RSSフィード、そしてプレーンなXMLでの提供
::現存するコンテンツの利用パターンを標準化することからはじめています。
::概略的で説明的なclass名を使い、ソースをみてもわかりやすくなっています。
::現存の相互運用できる規格に基づくことにより、汎用性が高まります。

シンプルに言うと、「microformatsは成文化したコンベンションのことです。」 -- [http://easy-reader.net Aaron Gustafson]

「ブラウザーでWeb巡回しかしないんだ。それはまた20世紀的だね。」 -- [http://diveintomark.org Mark Pilgrim]

== 協力の方法 ==

microformatsをより発展させるためには次のことができます。

*公開されてる [[to-do|to do list]]をチェックし、リストアップされてる事を終わらせるのを手伝ってください。
*[http://microformats.org/discuss mailing lists] と [[irc|IRC Channel]] に参加しマイクロフォーマットに関して質問したり学んだりすることができます。
*[[advocacy|Advocate]] the use of microformats.
*[[Main_Page-ja#.E4.BB.96.E8.A8.80.E8.AA.9E.E3.81.A7.E3.81.AEmicroformats_wiki|他言語でのmicroformats wiki]]を見てください。そして、世界中の人が利用しやすくするためにmicroformats wikiの翻訳を手伝ってください。

== 仕様 ==

以下はオープンスタンダードとなった[[microformats-ja|microformats]]の仕様です。([[implementations|実装]]や[[examples-in-the-wild|実世界での例]]もご覧ください)

* [[hcalendar-ja|hCalendar]] - [http://microformats.org/code/hcalendar/creator hcalendar creator](翻訳中！)
* [[hcard-ja|hCard]] - [http://microformats.org/code/hcard/creator hcard creator](翻訳中！)
* [[rel-license-ja|rel-license]](翻訳完了)
* [[rel-nofollow-ja|rel-nofollow]](翻訳完了)
* [[rel-tag-ja|rel-tag]](翻訳完了)
* [[vote-links-ja|Vote Links]](翻訳完了)
* [http://gmpg.org/xfn/ XFN] ([[xfn-implementations|XFNの実装]]もご覧下さい)
* [http://gmpg.org/xmdp/ XMDP]
* [[xoxo-ja|XOXO]](翻訳中！)

== ドラフト ==

* [[adr|adr]]
* [[geo|geo]]
* [[hatom|hAtom]]
* [[hresume|hResume]]
* [[hreview-ja|hReview]] - [http://microformats.org/code/hreview/creator hreview creator]
* [[rel-directory]]
* [[rel-enclosure]]
* [[rel-home]]
* [[relpayment-research | rel-payment]]
* [[robots-exclusion|Robots Exclusion]]
* [[xfolk|xFolk]]

== デザインパターン ==

{{design_patterns-ja}} 

== Exploratory Discussions ==
Per the microformats [[process]]:
実世界での[[examples|例]]の調査や分析、既に存在するフォーマット、またmicroformatsにできそうなもののブレインストーミングをまとめています。もし何かページを追加した場合、まず[[rejected-formats]]を見てから行ってください。
* alternates [[alternates-brainstorming|alternates brainstorming]], [[alternates-examples|alternates examples]]
*[[attention]]
* blog description [[blog-description-examples|blog description examples]]
* blog info [[blog-info-examples|blog info examples]]
* blog post [[blog-post-examples|examples]], [[blog-post-formats|blog post formats]], and [[blog-post-brainstorming|blog post brainstorming]] (yielded the [[hatom|hAtom]] draft)
* book [[book-examples|book examples]], [[book-formats|book formats]], and [[book-brainstorming|book brainstorming]]
* chat [[chat-examples|chat examples]], [[chat-formats|chat formats]], and [[chat-brainstorming|chat brainstorming]]
* citation [[citation|citation effort]], [[citation-examples|citation examples]], [[citation-formats|citation formats]], [[citation-brainstorming|citation brainstorming]], and [[citation-faq|citation FAQ]]
* code [[code-examples| code examples]], [[code-brainstorming|code brainstorming]]{{NewMarker}}
* comment [[comment-problem|comment problem]], [[comment-examples|comment examples]], and [[comments-formats|comment formats]] (Some stuff needs to be extracted from [[comments-formats]])
* [[collection-description|collection description]] {{NewMarker}}
* [[course-catalog]]; [[course-catalog-examples]] {{NewMarker}}
* [[currency]]; [[currency-examples]]; [[currency-brainstorming]]; [[currency-proposal]]; [[currency-issues]]
* [[depend-examples]]: examples of dependency graphs, especially as they relate to software {{NewMarker}}
* [[digital-signatures]]: incorporation of digital signatures in Microformatted data; ([[digitalsignature-examples|digital-signature examples]], [[digitalsignature-brainstorming|digital-signatures brainstorming]]) {{NewMarker}}
* directions [[directions-examples|directions examples]] {{NewMarker}}
* directory inclusion [[directory-inclusion-examples|directory inclusion examples]], [[directory-inclusion-formats|directory inclusion formats]]. (see also [[rel-directory]])
* distributed conversation [[distributed-conversation|distributed conversation overview]], [[distributed-conversation-brainstorming|distributed conversation brainstorming]], [[distributed-conversation-examples|distributed conversation examples]], and [[distributed-conversation-formats|distributed conversation formats]]
* forms [[forms-examples|forms examples]]
* genealogy [[genealogy-formats|genealogy examples]]
* group [[group-brainstorming|group brainstorming]] and [[group-examples|group examples]]
* hash [[hash-examples|hash examples]]
* items [[items-brainstorming|items brainstorming]] and [[items-examples|items examples]]
* job listing [[job-listing-examples|job listing examples]] and [[job-listing-brainstorming|job listing brainstorming]]
* last modified [[last-modified-examples|last modified examples]], [[last-modified-formats|last modified formats]], and [[last-modified-brainstorming|last modified brainstorming]]
* hListing [[hlisting-proposal|hListing proposal]], and [[hlisting-feedback|hListing feedback]]
** Also, listing [[listing-examples|examples]], [[listing-formats|formats]], and [[listing-brainstorming|brainstorming]]
* [[product|hProduct]] - [[product-brainstorming|hProduct brainstorming]] | [[product-examples|hProduct examples]]
* location [[location-formats|location formats]]. (see also [[adr]] and [[geo]])
* [[luna]] ([[geo]]-like co-ordinates, for places on The Moon) - see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* [[mars]] ([[geo]]-like co-ordinates, for places on the planet Mars)- see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* measures and measurement units [[measure]]
* [[media-info]] ([[media-info-examples|media-info examples]], [[media-info-formats|media-info formats]], [[media-info-brainstorming|media-info brainstorming]])
* meeting minutes [[meeting-minutes-examples|meeting minutes examples]], [[meeting-minutes-formats|meeting minutes formats]], and [[meeting-minutes-brainstorming|meeting minutes brainstorming]]
* metalink [[metalink-examples|metalink examples]] {{NewMarker}}
* microsummary [[microsummary-brainstorming|microsummary brainstorming]]
* [[mfo-examples|MFO examples]]
* music [[music-examples|music examples]]
* photo note [[photo-note-examples|photo note examples]]
*[[question-answer]], [[question-answer-brainstorming]]; [[question-answer-examples]] {{NewMarker}}
* recipe [[recipe-examples|recipe examples]], [[recipe-brainstorming]] {{UpdateMarker}}
* rel-product [[rel-product-brainstorming|rel-product brainstorming]]
* requirements testing [[requirements-testing|requirements testing overview]], and [[requirements-testing-examples|requirements testing examples]]
* [[rest-examples|REST examples]]
* resume [[resume-brainstorming|resume brainstorming]], and [[resume-formats|resume formats]]
* review [[review-examples|review examples]], and [[review-formats|review formats]] (yielded the [[hreview|hReview]] draft)
* search results [[search-results-example|search results example]]
* show [[show-brainstorming|show brainstorming]]
* showroll [[showroll-brainstorming|brainstorming]]
* [[species]] - for the marking up of the scientific names of living things: [[species-examples]]; [[species-brainstorming]] {{UpdateMarker}}
* table [[table-examples|examples]]
* tagspeak [[tagspeak-examples|tagspeak examples]]
* tagcloud [[tagcloud-examples|tagcloud examples]], and [[tagcloud-brainstorming|tagcloud brainstorming]].
* [[thoughts-on-extending-the-geo-microformat|thoughts on extending the geo microformat]], [http://microformats.telemetry.gr examples] {{NewMarker}}
* transit table [[transit-table-examples|transit table examples]]
* [[uid]]
* widget [[widget-examples|widget examples]], and [[widget-brainstorming|widget brainstorming]]
* [[wiki-formats|wiki formats]]
* work of art [[work-of-art|work of art overview]], [[workofart-examples|work of art examples]], [[workofart-formats|work of art formats]], and [[workofart-brainstorming|work of art brainstorming]]
*[[xmdp-brainstorming|XMDP brainstorming]] (see also [[xmdp-faq]])

== 例 ==
* [[examples-in-the-wild]]
* [[implementations]]
* [[zen-garden]]

== ツール、テストケース、リサーチ ==

事例やコードやテストケースを見るために最初に見るべき場所はmicroformatを使ったそれぞれのページです. 二つ以上のmicroformatを使うツールやサービスは少ししかありません. このセクションは複数のmicroformatに関連するエディター、パーサー、妥当性検証ソフト、テストケース、その他情報等のためのものです。

*[[accessibility]]
*[[faqs-for-rdf]]
*[[icalendar-implementations]]
*[[parsing-microformats]]
*[[selected-test-cases-from-the-web]]
*[http://hg.microformats.org/ Source code repository] -- [[mercurial-quick-start|HowTo: Download code from the repository]]
*[[vcard-implementations]], [[vcard-errata]], [[vcard-suggestions]]
*[[why-are-content-standards-hard]]
*[[profile-examples-in-wild|Profile examples, in the wild]]

== 共有ワークスペース ==

* [[buttons]]
* [[icons-ja]] {{NewMarker}}
* [[spread-microformats]] {{NewMarker}}
* [[demo|デモ]] - microformatを試すデモへのリンク集
* [[events]]
* [[to-do]]
* [[user-interface]]
* [[marked-for-deletion]]
* [[microformats-issues]] {{NewMarker}} - 一つ以上のmicroformatに関するissue

== 他言語でのmicroformats wiki ==

microformatsの記事を色々な言語で読んだり編集したりできます。

* 100以上の記事のある言語
** [[Main_Page|English (本家の英語)]]
** [[Main_Page-fr|Francais (フランス語)]] {{UpdateMarker-fr}}
* 10以上の記事のある言語
** [[Main_Page-pt-br| Português (ブラジル系ポルトガル語)]] {{NewMarker-pt-br}}
** [[Main_Page-ja|日本語]]
* 2以上の記事のある言語
** [[Main_Page-es|Espanol (スペイン語)]]
** [[Main_Page-de|Deutsch (ドイツ語)]]

==== 他の場所にあるmicroformatsの翻訳版 ====

いくつかのmicroformatsは、このWiki以外の場所にて翻訳が行われています。もしあなたがその翻訳に関わっていたら、ぜひこのmicroformats wikiで作業しないか考えて頂けると幸いです。
* [http://mikroformate.pbwiki.com/ Deutsch (German) mikroformate.pbwiki.com] {{NewMarker-de}}

=== 他の言語に翻訳するのをお手伝いください！ ===

読みたい記事があなたの読みたい言葉で存在していませんか？それならば是非microformats wikiを翻訳するのにご協力ください！microformats wikiの多言語化については現在も取り組んでいます。

翻訳に際し、まずは[http://en.wikipedia.org/wiki/Wikipedia:Multilingual_coordination Wikipediaにおける多言語版の位置づけ]、そして[http://meta.wikimedia.org/wiki/How_to_start_a_new_Wikipedia 新しいWikipediaを始めるには] をご覧下さい。
一般的なTIPSやアドバイス、このコミュニティの慣習が書いてあります。

実際に翻訳を始めるときは、まず、比較的静的であまり変化がないものを集めた[[stable-pages-ja|静的ページ]]に挙がっているものを少しずつ翻訳していくことから始めましょう。そして、(ページの変更を監視できる)[[Special:Watchlist|ウォッチリスト]]機能を使って英語版と歩調を合わせるとよいでしょう。

翻訳したページの名前: 翻訳したページのページ名は、英語版のページ名の末尾にハイフンに続いてRFC 3066の言語コード付けてください。例えば日本語版では、[[Main_Page]]は[[Main_Page-ja]]に、そして [[how-to-play]]は[[how-to-play-ja]]になります。

=== 要望のある言語はこちら ===

* Chinese: 微格式 (Microformats) (see [http://msittig.blogspot.com/2005/11/since-i-translated-schedule-of.html source of translation])
* Does somebody want to see a Dutch translation???

Main Page-ja

2007-05-28T04:57:21Z

Noriyo: /* はじめに */

__NOTOC__
<h1>Microformats Wiki</h1>

'''こんにちは！''' microformats wikiにようこそ。もしこのページを見るのが初めてでしたら、[[introduction-ja|microformatsの手引き]]をご覧ください。

何か編集する前には必ず[[how-to-play-ja]]を読んでください。

新しいmicroformatsを提案する際は、必ず[[process]]を読んでからにしてください。

__TOC__

== はじめに ==

[[what-are-microformats|microformatsとは何でしょう]]？また[[what-can-you-do-with-microformats|microformatsで何ができますか]]？

まずは[http://microformats.org/about/ about page]、そして[http://microformats.org/ latest news]をご覧ください。また最新の[[press-ja|プレス]]や[[presentations-ja|プレゼンテーション]]、さらには[[podcasts|ポッドキャスト]]や[[screencasts|スクリーンキャスト]]もmicroformatsの基礎を理解する手助けになると思います。Our [[cheatsheets]] are handy if you need a quick reminder about a particular microformat.
よくある質問とその答えは[[faq|FAQ]]で、また[[glossary|用語集]]もあります。

microformatsを活用するには、[http://microformats.org/wiki/posh <abbr title="Plain Old Semantic HTML">POSH</abbr>]について知るのもよいアイデアです。{{NewMarker}}

識者からもっと教わりたいことがあれば、[[events|microformatsのイベント]]もありますよ。

== 定義 ==

[http://microformats.org/discuss/ メーリングリスト]([[mailing-lists]])での一般的な定義は、「分散的開発を実現するために用いられる、セマンティクスをHTMLに埋め込む為のシンプルな仕様」です。もう少し細かく説明すると、microformatsは下記のように定義できます。
:分散的開発を実現するために用いられる
::Webにあるリソースそのものや、それを利用するツールやサービスを分散的に処理できるようにします。
:セマンティクスをHTMLに埋め込むための
::それぞれの分野に特化することで、各仕様が小さいものとなります。
:シンプルな仕様
:人間が解読できる(X)HTML/XMLドキュメントやAtom/RSSフィード、そしてプレーンなXMLでの提供
::現存するコンテンツの利用パターンを標準化することからはじめています。
::概略的で説明的なclass名を使い、ソースをみてもわかりやすくなっています。
::現存の相互運用できる規格に基づくことにより、汎用性が高まります。

シンプルに言うと、「microformatsは成文化したコンベンションのことです。」 -- [http://easy-reader.net Aaron Gustafson]

「ブラウザーでWeb巡回しかしないんだ。それはまた20世紀的だね。」 -- [http://diveintomark.org Mark Pilgrim]

== 協力の方法 ==

microformatsをより発展させるためには次のことができます。

*公開されてる [[to-do|to do list]]をチェックし、リストアップされてる事を終わらせるのを手伝ってください。
*[http://microformats.org/discuss mailing lists] と [[irc|IRC Channel]] に参加しマイクロフォーマットに関して質問したり学んだりすることができます。
*[[advocacy|Advocate]] the use of microformats.
*[[Main_Page-ja#.E4.BB.96.E8.A8.80.E8.AA.9E.E3.81.A7.E3.81.AEmicroformats_wiki|他言語でのmicroformats wiki]]を見てください。そして、世界中の人が利用しやすくするためにmicroformats wikiの翻訳を手伝ってください。

== 仕様 ==

以下はオープンスタンダードとなった[[microformats-ja|microformats]]の仕様です。([[implementations|実装]]や[[examples-in-the-wild|実世界での例]]もご覧ください)

* [[hcalendar-ja|hCalendar]] - [http://microformats.org/code/hcalendar/creator hcalendar creator](翻訳中！)
* [[hcard-ja|hCard]] - [http://microformats.org/code/hcard/creator hcard creator](翻訳中！)
* [[rel-license-ja|rel-license]](翻訳完了)
* [[rel-nofollow-ja|rel-nofollow]](翻訳完了)
* [[rel-tag-ja|rel-tag]](翻訳完了)
* [[vote-links-ja|Vote Links]](翻訳完了)
* [http://gmpg.org/xfn/ XFN] ([[xfn-implementations|XFNの実装]]もご覧下さい)
* [http://gmpg.org/xmdp/ XMDP]
* [[xoxo-ja|XOXO]](翻訳中！)

== ドラフト ==

* [[adr|adr]]
* [[geo|geo]]
* [[hatom|hAtom]]
* [[hresume|hResume]]
* [[hreview-ja|hReview]] - [http://microformats.org/code/hreview/creator hreview creator]
* [[rel-directory]]
* [[rel-enclosure]]
* [[rel-home]]
* [[relpayment-research | rel-payment]]
* [[robots-exclusion|Robots Exclusion]]
* [[xfolk|xFolk]]

== デザインパターン ==

{{design_patterns-ja}} 

== Exploratory Discussions ==
Per the microformats [[process]]:
実世界での[[examples|例]]の調査や分析、既に存在するフォーマット、またmicroformatsにできそうなもののブレインストーミングをまとめています。もし何かページを追加した場合、まず[[rejected-formats]]を見てから行ってください。
* alternates [[alternates-brainstorming|alternates brainstorming]], [[alternates-examples|alternates examples]]
*[[attention]]
* blog description [[blog-description-examples|blog description examples]]
* blog info [[blog-info-examples|blog info examples]]
* blog post [[blog-post-examples|examples]], [[blog-post-formats|blog post formats]], and [[blog-post-brainstorming|blog post brainstorming]] (yielded the [[hatom|hAtom]] draft)
* book [[book-examples|book examples]], [[book-formats|book formats]], and [[book-brainstorming|book brainstorming]]
* chat [[chat-examples|chat examples]], [[chat-formats|chat formats]], and [[chat-brainstorming|chat brainstorming]]
* citation [[citation|citation effort]], [[citation-examples|citation examples]], [[citation-formats|citation formats]], [[citation-brainstorming|citation brainstorming]], and [[citation-faq|citation FAQ]]
* code [[code-examples| code examples]], [[code-brainstorming|code brainstorming]]{{NewMarker}}
* comment [[comment-problem|comment problem]], [[comment-examples|comment examples]], and [[comments-formats|comment formats]] (Some stuff needs to be extracted from [[comments-formats]])
* [[collection-description|collection description]] {{NewMarker}}
* [[course-catalog]]; [[course-catalog-examples]] {{NewMarker}}
* [[currency]]; [[currency-examples]]; [[currency-brainstorming]]; [[currency-proposal]]; [[currency-issues]]
* [[depend-examples]]: examples of dependency graphs, especially as they relate to software {{NewMarker}}
* [[digital-signatures]]: incorporation of digital signatures in Microformatted data; ([[digitalsignature-examples|digital-signature examples]], [[digitalsignature-brainstorming|digital-signatures brainstorming]]) {{NewMarker}}
* directions [[directions-examples|directions examples]] {{NewMarker}}
* directory inclusion [[directory-inclusion-examples|directory inclusion examples]], [[directory-inclusion-formats|directory inclusion formats]]. (see also [[rel-directory]])
* distributed conversation [[distributed-conversation|distributed conversation overview]], [[distributed-conversation-brainstorming|distributed conversation brainstorming]], [[distributed-conversation-examples|distributed conversation examples]], and [[distributed-conversation-formats|distributed conversation formats]]
* forms [[forms-examples|forms examples]]
* genealogy [[genealogy-formats|genealogy examples]]
* group [[group-brainstorming|group brainstorming]] and [[group-examples|group examples]]
* hash [[hash-examples|hash examples]]
* items [[items-brainstorming|items brainstorming]] and [[items-examples|items examples]]
* job listing [[job-listing-examples|job listing examples]] and [[job-listing-brainstorming|job listing brainstorming]]
* last modified [[last-modified-examples|last modified examples]], [[last-modified-formats|last modified formats]], and [[last-modified-brainstorming|last modified brainstorming]]
* hListing [[hlisting-proposal|hListing proposal]], and [[hlisting-feedback|hListing feedback]]
** Also, listing [[listing-examples|examples]], [[listing-formats|formats]], and [[listing-brainstorming|brainstorming]]
* [[product|hProduct]] - [[product-brainstorming|hProduct brainstorming]] | [[product-examples|hProduct examples]]
* location [[location-formats|location formats]]. (see also [[adr]] and [[geo]])
* [[luna]] ([[geo]]-like co-ordinates, for places on The Moon) - see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* [[mars]] ([[geo]]-like co-ordinates, for places on the planet Mars)- see also [[geo-extension-strawman]] a possible implementation {{UpdateMarker}}
* measures and measurement units [[measure]]
* [[media-info]] ([[media-info-examples|media-info examples]], [[media-info-formats|media-info formats]], [[media-info-brainstorming|media-info brainstorming]])
* meeting minutes [[meeting-minutes-examples|meeting minutes examples]], [[meeting-minutes-formats|meeting minutes formats]], and [[meeting-minutes-brainstorming|meeting minutes brainstorming]]
* metalink [[metalink-examples|metalink examples]] {{NewMarker}}
* microsummary [[microsummary-brainstorming|microsummary brainstorming]]
* [[mfo-examples|MFO examples]]
* music [[music-examples|music examples]]
* photo note [[photo-note-examples|photo note examples]]
*[[question-answer]], [[question-answer-brainstorming]]; [[question-answer-examples]] {{NewMarker}}
* recipe [[recipe-examples|recipe examples]], [[recipe-brainstorming]] {{UpdateMarker}}
* rel-product [[rel-product-brainstorming|rel-product brainstorming]]
* requirements testing [[requirements-testing|requirements testing overview]], and [[requirements-testing-examples|requirements testing examples]]
* [[rest-examples|REST examples]]
* resume [[resume-brainstorming|resume brainstorming]], and [[resume-formats|resume formats]]
* review [[review-examples|review examples]], and [[review-formats|review formats]] (yielded the [[hreview|hReview]] draft)
* search results [[search-results-example|search results example]]
* show [[show-brainstorming|show brainstorming]]
* showroll [[showroll-brainstorming|brainstorming]]
* [[species]] - for the marking up of the scientific names of living things: [[species-examples]]; [[species-brainstorming]] {{UpdateMarker}}
* table [[table-examples|examples]]
* tagspeak [[tagspeak-examples|tagspeak examples]]
* tagcloud [[tagcloud-examples|tagcloud examples]], and [[tagcloud-brainstorming|tagcloud brainstorming]].
* [[thoughts-on-extending-the-geo-microformat|thoughts on extending the geo microformat]], [http://microformats.telemetry.gr examples] {{NewMarker}}
* transit table [[transit-table-examples|transit table examples]]
* [[uid]]
* widget [[widget-examples|widget examples]], and [[widget-brainstorming|widget brainstorming]]
* [[wiki-formats|wiki formats]]
* work of art [[work-of-art|work of art overview]], [[workofart-examples|work of art examples]], [[workofart-formats|work of art formats]], and [[workofart-brainstorming|work of art brainstorming]]
*[[xmdp-brainstorming|XMDP brainstorming]] (see also [[xmdp-faq]])

== 例 ==
* [[examples-in-the-wild]]
* [[implementations]]
* [[zen-garden]]

== ツール、テストケース、リサーチ ==

事例やコードやテストケースを見るために最初に見るべき場所はmicroformatを使ったそれぞれのページです. 二つ以上のmicroformatを使うツールやサービスは少ししかありません. このセクションは複数のmicroformatに関連するエディター、パーサー、妥当性検証ソフト、テストケース、その他情報等のためのものです。

*[[accessibility]]
*[[faqs-for-rdf]]
*[[icalendar-implementations]]
*[[parsing-microformats]]
*[[selected-test-cases-from-the-web]]
*[http://hg.microformats.org/ Source code repository] -- [[mercurial-quick-start|HowTo: Download code from the repository]]
*[[vcard-implementations]], [[vcard-errata]], [[vcard-suggestions]]
*[[why-are-content-standards-hard]]
*[[profile-examples-in-wild|Profile examples, in the wild]]

== 共有ワークスペース ==

* [[buttons]]
* [[icons-ja]] {{NewMarker}}
* [[spread-microformats]] {{NewMarker}}
* [[demo|デモ]] - microformatを試すデモへのリンク集
* [[events]]
* [[to-do]]
* [[user-interface]]
* [[marked-for-deletion]]
* [[microformats-issues]] {{NewMarker}} - 一つ以上のmicroformatに関するissue

== 他言語でのmicroformats wiki ==

microformatsの記事を色々な言語で読んだり編集したりできます。

* 100以上の記事のある言語
** [[Main_Page|English (本家の英語)]]
** [[Main_Page-fr|Francais (フランス語)]] {{UpdateMarker-fr}}
* 10以上の記事のある言語
** [[Main_Page-pt-br| Português (ブラジル系ポルトガル語)]] {{NewMarker-pt-br}}
** [[Main_Page-ja|日本語]]
* 2以上の記事のある言語
** [[Main_Page-es|Espanol (スペイン語)]]
** [[Main_Page-de|Deutsch (ドイツ語)]]

==== 他の場所にあるmicroformatsの翻訳版 ====

いくつかのmicroformatsは、このWiki以外の場所にて翻訳が行われています。もしあなたがその翻訳に関わっていたら、ぜひこのmicroformats wikiで作業しないか考えて頂けると幸いです。
* [http://mikroformate.pbwiki.com/ Deutsch (German) mikroformate.pbwiki.com] {{NewMarker-de}}

=== 他の言語に翻訳するのをお手伝いください！ ===

読みたい記事があなたの読みたい言葉で存在していませんか？それならば是非microformats wikiを翻訳するのにご協力ください！microformats wikiの多言語化については現在も取り組んでいます。

翻訳に際し、まずは[http://en.wikipedia.org/wiki/Wikipedia:Multilingual_coordination Wikipediaにおける多言語版の位置づけ]、そして[http://meta.wikimedia.org/wiki/How_to_start_a_new_Wikipedia 新しいWikipediaを始めるには] をご覧下さい。
一般的なTIPSやアドバイス、このコミュニティの慣習が書いてあります。

実際に翻訳を始めるときは、まず、比較的静的であまり変化がないものを集めた[[stable-pages-ja|静的ページ]]に挙がっているものを少しずつ翻訳していくことから始めましょう。そして、(ページの変更を監視できる)[[Special:Watchlist|ウォッチリスト]]機能を使って英語版と歩調を合わせるとよいでしょう。

翻訳したページの名前: 翻訳したページのページ名は、英語版のページ名の末尾にハイフンに続いてRFC 3066の言語コード付けてください。例えば日本語版では、[[Main_Page]]は[[Main_Page-ja]]に、そして [[how-to-play]]は[[how-to-play-ja]]になります。

=== 要望のある言語はこちら ===

* Chinese: 微格式 (Microformats) (see [http://msittig.blogspot.com/2005/11/since-i-translated-schedule-of.html source of translation])
* Does somebody want to see a Dutch translation???

Main Page

2007-05-28T04:45:46Z

Noriyo: /* How to contribute */

Welcome to the microformats wiki!

Please start with the [[introduction]] page and read [[how-to-play]] before making any edits.

__TOC__
==Getting Started==

* First, read up on what it means to be [http://microformats.org/wiki/posh <abbr title="Plain Old Semantic HTML">POSH</abbr>] {{NewMarker}}.
* See the [http://microformats.org/about/ about page], [http://microformats.org/ latest news], plus recent [[press]], [[presentations]], [[books]], [[podcasts]], and [[screencasts]].
* Have questions? Read the [[faq|frequently asked questions]] and see the [[glossary]] for new terms.
* Want to learn more in person? Check out microformats [[events]].

==Definition==
One popular definition from our [http://microformats.org/discuss/ mailing list] (see also: [[mailing-lists]]) is "simple conventions for embedding semantics in HTML to enable decentralized development." More precisely, microformats can be defined as:
:simple conventions
:for embedding semantic markup
::for a specific problem domain
:in human-readable (X)HTML/XML documents, Atom/RSS feeds, and "plain" XML
::that normalize existing content usage patterns
::using brief, descriptive class names
::often based on existing interoperable standards
:to enable decentralized development
::of resources, tools, and services

"Or do you just use your browser to browse? That's so 20th century." -- [http://diveintomark.org Mark Pilgrim]

See more explanations of [[what-are-microformats|what are microformats]], and [[what-can-you-do-with-microformats|what you can do with them]].

== How to contribute ==

Do you want to help take microformats to the next level? You can:

* [[advocacy|Advocate]] the use of microformats.
* Write a [[testimonial]].
* Do something on the [[to-do|to do list]].
* Join the [http://microformats.org/discuss mailing lists] and [[irc|IRC Channel]] to learn and help answer questions about microformats.
* [[Main_Page#microformats_wiki_translations_in_other_languages|Translate this microformats wiki into other languages]] to make microformats globally accessible.
* Find [[orphans|orphaned]] pages, and add links to them.
* Before proposing any new microformats, make sure your website is [[POSH]] and uses existing microformats, and then read the [[process]].

== Specifications ==
[[microformats|Microformats]] open standards specifications (see also: [[implementations]], [[examples-in-the-wild]])
* [[hcalendar|hCalendar]] - [http://microformats.org/code/hcalendar/creator hcalendar creator]
* [[hcard|hCard]] - [http://microformats.org/code/hcard/creator hcard creator]
* [[rel-license]]
* [[rel-nofollow]]
* [[rel-tag]]
* [[vote-links|VoteLinks]]
* [http://gmpg.org/xfn/ XFN] (see also: [[xfn-implementations]])
* [http://gmpg.org/xmdp/ XMDP]
* [[xoxo|XOXO]]

== Drafts ==
* [[adr|adr]]
* [[geo|geo]]
* [[hatom|hAtom]]
* [[hresume|hResume]]
* [[hreview|hReview]] - [http://microformats.org/code/hreview/creator hreview creator]
* [[rel-directory]]
* [[rel-enclosure]]
* [[rel-home]]
* [[rel-payment]]
* [[robots-exclusion|Robots Exclusion]]
* [[xfolk|xFolk]]

== Design Patterns ==

{{design_patterns}} 

== Exploratory Discussions ==
Per the microformats [[process]]: research and analysis of real-world [[examples]], existing formats, and brainstorming to motivate the microformat. Please check [[rejected-formats]] before making additions.

* alternates [[alternates-brainstorming|alternates brainstorming]], [[alternates-examples|alternates examples]]
*[[attention]]
* audio-info ([[audio-info-examples|examples]], [[audio-info-formats|formats]], [[audio-info-brainstorming|brainstorming]], [[audio-info-proposal|proposal]]) - Marking up information and metadata related to audio (speech, music, and sound in general). {{NewMarker}}
* blog description [[blog-description-examples|blog description examples]]
* blog info [[blog-info-examples|blog info examples]]
* blog post [[blog-post-examples|examples]], [[blog-post-formats|blog post formats]], and [[blog-post-brainstorming|blog post brainstorming]] (yielded the [[hatom|hAtom]] draft)
* book [[book-examples|book examples]], [[book-formats|book formats]], and [[book-brainstorming|book brainstorming]]
* chat [[chat-examples|chat examples]], [[chat-formats|chat formats]], and [[chat-brainstorming|chat brainstorming]]
* citation [[citation|citation effort]], [[citation-examples|citation examples]], [[citation-formats|citation formats]], [[citation-brainstorming|citation brainstorming]], and [[citation-faq|citation FAQ]]
* code [[code-examples| code examples]], [[code-brainstorming|code brainstorming]] {{NewMarker}}
* comment [[comment-problem|comment problem]], [[comment-examples|comment examples]], and [[comments-formats|comment formats]] (Some stuff needs to be extracted from [[comments-formats]])
* [[collection-description|collection description]] - for describing collections in libraries {{NewMarker}}
* [[course-catalog]]; [[course-catalog-examples]] {{NewMarker}}
* [[currency]]; [[currency-examples]]; [[currency-brainstorming]]; [[currency-proposal]]; [[currency-issues]]
* [[depend-examples]]: examples of dependency graphs, especially as they relate to software {{NewMarker}}
* [[digital-signatures]]: incorporation of digital signatures in Microformatted data; ([[digitalsignature-examples|digital-signature examples]], [[digitalsignature-brainstorming|digital-signatures brainstorming]]) {{NewMarker}}
* directions [[directions-examples|directions examples]] {{NewMarker}}
* directory inclusion [[directory-inclusion-examples|directory inclusion examples]], [[directory-inclusion-formats|directory inclusion formats]]. (see also [[rel-directory]])
* distributed conversation [[distributed-conversation|distributed conversation overview]], [[distributed-conversation-brainstorming|distributed conversation brainstorming]], [[distributed-conversation-examples|distributed conversation examples]], and [[distributed-conversation-formats|distributed conversation formats]]
* forms [[forms-examples|forms examples]]
* file-format ([[file-format-examples|examples]], formats, brainstorming) - for the mark-up of file format information (size, type, codecs, bitrate, etc.) {{NewMarker}}
* genealogy [[genealogy-formats|genealogy exploration]]
* geo extensions
** [[geo-extension-strawman]] - extend geo for moons, other planets, etc.
** [[geo-elevation-examples]] - extend geo for representing altitude {{NewMarker}}
** [[geo-waypoint-examples]] - extend geo for representing routes and boundaries, using waypoints {{NewMarker}}
* group [[group-brainstorming|group brainstorming]] and [[group-examples|group examples]]
* grouping ([[grouping-examples|examples]], [[grouping-formats|formats]], [[grouping-brainstorming|brainstorming]], [[grouping-proposal|proposal]]) - Metadata markup of items that should be grouped together. {{NewMarker}}
* items [[items-brainstorming|items brainstorming]] and [[items-examples|items examples]]
* hash [[hash-examples|hash examples]]
* job listing [[job-listing-examples|job listing examples]] and [[job-listing-brainstorming|job listing brainstorming]]
* last modified [[last-modified-examples|last modified examples]], [[last-modified-formats|last modified formats]], and [[last-modified-brainstorming|last modified brainstorming]]
* hListing [[hlisting-proposal|hListing proposal]], and [[hlisting-feedback|hListing feedback]]
** Also, listing [[listing-examples|examples]], [[listing-formats|formats]], and [[listing-brainstorming|brainstorming]]
* [[product|hProduct]] - [[product-brainstorming|hProduct brainstorming]] | [[product-examples|hProduct examples]]
* [[htodo|hToDo]]
* location [[location-formats|location formats]]. (see also [[adr]] and [[geo]])
* measures and measurement units [[measure]]
* [[media-info]] ([[media-info-examples|media-info examples]], [[media-info-formats|media-info formats]], [[media-info-brainstorming|media-info brainstorming]]) {{UpdateMarker}}
* meeting minutes [[meeting-minutes-examples|meeting minutes examples]], [[meeting-minutes-formats|meeting minutes formats]], and [[meeting-minutes-brainstorming|meeting minutes brainstorming]]
* metalink [[metalink-examples|metalink examples]] {{NewMarker}}
* microsummary [[microsummary-brainstorming|microsummary brainstorming]]
* [[mfo-examples|MFO examples]]
* music [[music-examples|music examples]] {{UpdateMarker}}
* [[operating-hours]]: [[operating-hours-examples]] ..of stores, restaurants, etc. {{UpdateMarker}}
* [[payment]]
* photo note [[photo-note-examples|photo note examples]]
*[[question-answer]], [[question-answer-brainstorming]]; [[question-answer-examples]] {{NewMarker}}
* recipe [[recipe-examples|recipe examples]], [[recipe-brainstorming]] {{UpdateMarker}}
* rel-product [[rel-product-brainstorming|rel-product brainstorming]]
* requirements testing [[requirements-testing|requirements testing overview]], and [[requirements-testing-examples|requirements testing examples]]
* [[rest-examples|REST examples]]
* resume [[resume-brainstorming|resume brainstorming]], and [[resume-formats|resume formats]]
* review [[review-examples|review examples]], and [[review-formats|review formats]] (yielded the [[hreview|hReview]] draft)
* search results [[search-results-example|search results example]]
* show [[show-brainstorming|show brainstorming]]
* showroll [[showroll-brainstorming|brainstorming]]
* [[species]] - for the marking up of the scientific names of living things: [[species-examples]]; [[species-brainstorming]] {{UpdateMarker}}
* table [[table-examples|examples]]
* tagspeak [[tagspeak-examples|tagspeak examples]]
* tagcloud [[tagcloud-examples|tagcloud examples]], and [[tagcloud-brainstorming|tagcloud brainstorming]].
* transit table [[transit-table-examples|transit table examples]]
* [[uid]]
* widget [[widget-examples|widget examples]], and [[widget-brainstorming|widget brainstorming]]
* [[wiki-formats|wiki formats]]
* work of art [[work-of-art|work of art overview]], [[workofart-examples|work of art examples]], [[workofart-formats|work of art formats]], and [[workofart-brainstorming|work of art brainstorming]]
*[[xmdp-brainstorming|XMDP brainstorming]] (see also [[xmdp-faq]])
*[[realestate-propertydetail|realestate-propertydetail brainstorming]]

== Examples ==
* [[examples-in-the-wild]]
* [[implementations]]
* [[zen-garden]]

== Tools, Test Cases and Additional Research ==

The first place to look for examples, code, and test cases is in the pages for each individual microformat. There are only a few cross-cutting tools and services that need to process more than one microformat. This section is intended for editors, parsers, validators, test cases, and other information relevant across multiple microformats.

*[[accessibility]]
*[[faqs-for-rdf]]
*[[icalendar-implementations]]
*[[internationalization]]
*[[parsing-microformats]]
*[[selected-test-cases-from-the-web]]
*[http://hg.microformats.org/ Source code repository] -- [[mercurial-quick-start|HowTo: Download code from the repository]]
*[[vcard-implementations]], [[vcard-errata]], [[vcard-suggestions]]
*[[why-are-content-standards-hard]]
* [[profile-examples-in-wild|Profile examples, in the wild]]

== resources ==
* [[buttons]]
* [[icons]]
* [[spread-microformats]]
* [[demo]] - a page with links for quickly demonstrating microformats working in practice.
* [[events]]
* [[user-interface]]
* [[shortcuts]] to wiki pages with long names
* [[marked-for-deletion]]
* [[spellcheck|spell-check dictionary]]
* [[cheatsheets]] are handy if you need a quick reminder about a particular microformat.

== shared work areas ==
* [[to-do]]
* [[microformats-issues]] - issues related to more than one microformat.
* [[external-issues]]

== microformats wiki translations in other languages ==
You may read and edit microformats articles in many other languages:

* languages with over 100 articles
** [[Main_Page-fr|Français (French)]] {{UpdateMarker-fr}}
* languages with over 10 articles
** [[Main_Page-pt-br| Português (Brazilian Portuguese)]]
** [[Main_Page-ja|日本語 (Japanese)]]
* languages with over 2 articles
** [[Main_Page-es|Español (Spanish)]]
** [[Main_Page-de|Deutsch (German)]]
** [[Main_Page-ro|Romanian]]

See also [[other-languages]], and [[how-to-start-new-translation|how-to-start-a-new-translation]].