So what’s new?
Quite a bit! The next few sections explain what I changed and why I changed it.
The basics
I started by removing elements that have been deprecated from the HTML 5 specification, like <acronym>, <center> and <big>. (We’ll cover deprecated elements in more detail in another post). I also added new HTML 5 elements, like and, in order to remove any default padding, margin, and borders. I’ve also added an explicit display:block property for elements that are required to render as blocks.
何が変わった？
色々だ！ この後のいくつかの項では、何が変更されたのか、なぜ変更されたのかについて説明しよう。
基本的な事柄
私は HTML5 仕様で非推奨となった要素の削除から始めた。<acronym>、<center>、<big> のような要素だ (他の非推奨の要素については別の記事で詳しく述べる)。そして、HTML5 の新しい要素を追加してデフォルトのパディング、マージン、ボーダーを削除するようにした。さらに、ブロックとしてレンダリングされる要素のために明示的な display:block プロパティ も追加した。
I also removed the explicit unstyling of the :focus pseudo-class. There are two reasons for this. First, by declaring outline:0, you remove the focus identifier for keyboard users. Second, Eric released his stylesheet in good faith that people would explicitly style :focus, but they generally don’t, so it’s safer to leave the default :focus styles in place. (I also set defaults for <ins>, since I don’t think that got updated very often either.)
I’ve left the default list styles in place simply as a personal preference. I tend to add the list style back when using Eric’s reset anyway. I have, however, included nav ul {list-style:none;} to remove those pesky bullets from your navigation.
また、:focus 擬似クラスの明示的なスタイル解除は削除した。これには理由が 2つある。1つめに、outline:0 を宣言すると、キーボードを使うユーザーのためのフォーカスが見えなくなってしまうこと。2つめに、Eric がリリースしたスタイルシートでは、みんなが :focus のスタイルを明示的に指定してくれることを期待していたが、普通はそうではないので、:focus スタイルはデフォルトのまま置いておくのが安全だということだ (私は <ins> もデフォルトにしたが、これはそんなに頻繁にアップデートをしてもらえるとは思えないからだ)。
個人的な好みから、リストのスタイルについてもデフォルトのままにした。Eric のリセットスタイルシートを使うときにはリストのスタイルに手を入れることが多くなってしまう。でも、ナビゲートの邪魔になる黒丸を消すための nav ul {list-style:none;} は入れておいた。
Using attribute selectors
You’ll notice that I’ve included attribute selectors for <abbr> and <dfn>. This way, the style will only appear if there is a title attribute on the element. This is primarily for accessibility. For example, we use <abbr> regularly on this site but don’t always include a title attribute. We think it’s safe to assume all of our readers (no matter what device they’re using) know what HTML stands for. We do still use the <abbr> element to make sure screen readers read the text as H-T-M-L rather than struggling to pronounce “HTML”.
属性セレクタの利用
<abbr> と <dfn> に属性セレクタを入れておいたのに気づくと思う。このスタイルは、要素に title 属性が指定されている場合にのみ有効になる。これは主にアクセシビリティーのためだ。例えば、私たちはこのサイト上で <abbr> をよく使うが、title 属性は指定していない。すべてのリーダー (どんなデバイスを使っているかに関わらず) が HTML 標準に従っていると仮定するのが無難だとは思うが、それでも私たちは、スクリーンリーダーが「HTML」を発音しようと奮闘することなく エイチ・ティ・エム・エル と発音できるよう、<abbr> を使う。
What’s that bit about mark?
<mark> is a new element introduced in HTML 5 used to (you guessed it) mark text in a document. According to the spec: "“The mark element represents a run of text in one document marked or highlighted for reference purposes, due to its relevance in another context.”". I anticipate it will be used for highlighting phrases in search results and other similar purposes. We’ll post more on <mark> soon.
mark については？
<mark> は HTML 5 で登場した新しい要素だ。(想像通り) 文書中のテキストをマークするために使われる。仕様によると、「mark 要素は、他の文脈との関連を示すために、参考としてマークまたはハイライトされた文書中の一連のテキストを表現する」とある。これは検索結果のフレーズをハイライトするとかそういった目的に利用されるだろうと私は予想している。<mark> については間もなく詳しい記事を投稿する。
Where are all those application elements?
Application elements is a term I’ve loosely used to describe elements like menu, etc. These elements are more likely found in web apps than web sites. I left these out since, at the time of writing, browsers implement barely any of what was “Web Applications 1.0″. Also, this stylesheet is intended primarily for authors serving their pages as text/html, not XML.
Go grab it
The stylesheet is released under a Creative Commons license, so you can use it for both personal and commercial work. I thought I’d let Google take care of the hosting, so go grab it from Google Code and let us know about any improvements you make!
アプリケーション関連の要素については？
アプリケーション関連の要素は、私がメニューなどを作るためにいい加減に使ってきた要素についての問題だ。これらの要素は、ウェブサイトというよりもウェブアプリケーションにおいてよく見られる。ブラウザが辛うじて実装する、この「Web アプリケーション 1.0」を、記事を書く際、私は放置してきた。それに、このスタイルシートは主に作者が text/html としてページを提供することを意図しており、XML 向けではない。
手に入れよう
このスタイルシートはクリエイティブ・コモンズのライセンスでリリースされており、私的にも商用としても利用できる。私はこれを Google でホスティングするつもりなので、Google Code からこれを入手し、あなたが施した改善を私たちにも教えて欲しい！
