タグ

(x)htmlに関するpicnicgraphicのブックマーク (109)

  • XHTML 2 WGが活動終了へ、XHTML 2.0も策定終了に | Web標準Blog | ミツエーリンクス

    タイトルのとおりですが、XHTML 2.0をはじめとする各種XHTML仕様を策定していたXHTML 2 WGの活動が、年内で終了することがアナウンスされました。W3Cは、今後はHTML5に注力すると発表しています。 今後のXHTMLHTML5で XHTML 1.1などのメンテナンスは活動終了までに行うものの、次世代のXHTML仕様はXHTML2 WGで行いません。すなわち、XHTML 2.0の策定は終了ということになります。 今後のXHTMLは、HTML5で定義されます。名前が「HTML5」とあるため紛らわしいのですが、HTML5仕様にはXML構文も含まれており、これは「XHTML5」と便宜的に呼ばれています。XMLでもcanvasやvideo要素などを利用することができるのです。 「XHTML 2.0と統合する」というわけではありませんが、機能のほとんどすべてがXHTML5でもカバーで

    picnicgraphic
    picnicgraphic 2009/07/03
    「W3Cは、今後はHTML5に注力すると発表/HTML5仕様にはXML構文も含まれており、これは「XHTML5」と便宜的に呼ばれています」
  • Slot5000 yang mempersembahkan korban dari situs resmi.

    Jika kamu ‘re mencari sebuah kasino online yang menerima beberapa metode, deposit dan penarikan slot5000 mungkin. satu untuk anda Slot5000, memiliki banyak manfaat termasuk bonus yang mulia dan telefon kompatibilitas. selamat datang Anda dapat bermain di real-time dari setiap perangkat, dan sesuai dengan turnamen dan aman adalah deposito yang besar ditambah.Selain itu, anda dapat menikmati pengala

    Slot5000 yang mempersembahkan korban dari situs resmi.
    picnicgraphic
    picnicgraphic 2009/06/18
    「HTMLメールのために、参照しているCSSをインラインに変換してくれる/URLを指定するかHTML ソースをコピーして変換」
  • パンくず詳解 | コリス

    パンくずの由来や概要、特長をはじめ、設置の判断基準、実装のよくある間違い、デザインのポイント、クラシックなものや進化したパンくずのショーケースなどをSmashing Magazineから紹介します。 Breadcrumbs In Web Design 以下、その意訳です。 パンくず ナビゲーションは、大量のページを保持するウェブサイトで、ナビゲーション機能を拡張することができます。 パンくずの大きな有用性は、ウェブサイトの訪問者が上の階層に移動する際、少ないアクションで実現させることです。 このことはウェブサイトのセクションやページのファインダビリティ(見つけやすさ)を改善するものとなります。 また、ランディングページ(検索などから訪れた最初のページ)にも非常に効果的で、ユーザーの現在の場所を明示するだけでなく、文脈のヒントとなるインフォメーションも提供します。 What is a bre

    picnicgraphic
    picnicgraphic 2009/04/01
    パンくず説明用に良さそう。
  • 送信ボタンの上にリンクがあればtabindex=-1に | ランサーズ社長日記

    いいね! 1 ツイート B! はてブ 86 Pocket 8 入力フォーム間の移動はマウスで行いますか?tabで移動しますか? 例えばtabでログインフォームを移動していて、IDとパスワードを入力して、送信ボタンを押そうとする時に、送信ボタンの上にリンクがあって、間違ってリンクを押してしまい、とてもストレスを感じたことはありませんか? 年始に興味がわくような話題ではないかもしれませんが、ちょっとしたTIPSに。。 ライブドアさんを例に出して申し訳ないのですが、ライブドアさんのログイン画面には「ID・パスワードを忘れた方」というリンクがあります。 パスワードを入力した後にtabを押すと、このリンクにカーソルが当たります。フォーム間の移動をtabで行い、最終フォームに来ると「tab + Enter」が癖になっている人に取って、このリンクを間違って押してしまうことが結構あります。リンク後に戻って

    picnicgraphic
    picnicgraphic 2009/01/14
    「tabindexはタブ順序を明示的に指定するオプションですが、「-1」を指定すると、リンク機能は残したまま、フォーカスが移動しなくなります」を参考。
  • CopyCode :: Firefox Add-ons

    CopyCode 1.0 by DylanT experimental Categories Web Development CopyCode allows you to select a region of text from FireFox and copy it with the HTML formatting via the keyboard shortcut or the button on the right click menu. Review at http://www.ghacks.net/2008/11/07/firefox-copy-code/ Not yet rated

    picnicgraphic
    picnicgraphic 2008/11/12
    [「ブラウザの右クリックやショートカットから、HTMLのコードをコピー」
  • Flashの上に(X)HTMLを重ねる - 448.jp blog

    「Flashの上に(X)HTMLを重ねたいんですけどー」という声がどこからか聞こ...

    picnicgraphic
    picnicgraphic 2008/08/14
    「Flashと重ねたい要素を、CSSのz-indexで重ねる/Flashのwmodeをopaqueかtransparentに/wmodeがデフォルト値(normal)だと、Flashのz-indexが無視されて最前面をキープしてしまうので注意」
  • label要素とその挙動 | Web標準Blog | ミツエーリンクス

    先週取り上げたmaxlength属性に引き続き、今回はlabel要素について調べてみました。 label要素とアクセシビリティ・ユーザビリティ input要素そのものには、ラベルを記述する仕組みが用意されていません。このため、スクリーンリーダーなどでフォームコントロールの読み上げに支障が出ることがあります。アクセシビリティの確保のため、各フォームコントロールにはlabel要素を設けることが必要でしょう。 さて、label要素はアクセシビリティにのみ効果があるというわけではありません。ラベルを指定することは、ユーザビリティの向上にもつながります。 たとえば、チェックボックスやラジオボタンなどのコントロールは、それ自身のサイズが小さいため、クリックをしにくいという欠点があります。しかし、label要素でラベルとフォームコントロールを結びつけることにより、ラベルをクリックしたときにチェックをつけ

    picnicgraphic
    picnicgraphic 2008/07/24
    label要素を使用したとき「IEではラベルにカーソルをのせたとき、結び付けられたコントロールも視覚的に反応する」FirefoxとOperaは視覚的反応なし。Safariもほぼ同様だがクリック中はチェックボックスの色が少し暗くなる。
  • フォームのmaxlength属性 | Web標準Blog | ミツエーリンクス

    input要素には、maxlengthという属性が定義されています。先日社内でこの属性について質問をうけたので、すこし調べてみることにしました。 最大文字数を指定する属性 HTML4仕様書では、maxlength属性は次のように定義されています。 maxlength = number [CN] When the type attribute has the value "text" or "password", this attribute specifies the maximum number of characters the user may enter. This number may exceed the specified size, in which case the user agent should offer a scrolling mechanism. The de

    picnicgraphic
    picnicgraphic 2008/07/18
    入力中の文字は読むが切り取りを予想できないFxやSafariと指定文字数を超えた文字は読めないがテキストボックスに仕掛けがあると暗示するIEやOpera→FBを行う仕組みがブラウザに標準導入されるべきかも
  • tfoot に関するエントリーの補足

    前のエントリー、「tfoot は tbody の前に書いた方がいいよ」では、行グループ、tfoot 要素の記述位置に関して hxxk.jp さんのエントリーに乗っからせて頂く形で書きましたが、該当エントリーのタイトルに突っ込みをいくつか頂いたので補足エントリー上げます。 突っ込みの内容としては、「書いた方がいいよ」 というタイトルの書き方だと、「書いても書かなくても自由だけど、書いたほうが吉」 と受け取る人がいて、ミスリードじゃないのということなんですが、確かにおっしゃる通りなのでその辺を補足したいと思います。 で、いきなり言い訳からなんですが、該当エントリーのタイトルを 「書いたほうがいいよ」 としたのは、 hxxk.jp さんのエントリーに対する突っ込みが主な内容だったので、hxxk.jp さんに向けて語りかける形で書いたからなんですね。なので、エントリー文では 「仕様書には tfo

    tfoot に関するエントリーの補足
    picnicgraphic
    picnicgraphic 2008/06/19
    「tfoot は、テーブル内で、tbody よりも前に出現しなければならない。こうしておくと、表データが大きい場合などに、表内のデータをすべて取得するまで待たずにユーザーエージェントがフッタのレンダリングが行える」
  • 3キャリア対応ケータイXHTMLのTIPS 8つ : アシアルブログ

    最近ケータイサイトの開発を行っているのですが、キャリアや機種によって動作にいろいろと違いがあり、なかなか面倒ですね。 キャリアごとにテンプレートを分けて記述するのは手間なので、基的に共通テンプレートで記述したいところですが、どうしても振り分けをしないと駄目なこともあるため、今回やってみて気がついた違いなどについてまとめてみました。 なお、いわゆる第三世代携帯電話(DoCoMo FOMA, au WIN, SoftBank/Vodafone 3G)でXHTML対応機種のみを対象としています。 ■文字コード UTF-8で統一して大丈夫そうなのですが、DoCoMoのみ特定の文字(三点リーダーや丸数字など)をフォームから入力した場合に消えてしまったりするようですので、DoCoMoは入出力をShift_JISにする必要があります。 ※上記で特定の文字のひとつとしてあげました三点リーダーですが、UT

    3キャリア対応ケータイXHTMLのTIPS 8つ : アシアルブログ
    picnicgraphic
    picnicgraphic 2008/04/15
    Shift_JIS(for DoCoMo)/CSSはインライン(for DoCoMo)/GIFかJPEG/横228ピクセル以内/floatに加えてalign属性(for au)/ フォントサイズはキャリア判別して指定。+入力文字制御について参考。
  • ページではなくサイト全体をW3C HTML Validator でチェックする | ブログが続かないわけ

    ページではなくサイト全体をW3C HTML Validator でチェックする | ブログが続かないわけ
    picnicgraphic
    picnicgraphic 2008/04/10
    「サイトのTOPのURIを入力すると、そのサイトの全ページのValidationをチェックするツール/100ページまでで打ち切るように制限」
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
    picnicgraphic
    picnicgraphic 2008/04/09
    「XHTMLからスタイルシートの枠組みを作ってくれる、というジェネレータ」の説明。
  • hn要素を各エリアに配置し、アクセシビリティを高くする。 - Trans

    ページの各エリアに対してhn要素を使い起点を設けることにより、アクセシビリティを高めることができるかもしれません。 ある全盲の音声ブラウザユーザの意見 最近、ある全盲の音声ブラウザユーザの意見を聞く機会がありました。彼女が主張する使いやすいWebサイトとは以下の3つとのことでした。 ページ全体の構造がイメージしやすいこと 迷子にならないように道しるべがあること 自分の行きたい場所にすぐに行けること 1つ目はWebサイトの標準的なデザインに従えば、ある程度達成できます。このあたりは、Alertbox: ウェブデザイン標準の必要性(2004年9月13日)を参考にしてください。 また、3つ目はWebコンテンツJISにもあるナビゲーションスキップである程度対応できます。ただ、ジャンプするのはメインコンテンツだけにするべきか、それともサブナビゲーションも入れるべきかなどの問題もあるとは思いますが。

    hn要素を各エリアに配置し、アクセシビリティを高くする。 - Trans
    picnicgraphic
    picnicgraphic 2008/03/18
    構造イメージ(→標準的デザイン)/行きたい場所(→ナビスキップ)/迷子にならない道しるべ(→各エリアにページ内起点→行き来楽・デザイン一貫性で構造理解)。HTML5ならarticle・aside要素で音声ブラウザによるナビ向上。
  • Another_HTML-lintへの言及 - 徒委記

    Another_HTML-lintへの言及 2007年7月31日 2007年8月1日 2007年8月4日 2007年8月5日 2007年8月6日 2007年8月7日 2007年8月8日 参考資料 取り敢えず作成。 2007年7月31日 lintで100点を取る必要はない : 雑記帳 : der Gegenwart 2007年8月1日 IT戦記 - xmllint で XHTML をバリデーション 2007年8月4日 まじかんと雑記: Another HTML-lint を使うべからず まじかんと雑記: まず lint より validator を使え まじかんと雑記: まず lint より validator を使え その 2 まじかんと雑記: Another HTML-lint について その 4 2007年8月5日 まじかんと雑記: Validator/lint に関して望まれる(べき

  • なんにしても僕はAnother HTML-lintをお勧めしたい | securecat's exblog

    正しく文法どおりに書いているので、W3C Markup Validation Serviceでは予想通り「あんたのHTMLはvalidだぜ!」と称えてくれるにも関わらず、AHLではなんかひどい言われようになる[謎]ことがあります。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <title>example</title> <p<a href="hoge.html"<em>link</em</a</p> たとえばこういうやつです。 HTML 4.01ではhtml要素、head要素、body要素のそれぞれの開始タグ・終了タグともに省略可能です。この例ではすべて省略しています。 また、HTML 4.01はSGML宣言において短縮タグが使えることになっていまして(SHORTTAG YES)、p要素の開始タグ以降で短縮タグを使用しています。 W

    なんにしても僕はAnother HTML-lintをお勧めしたい | securecat's exblog
    picnicgraphic
    picnicgraphic 2008/03/11
    「サイトの実装方針に基づいて、必要なチェックオプションだけを有効にして、それで検証するというのが最もオススメな感じ/採点結果を欲しいのではなくて、必要な分だけのテストをしたいというのが目的」
  • 実践アクセシブルHTML - altはつけるだけじゃなくて

    画像にalt属性を よく「画像にはalt属性をつけましょう」というフレーズを耳にするかと思いますが、これはサイトのアクセシビリティ改善における対応のうち、もっともメジャーなものであるといえます。WAIのアクセシビリティガイドラインであるWCAG1.0には「テーブルをレイアウトに使ってはいけません」というような内容の項目もありますが、これに対して「よっしゃ、テーブルを使うのをやめよう」とあっさりと決断してサックリとそのように作り変えることなど、ほとんどのサイトにおいて無茶な話でしょう。しかし「すべての画像にalt属性をつけよう」というのはアクセシビリティの対応要件に必ずといって良いほど含まれます。これなら、たとえ数千ページある規模のサイトであっても、とりあえず機械的な処理であるとか、人海戦術であるとかでも何とかなりそうだから……と思うからかもしれません。 たまにalt属性のことをaltタグと

    picnicgraphic
    picnicgraphic 2008/03/07
    「画像の代替がalt属性だということは、テキスト情報の代替として画像を使うという逆の見方/外観のみを充実させる装飾的な画像のaltは空/内容を充実させるための画像には、alt属性にも内容がついてくる」#なるほどぉぉぉ
  • imgタグにおけるaltの使い方について -- ごく簡単なHTMLの説明

    HTML文書においてはimg要素を使ってインライン画像を表示することができますが、Lynxのようなテキストブラウザや画像表示をOFFにしている利用者のためにはalt属性によって画像の代わりとなる代替文字列を用意することができます。いえ、正しくは「用意できる」ではなく「必ず用意しなければならない」ものです。HTML4においては、altはオプションではなく「必須」の属性とされています。 WWW利用者の環境 alt属性の使い方の基公式 伝えるべき情報 なぜalt文をうまく組み込めないのか alt="" ? img要素のtitle属性を使う WWW利用者の環境 近頃はNetscape NavigatorやInternetExplorerが全盛で、それらに合わせたページを作ることが当たり前のように思われていますが、実際は: これらのグラフィカル・ブラウザを使っているが、回線の事情や、よりスピーディ

    picnicgraphic
    picnicgraphic 2008/03/07
    画像に情報がないならalt=""だがアンカーが画像のみなら文字ベースブラウザにはリンクの手だてがない(クリッカブルマップは無意味なのでalt="")/サムネイルや音楽ファイルへのリンクは何がおこるか説明 を参考。
  • alt属性はいかに決定されるべきか | Takazudo Clipping*

    画像を閲覧できないユーザーでも内容を把握できるようにalt属性をつけましょうとは言うが、実際にはどのようにつけたらよいのかが実はかなりわからない。さらに納品前になんじゃこのalt!と突っ込まれる・・・。色々話し合ったりググったりした末にでた自分結論はこんなの。 前提 画像OFFのユーザー・音声ブラウザのユーザーが、画像の代わりにそのaltテキストが表示されても、ページ内容が分かる。但し、100%の情報を伝える必要があるわけでもない。そこに何の画像があるのかが伝わり、ページ内容を把握できる。 画像の中に文字がある場合

    picnicgraphic
    picnicgraphic 2008/03/07
    ページ内容を把握できるのが前提。長文はaltなしだと不明なので全部/製品の写真なら"製品写真"。型番までは載せずすぐ横にテキストで用意/リンクアイコンが画像の場合"*"などとするとリスト頭と明示できる を参考。
  • imgは画像、altは代替 - 徒書

    LSC1月17日分の17b alt属性で、img要素について気になる記述がありました。 「alt属性は画像の代替」と考えるからおかしなことになる。 HTML は文章にタグで意味付けするものだから、既にある文章(フレーズ)をマークアップした結果が img要素になるべき。つまり、「画像はあるフレーズの代替」が正しいんじゃないかと。 これはちょっとひねって考えすぎなのではないでしょうか。 HTML仕様書を素直に読めば、img要素は埋め込み画像 (Embedded image)であり、alt属性は代替テキストなのだから、それを逆に考えるというのは無理があるように思います。 HTMLを書く上での考え方として、野嵜さんにより提唱された「はじめにテキストありき」という言葉があります。これは自然言語で書かれた文書をマークアップする上ではとても重要な考え方ではあるのですが、一方で、HTMLは自然言語で書かれ

    picnicgraphic
    picnicgraphic 2008/03/07
    「img要素で示されたリソースがどういう類のものなのかくらいは、あらかじめ文書中で提示しておいて損はない」
  • HTML - meta タグの仕様詳細まとめ :: Drk7jp

    前エントリ - Internet Explorer のイメージツールバーを無効化する meta タグ で予告したとおり meta タグについて生まれて初めてまじめに調べてみました。改めて調べてみると知らなかったこと満載です。っていうか Web エンジニアたるもの一度は W3C勧告 くらいは一通り目を通しておかなくてはダメだなと思ったりしました。面倒なくらい分量があるけど。ひとまず meta タグ情報としての自分にとって永久保存版まとめという位置づけです。 まずは参考になったサイトの紹介から。 W3C勧告HTML4.01 :: The global structure of an HTML document W3C勧告HTML4.01 私的日語訳 :: The global structure of an HTML document(ja) rfc2616.txt Another HTML

    picnicgraphic
    picnicgraphic 2008/02/04
    meta要素についてまとめてくれてる。