さよならのかわりに、昔話を 〜XHTML2 を追悼してみるテスト〜 - 若葉もすなる☆日記というもの
いつか XHTML2 の時代が来ると思っていた頃もありました。ネタを漁っていたら大杉で書ききれませんでした。わかりやすそうなのを集めてみました。 1998年5月 HTML の将来を議論する W3C Workshop で従来の HTML を捨て、 XML 構文に移行することが決定されました。 これがすべてのはじまりでした。 W3C workshop - Shaping the Future of HTML http://www.w3.org/MarkUp/future/ 2000年夏〜2008年12月 XHTML m12n 仕様書において usemap 属性の属性値の定義が誤っている問題について当時の HTML WG (現 XHTML2 WG) は度々指摘を受けてきましたが、対応を怠り、2008年12月になってようやく XHTML 1.2 Editor's Draft に限って修正されました
アクセシビリティも考慮して表組みするための10のタグ（1/11） - ＠IT
有限会社タグパンダ 喜安 亮介 2009/4/24 XHTMLでページ全体をレイアウトする際に“表”を使っていませんか？ それはCSSでやるべきで、ほかに使いどころは多々あります Webアクセシビリティを考慮した表組みをしよう 今回は“表組み”（テーブル）を表すタグを紹介してきたいと思います。HTMLの表組みは、table要素でマークアップされたブロックで、Excelでよく見る「スプレッドシート」と同じイメージです。tr要素が“行”、th/td要素が“列”を表します。Webアクセシビリティを考慮した表組みをするには、以下に上げる点も踏まえ、きちんとコーディングする必要があります。 table要素にsummary属性を付けて要約を記述 テーブル項目のタイトルは、th要素でマークアップ caption要素により、きちんと表題を付ける theadやtfoot、tbody要素によりテーブル行をグル
『Web標準の教科書』 益子貴寛 (秀和システム) - 書評空間::紀伊國屋書店 KINOKUNIYA::BOOKLOG
→紀伊國屋書店で購入 あるサイトの構築をまかされることになり、久しぶりにホームページの作り方を勉強し、浦島太郎の気分を味わった。 わたしはWebデザインを仕事にしているわけではなく、単なるアマチュアだが、これまで二度、HTML関係の本をまとめて読んだことがある。 一度目は「ほら貝」を立ちあげて一年ほどたった1996年頃だ。「ほら貝」をはじめた当時はろくな入門書もツールもなく、「本文を<H4>で囲むと読みやすくなります」などと書いた本まであったくらいで滅茶苦茶だった。HTMLに標準があるという意識もなく、他サイトのソースを見て覚えたタグをエディタでしこしこ埋めこむという作り方だった。しかし、ページが増えてくるとそれでは済まなくなり、本格的な本で勉強しようと思いたったのだ。 何冊か読んだが、長く手もとにおいて頼りにしたのはローラ・リメイの『HTML入門』正続だった。二冊で千頁を超えたが、アメリ
マークアップエンジニアじゃなくても覚えておきたいHTMLとCSSの話(〜HTML5・CSS3、IE8 それぞれの準備に向けて) - livedoor ディレクター Blog(ブログ)
こんにちは。 livedoor Blogを担当しています石野と申します。 前職はマークアップエンジニア(HTMLコーダー)をしていました。 今回はその経験を踏まえ、ディレクターとして把握しておいた方が良いHTML/CSS関連のお話をご紹介しようと思います。 昨年からHTML5、CSS3、そしてInternet Explorer(以下IE)8のベータ2版発表と、バージョンアップに関するニュースが相次ぎました。 その違いを認識する上でも、また制作サイドのディレクションに活かす上でも本エントリーを参考にしてください。 ▼ 構成 (1) HTML - 文書型について (2) HTML+CSS - クロスブラウザについて (1) 文書型について - ファイルの先頭に陣取っている「DOCTYPE」とは何か？ HTMLソースを開くと、こういった記述を目にしませんか？ !DOCTYPE html PUBL
テキストに意味を持たせるXHTMLタグの正しいマークアップ（1/20） - ＠IT
有限会社タグパンダ 喜安 亮介 2009/2/20 テキストに意味を持たせるXHTMLタグの正しいマークアップをおさらいしましょう。フレーズ要素を含む19タグを一挙ご紹介します。 これらの要素を用いたマークアップを行うことにより、「この文章は○○から引用された文」とか「この文字列は▲▲の略語である」といったふうに、テキストに論理的な意味を持たせることが可能になります。 p要素 p要素は、文章の段落を表すための要素です。 ブロックレベル要素として機能し、テキストとインライン要素を内包できますが、ブロックレベル要素を内包できません。 p 文章の段落構造を表すp要素 q要素 q要素は、段落による区切りが不要な短い引用文を表す際に使います。 インライン要素として機能し、テキストとインライン要素を内包できますが、ブロックレベル要素を内包できません。cite属性値に引用元のURIを記述し、必要に応じて
HTMLのマークアップ時に目的に合った要素を選ぶ方法
本連載では、Web標準のメリットを最大限に生かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口をたらしていきたいと思います。連載第3回目となる今回のテーマは、「目的にあった要素選び」です。コーディングの際、「構文的に正しいかどうか」はツールを使ってチェックすることができますが、「目的に合っているかどうか」については人間が判断する他ありません。どの要素でマークアップするか、判断に迷う部分について掘り下げて考えてみましょう。 はじめに 本連載では、Web標準のメリットを最大限に生かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口をたらしていきたいと思います。 連載第3回目となる今回のテーマは、「目的にあった要素選び」です。コーディングの際、「構文的に正
文書構造を表現するXHTMLタグの正しいマークアップ HTMLタグリファレンス（1/10） - ＠IT
文書構造を表現するタグ 文書構造を表現するXHTMLタグを大まかに分類し、分類したタグをXHTMLの“要素”として、1つずつ紹介していきます。 これらの要素類はXHTMLの骨格（枠）となる部分を形成していくために使われる、XHTMLタグの記述（＝マークアップ）を行ううえで基礎となる要素類です。 htmlタグが一番の外側（先祖）となり、その内側（子）に上からhead要素、body要素といった順番でマークアップされます。 ページとして作成する（.htmlファイル）の文書構造を考慮し、情報構造として論理的に合っているかというのを考えながらマークアップを行いましょう。 html要素 htmlのそれぞれの要素はhtml要素を頂点とする階層構造になっています。 その中でhtml要素は最も基礎となる要素で、そのほかの要素はすべてがhtml要素の子や子孫（※）となる関係性になります。 なお、htmlファイ
3G端末（FOMA・WIN・3GC）のモバイルサイトのコーディング＆デザイン - livedoor ディレクター Blog(ブログ)
こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G（FOMA・WIN・3GC）端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末（FOMA・WIN・3GC）がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末（PDC・P型・C型など）を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運
XHTML+CSSサイトデザイン : LINE Corporation ディレクターブログ
どうも、ユティです。 直接ディレクションには関係しないのかもしれませんが、ウェブトレンドと技術的な理解ということで、HTML マークアップについて書きたいと思います。あと、以前も書きましたが、自分が理解していないことを依頼しちゃダメですよね。自戒もこめて。 それと、超基本的なことをマークアップの人じゃない人が書いてますので、その辺りご理解ください。 【01】HTML ご存知とは思いますが、ウェブページというものは、基本的にHTML（HyperText Markup Language）という言語で書かれたファイルを、ブラウザが読み込み、内容を解釈して表示しているわけです。で、そのファイルの中身と言うのは 例1.HTML記述例 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict
XHTMLでやりがちな8個の間違い | ブログが続かないわけ
最近、XHTMLのValidationに恋してます。 Validationチェックをするのに便利なのは、やっぱり本家のW3CのMarkup Validation Service。単一のページをチェックするにはこれが一番いい。 Markup Validation Service サイト全体をまとめてチェックする場合はこちらが便利(手前味噌でごめんなさい)。 Site Validator ただ、これらのサービスは詳細のエラーを見てもどこが間違いかわからないことがある。慣れないと難しい。まず、英語だと言うのも問題かもしれないが、微妙に問題点とエラーメッセージの内容がずれていることも多いからだ。プログラマであればエラーメッセージとエラー内容がずれているなんてことは慣れっこかもしれないが、これらのツールを使うのは非エンジニアであることも多い。HTMLのコーダーとかディレクターとか。 Site Val
XHTML+CSSで作成する10の理由-CSS TIPS
そもそもなぜXHTML+CSSで作らなくていけないか? 10の理由にまとめてみました。 １．構造とデザインの分離ができる。 構造(XHTML)とデザイン(CSS)が分離される事により より整理されたコードが記述できるようになります。 ２．プログラミングの作業が簡単になる。 これには２つの視点があります。 まずプログラマーの視点から言えばXHTMLは構造化されておりプログラムからXHTMLを出力する際に無駄な処理が省かれます。 （複雑なXHTMLの場合デザイン要素を出力するために無駄な分岐やループを記述する必要がある） デザイナーの視点とすると プログラムの知識がなくともPHPやCGIで書かれたプログラムのデザインの変更が可能になります。 （Movable Typeなどがよい例） ３．SEO効果が高い タグを正確に記述すれば検索エンジンに対してより重要な内容を訴える事ができます。 (hxタグ
非整形式なXHTMLのエラー表示 | Web標準Blog | ミツエーリンクス
タグを閉じ忘れたり、引用符で属性値を囲み忘れたXML文書は、非整形式のエラーとなります。さて、このようなエラーを持つXHTML文書をXMLとしてブラウザに処理させた場合、どのように表示されるのでしょうか。スクリーンショットと共に解説したいと思います。 非整形式のXHTMLソースは、次のようなものとなっています（エラー部分は強調表示しています）。 <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <title>An Ill-formed XHTML Document</titl
新しくなったW3CのHTML検証サービス | Web標準Blog | ミツエーリンクス
7月25日より新しいW3C Markup Validation Serviceが稼動しています。デザインやインターフェースの改良だけではなく、内部の仕組みや検証機能にも改善がみられます。 新しいバージョン0.8.0ではアーキテクチャが一新され、検証時間の短縮や信頼性の向上が図られています。加えて、XMLの整形式や名前空間、MIMEタイプに関するチェックなど、XMLに関するエラー検証の精度が高まっています。このため、今までvalidとされていたXHTML文書が新しいvalidatorではinvalidとなる可能性があることにご注意ください。 Validatorは今後も、サービスのローカライズをはじめとするさまざまな改良を続けていくとのことです。日本語版の登場が待たれます。
12 のレイアウトを切替可能なテンプレート
1つのテンプレートで 12度おいしい XHTML + CSS テンプレートを公開してみたいと思います。といっても、ごく普通のテンプレートに CSS 切り替え機能を付けただけなんですが、Blog や Webサイトを作られる際のベースとして役立てて頂けたらうれしいです。 サンプルはこちらで確認できます 全ファイルのダウンロードはこちら （zip ファイル / 50KB） 8/10 追記 初期に配布したテンプレート内に、結構な量の誤字等がありましたので、現在の最新版を下記からダウンロードしてください。 では使い方などの説明を。 ファイルをダウンロードして解凍すると下記のようなフォルダ構成になっています。 index.html （XHTML テンプレート） css （CSS ファイル格納フォルダ） img （画像ファイル格納フォルダ） js （JavaScript ファイル格納フォルダ） 基本的に
XHTML2ワーキンググループとXHTMLの動き | Web標準Blog | ミツエーリンクス
前回の記事では新しいHTMLワーキンググループとHTML 5についてお伝えしました。今回は「旧」HTMLワーキンググループであるXHTML2ワーキンググループについて、その目的や動向を解説します。 今年3月の新HTMLワーキンググループ発足時に、それまでXHTMLの策定を行っていた旧HTMLワーキンググループは「XHTML2ワーキンググループ」と改称されました。引き続きXHTML 2.0の策定を活動の中心に据え、関連仕様であるXML Events 2やXFramesの開発を行うとしています。また、XHTML Modularizationを改訂し、これらの新しいモジュールを含めることも検討しているようです。 また、運営体制がHTMLワーキンググループと同じくパブリックなものへと変更されました。これを受けて、以前は参加者のみに閲覧が限定されていた編集者ドラフトが、XHTML Document
colgroup / col 要素を活用してみる | WWW WATCH
table 関連の要素とか属性っていろいろあるにもかかわらず、結構使われていないなと思ったり。 上手にマークアップしておけば、アクセシビリティ的にも優れた表組み... table 関連の要素とか属性っていろいろあるにもかかわらず、結構使われていないなと思ったり。 上手にマークアップしておけば、アクセシビリティ的にも優れた表組みが再現できるだけでなく、CSS で見た目をいじるときにも、無駄に class 属性なんかをつける必要もなかったりと、いろいろ良い事あるのになということで、今回はその中から colgroup 要素と col 要素について書いてみることにします。 例えば上記サンプルのような表を作りたいと思ったとき、列方向 （縦方向） のセルに背景色を指定するためだけに class 属性を付けていったりするのは面倒だしスマートじゃない。サンプルのように列方向の各データが構造的にグループ化で
正しくHTMLを書こうと心がけている人に5つの質問 : 雑記帳 : der Gegenwart
[ Web関係 ] HTML文書を制作する際に使用しているプログラムをお答えください。（Webプログラムも含む） 採用しているDTDとその理由をお答えください。 何故正しくHTMLを書いているのですか？ W3CとWHATWG、どちらに期待してますか？ あなたにとってHTMLとは何ですか？ 単純に私が聞きたいことを並べてみただけ。答えてくれる奇特な方がいらっしゃいましたらご自由にどうぞ。 数の多い質問系は私が好きじゃないので5個に。ホントはもっと色々聞きたいことがあるんですけど。所謂「100質」なんて質問考えるのも、答えるのも面倒ですよね。 追記 ちなみに、ここでいう「HTML」とはXHTMLも含みます。 それと最後の質問を「あなたにとってHTMLとは何ですか？」としたのは「その人がHTMLというものをどう捉えているのか」「その人の中でのHTMLという概念」を知りたかったから。単なる道具なの
SEO対策とWeb標準のホームページ作成 - SEO-Equation
楽しいとしか思えない！ 風邪だけではありません。 日は雨です 関東熟女は岩手はかっこいいようです 湿気が多い さて、これからは雨が降るたびに 涼しくなってきま 高熱が出て何年になりますか？ インフルエンザは何十年もかかっていないので、久しぶりの高熱は大変でした。 気温の違いによると思いますが、今回は朝から着ている服がとても気になります。 岩手 熟女 話が変わる... 最近は焼肉が食べたくて仕方がない 家でお肉を焼いても大丈夫ですが、お店に行って食べたいです〜 ここの焼肉店は美味しいのでオススメです。 すでに 処理しないと追いつかない 熟女は岩手が暗くないと見えません あなたの年齢を残さないでください！ しかし、Suppinは神です 週7回のメイクアップはありません！ ああ。 CDTVが始まりました！ 熟女は岩手は自分で写真を撮りに行きたいです 私は旅行の計画を立てるために休日に半日を過ごし
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
作ろうiモード：iモードブラウザ2.0 | サービス・機能 | NTTドコモ
fam.cx