The Elements of Meaningful XHTML
"XHTML" Today's Web HTML 4 and "compatible" XHTML 1.0 Valid For Meaning not Show Strict not Transitional Layout Tables Avoid <b> <br/> <i> <sub> <sup> <h1> != big and bold <em> != make this italic <blockquote> != indent this For more, see: Throwing Tables Out the Window Why tables for layout is stupid Integrated Web Design: The Meaning of Semantics Precisely Meaningful Goldilocks <div> & <span> la
hxxk.jp - DOCTYPE スイッチについてのまとめと一覧表 (HTML 5 や IE 8 Beta 2 のモードスイッチなどの情報も含んだ 2008 年版 )
DOCTYPE スイッチについて再度まとめ 以前 DOCTYPE スイッチについての検証とまとめと一覧表という記事で DOCTYPE スイッチについてまとめましたが、あれから 2 年弱が経過したので、改めてまとめてみようと思います。 まとめるまでの話がけっこう長いので、一覧表だけ参照したい ! という場合は DOCTYPE スイッチの一覧表をご覧ください。 DOCTYPE スイッチとは何か そもそも DOCTYPE スイッチとは何か、というのがまず書くべきところですが、これは私が書かずとも良質のリソースが各種ありますのでそのリンクのみまとめておきます。 !DOCTYPE スイッチ 各UAのDOCTYPEスイッチについて - CSS Dencitie Mozilla's DOCTYPE sniffing - MDC Mozilla's DOCTYPE sniffing - MDC ( 日本語
標準準拠・後方互換モード各々の CSS 解釈の違いをまとめたドキュメントを共有
2007-07-27T21:11:11+09:00 最近のブラウザには DOCTYPE 宣言の有無や種類で大きくわけて2種類の表示モードを切り替え、CSS や HTML の解釈を変える機能が備わっています。マイクロソフトは同様の機能を DOCTYPE スイッチとしており、一般的にもそう呼ばれることが多いように感じます (この記事でも DOCTYPE スイッチとします)。 DOCTYPE スイッチはオンの状態で standards mode (標準準拠モード) に、オフの状態で quirks mode (後方 (過去) 互換モード) になります。標準準拠モードは仕様に準拠した厳格な表示モード、後方 (過去) 互換モードは仕様に準拠していない古いブラウザとの互換を目的とした表示モードです。つまり DOCTYPE 宣言の記述が無いようなコンテンツに対しては、仕様に準拠していない古いブラウザの解釈
MOONGIFT: » 不要なCSSの洗い出し「CSS Redundancy Checker」:オープンソースを毎日紹介
CSSははじめこそきちんと定義しながら進めるのだが、修正が重なったり、日々の運用の中で徐々に肥大化していく。HTMLと同じで多少間違っていたり、不要な情報が紛れ込んでいてもそれなりに表示されるので気にならないのだ。 だが不要な情報が紛れ込んでいると、ちょっとした修正が全く無関係と思われる場所に影響を及ぼしたり、管理しきれなくなってくる。そこで使ってみたいのがこのソフトウェアだ。 今回紹介するオープンソース・ソフトウェアはCSS Redundancy Checker、不要なCSSチェッカーだ。 CSS Redundancy CheckerはRubyで作られている、CUIベースで動作するアプリケーションだ。また、gemでhpricotをインストールする必要がある。そのため、若干敷居が高いかも知れないが、便利なアプリケーションだと思うのでぜひトライしてみて欲しい。 使い方は簡単で、CSSファイル
tfoot に関するエントリーの補足
前のエントリー、「tfoot は tbody の前に書いた方がいいよ」では、行グループ、tfoot 要素の記述位置に関して hxxk.jp さんのエントリーに乗っからせて頂く形で書きましたが、該当エントリーのタイトルに突っ込みをいくつか頂いたので補足エントリー上げます。 突っ込みの内容としては、「書いた方がいいよ」 というタイトルの書き方だと、「書いても書かなくても自由だけど、書いたほうが吉」 と受け取る人がいて、ミスリードじゃないのということなんですが、確かにおっしゃる通りなのでその辺を補足したいと思います。 で、いきなり言い訳からなんですが、該当エントリーのタイトルを 「書いたほうがいいよ」 としたのは、 hxxk.jp さんのエントリーに対する突っ込みが主な内容だったので、hxxk.jp さんに向けて語りかける形で書いたからなんですね。なので、エントリー本文では 「仕様書には tfo
吹き出しバリデータと TMT Validator を組み合わせてみた
■ 吹き出しバリデータと TMT Validator を組み合わせてみた TMT Validator っていうフォームの入力値チェック用のライブラリがありまして、これって結構見た目とか簡単にカスタマイズ出来て、何気にすごい便利なライブラリなんで、この前紹介した 吹き出しバリデータ でやってるのと似た方法でエラーを表示するコールバック用のコードを書いてみました。 実際の動作サンプル この TMT Validator は、吹き出しバリデータと違ってエラーメッセージも簡単にカスタマイズ出来たりとか、かゆい所に手が届く感じなので、そういう柔軟性を求めてる上に吹き出し表示が気に入ってる方はこっちを使ってみて下さい。 オリジナルの配布ファイルに、以下のファイルを追加すれば使えるようになります。CSS と画像ファイルは 吹き出しバリデータ のやつと同じものです。 baloon_validator.js
linkのススメ (kuruman.org > 駄的HTML改善計画)
リンクを作る、これはHTML文書の、非常に多くの場面で使われています。 その場合には専らa要素が使われています。 コレはまぁ、当然のことでしょう。 しかし、他の文書との関係を示すlink要素の存在を知っていますか? ココでお勧めするのはlink要素です。 UAによってはこの関係を辿って他の文書へ進める場合もあるのです。 ココではlink要素について、ちょっぴり知識を深めていこうと思います。 link要素とは link要素はただスタイルシートを読み込む為だけに存在する……などと思っていませんか? そんな事はありません。 link要素は head要素の子要素 として存在し得る、 別の文書等との関係を定義する要素 です。 これは空要素(エンプティタグ)として定義されています。 よってスタイルシートの呼び出しの他、 ナビゲーション情報を記述する事が出来る のです。 ……がしかし、圧倒的シェアを誇る
パンくずリストがベストとは限らない | WWW WATCH
最近ウチの会社の中の人も書いていました、Web サイトのナビゲーションとしてよく使われる 「パンくずリスト」 （Topic Path なんて言い方もしますね） ... 最近ウチの会社の中の人も書いていました、Web サイトのナビゲーションとしてよく使われる 「パンくずリスト」 （Topic Path なんて言い方もしますね） ですが、マークアップの仕方はどういう方法がいいとか、そもそもパンくずリストって必要なの？ なんて話まで、最近よく目にする気がします。 個人的にパンくずリストはサイト ID （ロゴなどですね） に対するトップページへのリンク設定同様の慣習みたいな感覚で、すべての人とは言わないまでも一定の認知はされていると考えていますので、サイト構築の際は基本的に要件に含めるようにしています。 で、今回はパンくずリストが必要か？ とか、パンくずリストのマークアップはどのような方法が妥当か
Web標準化Tips - Web標準普及プロジェクト
特定のWebブラウザの独自拡張仕様を使っていたり、 特定のWebブラウザの表示が間違っていたために、 Mozillaによって実際に問題が発生した事例の修正方法を紹介しています。 また、ここで紹介する修正案は全てWeb標準仕様に基づいた内容となっています。
css - ルビもCSSで : 404 Blog Not Found
2006年05月31日00:55 カテゴリTips css - ルビもCSSで これ、実はCSSでなんとかなります。 檜山正幸のキマイラ飼育記 - ルビ（ふりがな）タグの話 IE6では期待通りの表示（ふりがなの「おびただ」が「夥」の上に乗る）が得られます。FireFoxはダメでした、 以下をご覧ください。 夥 （おびただ） しい数のWebページ どうです? 当blogでは、現在以下をCSSに加えてrubyを実現しています。IEでもSafariでもFirefoxでもちゃんと見えます。 /* * based upon * http://www.akatsukinishisu.net/itazuragaki/2001_10.html#ruby_for_Mozilla_3 */ ruby { display:inline-table; text-align:center; white-space:
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.massimocorner.com/validator/
Custom Web Development Services – GetDevDone® (PSD2HTML)