Danger! ARIA tabs » Simply Accessible
At Simply Accessible, we believe strongly in including people with disabilities in our usability studies. We test both code and design prototypes as well as web pages in production, and it’s incredibly important for us to see how our users interact with our clients’ sites. It’s difficult to predict how different types of users will experience a given interaction. The results of usability testing c
Web Componentsのアクセシビリティ
IIJ社内で行われている新人向けハンズオン勉強会「IIJ Bootcamp」で行われた "DevOps Overview" です。 開発者と運用者がうまくいくには。効率的な時間の使い方。自動化の話。Kubernetesなどを紹介します。 ▼IIJ Bootcampについて IIJ Bootcampとは、様々な技術に触れることを目的としたIIJ社内で行われている新人向けハンズオン勉強会です。 https://iij.github.io/bootcamp/ 各技術が誕生した経緯・歴史、ほかの技術と比較といった知識を得るためのきっかけとして、さまざまな言語・フレームワーク・ツールに触れて実際に動かすハンズオンを行っています。 カリキュラムにはハンズオンだけでなく、「overview」として技術ジャンルの全体像や歴史などを紹介する回も設けています。
WAI-ARIA - an introduction to accessible rich internet applications (1 day workshop) / Darmstadt / 22 January 2015
WAI-ARIA - an introduction to accessible rich internet applications (1 day workshop) / Darmstadt / 22 January 2015 This document introduces the Accessible Rich Internet Applications (ARIA) specification. It discusses: 1) The need for ARIA to make complex web applications accessible to assistive technologies like screen readers, as traditional HTML elements may not adequately convey semantics. 2) C
2015年のWebアクセシビリティ | gihyo.jp
あけましておめでとうございます。株式会社ミツエーリンクスの黒澤剛志です。本稿では、昨年に引き続いて、2015年のWebアクセシビリティの短期的な予測を寄稿させていただきます。 HTML5がW3C勧告に 2014年10月、HTML5仕様がW3C勧告として公開されました。 W3C勧告として公開されることは、その仕様はブラウザーなどに既に実装されていることを意味しています。Webアクセシビリティの観点からは、HTMLのセマンティクスがユーザーに伝わるかどうか、という点も重要です。この点に関しては、2014年を通して多くのブラウザーが改善に取り組みました。特に、これまで対応が弱かったGoogle Chromeでの取り組みが目立ちました。HTML5 Accessibilityのスコアを見ると、Goolge Chrome（Windows版）は、2014年3月には47でしたが、2014年11月には83.
入力フォームのプレースホルダーを使ってはいけない
入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル
kakipy.com
kakipy.com 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
<ruby>関連要素って駄目駄目 - WebStudio
もずはっく日記(2013年4月) 2013年4月24日 <ruby>関連要素って駄目駄目 初回投稿日時: 2013年04月24日08時50分50秒 最終更新日時: 2015年02月21日15時45分29秒 カテゴリ: HTML XHTML 雑談 SNS: Tweet (list) <ruby>関連要素の仕様について色々と思うところが多いので、この日記にまとめておこうと思います。 私の結論を先に述べておくと、一言、酷い仕様、です。 まず、<ruby>関連要素の歴史を振り返ってみましょう。 まず、<ruby>関連要素はIE5で独自拡張として実装されました。ルビを振りたい日本人に一定の支持を受けていた印象があります。ですが、独自に暴走して仕様を決めてしまっているため、他のブラウザベンダ等との協議を経て、ブラッシュアップされたものでないのは当然と言えます。これが第一の不幸です。 そして、Mic
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
構造化テキストの間違ったエスケープ手法について : 404 Blog Not Found
2010年09月22日21:30 カテゴリLightweight Languages 構造化テキストの間違ったエスケープ手法について 昨晩のtwitter XSS祭りは、ふだんもtwitter.comは使わない私には遠くの祭り囃子だったのですが、せっかくの自戒の機会なので。 Kazuho@Cybozu Labs: (Twitter の XSS 脆弱性に関連して) 構造化テキストの正しいエスケープ手法について 正しいアプローチは、全てのルールを同時に適用することです。 これは残念ながら(おそらく)必要条件であっても十分条件ではありません。 こういう(かなりええかげんな)正規表現でtweetをparseしていたとします。 re_http = '(?:https?://[\\x21-\\x7e]+)'; re_user = '(?:[@][0-9A-Za-z_]{1,15})'; re_hash
コンテンツ・モデル
メタデータ・コンテンツ <base /> 空 <link /> 空 <meta /> 空 <noscript>-</noscript> スクリプトが無効な場合:0個以上のlink要素, meta要素, style要素 スクリプトが有効な場合:テキスト <script>-</script> src属性がある場合: 空、もしくは著作権情報やAPI 情報といったスクリプトの説明文 src属性がない場合: JavaScriptのコード等(text/javascript以外を用いるのであれば、type属性は必須) <style>-</style> CSSのコード等(text/css以外を用いるのであれば、type属性は必須) <title>-</title> テキストのみ 必須要素であり、必ず1個だけ定義 フロー・コンテンツ <a>-</a> トランスペアレント(ただし、インタラクティブ・コンテンツ
HTML5 + WAI-ARIA: 入門篇
このサイトを HTML5 でリニューアルした際に保留としたまますっかり忘れかけていましたが、ようやく WAI-ARIA を導入してみました。 WAI-ARIA は W3C の Web Accessibility Initiative (WAI) が公開している技術仕様で、Web コンテントや Web アプリケーションのアクセシビリティを強化することを目的としています。具体的には、Web ブラウザや支援技術 (AT) がコンテントのセマンティクスをより適切に認識できるよう、HTML ドキュメントに要素の「役割」や「状態」といった詳細な情報を付与するものです。名称に RIA とあるように、Ajax などによるリッチ・インターネット・アプリケーションをおもな対象とした仕様ですが、HTML5 によるシンプルな Web ページに取り入れることもできます。ここでは WAI-ARIA の HTML5 へ
H18年度ウェブアプリケーション開発者向けセキュリティ実装講座 | 水無月ばけらのえび日記
【講演1】 脆弱性の届出情報の深刻度評価についてCVSS のお話。「IPA が受付けた脆弱性をCVSSを用いて分析した結果を紹介します」ということで、具体的にこんな事例がこうなった、という話を期待していたのですが……。残念ながら統計データだけで、具体的な事例は出ませんでした。 もっとも、それは私の期待が大きすぎただけで、話としては普通に面白かったと思います。 【講演2】 安全なWebアプリケーションの作り方（番外編）極楽せきゅあ日記 (d.hatena.ne.jp)などで有名な園田さんの講演。中心はフレームワークのお話で、あとは書籍の脆弱性のお話など。 書籍の話ですが、個人が批判する分には問題ないと思うものの、何をもって誤りとするのかが難しいですね。「のけぞる本!」なんてコンテンツがありますが、これは HTML の仕様に照らして間違いだと言っているので、間違いだと断じるだけの論拠があります
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
HTML5のCustom Data Attributeは、Microdataよりも気軽にデータを埋め込める
HTML5のCustom Data Attributeは、Microdataよりも気軽にデータを埋め込める HTML5にはMicrodataというメタデータを埋め込むための仕様がある、ということを、「HTML5のMicrodataとは何か？ 」「HHTML5のドラフト仕様書からMicrodataの抄訳 」という2つの記事で紹介しました。 そのMicrodataよりもずっと手軽にHTMLに独自データを埋め込む方法が、HTML5では提供されています。それが「Custom Data Attribute」です。 すでに使われている独自属性 あるタグに独自の属性を付加したいという要求は、まれに生じます。 追記12/2：rel属性はHTMLの正式な仕様でした。そのため、以下の例は独自属性の例としては正しくないので省略させていただきます。すいません） 例えば、グーグルなどの検索エンジンは、スパム対策とし
MicrosoftがHTML5からcanvas 2Dの仕様からの分離を提案。 - k3akinoriのWebデザインの日々日記
twitterでHTML5watcherをフォローしていたら気になる情報が。 HTML5watcher RT @p_g_: RT @t_trace: MSがCanvasをHTML5から外そうよって提案してる。してる。 RT @tweetmeme Microsoft Wants to Separat… HTML5watcher RT @HenrikJoreteg: Microsoft wants canvas removed from HTML5 [...]would reduce the need for Silverlight http://tr.im/CO9Y via @fak3r @jen… 早速それぞれの情報源にアクセスしました。リンク（いずれも英文です）：一つ目の情報源、二つ目の情報源。 英語は苦手ですが、それぞれ何が書いているのか翻訳にチャレンジしてみました。一部はGoogle
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML［table要素］表がレイアウト目的でないことを示す（廃止） - TAG index
「雑感」の補足
HTML5の講演資料を公開しました
20090925 HTML5の過去、現在、未来
