タグ

ブックマーク / trans.hatenablog.jp (10)

  • WAI-ARIA導入(日本語訳) - Trans

    著者: Gez Lemon件名: Introduction to WAI ARIA日付: 2008年8月1日URL: http://dev.opera.com/articles/view/introduction-to-wai-aria/訳者: Arata Kojima著作: This article is licensed under a Creative Commons Attribution, Non Commercial - Share Alike 2.5 license. WAI-ARIA導入 ARIAにはじめて触れる人たちのためにこの記事は書かれている。障害を持つ人たちがWebを使うにあたってぶつかる潜在的な難しさとHTMLの理解を必要とする。ユーザを観察すると、いくつかのRIAと親和性が高いことが分かるだろう。 この記事を読んだあと、ARIAが何の役に立つか、Webサイトにど

    WAI-ARIA導入(日本語訳) - Trans
  • 聴覚障害とユーザーエクスペリエンス(日本語訳) - Trans

    著者: Lisa Herrod件名: Deafness and the User Experience日付: 2008年8月12日URL: http://www.alistapart.com/articles/deafnessandtheuserexperience訳者: Arata Kojimaその他: Translated with the permission of A List Apart Magazine and the author[s].あなたは何度もこの質問をされたことがあるだろう。もしあなたが選ばないといけないとすれば、どちらを選ぶだろうか。耳が聞こえなくなるか、目が見えなくなるか。この質問は、難聴がある意味視覚障害とは正反対のものだという誤解を生む。それはまるで障害の2進法表現のようなものだ。難聴のためのアクセシブルなデザインというものに私たちはあまり驚かないだろう。そ

    聴覚障害とユーザーエクスペリエンス(日本語訳) - Trans
  • Webサービスにおけるショートカットキーの原則 - Trans

    Webサービスにおいてもデスクトップアプリケーションと変わらない使用用途のものが増えています。そこで使用頻度が上がるにつれてほしいなと思うのがショートカットキーです。 ショートカットキーのユーザビリティ よく使うソフトウェアにショートカットキーが実装されていると嬉しいものです。何度も繰り返す作業を簡単に行うことができるようになります。 今までは使用頻度が高いソフトウェアはその多くがデスクトップアプリケーションでしたが、Gmailを始めとしてデスクトップアプリケーションと遜色ないWebサービスが多数現れるようになってきました。 ただ、デスクトップアプリケーションと違い、Webサービスにおいてはそのショートカットキーの実装方法が共通化されているわけではありません。そこで、一度現状のWebサービスを比較し、ショートカットキーの原則を作ってみようというのがこのエントリーの趣旨です。 そのために、当

    Webサービスにおけるショートカットキーの原則 - Trans
  • 携帯用の告知ページのHTMLとCSSを公開しておきます。 - Trans

    インクルーシブデザインワークショップの告知ページの携帯用HTMLCSSを書いたので、せっかくだから公開しておきます。 モバツイにインクルWSの広告出してるよ! 先日から宣伝しているインクルーシブデザインワークショップ with Re:Creator's Kansaiですが、先週あたりから携帯電話でもそれなりのデザインで閲覧できるように対応させました。 理由はワークショップそのもののテーマが携帯電話ということもありますし、またモバツイに無料で広告を出させてもらえると知り、f-shinさんにお願いすると快く承諾をいただいたので、せっかくならPCサイトを携帯で見てもらうのではなく、携帯用のページを用意しようかと思った次第。 せっかくだからコードを共有 コーポレートサイトそのものを携帯対応にしてほしいという案件は少なくとも僕の周り(NPO法人や公益法人等)では聞かないのですが、河野武さんのスライ

    携帯用の告知ページのHTMLとCSSを公開しておきます。 - Trans
  • Web制作者ってとりあえずalt属性は空にしておけばいいって思ってるよね? - Trans

    アクセシビリティの基でありながら、奥が深いalt属性。こんな視点もあるのだということを書いておきます。 追記(2008年7月14日):文章中に誤解を招く表現がありましたので、文章を追記しました。 ある視覚障害者の意見 上のタイトルは皆さんを煽っているわけではなく、僕が実際に言われたこと。 どこのセミナーか講演会かは覚えていないのですが、決してプロレベルではないが自分でもWebサイトを制作できる全盲の視覚障害者(スクリーンリーダー利用者)がそのときに言っていた言葉。 もう少しちゃんと説明すると、もし何らかの画像があった場合に、僕たちのようなWebサイト制作者がそのimg要素のalt属性に何を入れればよいのかをパッと閃かなかったときに「とりあえず」alt属性を空にしているよね、と言われたということです。 僕はこれを言われたときに当に胸に刺さるものがありました。思い当たる節が多すぎた(追記(

    Web制作者ってとりあえずalt属性は空にしておけばいいって思ってるよね? - Trans
  • HTML×CSSのプレビュー型とアーキテクト型コーディングフロー - TRANS [hatena]

    CSSにはプレビュー型とアーキテクト型コーディングフローというのがあり、今後はアーキテクト型コーディングが主流になるのでは!というアイディアを思いつき、実際にコーディングしてみたら。・・・挫折しました。ただ、こういう考え方もありなのかなと思い、書いておきます。 プレビュー型コーディング 先に申し上げておきますが、このプレビュー型とアーキテクト型コーディングフローとはどこかのCSSハッカーの言葉ではなく、僕が便宜上名付けただけです。というわけで知った顔して誰かに話しても、全く通じないこと請け合いなので気をつけてください。 さて、ここでいうプレビュー型コーディングとはこんなコーディングフローのことを意味しています。 HTMLをコーディング PhotoshopやFireworksの画像をスライス HTMLで書いたid属性やclass属性を軸にCSSをコーディング 多少の前後はあるにせよ、このフロ

    HTML×CSSのプレビュー型とアーキテクト型コーディングフロー - TRANS [hatena]
    ciqlie
    ciqlie 2008/07/05
  • 印刷用デザインをきれいにまとめるための7つのポイント - TRANS [hatena]

    印刷用デザインもWebサイトにとっては1つのデザインだと言えます。制約がある印刷用デザインをきれいにまとめるためのポイントを上げてみました。 印刷用デザインをどうするか。 当ブログで印刷用CSSをはじめて取り上げたのが2006年12月でした。また、2007年4月にも印刷用CSSをもっとよくするための4つのTipsという内容で取り上げました。 さて、今回取り上げるのは今までと違い、印刷用CSSのコーディングではなく、純粋に印刷用デザインはどのようなものがよいか、というものです。コーディングではなく、いかにデザインするか。 ちょうどアックゼロヨン・アワード2007の結果発表もあったことなので、その受賞作の印刷用デザインを参考にしました。また、ADP: 印刷用CSSの書き方(基編)もかなり(むしろほとんど)参考にさせてもらいました。そのポイントを以下の7つにまとめました。 なお、文末にアックゼ

    印刷用デザインをきれいにまとめるための7つのポイント - TRANS [hatena]
    ciqlie
    ciqlie 2008/05/19
  • リンクテキストとアクセシビリティとスクリーンリーダーの動作 - TRANS [hatena]

    リンクテキストをスクリーンから隠したいときに、どんな方法が最もアクセシブルなのでしょうか。 Yahoo! User Interface Blogより もう3ヶ月ほど前のことですが、Yahoo! User Interface Blogで面白い取り組みをしていました。Empty Links and Screen Readersという記事です。その取り組みとは、リンクテキストをスクリーンから隠すための方法を1つ1つ検証し、どの方法がアクセシブルなのかを調査するというものです。 Yahooが調べたのは以下のリンクです。 通常のテキストとそれに対するリンク テキストもtitle属性もないリンク title属性はあるが、テキストがないリンク テキストの代わりに空白を入れたリンク これらのリンクに次のCSSを当てます。 特に指定しない offscreen visibility: hidden displ

    リンクテキストとアクセシビリティとスクリーンリーダーの動作 - TRANS [hatena]
  • ブロガーのためのアクセシビリティガイドライン - Trans

    唐突ですが、ブログやWebサイトを更新する際に、よりアクセシビリティが高いコンテンツをどうすれば書くことができるのか、そういったガイドラインを公開します。 といっても、元々は他団体向けにWebサイトを制作している際に、「結構、Webには詳しい」方にコンテンツを書いてもらっていたのですが、時折「概  要」とか、「2007年1月11日(水)」といった記述が見られ、「あー、このままでいくと、更新作業を今後やってもらうのってすごく不安だな」と思いました。そこで、どうすれば音声ブラウザなどがうまく対応できるようにコンテンツを書けばよいのかをガイドラインにまとめてみたのですが、せっかくですので、ウェブ上で公開することにしました。 前提として、 アクセシビリティに詳しい方にとっては、「何を今更」という内容。 デザインやマークアップよりも、コンテンツを書く=ウェブライティングに特化したガイドライン。 ブロ

    ブロガーのためのアクセシビリティガイドライン - Trans
  • ヤコブ・ニールセン氏の考えを元に、ユーザビリティガイドラインを作った。 - Trans

    またもや、唐突ですが、ユーザビリティのグル、ヤコブ・ニールセン氏の主張や考えを元にユーザビリティガイドラインを作りました。 ヤコブ・ニールセンの考えをまとめたユーザビリティガイドライン::NPO法人しゃらく 主に参考にしたのは、ヤコブ・ニールセンのAlertbox -そのデザイン、間違ってます- (RD Books)と新ウェブ・ユーザビリティ、そして体のJakob Nielsen博士のAlertbox。以前から、氏の書籍は目を通していたのですが、どうもまとまった記事が見つかりませんでした。もちろん、2005年 ウェブ・デザインの間違いトップ10などの記事は有名だとは思いますが、いかんせん「やってはいけないこと」ばかりで、「何をやるべきなのか」が掲載されていません。 でも、氏の書籍を読むと、所々に「何をやったほうがよいのか」について書いてあります。かといって、わざわざユーザビリティのチェッ

    ヤコブ・ニールセン氏の考えを元に、ユーザビリティガイドラインを作った。 - Trans
  • 1