»Next  1  |  2  |  3  | All
2007-07-31

Markup Validation Service

新しくなったW3CのHTML検証サービス | Web標準Blog[外部へのリンク]

新しいバージョン0.8.0ではアーキテクチャが一新され、検証時間の短縮や信頼性の向上が図られています。加えて、XMLの整形式や名前空間、MIME タイプに関するチェックなど、XMLに関するエラー検証の精度が高まっています。このため、今までvalidとされていたXHTML文書が新しい validatorではinvalidとなる可能性があることにご注意ください。

Markup Validation Service

チェックしてみると検証時間がやけに長い。青いアイコンもある

Valid アイコン

Valid アイコンを貼っている方は必ず確認を…「嘘っぱちだ！」と思われないうちに！

追記：再度チェックしてみるとかなり高速で検証できました！

タグ:

Posted by @Style : Entry 00:35 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-05-07

XHTML 1.1

MS、「IE 8」の基本設計を示唆--セキュリティと使いやすさを追求[外部へのリンク]

Wilson氏は、「標準化団体ではローカルストレージやセキュリティモデルの改善に関する作業が進んでいる」と語り、MicrosoftがW3Cと、HTMLバージョン5とXHTMLバージョン1および1.1の標準化で協力していることも付け加えた。

二年後には一気に加速するかもしれない。

タグ:

Posted by @Style : Entry 12:34 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-03-04

accesskey

キーボードによるフォームへのアクセス

該当するチェックポイント：

  • 9.4 リンクとフォームの構成部品、オブジェクトの全体を通しての論理的なTab移動順を設定しておく。 [優先度3]
  • 9.5 重要なリンク(クライアントサイド・イメージマップのリンクも含む)、フォームの構成部品とそのグループには、キーボード・ショートカットを付ける。 [優先度3]

11.1 キーボードによるフォームへのアクセス[外部へのリンク]

Movable Type デフォルトテンプレートのindividual_entry_archive.tmplにおけるコメントフォーム

<p>
<label for="comment-author">名前:</label>
<input id="comment-author" name="author" size="30" />
</p>
<p>
<label for="comment-email">メールアドレス:</label>
<input id="comment-email" name="email" size="30" />
</p>

隠し技的にaccesskeyを追加するよりも、accesskeyによるショートカットを設けていることを明記すべきである。

主要モダンブラウザのaccesskey対応

Internet Explorer 6
Alt + accesskey
Internet Explorer 7
Alt + accesskey
Firefox 2.0.0.2
Alt + Shift + accesskey
Firefox 1.5.0.10
Alt + accesskey
Opera 9.10
Shift + Esc + accesskey
Safari 2.0.4
control + accesskey

Posted by @Style : Entry 02:04 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-02-18

XHTML 1.1 Second Edition

XHTML™ 1.1 - Module-based XHTML - Second Edition W3C Working Draft 16 February 2007[外部へのリンク]

Here is an example of an XHTML 1.1 document.

<?xml version="1.0" encoding="UTF-8"?>
<!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"
     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
     xsi:schemaLocation="http://www.w3.org/MarkUp/SCHEMA/xhtml11.xsd"
     xml:lang="en" >
  <head>
    <title>Virtual Library</title>
  </head>
  <body>
    <p>Moved to <a href="http://example.org/">example.org</a>.</p>
  </body>
</html>

最大の変更はXML Schema 。text/htmlはどうなるのか…

タグ:

Posted by @Style : Entry 02:11 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-02-12

xml:lang属性

SEO対策とWeb標準のホームページ作成：xml:lang属性[外部へのリンク]

xml:lang属性は、指定した要素内の内容を書き表している言語を示します。 XHTML1.1 では、HTML互換の lang属性が廃止されたため、代わりに xml:lang属性を指定します。値は lang属性と同じでアルファベット2文字で言語の種類を表す言語コードを指定します。文書内で使用している言語を指定することで、検索エンジンのロボットが情報を収集する際の各言語別の文書インデックス化の手助けや音声出力環境の読み上げ時に言語特有の発声規則を使えるようになることが期待されます。

他文書の引用などで文書内（blockquote要素等）での言語コードが変わる場合がある。

このブログの2006年4月14日のエントリー：pre要素の引用部分も言語コードが変わっている

<blockquote cite="http://www.w3.org/TR/html4/struct/text.html#h-9.3.4" lang="en" xml:lang="en"><p>The horizontal tab character</p>
<p>The horizontal tab character (decimal 9 in [ISO10646] and [ISO88591] ) is usually interpreted by visual user agents as the smallest non-zero number of spaces necessary to line characters up along tab stops that are every 8 characters. We strongly discourage using horizontal tabs in preformatted text since it is common practice, when editing, to set the tab-spacing to other values, leading to misaligned documents.</p></blockquote>

ウェブコンテンツ・アクセシビリティ・ガイドライン1.0 HTML技術書：2.1 言語の変更を明示する[外部へのリンク]

同様に、複数の言語に対応したスピーチ・シンセサイザーが、適切なアクセントの正しい発音で内容を読み上げられるようになります。もし、言語の変更が示されていなければ、スピーチ・シンセサイザーは現在の言語内で最も適切だと思われる言葉で読み上げようとします。したがって、フランス語で車を表す「voiture」という言葉は、基本言語として英語を使用するスピーチ・シンセサイザーでは「voter」(投票者)と発音されてしまうことになります。

上で示したようにhtml要素で指定した以外の言語コードが出現するたびに再度指定する必要があり、音声出力の読み上げにも大きく影響する。

参考になるリソース

タグ:

Posted by @Style : Entry 01:53 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-02-08

map要素

map要素は複数のリンクをグループ化してナビゲーションの読み飛ばしに利用することができる。

ウェブコンテンツ・アクセシビリティ・ガイドライン1.0 HTML技術書[外部へのリンク]:6.2 リンクのグループ化とそれを読み飛ばす仕組[外部へのリンク]

【例】
この例では、MAP要素によってリンクをグループ化し、title属性によってそれがナビゲーション・バーであることを示しています。そして、グループ化したリンクの中の最初のリンクは、グループの後にあるアンカーへと移動するようになっています。また、各リンクは、リンクしていない印刷可能な(両端をスペースで囲った)文字で区切られていることに注意してください。 （【訳注】MAP要素には、HTML4.01の場合はname属性を、XHTML1.0の場合はid属性を必ず指定する必要がありますので注意してください。）

<BODY>     
     <MAP title="ナビゲーション・バー">    
       <P>
       [<A href="#how">ナビゲーション・バーを読み飛ばす</A>]
       [<A href="home.html">ホーム</A>]
       [<A href="search.html">検索</A>]
       [<A href="new.html">更新情報</A>]
       [<A href="sitemap.html">サイトマップ</A>]
       </P>
     </MAP>     
     <H1><A name="how">このサイトの使い方</A></H1>
   <!-- このページのコンテンツ -->     
   </BODY>

DTD

<!ELEMENT map ((%block; | form | %misc;)+ | area+)>
<!ATTLIST map
  %i18n;
  %events;
  id          ID             #REQUIRED
  class       CDATA          #IMPLIED
  style       %StyleSheet;   #IMPLIED
  title       %Text;         #IMPLIED
  name        NMTOKEN        #IMPLIED
  >

元々イメージマップのために定義された要素型であるため解説しているサイトも少ない。アクセシビリティアップを目指してmap要素を有効に利用しよう。

タグ:

Posted by @Style : Entry 01:25 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2007-01-22

dl要素

mixiのXHTML・CSS関連コミュニティでもたまに語られる【dl要素】は様々な使い方がされている。アットスタイルやBlogStyle[外部へのリンク]でも積極的に使用している。

XHTML+CSS (r)evolution: dl要素の応用例、ご意見募集[外部へのリンク]でも数件の利用方法がコメントがされ、その後のXHTML+CSS (r)evolutionでもプレゼンされている。

プレゼン資料（XHTML+CSS (r)evolution スライド[外部へのリンク]）によると

  1. h1-h6要素はページ全体から見た文脈上の見出しでしかないため、個別的・直接的な見出しをdt要素で示し、対応する内容をdd要素で示す方法が好んで使われる。
  2. dt要素の子要素にはテキスト/インライン要素しか置けないが、dd要素の子要素にはさらにブロックレベル要素も置ける。この内容モデルの自由さが多目的利用のひとつの理由に。
  3. dl要素はtable要素の使用を避ける目的でも使われる。th要素をdt要素に、td要素をdd要素になぞらえる。

DTDを見てみる

<!-- definition lists - dt for term, dd for its definition -->
<!ELEMENT dl (dt|dd)+>
<!ATTLIST dl
  %attrs;
  >
<!ELEMENT dt %Inline;>
<!ATTLIST dt
  %attrs;
  >
<!ELEMENT dd %Flow;>
<!ATTLIST dd
  %attrs;
  >

接尾演算子に注目

(dt|dd)+であるため、順序には関係なくdtまたはddのいづれか一方が1回以上出現すればよい

あるサイトを見て最近気になったのが、以下の例

<dl>
  <dd>
    <pre>(ソースコード)</pre>
  </dd>
  <dt>(タイトル)</dt>
</dl>

dtより先にddが出現している。DTDから考えると間違いではないが、文書の構造的にはおかしくはないか…

1月22日追記：記事を一部修正いたしました。

タグ:

Posted by @Style : Entry 01:50 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2006-10-04

IE7でabbr要素

abbr要素と acronym要素の違い外部へのリンク

現在、草案段階のXML技術による次世代HTML である XHTML2.0 において、実は acronym要素は廃止される予定です。

最新版の Win版Internet Explorer 7 より、abbr要素に対応することになったことで、ようやく abbr要素・acronym要素闘争問題にも終止符が打たれることとなりました。結論としては、本文書では主に abbr要素と acronym要素の両要素の違いについてみてきましたが、実は両要素を使い分けるというのは無駄なことでしかなく、略語はすべて abbr要素に統一しなさいということになるのでしょう。

IE7の対応についてはまったく確認していなかった。

早速確認。他のモダンブラウザのように下部に点線ボーダーが出ないので、カーソルを合わせてみないとabbrを使っていることが一切解からない。

abbr {
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #666;
}

またも、IE7用の対応が必要です…

タグ:

Posted by @Style : Entry 02:02 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2006-09-01

XHTMLの知識がないと

現在は閉鎖した個人的なブログへ2005年7月20日にエントリーしたものですが、本日、あえてこのブログにエントリーいたします。

去年くらいから、いろんなところで【ビジネスブログ】という言葉を見るようになった。

未だよくわからない。よくある社長Blogなのか、アフェリエイトを行うBlogなのか・・・それとも？ ビジネスブログウオッチを見てみたら、アフェリエイトばっかり。

私のサイトでは、ビジネスブログという言い方は一切していない。
テンプレートも【商用テンプレート】

Nucleusで構築した奥さんのサイトもコメントやトラックバックは受け付ける（本当はいらないんですが…）ようにしているけれども、サイドバーに一覧はない。だけどエントリーの中に買い物カゴは、ちゃんとある。
「BlogをCMSとして使う」という目標で、変更を続けている。（更新ではありません）

よく制作会社ではこんなことを書いてる。

ビジネスブログとは、ブログを利用したサイト構築サービスです。HTMLがわからない人でも簡単に、素早くサイトの更新をすることが可能となりました。SEOにも非常に相性の良いシステムになっていますので集客にも効果を発揮します・・・

自らをWebデザイナーと呼ぶ方もエントリーでbrを連発してみたり・・・
XHTMLの知識がないとエントリーは出来ません！

タグ:

Posted by @Style : Entry 23:06 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
2006-07-15

Internet Explorer 7

CSS実装徹底検証! そこが知りたいInternet Explorer 7外部へのリンク

かなり詳細までInternet Explorer 7に於けるCSS実装を検証している記事だ。

使用するサンプルソースはXHTML1.0 Strictで記述し、基本的にStandard(標準準拠)モードで表示する。IE7 beta2においても、Quirks(下位互換)モードで表示すると古いバージョンと同じ表示になってしまうため、注意が必要だ。また、特に断りのない限り、「Internet Explorer」は「IE」、「Internet Explorer 6」は「IE6」、「Internet Explorer 7 beta2」は「IE7 beta2」と略している。

やはりInternet Explorer 7でもapplication/xhtml+xmlをサポートしないのだろうか。

いつになったら正式にXHTML 1.1を利用できるのか？CSS以前の問題では…

タグ:

Posted by @Style : Entry 00:42 | Comment コメント (0) | Trackbacks トラックバック (0)

ページ先頭へ
»Next  1  |  2  |  3  | All

スポンサード　リンク

ページ先頭へ

Tags

Archives

Support

Search



Feed

Syndicate this site (RDF) Syndicate this site (XML)
Syndicate this site (ATOM)

Licenses

クリエイティブ・コモンズ・ライセンス
This weblog is licensed under a Creative Commons License.
Powered by
Movable Type 3.36

共同執筆書籍

Movable Type プロフェッショナル・スタイル MT4.1対応

みんなで止めよう温暖化

チーム・マイナス6%