XHTMLのマークアップでどうしても許せないというか、気になるやり方をよく見かける。 企業サイトではトップページに最新ニュースの一覧が表示されていることがよくあるが、その部分がかなりの確率でこのように書かれている。 <dl id="news"> <dt>2009.06.02<dt> <dd><a href="~">ニュースのタイトル</a></dd> <dt>2009.06.01<dt> <dd><a href="~">ニュースのタイトル</a></dd> </dl> 要は定義リストを使っているわけだが、これが「正しいコーディングである」と誰かが提唱しているのだろうか、ほんとによく見るんですが、定義リストの本来の意味からは大きく外れているのが気になるんです。 DTDではdl要素について「definition lists – dt for term, dd for its definitio
上記タグは次の点に注意してください。 必ずdiv要素を用意してください。divではない要素ではブログレスバーは表示されません。 id属性は必須です。id属性値をセットしてください。 HTMLのhead要素内に、次のJavaScriptコードを記述してください。 <script type="text/javascript" src="../html5jp/progress.js"></script> <script type="text/javascript"> window.onload = function() { var p = { to: 50 }; var o = new html5jp.progress("sample1", p); o.draw(); }; </script> このサンプルは、html5jpフォルダが一階層上に存在しているものとしてscript要素のsrc属性を
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
HTML5勉強企画第2弾。 今回も参照させてもらったサイトを以下に(敬称略)。 HTML5 W3C working draft livedoor labs EDGE EDGEのトップページをHTML5化した件について:Blog hamashun.com HTML5のセクション(その2):vantguarde 前記事同様、基本的にW3Cのワーキングドラフト(英文)を読んでいるので、ここに書かれていることが原文と全く同じとは限りません。翻訳に際して生じる間違いがある場合がございますこと、ご理解いただけると助かります。 間違いを発見した場合、ご連絡いただけると勉強になるのでとても嬉しいです。 連絡先:granshe@jcom.home.ne.jp section 文章の章を表すのに使う。ある程度意味の同じコンテンツをまとめる。 一般的にheader要素と共に用いられ、footer要素をともなうこ
Re: CSS Nite in Ginza, Vol.31でお話させていただきました コバさんのCSS Nite in Ginza, Vol.31でお話させていただきましたという記事を読んで。僕はイベントに参加したわけではないから、文脈であったり発言の真意を十分に理解したうえで書くわけではないのですが……。 また、結構思い切ってXHTMLを採用する際に、XML宣言を書かないようにということを言ってしまいましたので、もしかしたら反響もあるかと思います。僕の場合は、まぁ書いた方が仕様にそったものであるのは分かっているのですが、作業工数があがってしまうのはクライアントさん的にどうかなーということもありまして、デメリットを説明した上で、書かないということがほとんどです。せっかくCSSレイアウトになって作業効率の向上が実現されたということもありまして、それならば楽出来る部分は一層楽しましょうよという
新しいHTML5の草案が昨日、付属文書とともに公開されました。 “HTML 5 (W3C Working Draft 12 February 2009)” “HTML 5 differences from HTML 4 (W3C Working Draft 12 February 2009)” 前回の草案公開は去年の6月でしたので、8ヶ月ぶりのリリースとなります。数多くの更新が行われていますが、主要な変更点は“HTML 5 differences”の“Changes since 10 June 2008”というセクションにまとめられています。いくつか気になったものを抜粋してみます。 HTMLのフォームを拡張したWeb Forms 2.0がHTML5に統合されました。input type=dateやinput type=emailなどはOperaで実装されており、入力した内容の検証を行うこと
XHTML文書とメディア型に関する覚書として、“XHTML Media Types”というノートがあります。このノートが改訂され、“XHTML Media Types - Second Edition”として公開されました。 先ほど日本語訳も公開しましたので、ご覧いただければと思います。 XHTML Media Types ― 第二版 XHTMLのメディア型と拡張性のジレンマ XHTML Media Typesの第一版は、各メディアタイプの説明と、どの文書型にどのメディア型が利用できるかをまとめた簡単な文書でした。 文書型との関連を示す表によれば、現在XHTML, HTMLを問わず広く使われているtext/htmlというメディア型は、HTML 4.01と、HTML互換のXHTML 1.0のみで利用可能とされており、XML志向の強いXHTML 1.1や、それ以降のXHTMLでは非推奨とされて
少し前にJeffrey ZeldmanとEric Meyer両氏の手によってリニューアルされた、"An Event Apart"(Webサイト制作者向けのオンライン雑誌 "A List Apart"のオフラインライブイベント版)や、今年6月15日-17日にかけてロンドンで開催される、Clearleft社主催のユーザー・エクスペリエンスのワークショップ"UX London"のサイトでは、先月少しだけ紹介した"<!DOCTYPE html>"という新しい文書型宣言が採用されています(→連載 #20をご参照下さい)。 すでに個人レベルでは、可能な範囲でHTML5によるマークアップを試みる事例は見られたものの(事例1、事例2、事例3)、ウェブ業界関係のサイト、しかも実質的に採用したのは文書型宣言だけ(HTML5固有の要素や新ルールの適用は、ひとまず見合わせた感じのおとなしめのマークアップになってる
技術評論社のサイト、gihyo.jpにて、2009年のWeb標準と題したコラムを寄稿させていただきました。Web標準と絡めて、個人的に今年注目あるいは期待したい動きに言及しています。当Blogをお読みの方にとって、それほど目新しい内容は無いかもしれませんが、お読みいただければ幸いです。 同コラムの最後で、ブラウザの進化と共に、マークアップやスタイルシートの書き方もまた変化していくといったことを書きましたが、年明け早々に気になる動きがありました。HTML 5を文書型に採用したサイトが、相次いで公開されていたのです。いずれのサイトもコラム執筆後に知ったため、取り上げることができなかったのは残念です。 An Event Apart: The Design Conference For People Who Make Web Sites UX London 興味深いのは、これらのサイトに携わったE
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
img要素にwidth、height属性を指定するかどうかは常に悩んでいて、以前にもブログでみなさんに質問したりもしましたが、自分なりの一つの答えにたどり着きました。 画像の幅、高さの情報というのは以下の2通りの情報があると思います。 画像の大きさを構造上表すメタデータとしての情報 見た目の大きさを表す情報 それぞれについて考えてみます。 画像の大きさを構造上表すメタデータとしての情報 以前書いた質問のエントリーにいただいたコメントで以下のようなものがありました。 静止画像である写真や絵画は、IT化以前の歴史上、サイズを表記してきました。美術館に行くとわかりますが、絵の説明は「題名、作者名、発表年、画材、所有者(収蔵美術館)名、『サイズ』」になっています。もちろんここで表記するサイズはピクセルではなくキャンバスの号数かセンチ単位ですが。このことから考えると、現実世界において画像の大きさは重
ちょっと前に パンくずリスト(Topic Path)を作成する際に使えそうなサンプル8種(CSS HappyLife)というエントリーが盛況でしたが、今日はパンくずナビゲーションの論理構造面を補強する意味も込めて、(X)HTML マークアップの例を、サイト構造やサイトの目的に応じて、いくつか挙げてみました。CSS の話まで入れると長くなるので、今回は(も?)(X)HTML マークアップに話を絞ります。CSS については、特にセレクタまわりが結構 変わってしまいますが、ひとまず、HirasaWa さんのエントリーなどを参照してください。(気が向いたら、別エントリーを立てますけど、実際に書くかどうかは未定。) 階層型構造(tree structure) [2006-02-11 追記] 石川一靖さんより、「セマンティクスを重視するならa要素にrel/rev属性を加えてリンクの関係性を明示するのが
はじめまして。hxxk.jpの望月真琴です。ふだんはWebと全く関係のない業種で仕事をしていますが、このように時々テクニカルライティングを行っています。 2007年3月に株式会社 九天社から『実践Web Standards Design』(通称:ホップ本)という(X)HTMLとCSSのガイドブックを共著で出版し、2度の増刷を経て、このたび新装版としてここ技術評論社から再刊行させていただくことになりました。 技術評論社から刊行される新刊図書は、新刊ピックアップというページで紹介がなされるのですが、打ち合わせの中で編集担当の高橋さんから「せっかく3人が共同で執筆されているのだから、発売にあわせてgihyo.jp上でリレー連載なんてどうでしょう?」という話が持ち上がり、「それ、面白そうですね!」と私が一も二もなく賛同したことからこの連載が実現しました。 ――その時は、他の2人は打ち合わせに参
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
Webサイトのアクセシビリティのチェックを行っているとバランスの悪い代替テキストに出会うことがあります。 例えば、複雑なフロー図に「フロー」という代替テキストのみが記述されているようなケースです。もしその画像以外にフローに関する説明がない場合、「フロー」という文言からだけでは、フローの具体的な内容を理解することは出来ません。本来であれば、alt属性にはフロー図に書かれた内容を記述する必要があるでしょう。 一方、画像に含まれる情報をすべて記載しているにもかかわらず、理解しにくい代替テキストとなるケースも存在します。グラフに対する代替テキストを例に見てみましょう。下記は画像上の情報をすべてalt属性に記述したケースです。 音声読み上げ環境では、alt属性に設定されたテキストは、1行に羅列された状態で読み上げられます。次々読み上げられる情報を頭で記憶しながら聞かねばならないため、代替テキストが長
16日に開催されたイベント「Firefox Developers Conference 2008~次世代Webとプラットフォーム~」では、Firefoxに関するセッションが中心となったが、Firefoxの枠を超えたWebブラウザのあり方や、次世代のHTML規格「HTML 5」に関するセッションも行われた。 ● LEDもデジタルサイネージも服も「Webブラウザ」? Webブラウザの進化はめざましい。レンダリングエンジンの改良はもとより、プラグインによるリッチ化、タブインターフェイス、検索エンジン窓、携帯電話やゲーム機などへの組み込みなど数多くある。しかし、“コンピュータ上でHTMLを表示する”という根本の部分は変わっていない。未来のWebブラウザもその延長線上なのだろうか? パネルディスカッション「近未来ブラウザの形を考える60分―ユーザエクスペリエンスの視点から―」では、3年から5年先のW
W3C Editor's Draft 17 October 2008 This version: http://www.w3.org/TR/2008/ED-xhtml12-20081017 Latest stable version: http://www.w3.org/TR/xhtml12 Previous Editor's Draft: Diff from previous Editor's Draft: xhtml12-diff.html Editors: Shane McCarron, Applied Testing and Technology, Inc. This document is also available in these non-normative formats: Single XHTML 1.0 Strict file, PostScript version,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く