HTMLにおける引用
blockquote要素とq要素 引用を明示するHTML/XHTMLの要素型は、blockquote要素とq要素です[HTML4.01]。パラグラフなどのブロック（まとまり）ごと引用する場合はblockquote要素、ひとつのブロック（まとまり）に満たない断片的な引用の場合はq要素としてマーク付けします。 <blockquote> <p>今日は7月7日、七夕です。笹に短冊を吊るそうとしましたが、 通りすがりのパンダに笹を食べられてしまいました。</p> </blockquote> <p>なにこの例文。<q>通りすがりのパンダ</q>とかありえないだろ。</p> HTML4.01及びHTML5の仕様では、文書制作者がq要素の内容に引用符を付けるべきではない、ということになっています[HTML4.01]/[HTML5]。 HTML5では、q要素なしで明示的に引用符を使用することも、q要素の使用
ppBlog official
こんにちは、martinです。日本に帰国して1年が経ちました。昨年は２月から新しい職場で働き始めたり、9月６日に第１子が生まれたりとバタバタな一年でして、まるでppBlogの開発・サポートが出来ませんでしたが、今年はなるべく時間を作ってppBlogをいじれたらと思っています。 世界中の皆さんにとって、良い年でありますように。 久しぶりのカキコ。 静的リンクでの挙動を変えています。URLのパスに日付情報などを含ませるように。まだ、いじっている段階なので、色々と不具合があるだろうけれど、まぁ気にしないと。 日付情報がある以外には、現状、PermaLink用の英数文字からなる記事タイトルを別に指定できたのですが、これはそのまま取っておくとして、そうでない場合は、記事のタイトルがそのままブラウザのアドレスバーに表示されるような感じにしてます（静的リンクが有効な場合ですが）。今時のブラウザならエンコ
blockquote要素 -- HTML 4.01リファレンス
固有属性 cite="引用元のURI" Strict: ○ | Transitional: ○ | Frameset: ○ 引用元のURIを示します。ウェブページの場合は「http://」で始まるURIになります。(もちろん相対URIも可能です。)書籍の場合「urn:isbn:0-123-45678-9」のようにISBNコードを記述することができます。 解説 引用を示す要素です。blockquote要素はブロックレベル要素です。引用したい文章が長い場合などによく使われます。Strict DTDでは子要素にインライン要素を置けないことに注意してください。(Transitional DTDならインライン要素を置くことができます。)短い引用の場合は、インライン要素であるq要素を使います。 他人の著作物を引用する際は、引用元を明示することが法律で義務付けられています。HTMLでは<blockquo
mozilla.org マークアップ参考資料
fantasai このドキュメントの目的は、セマンティッククラスの豊富なボキャブラリーを定義するこ とです。サイト全体のスタイルシート内に指定するこ とができ、CSS の規則を書かなくても長く複雑でよく整えられたスタイルのドキュメントを記述することができるほど十分なボキャブラリーを定義します。こうしたクラスは古 い「見栄え」テンプレートに取って代わります；今では「見栄え」はスタイルシート内に定義されるようになり、マークアップをセ マンティックに保つこと ができます。これによって HTML のコードを書く人の仕事が簡素化され、ページのスタイリングに関してさらに優れた柔軟性を可能にし、一貫した仕様でサイト全体の体裁を整えます。 これらのクラスは必要に応じて使用できるように定義されています。これらのクラスを必要としないのであれば、これらを学んだり使用したりする必要は ありま
実践 タグの書き方と文書構造 - develo.org
目次 実践 まず始めに 中身を考える header content footer きれいな(X)HTMLの自分的書き方 実践 タグの書き方と文書構造 積水ハウスHTML + CSS HTMLをXHTMLに！ ポイント ただしく、きれいなHTMLを書くポイントは二つです。 文書構造を理解したHTML記述。 divでの構造化。 実践 ここからは、実際にくみながら説明していきたいと思います。 普段よく見慣れている、積水ハウスサイトですが、テーブルでくまれているので、これをhtml strctにしていきたいと思います。 (画像の中の文字、FLASHの中の文字は、画像にせずText扱いにします。) まず始めに header、content、footerに分けて考える。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.o
テーブル -- ごく簡単なHTMLの説明
いくつかの属性とそのサンプルのような、2次元で表現できる情報は「表」の形にまとめると理解しやすくなります。表計算やデータベースでは、横軸に属性（氏名、住所、電話など）をとり、縦軸にサンプル（それぞれの属性を持つメンバー）をとって表現します。リストが「列挙」という形で1次元の情報を表現していたのと対比すると、「表」がふさわしい情報のタイプがよく分かります。 目次： テーブルの基本構成要素 簡単なテーブル 罫線とセルの境界 テーブルの説明 項目名 セルの伸張 セルの背景色 行と列のグループ化 取り上げる要素： table caption tr td th col colgroup thead tbody tfoot HTMLのテーブルはたくさんの要素や属性があって複雑ですが、XHTMLのモジュール化においてBasic Tableと分類されている範囲として、まず項目名あたりまで目を通しておくだけ
横並びのフォームのマークアップ - Webtech Walker
以下のような、よくある横並びのフォームですが、どのようにマークアップするのがいいのか迷います。 今まではよく定義リスト(dl)を使ってマークアップしていまたのですが、他にもいろいろなマークアップがありそうなので書き出して見ました。 labelをうまく使えば余計なタグを入れなくてすみます。今回はposition:absoluteで横並びを実現してます（tableを除く）が、floatを使う方法もあります。僕はもっぱらposition派。 リスト(ul,ol) シンプルで、構造の意味的にもしっくりきます。順序付きリスト(ol)か順序無しリスト(ul)にするかはケースバイケースです。 DEMO <ul id="formItems_1"> <li><label for="commentAuthor_1">名前</label><input type="text" name="author" valu
h1はトップレベルの見出し | Takazudo Clipping*
h1をページロゴにすべきか、ページの内容を一番よく表す見出しとして使うべきか、考えるネタとして、W3CのTipsのなかにこんなのがあった。 Use <h1> for top-level heading これによると、 スタンドアローンのページであれば、「ジェネバのおすすめスポット」みたいな、ページ内容を一番よく表す見出しがh1=titleになり、両方に指定すればいい。 複数のページにまたがる内容の一部であれば、例えば、ペットのサイトのなかにある犬のページであれば、h1は、「犬」っていう、ページの内容を汲み取れる見出しにしたほうがよくて、titleには、内容が分かるように「犬 - ペットガイド」にすればうまくいくんじゃねーか とある。 そうなると、サイトロゴとかって何タグになるの？というなぞなぞに対して、個人的には、別に決まってないってことで、妥協のpとかでいい。とか思う。 ロゴだけじゃなく
px*blog | alt属性とtitle属性
IEは、imgにalt属性を入れると、画像にマウスをあてたときaltの内容がポップアップで現れます。しかし、Firefoxではポップアップは現れません。 alt入れ忘れチェックするのに、Firefoxってちょっと不便、なんて思っちゃって、altの代わりにtitle属性も入れれば、Firefoxでも出るからそっちにする？なんていう方向に走りかけているコーダーをよく見かけます… （って、自分でしたスミマセン） img要素のalt属性に値を設定しておくと、その画像の上にマウスカーソルを乗せた時にポップアップによってその画像の説明が出る、またはalt属性そのものがそういう役割の属性であると認識している人がいるようですが、このような考え方は間違いです。 By.img要素でalt属性の内容がポップアップしない｜Web標準普及プロジェクト あー実行しなくて良かったぁ、そしてごめんなさい、の思い
画像に関するマークアップ(HTMLマークアップ案)
埋込み画像は、多くの場合<img>要素とされますが、そのマークアップについて。 はじめに。 ISO-HTML, HTML4/XHTML1 では、埋込画像である<img>要素はインライン要素です。 従って、文章中に埋込まれる画像でなければ、何らかのブロックレヴェル要素にしなければなりません。 また、HTML5 ではブロックレヴェル要素やインライン要素の概念はなくなりましたが、だからと言って<img>要素をいきなり書くのは感心しません。 やはり意味のあるマークアップをしたいものです。 普通の段落や見出しとする(全文書型共通)。 画像に代替文字列があり、それで一つの段落や見出しと出来るのであれば、何も考える必要はありません。 通常のテキスト段落同様、<p>要素なり<h○>要素にしてしまうのが最も順当です。 例えば、HTML5, ISO-HTML, HTML 4.01 で <p> <img alt
カスタムチャンス！ - 正しいHTMLとWebアクセシビリティ
livedoor Blog(ライブドア ブログ)の基礎的カスタマイズの書.正しいHTML（妥当なXHTMLと論理的マークアップ）,Webアクセシビリティの向上など.[ skip ] [ 次頁 ] [ 目次 ] [ 検索 ] [ 雑記帖 ] [ サイトマップ ] ... あなたはカスタムチャンス！に来ましたね 正しいHTMLとWebアクセシビリティ こんにちは。カスタムチャンスのコーラ父（livedoor ID：cola_papa）と申します。このブログは livedoor Blog（ライブドア ブログ）を対象にした「正しいHTMLとWebアクセシビリティの向上」に関する簡単な覚書です。（見直しが必要な記事もあります。ご容赦下さい。） 概要 正しいHTMLのための覚書 Webアクセシビリティ向上のための覚書 カスタマイズ関連の記事 精選リンク集 XH
第28回目 SEOの実務 前編 （2/2） - 広告コラム - ネット広告ガイド - Yahoo! JAPAN
第28回目 SEOの実務 前編 （2/2）（2008年10月1日） Webコンテンツを見直す現時点でのアクセスログや、検索ワードの設定と現在の検索結果表示位置を確認し終わったら、いよいよWebコンテンツの見直しに入ります。 検索エンジンの検索結果表示順位を決めるアルゴリズムは、およそ200と言われています。それぞれがどれくらい作用しているかについては、専門家のなかでもさまざまな意見があり、しかも随時変化しています。ここでは基本的なポイントのみ紹介します。HTMLの構造と文法を確認する最初に確認するのはHTMLの構造と文法です。ルールに従い正しく書かれたHTMLはサーチエンジンのクローラーにとっては解釈しやすいものです。そのため、正しく書かれたHTMLはSEOに効果があります。 ここ数年、CSSを使ったレイアウトが普及しました。Webページのスタイル（見え方、装飾、ページの段組など）はすべて
<h○>要素(見出し) - HTML リファレンス
HTML5 ISO-HTML HTML4/XHTML1 詳細 HTML5 での定義。 平成30年 1月17日現在の定義です。 要素の定義 見出し。 カテゴリ フロウ内容要素 見出し内容要素 "明確な"内容 要素が置ける箇所 フロウ内容要素が置ける箇所。 内容モデル フレージング内容要素。 定義されている属性 グローバル属性のみ。 在来 HTML でのタグの省略 開始タグ×・終了タグ×。 DOM インタフェイスでの扱い HTMLElement インタフェイスを実装した HTMLHeadingElement インタフェイス。 ISO-HTML (JIS-HTML, ISO/IEC 15445:2000)での定義。 要素の定義 見出し。 カテゴリ ブロックレヴェル要素。 要素が置ける箇所 <body>要素の直下。 内容モデル インライン要素。 定義されている属性 コア属性 国際化対応属性 のみ。
見出し構造とツリー構造明示 @ ぽかぽかWeb研究室
どのような方法が定められているか 仕様としては、以下のあり方が考えられています。 hn 要素に関係する要素群を、hn 要素ごと div 要素で括る (旧来の (X)HTML で最も行われてきた方法) hn 要素に関係する要素群を、まとめて divn で括る。 hn 要素自体は divn 要素では括られない (ISO/IEC 15445 の Pre-HTML の方法) hn 要素のみで階層構造を作る (XHTML Primary の方法) section 要素の入れ子で階層構造を明示。見出しは h 要素で明示(かつて XHTML 2.0 (2022 年現在廃止)で提唱されていた方法) セクションの役割 (article, hgroup, section 等) を持つ要素と見出し (h1 ~ h6 各要素) の組み合わせで階層構造を明治する方法 (HTML Living Standard で
divを使うということ - Personnel
人の頭は論理的なものを解釈するようにできている。視覚情報は、文書の論理構造を理解する為の媒体となり得る。故に文書の論理構造に基づいたデザインは、それを理解する手助けとなるだろう。 従って、著者が極めて重要であると認識する（読者に伝えたいと考える）文書構造は、視覚情報に変換すると、より良い。しかし、HTMLのマークアップで明示できる文書構成要素は、最低限のものに限られている。故に、それらに含まれない要素をdivやSPANを用いてマークアップし、CSSを通じて視覚情報に変換することは有益である。 Foot note この記事のURI参照 http://members.jcom.home.ne.jp/jintrick/Personal/css_div.html#overture しかし、私はHTMLで訳もなく複雑な階層構造を表現しようとするのには反対です。理由は2つ。 ある程度ツールに
dlで写真をマークアップ | d-spica
dlで写真をマークアップ 2007-02-15 0 0 XHTML/CSS CSS, dl, XHTML dl，dt，ddの定義リストで写真をマークアップしてみました。 八ヶ岳・甲斐駒ヶ岳 の記事に写真を何枚か載せました。写真とその説明（キャプション）のセットでは，dt要素によって説明する対象を示し，dd要素にその説明を書くと，文書の構造がはっきりします。 <p><img src="/photo/yatsugatake02.jpg" alt="八ヶ岳" /><br /> 山梨県韮崎市神山町鍋山からの八ヶ岳。</p> と，下の記述を比べてみてください。 <dl class="image"> <dt><img src="/photo/yatsugatake02.jpg" alt="photo:八ヶ岳遠景" /></dt> <dd>山梨県韮崎市神山町鍋山からの八ヶ岳。</dd> </dl> dt
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
HTML 及び XHTML 1.x の階層表記に関する文書