CSS着せ替えテンプレートプロジェクト二代目管理人の希さん(alevirita)のブログでCDPver.2ネタを拝見しました。
本当にCDPver.2が出るのかネタなのか分かりませんが、CDP2というカテゴリーがあるので出るのでしょうか。前者であれば公式サイトで発表があるでしょうから待て次号です。私も基礎htmlを見ながら改善点を考えてみました。ぱっと思いついたのは以下です。
title要素は「ページタイトル < サイト名」にするtitle要素をパンくずリスト的な使い方をしているサイトを見かけます。閲覧している時はいいのですが、ブックマークに登録した時に不便です(ページタイトルが表示されないことがあるため)。なので、パンくずリスト使い方をしたい場合は逆パンくず(ページタイトル < コンテンツ名 < サイト名)にするといいと思います。class="modori"に前のページに戻るリンクを追加重箱の隅つつき的要望の数々。ver.2どころか、ver.1.1という感じで元と殆ど変わりません。他には「h1をページタイトルにする」、「div要素を減らす」、「パンくずリスト不要?」、「サブメニューの是非」など思うことはあるのですが、上記が改善されれば概ね満足です。
h1はページタイトルの方が好みですがそうすると字数が不定になるのでデザインがしにくくなる、div要素を減らせば文書構造がすっきりしますがデザインがしにくくなる、サブメニューは局地的需要がありそうですがデザインが(略)。デザインが内容を制約する典型的パターンですが、配布テンプレートなのでその辺の妥協は仕方ないと思っています。利用者のレベルもまちまちですし、複雑化すると作り手としても対応が面倒なので。
わたしたちはweb制作になれていないユーザーが、できるだけ使いやすいように、シンプルな構造のテンプレートを目指しました。複雑なものや初心者では理解しがたいと思われるものは出来るだけ削り、本当に必要なものだけを残しました。しかし同時にCSS制作者が意図したデザインを作り出しやすいように、いくつかの、文法的には邪魔とも言える記述がなされています。
CDPは利用者に分かりやすく、CSS作成者にもデザインしやすい妥協点のバランスが好きです。「CDPがなかったらテンプレート配布サイトは作っていませんでした!!」と感嘆符をつけて断言できるくらい。好みの関係で気になるマークアップもありますが、基礎HTMLはValidなので特に文句はありません。
意見要望あればメールで。
とのことですので、意見要望があれば希さんへどうぞ。ネタにしておいて何ですが、私は現状維持派です。
最近、h1タグをサイト名にするか否かというのをよく聞きますが、坂取さんはどうお考えですか?
というメッセージをいただきました。そう言えば去年そんな話題があったなーと見出し要素に関する議論(徒委記)を読んでいました。全ての記事に目を通していませんが、このサイトの方向性は、
heading要素は1から順番に用いるh1要素はbody要素の直下に1つだけ配置するtitle要素とh1要素にページタイトル必須です。h1要素はページタイトルだけですが、title要素は「ページタイトル|AZ store」というふうにサイト名も入っています。例により自分ルールなので他所では通用しません。
「h1(他の数値からから始まる場合はそれが)は最も重要な見出し」、「最も重要な見出しにすべき内容に関しての記述なし」、「h1は複数回出現OK」、「h1から使う必要はない」、「順番を飛ばしてもOK」、「そもそもheadingは必須でない」など、どの仕様書においてもheading要素に関する記述は曖昧です。勘違いがあるかもしれませんが、大体こんな感じだったと記憶しています。
現時点で見出しに関して厳しい制限があるのはISO-HTMLだけです(「必ずh1から順番に使う」、「heading要素は本文中において親要素を持つことができない」など)。そのISO-HTMLでもheading要素は必須ではないので、title要素にタイトルがあれば、h1要素の内容は自由だと考えます。
というわけで、サイト名が最も重要だと思う人はサイト名をh1タグで括ればいいし、タイトルが最も大切だと思う人はタイトルをh1タグで括ればいいと思います。ただ、title要素は必須なので、そこにはきちんとタイトルを書きましょう。h1要素≠ページタイトルですが、title要素=ページタイトルです、多分。【完】
しかし仕様に依らない批判は単なる言いがかりと分かっていても、全ページh1要素がサイト名のサイトに違和感があるのも事実です。マークアップにも好みがあるので。
理由は自分のサイト名とURIにあります。このサイトの名前はAZ storeで、URIはhttp://az-store.nrym.org/です。この時点でタイトルバーとアドレスバーにサイト名が表示されています。これに加えて見出しまでサイト名だと、サイト名出すぎ!と思ってしまうわけで…。URIはサイト名が表示されたことにならないでしょうが、管理人である私が気になるので見出しにサイト名を使いません。
ブラウザのデフォルトスタイルシートを適応させると、h4以下の文字の大きさが本文のと同じか、それより小さくなってしまうのは何故?という疑問が昔からありました。先ほど改めてIE/Fx/Opera/Safariの最新版で確認しましたが、h4以下は本文の文字と同じかそれより小さかったです。いくらなんでもh6はミニマムすぎです。見出は本文より大きい方がいいと思います。デフォルトスタイルシートの改善して欲しい点の一つです。と言いつつも、h4は滅多に使わないのですが。あとh6という数字の中途半端さが謎です。
クールなURIは変わらないというか、変わらないURIだからクールと言うか。
1年に2度も移転した私は非モテ確定です。しかし、死ぬまで何らかのサイトを運営し続けたいので恒久的なURIには興味があります。独自ドメインを取ったし、このサーバでは.htaccessも使えるのでクールなURIとやらを実現するためにある作業をしました。
.htaccessファイルに、
Options +MultiViews
を追加しただけ。これで拡張子を省略してもアクセスできます。別に拡張子がなくなったから何が起こるわけでもなく、拡張子があろうがなかろうがそのURIにリソースがありさえすればそれでいいと思うのですが、一応。
URIの設計は、ブログの場合http://example.com/2008/05/24のような年月別風ディレクトリ構成が好きです。理由はディレクトリを削っていくと年別・月別アーカイブになるから。というわけなので、このブログではhttp://example.com/年/月/日/記事番号になっています。記事番号より件名の方がいいのでしょうか。英語圏のサイトでは日付に加え件名を含んだURIが多いのですが(例えばhttp://example.com/2008/05/24/this-is-a-penみたいな)、これは冗長で好きでなかったりします。this-is-a-pen程度ならいいのですが、たまにアドレス欄で作文するな!というくらい長いURIがあったりするので。
まぁどんなURIでもそのURIとリソースが存在し続ければ、あとはどうでもいいです。
余談ですが、昔は拡張子なしURIが不気味に見えたのですが、http://example.com/index.htmlをhttp://example.com/と表記しているようなものと思えば気にならなくなりました。省略できるものは省略した方がスマートです。
というか、http://example.com/index.htmlは初心者臭く見えるうえ、一つのページにURIが2つ存在している点が気持ち悪いです。
webデザイン系の本などを見ていると、CSSは
html,body {
margin: 0;
padding: 0;
}
というふうに書かれていることが多いのですが、
html,
body
{
margin: 0;
padding: 0;
}
の方が分かりやすいのではないかという話。理由は後述します。ちなみに後者の書式を「CSS版ホワイトスミスのスタイル」といいます。私が勝手に名づけたので、おそらく他の方には通じません。「ホワイトスミス」をgoogleで検索してもネットゲーム関係(?)の記事ばかり引っかかるあたりアレな感じです。
以上、守らないことが多い自分ルール。
宣言ブロックを字下げすることにより集合規則の範囲が把握しやすく、セレクタや宣言ブロックも目視しやすく、コピー&ペースト及び削除する時も楽でいいことだらけだー! …と自分では思っています。他の方がどう思うかは知りません。
ちなみに全称セレクタでリセットしないのはフォーム、リスト、入れ子したタグのスタイル再指定が面倒だからです。IE6でも子供セレクタが使えればよかったのですが。
欠点は行数が多くなること、入れ子すると奇抜度が上がること、特殊な書き方なので分業する場合はかなりやりにくいこと(この書き方をしている人が殆どいないので)。プログラムを組むならともかく、CSSを書く時は何重も入れ子しないと思うので気にするほどでもないと思います。しかしテンプレートを配布しているので、利用者のことを考えないといけないですね。配布CSSでは使わない方がいいのでしょうか。謎。
元ネタはマークアップの指針(メモランダム)。2008年5月15日現在はこんな感じです。
application/xhtml+xmlとして、未対応のUAにはtext/htmlとして配信する。head要素内にはlink要素によるナビゲーションを配置する。heading要素はh1要素から順番に使用する。なお、h1要素は文書の先頭に一つだけ配置する。heading要素で暗示するにとどめる。summary属性は記述する。thead要素、tfoot要素、tbody要素によるグループ化を行う。li要素、ol要素、dd要素内にブロックレベル要素、インライン要素、テキストが混在してもよい。cite属性にURIかISBNを記述する。title属性には引用元のタイトルを記す。cite要素による出典の暗示や、a要素でのハイパーリンクは必要ない。pre要素とcode要素によってマークアップする。code要素によってマークアップする。a要素によるハイパーリンクはアンカーテキストがリンク先リソースのタイトルと同一であることが望ましい。しかし、異なる場合はtitle属性でそのタイトルを示す。abbr要素による略語の明示は同一文書内の同一単語について初出の1回限りとする。略語であることが明らかな場合はabbr要素としてマークアップしなくてもよい。em要素は用いない。通常の強調にはstrong要素を用い、より強調したい場合は入れ子する。img要素にwidth属性とheight属性の記述は必要ない。アクセシビリティはあまり考慮していない。そして曖昧な点が多い(特にclass/id関係)。守れていない規則も多いというオチつきです。
h1要素は1ページに1つ、通常の強調にem要素を使わないなどは自分ルールであり、仕様に依るものではありません。引用元リンクは必要ないと書きつつも、JavaScriptでcite属性のリンクを生成したり、前後の文章にリンクを併記したりと色々媚びて(?)います。媚びというか妥協というか配慮というか。
他サイトさんが書かれた有益な記事をアップロードしました。今後も地味に増えていくかもしれません。ちなみに転載の許可がされている閉鎖(?)サイトからのみ転載しています。もし相手方が復帰したら下げる予定です。
「脱初心者をめざす人のためのホームページ作成講座」の方はファイル数が多いのでそのまま上げました。link要素など、ところどころリンク切れを起こしています。少しずつ修正していくつもりです。
サイト情報のところに開設日を書いていたおかげか、2日くらい前から意識することができました。忘れなくてよかったです。
これからもまったり運営していく予定なので、趣味の合う方はおつき合いください。あとアンケートも実施しているのでご協力いただければ幸いです。
終了しました。ご協力ありがとうございました。
web拍手ツールはたくさんありますが、現在私が使用しているのはKash+です。お礼ページも解析ページも出力はすべてスキン側で制御。CGI側では余計な(使用者が意図しない)ソースを一切出力しない。
というところがお気に入りです。本体をいじらず出力ソースの制御ができるスクリプトは貴重です。UTF-8対応、月別レポート機能、正規表現使用可など多機能なところも素敵です。かゆいところに手が届きます。
必要環境が他のweb拍手ツールより厳しいという難点もありますが…。あと、きれいなソースを出力できるのに、スクリプト本体の「共通ソース機能」、「ランダムソース機能」部分のマークアップが残念な点。なぜそんな書き方を…!という。ただ、これは利用者が簡単に書き換えできるので気にする部分ではないのかもしれませんが。
前置きが長くなりましたが、Kash+のスキンを作りました(CLAP(1))。今後の発展と利用者の増加を願っています。
とりあえず3種類作りました。ソースの書き換えが楽だったので、「PatiPati」対応版も配布することにしました。Web Clapも作るかもしれません。
Web Clap対応版も作成しました。
前回改装したのは1月3日だったので4ヵ月ぶりのデザイン変更です。IE6では使えないCSSプルダウンメニューがポイント。あと、アイコン(3つ)以外の画像は使っていないので、精神的エコロジーです。「ブログ風で画像を使わないデザインにしたい。CDP(15)みたいな感じにしよう」と考えていたので、色が同じです。
IE6以外でも表示がおかしいところがあるのと、JavaScriptのエラーも出ているのでちまちま修正していく予定です。コンテンツ表記とclass/id命名も考え直します。