1.1 変化させる必要のあるプロパティ値には
emもしくは%を使用する
1.2 変化させる必要のないプロパティ値には
pxを使用する
h1やh2、h3等の見出しに画像、文章部分はテキストとしてemや%を使用している事が多くみかけられる。
美しく、一見親切のようであるが、ブラウザで文字の大きさをコントロールしても画像を使った見出しの文字サイズは変わらない。アンバランスである。
見出しが読めなくても良いのか。重要であるからこそh1やh2でマークアップするのではないか...
シックス・アパート株式会社は、米シックス・アパート（Six Apart, Ltd.）の日本法人です。
米シックス・アパート社は米カリフォルニア州サンフランシスコに本社を置き、ブログ・ツール「Movable Type（TM）」と統合ブログ・サービス「TypePad（TM）」を提供するブログ技術のリーディング・カンパニーです。
またもプレゼントが送ってきた。ありがとうございました。
mixiのXHTML・CSS関連コミュニティでもたまに語られる【dl要素】は様々な使い方がされている。アットスタイルやBlogStyleでも積極的に使用している。
XHTML+CSS (r)evolution: dl要素の応用例、ご意見募集でも数件の利用方法がコメントがされ、その後のXHTML+CSS (r)evolutionでもプレゼンされている。
プレゼン資料（XHTML+CSS (r)evolution スライド）によると
h1-h6要素はページ全体から見た文脈上の見出しでしかないため、個別的・直接的な見出しをdt要素で示し、対応する内容をdd要素で示す方法が好んで使われる。dt要素の子要素にはテキスト/インライン要素しか置けないが、dd要素の子要素にはさらにブロックレベル要素も置ける。この内容モデルの自由さが多目的利用のひとつの理由に。dl要素はtable要素の使用を避ける目的でも使われる。th要素をdt要素に、td要素をdd要素になぞらえる。
DTDを見てみる
<!-- definition lists - dt for term, dd for its definition -->
<!ELEMENT dl (dt|dd)+>
<!ATTLIST dl
%attrs;
>
<!ELEMENT dt %Inline;>
<!ATTLIST dt
%attrs;
>
<!ELEMENT dd %Flow;>
<!ATTLIST dd
%attrs;
>接尾演算子に注目
(dt|dd)+であるため、順序には関係なくdtまたはddのいづれか一方が1回以上出現すればよい
あるサイトを見て最近気になったのが、以下の例
<dl>
<dd>
<pre>(ソースコード)</pre>
</dd>
<dt>(タイトル)</dt>
</dl>dtより先にddが出現している。DTDから考えると間違いではないが、文書の構造的にはおかしくはないか...
1月22日追記：記事を一部修正いたしました。
Blogのタイトルを変更しました。
以前から気になっていまして、Googleで検索すると、「もしかして：Webmaster」と聞き返してくるんです。
神様が言うことは間違いない（？）。英語じゃ「Web Master」とは言わないので、「Web Master」自体が間違っていたんですが…
【Web Master @Style】から【Webmaster@Style】です。よろしくお願いいたします。
シックス・アパート、家族でも使える安心な無料ブログ・サービス「Vox」にグループ機能「Voxグループ」を追加し、さらに機能強化
ブログ・ソフトウェア大手のシックス・アパート株式会社（本社：東京都港区、代表取締役：関 信浩）は、2007年1月16日、個人向け無料ブログ・サービス「Vox（ヴォックス）」に公開範囲の制限ができるグループ機能「Voxグループ」を追加しました。
今回追加される「Voxグループ」は、通常のVoxブログでの閲覧制限とは別に３段階の公開範囲が設定できる“グループ”を作成し、記事や画像などのアイテムを複数人数で共有できるサービスです。Voxブログと組み合わせることで、記事・画像単位で公開・共有範囲を自在に設定することが可能になります。
詳しくは「今日のコラム：Voxにインターネットの未来を見た」を読むと解りやすい。
Voxの情報は去年6月のMovableTypeセミナーで聞いていた。ベータの招待が始まってすぐに申し込んだ。最近になってちょこちょことエントリーしている。
私のVox、http://atstyle.vox.com/
本日、Voxストラップも入手し、私、浮かれています…
IS0 8601やW3Cで日付及び時間のフォーマットは以下のような表記方法がある。
Different standards may need different levels of granularity in the date and time, so this profile defines six levels. Standards that reference this profile should specify one or more of these granularities. If a given standard allows more than one granularity, it should specify the meaning of the dates and times with reduced precision, for example, the result of comparing two dates with different precisions.
The formats are as follows. Exactly the components shown here must be present, with exactly this punctuation. Note that the "T" appears literally in the string, to indicate the beginning of the time element, as specified in ISO 8601.
Year:
YYYY (eg 1997)
Year and month:
YYYY-MM (eg 1997-07)
Complete date:
YYYY-MM-DD (eg 1997-07-16)
Complete date plus hours and minutes:
YYYY-MM-DDThh:mmTZD (eg 1997-07-16T19:20+01:00)
Complete date plus hours, minutes and seconds:
YYYY-MM-DDThh:mm:ssTZD (eg 1997-07-16T19:20:30+01:00)
Complete date plus hours, minutes, seconds and a decimal fraction of a
second
YYYY-MM-DDThh:mm:ss.sTZD (eg 1997-07-16T19:20:30.45+01:00)
アットスタイルのトップページにはこのブログのRSS（index.rdf）を取得して最新エントリーの概要を表示している。しかしIS0 8601のフォーマット（例：2007-01-17T00:47:27+09:00）となっており音声ブラウザで適切に表現できない。
index.rdfの日付及び時間フォーマットは以下の通り
<$MTEntryDate format="%Y-%m-%dT%H:%M:%S" language="en"$><$MTBlogTimezone$>RSSの日付フォーマットは変更できない。新しいインデックステンプレートを作成しincludeすれば代替可能である。早速、作ってみた
<MTEntries lastn="1">
<h3><$MTBlogName encode_html="1"$> 最新記事</h3>
<h4><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a> (<$MTEntryDate format="%x"$>)</h4>
<p><$MTEntryExcerpt$> <a href="<$MTEntryPermalink$>" title="<$MTEntryTitle$>">続きを読む</a></p>
</MTEntries>しかしアットスタイルの文字コードはShift-JISであるのでブログのファイルをincludeできない。UTF-8に移行する時期なのでしょうか...
ここ2ヶ月くらいアクセス数が低迷しており、Alexa Traffic Rankが47,000くらいまで落ち込んでいた。1月になり多少取り戻しているみたいで、3 mos. Avg.が40,141、3 mos. Changeがアップ2,382になっていた。Page Views per userも3 mos. Avg.：19.1と莫大な数字である。
なんとAlexa 世界ランキングの日本語部門では947位である。「MovableType テンプレート」をメインのキーワードと考えている為、「Movable Type テンプレート」や「MT テンプレート」で検索されても検索結果に現れていなかったが、最近では上位表示されるようになった。
テンプレートの数も増え、このブログの方向性も見えてきた。やはりSEOはテクニックではない、コンテンツ次第なのである。
情報を公開し、共有しよう－ 住 太陽の『トリックに頼らない本当のSEO』 第１回
実のところ、検索エンジンを通じたトラフィックを増やすために最も効果的な施策は「公開している情報量を増やす」ということです。筆者の経験した範囲内では、情報量を2倍にすれば、必ず2倍以上のトラフィックを誘導できます。もともと100ページで構成されていたサイトを200ページに増やすだけで、検索からのトラフィックは2倍以上になり、ページビューも2倍以上になります。
特に最近はSEO効果の高いテンプレートへのカスタマイズとのご相談を受けることが多いが、「コンテンツとキーワード次第ですよ」と回答する...
エキスパート連載コラム / 実践ノウハウ － Webアクセシビリティポータルサイト『infoaxia(インフォアクシア)』
アクセシビリティ、Web標準（Webスタンダード）、SEO（検索エンジン最適化）、ライティング、それぞれの第一人者の皆さんによる連載コラムです。"木を見て森を見ず" にならないように、アクセシビリティを関連するキーワードとあわせて考えてみましょう。
エキスパート連載コラム / 実践ノウハウ － Webアクセシビリティポータルサイト『infoaxia(インフォアクシア)』
植木 真・大藤 幹・住 太陽・益子貴寛・木達一仁の4名による連載コラム。
ここ数年のキーワードとして "SEO（検索エンジン最適化）" というのがあります。そして、さらにもう一歩引いてみると、"Web標準（Webスタンダード）" というキーワードがあるのです。昨今のサイト運営において無視することのできないこれらのキーワードは、一見するとアクセシビリティとは何の関係もなくバラバラの点のように見えます。しかし、アクセシビリティとSEOには共通点が多くあり、さらにこれらはWeb標準の構成要素でもあるのです。つまり、それぞれが相互に関連しあっており、その関連性の中でそれぞれを考えていくことが大切です。
タイトルと引用部分だけで全てが言い尽くされているのかもしれません。
TinyMCE2.0.8の日本語書体追加等の修正済差替ファイルが公開されている。しかし、ダウンロード数（2007年1月15日現在）はTinyMCE-for-mtの 1306に比べ、54と少数である。
アクセシビリティを考える上ではフォントサイズを固定しないことは必須であるため、%での指定が出来るこの機能はぜひ組み込みたい。
＊デフォルトテンプレートをご使用の場合、ピクセルでのフォントサイズ指定が行われています。Internet Explorer 6での文字の大きさが変更できない為、StyleCatcherで可変文字サイズのスタイルシートに変更することをお勧めします。
この修正はTinyMCE2.0.8の本体を独自にコアハックをおこなったもので、修正済ファイルを既存ファイルと差し替えることにより、W3C勧告に準拠した正しいXHTML表現とアクセシビリティを高め、ブログやWebの表現力を高めることができる。
TinyMCE Japanリリースファイル・リストからtiny_mce.zipを選らんでダウンロード解凍して、既存の同名ファイルと差し替えるだけで完了。
TinyMCE Japan よりtiny_mce.zipをダウンロード。
ダウンロードしたファイルを解凍するとできる「tiny_mce」ディレクトリ中の 中身をMovableTypeがインストールされているディレクトリ中の同じ名前のディレクトリにアップロードする。
tiny_mce
└tiny_mce.js
└tiny_mce_src.js
└themes
└advanced
└editor_template.js
└editor_template_src.js
まず、mt-static/TinyMCEforMT/js/tiny_mceディレクトリへ以下の2つのファイルをアップロードする
更にmt-static/TinyMCEforMT/js/tiny_mce/themes/advancedディレクトリへ以下の2つのファイルをアップロードする
完了したエントリー画面
書体指定
文字サイズ指定
注意：必ず今日の開発：TinyMCE書体関係のハック公開および、TinyMCE2.08用日本語書体追加等のハック済み差替ファイル公開を確認し作業を行ってください。
私のブログのエントリータイトルはどれも短い。
一年前の2006年1月、ある企業の社長とお会いした際に「ブログのエントリータイトルに文章を書くな」とおっしゃっていたのが印象に残っているからだ。その方のブログは今も文章ではなく単語などの極短いエントリータイトルである。
タイトル自体がそのものずばりの「検索キーワード」となり得る…
textareaには入力を解りやすくする為に何かテキストを記述しておくべきですが、入力する時点で表示されたテキストを削除する必要があります。これはコメントをいただく際に非常に面倒な作業となります。
イベントハンドラ（onfocus・onblur）を使ってMovableTypeのコメントフォームをちょっとかっこよくしてみます。
<textarea id="comment-text" name="text" rows="15" cols="50" tabindex="5" accesskey="t" onfocus="if(this.value=='Leave your comment here.'){this.value='';}" onblur="if(this.value==''){this.value='Leave your comment here.';}">Leave your comment here.</textarea>このブログで実装しています
id・name・tabindex・accesskeyはご自身の環境に合わせて変更してください。
1月16日追記
Open MagicVox.netのぴろりさんよりご指摘いただきました。上記リソースを参考に以下のように修正いたしました。
<textarea id="comment-text" name="text" rows="15" cols="50" tabindex="5" accesskey="t" onfocus="(t=this).def_value||(t.def_value=t.value);t.def_value==t.value&&(t.value='');" onblur="(t=this).value==''&&(t.value=t.def_value);">Leave your comment here.</textarea>重要 【MovableType 3.3用 テンプレート @Style2.0バージョン】および【MovableType 3.2以降 テンプレート @Style2.0バージョン】に付属するメールフォームについてのお願い
アットスタイルにて稼動しておりましたメールフォームcgi及びjsを削除いたしました。フォーム内のパスを変更せずアットスタイルにて稼動しておりましたcgi・jsを使用されている場合には、送信がエラーとなり指定したメールアドレスにメールは届きません。
以下を参考に編集してご利用ください。
<!-- [POINT]メールフォームのmailform.jsまでのパスを記入します。-->
<script type="text/javascript" src="設置ディレクトリのパス（http://から）/mailform/mailform.js"></script>
<!-- [POINT]actionにメールフォームのsend.cgiまでのパスを記入します。-->
<div class="form"><form name="mailform" id="mailform" method="post" action="設置ディレクトリのパス（http://から）/mailform/send.cgi" onsubmit="return sendMail(this.name);">よろしくお願いいたします。
とうとうメインブラウザをFirefox 2.0.0.1にアップグレードした。
動作がなんだかもっさりしている。レンダリングに時間がかかり、タブを閉じる際に一瞬動作が止まる。
こんなはずじゃない…
オプション等をいじってみたのですが効果なし。思い余って、アドオン（拡張機能）を無効にしてみる。About This Siteを外した途端、きびきび動く。Firefox 2.0.0.1との相性はあまり良くない様です。心配していたXSLTもFeed with Stylesheetを利用して、サイトの制作者に敬意を払ってみる。
それにしても、Internet Explorerはいつアップグレードするか…
サイト及びテンプレートご利用の皆様に支えられて、2006年はテンプレート出荷200本を数えました。
今年はさらにより良い商品をお目に掛けたいと思っております。どうぞ、ご利用下さいますよう、お願い申し上げます。
平成十九年元旦
アットスタイル 柳 泰久