並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 40 件 / 907件

新着順 人気順

a11yの検索結果1 - 40 件 / 907件

  • asada's memorandum (ゴッホの本当のすごさを知った日)

    English version 先日、北海道カラーユニバーサルデザイン機構(北海道CUDO)のイベントで、「色覚体験ルーム」というのを経験した。特殊な分光特性を持つライトに特殊な光学フィルタを被せたものを照明として使用しているその部屋の中では、一般型の色覚の人でも、P型(1型)やD型(2型)色覚の人と同様に色が見えてしまうのだ。つまり、特定の色の組合せにおいて、色の区別がつかなくなってしまう。こんなすごいものをよく作れたと思う。その部屋の中でいろいろなものを見たが、裸眼で色覚体験を行うのは、シミュレータを使ってディスプレイ上で見るのとはまた違った臨場感がある。貴重な体験だった。 部屋の中にフィンセント・ファン・ゴッホ(Vincent van Gogh)の絵のコピーがあった。その絵は、なんだか僕がいつも見ているゴッホと違って見えた。僕はゴッホの絵が大好きで、いろいろな美術館で実物を何点も見た

      asada's memorandum (ゴッホの本当のすごさを知った日)
    • これだけは押さえよう!住所フォームの作り方 - ケンオールブログ

      まとめ 住所フォームの作り方 住所フォームを作るときには以下の4つを押さえましょう。 オートコンプリート機能に最適化する 郵便番号フィールドは1フィールドにしてハイフン有無どちらも対応する モバイルUX優先なら郵便番号が入力されたら即座に補完。精度優先なら郵便番号補完ボタンを設置 住所フィールドは「都道府県」「市区町村」「町名以下」の3フィールドが基本。「建物」フィールドはオプション 本文 地域SNSのユーザー登録、ECサイトの配送先入力、資料請求、自治体サイトでの電子申請など、ウェブサービスを活用する上で住所入力は欠かすことができません。 住所入力をシンプルかつ正確に行えるような入力インタフェース(住所フォーム)は、離脱率を減らし、コンバージョン率を向上させる上で重要です。 郵便番号を入力すると対応する住所を自動入力する機能(郵便番号による住所補完)は、住所フォームの改善方法として最も効

        これだけは押さえよう!住所フォームの作り方 - ケンオールブログ
      • 40分でできるホームページ診断 ~最低限クリアしたい40項目のチェックシート | Web担当者Forum

        40分でできるホームページ診断 最低限クリアしたい40項目のチェックシート[訪問者目線編 2008年版] SEO? ユーザビリティの向上? それ以前にしなきゃいけない「サイト作りの基本のキ」を、あなたのサイトではちゃんとできているだろうか? 高度な施策に目を向ける前に、最低限クリアしておきたいチェックポイントをまとめてみた。あなたのサイトは何点とれるだろうか? TEXT:編集部 協力:株式会社 環 ウェブサイト作りの基本のキSEOやユーザビリティに限らず、キーワード広告、アクセス解析、LPO、リッチインターフェイスなど、サイトの効果をアップさせる手法はさまざまあり、Web担でも詳しく解説してきている。 しかし、そういった施策にコストを割く前に、現状の自社サイトが、訪問者が「あれれ?」とマウスをうろうろさせてしまうような状態になっていないか確認したことがあるだろうか。 そんなあなたのために、

          40分でできるホームページ診断 ~最低限クリアしたい40項目のチェックシート | Web担当者Forum
        • マイクロソフト アクセシビリティ ホーム

          マイクロソフトの製品などについてお問い合わせしていただく際は、チャットや電話やコミュニティへの質問を選択いただけます。 お電話が難しい場合はチャット、チャットが難しい場合はお電話など、ご自身の状況にあった方法でお問い合わせいただければと思います。 メールとFAXによるお問い合わせの受付は 2020 年 8 月末日をもって終了させていただきました。 チャットでお問い合わせをしていただくことで、より迅速に回答させていただき、オンラインサポートをさせていただくことも可能になります。

          • 「SEOに強いHTMLの書き方」についての個人的な見解

            「SEO に強い HTML の書き方」というツイートがそこそこバズっていて、その内容に対して駆け出しエンジニアの方たちが「参考になった」などと称賛の声を挙げていたのを見かけて思うところがあったのでこの記事を書きました。 元ツイの概要は次の通り。 body > main > article > sectionに h1は 1 ページに 1 つ(要キーワード) 見出しタグは毎度 section で囲む ヘッダーメニューは nav で囲む 画像に適切な alt を設定する title / description を書く 階層を意識して書く div はあまり使わない 画像は p で囲む この記事は元ツイおよび元ツイの投稿者を批判する意図で書いたものではなく、あくまで挙げられている内容に対する個人的見解をまとめたものです。 正しいか正しくないかをそれぞれの項目のはじめに書いていますが、あくまで僕個人の

              「SEOに強いHTMLの書き方」についての個人的な見解
            • Azureテクノロジ入門 2016 目次 - 日経BP書店

              • 盲目のiPhoneユーザーに聞いた、視覚を使わない驚きのスマホ操作術 | スタッフブログ | マイネ王

                画像:スマホのイラスト !? え、iPhoneってツルツルですよ!? 触ってわかるボタン、ほぼないですよ!? 『電話もメールもインターネットもしますよ』とのことだったのですが、 一体、どうやって使ってるの……!? き………… 気になる〜〜〜〜!!!! もっと話を聞かせて〜〜〜〜!!!! 画像:ダイアログ・イン・ザ・ダーク前での社領の写真 ということで、外苑前にある施設 「ダイアログ・イン・ザ・ダーク」 にやって来ました! 「ダイアログ・イン・ザ・ダーク」は、暗闇のソーシャル・エンターテインメント。完全な真っ暗闇の空間へグループを組んで入り、暗闇のエキスパートである視覚障がい者のスタッフの案内で、視覚以外の感覚を研ぎすませながら中を探検したりと、さまざまな体験ができる施設です。

                  盲目のiPhoneユーザーに聞いた、視覚を使わない驚きのスマホ操作術 | スタッフブログ | マイネ王
                • こんなにあった!シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由 | マミオン有限会社-パソコン・数学研修、法人研修

                  シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。 シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康食品の『皇潤』で有名なエバーライフです。 今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。 1. 各フォームがそこそこ大きく見やすい 2. 必須項目表示がわかりやすい 3. ふりがなが自動的に入力される 4. 住所が自動的に入力される

                  • 「終了前に、ただ伝えてほしい」――多くの開発者に届きますように。

                    オープンソースの集まりで1度しか実際にお会いしていませんが、お願いがあります。 富士通アクセシビリティ・アシスタンスというサービスが、2013年8月20日で提供終了します。つまり、あと20日。このソフトは視覚障がい者や色覚障がい者の方がどのように色を見ているかを確認できるツールです。Webサイト制作をしている人なら、今は必要なくても、いつか必要になるソフトです。 8月20日までにダウンロードすれば、8月21日以降もローカル環境で普通に使えるので、なんとかメディアで紹介して頂き、提供終了するまでに、少しでも多くの人に知ってもらいたいと考えています。 紙媒体だと、とても間に合わないのですが、ネット媒体なら、なんとかなるかも!と思い、お願いしたいと思いました。 視覚障がい者や色覚障がい者という障がいに興味がないかもしれませんが、外見では判断できない障がいなので、気付いていないだけなのです。 よか

                      「終了前に、ただ伝えてほしい」――多くの開発者に届きますように。
                    • ユーザビリティコラム:Jakob Nielsen博士のAlertbox

                      スクロールフェードの基礎 4月11日 読了までに約14分 スクロールフェードがユーザブルというよりも気が散るものになるかどうかは、その持続性、応答性、ページ上の要素への控えめな適用といった要素に左右される。このデザインパターンを正しく用いれば、ブランド認知を向上させ、ページの読み込みを最適化し、コンテンツをより理解しやすくすることができる。 このコラムについてUIデザイン・ユーザビリティ・UXデザインについて、その道の第一人者・ヤコブ・ニールセン博士(略歴)ら米Nielsen Norman Groupのメンバーが実例を交えて洞察するコラム『Alertbox』。その日本語訳を許可を得て公開しています。 デザインサイクルの各段階でアンケートを実施する方法 3月29日 読了までに約7分 ほとんどのUXアンケートは、デザインサイクルの最後の「耳を澄ます」フェーズで実施される。しかし、アンケートには

                        ユーザビリティコラム:Jakob Nielsen博士のAlertbox
                      • 実例で納得!シニアが使えないサイトの例 | マミオン有限会社-パソコン・数学研修、法人研修

                        パソコン教室でシニア層にインターネットの使い方を教えているときほど 「ああ、ここがもう少し改善されれば!」と吠えたくなる時がある。 「知りたい事」「申し込みたいもの」「買いたいもの」があって ワクワクしているのに、多くの人が、若い人に取っては「些細な」ミスで サイト上で目的を達成できずに諦めたり、 諦めきれないからとサポートセンターに電話して 「その情報はホームページに載ってます」と言われ落ち込んだりしている。 今日は大学の公開講座に申し込もうとしている70歳代後半女性の話。 ウキウキの申し込み「大学の公開講座申し込みたいの。英語をやり直したいのよ」といらしたMさん。 「新聞の折り込みで講座を見たのだけど、ホームページから申し込んでって書いてあって。 ホームページを見たのだけどどうすればいいのかわからないけど ホームページからしか申し込めないらしいから、やり方教えて」 とのこと。 チラシに

                        • 2022年におけるフロントエンド開発のベースライン

                          LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog TL;DR:2022にフロントエンド開発で最も考慮すべきユーザー環境は、パフォーマンスでは低スペックのAndroid端末、標準仕様では2年前のSafari、そしてネットワークでは4Gです。それに対してはJSへの過剰依存などが原因で主にパフォーマンスの面でのウェブ全体の対応がよくありません。 こんにちは!LINEフロントエンド開発室のダバロス アランです。この記事のタイトルを見て「釣りタイトルですね〜」と考えている方がいると思いますが今回に限ってはそれを大目に見てください。それはなぜかと言いますと、2021年から2022年にかけて私たちフロントエンドエンジニアが全体的に考え方を改める必要が出るほど大きな変化がありました。 その変

                            2022年におけるフロントエンド開発のベースライン
                          • Audacity: フリーのオーディオエディタ・レコーダー

                            Audacity is a free, easy-to-use, multi-track audio editor and recorder for Windows, Mac OS X, GNU/Linux and other operating systems. Audacity is free software, developed by a group of volunteers and distributed under the GNU General Public License (GPL). Programs like Audacity are also called open source software, because their source code is available for anyone to study or use. There are thousan

                            • 今まで文字を読めなかった子がある書体に変えたら読めるようになった!その書体への感想や今後への期待の声が集まる

                              リンク Wikipedia ディスレクシア ディスレクシア(英語: dyslexia、ディスレキシアとも)は、学習障害の一種で、知的能力及び一般的な理解能力などに特に異常がないにもかかわらず、文字の読み書き学習に著しい困難を抱える障害である。失読症、難読症、識字障害、(特異的)読字障害、読み書き障害、とも訳される。発達性読字障害(DRD; Developmental reading disorder)とも呼ばれる。1884年にドイツの眼科医ルドルフ・ベルリンによって報告され命名された。 2013年に改定された米国精神医学会の診断基準(DSM-IV) 22 users 206

                                今まで文字を読めなかった子がある書体に変えたら読めるようになった!その書体への感想や今後への期待の声が集まる
                              • 『JRで車いすユーザー乗車拒否にあいました』の方について『車イス乗車拒否の女性、10年前にも拒否されてメディアにの取材に応じる 社民党幹事として活動』とネットユーザの証言

                                10年前の記事は2010年10月の掲載なので、おおよそ10年半前といったところでしょうか。 特定非営利活動法人 共に生きるネットワークまなびやー|BtoBプラットフォーム 業界チャネル https://b2b-ch.infomart.co.jp/company/detail.page?IMCOMPANY=10644653 ご自身のブログにも過去記事を掲載されているようです>乗車拒否は乗者拒否/琉球新報連載14 : コラムニスト伊是名夏子ブログ http://blog.livedoor.jp/natirou/archives/51754463.html

                                  『JRで車いすユーザー乗車拒否にあいました』の方について『車イス乗車拒否の女性、10年前にも拒否されてメディアにの取材に応じる 社民党幹事として活動』とネットユーザの証言
                                • 入力フォームのプレースホルダーを使ってはいけない

                                  入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル

                                    入力フォームのプレースホルダーを使ってはいけない
                                  • Sign-in form best practices  |  Articles  |  web.dev

                                    Sign-in form best practices Stay organized with collections Save and categorize content based on your preferences. Use cross-platform browser features to build sign-in forms that are secure, accessible and easy to use. If users ever need to log in to your site, then good sign-in form design is critical. This is especially true for people on poor connections, on mobile, in a hurry, or under stress.

                                    • パスポート更新申請のPDFの仕様が酷いと聞いたので確認してみた - Windows 2000 Blog

                                      3rdに引っ越しました。 2010/12/31 以前&2023/1/1 以降の記事を開くと5秒後にリダイレクトされます。 普段の日記は あっち[http://thyrving.livedoor.biz/] こちらには技術関係のちょっとマニアックな記事やニュースを載せます。 Windows2000ネタ中心に毎日更新。 <body xmlns="http://www.w3.org/1999/xhtml" xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/"><p style="font-family:'Times';font-size:24pt;letter-spacing:0in"> Please wait... </p> <p style="font-family:'Times';font-size:12pt;letter-spacing:

                                        パスポート更新申請のPDFの仕様が酷いと聞いたので確認してみた - Windows 2000 Blog
                                      • 車いすを押してきた人間として、いま複雑な気持ちでいる

                                        俺は、爺さんと親父と2人の車いすを押してきた人間として、映画館の対応で炎上している今の騒動を複雑な気持ちで見ている。 少し愚痴を書き込みたい。 単純な話として、もし自分の働いているところにああいう車いすユーザーが来たら、表面的な対応は別としても内心では腹が立つ。これはもうしょうがない。 クソみたいなクレーマーは多いし、ちょっとこっちが仏心を出すとそこにつけこむクソ客も多い。 とりあえず言ってみて通ればめっけもん、一度通ればそっからはソコを最低ラインとしてさらに言う、対応できなきゃ文句を言う。対応する側としてはクソ客以外の何物でもない。 ただ、そういう対応する側からすると速やかにおかえり願えないかなと思うようなゴリゴリ押してくる車いすユーザーが先陣を切ってくれなければ、変わらなかっただろうな、とも思う自分が居る。 爺さんの時は、俺も車いすを押したが、主に調べたのは親父やおふくろだった。 何を

                                          車いすを押してきた人間として、いま複雑な気持ちでいる
                                        • ユニバーサルデザイン - FUJITSU Japan

                                          富士通のUD宣言富士通は、人々がそれぞれの能力を十分に発揮でき、安心、快適、そして豊かに生活できる社会を目指して、製品やサービスのUDを推進しています。 1. 富士通の役割持続可能な世界の実現を目指して国連で定められた開発目標SDGsは、世界の共通認識・共通課題です。このSDG(注1)の背景の一つには、ダイバーシティ&インクルージョン(注2)の考え方があります。富士通は、誰もが使える製品やサービス、それらを支える技術とICT基盤の提供を通して、この持続可能で多様性のある豊かな社会の実現に貢献します。

                                            ユニバーサルデザイン - FUJITSU Japan
                                          • キーボード操作を意識したHTML/CSSコーディング

                                            この記事は 「Webアクセシビリティ Advent Calendar 2020」 5日目の記事です。 アクセシビリティ Advent Calenderの記事を寄稿するにあたり、少しの工夫であらゆるユーザーに対して優しいWebサイトを作れるようなHTML/CSSコーディングの方法についてまとめました。より多くの人にとって優しい・使いやすいWebサイトを作ることは訪れてくださるユーザーの方々だけでなく、クライアントにとってもユーザーの機会損失を防ぐことができるので多大なるメリットがあります。(よくコードが適当でもデザインが見えていれば良いって意見を聞くけれどそんなことはない) ただ、アクセシビリティを意識したHTML/CSSコーディングについてのまとめだと内容量が非常に多くなりZennなら記事より本で出したほうがベターになってしまうので、今回は数あるアクセシビリティの視点から「キーボード操作で

                                              キーボード操作を意識したHTML/CSSコーディング
                                            • Colorbase

                                              All-in-one color tool for creators

                                                Colorbase
                                              • やってほしくない緑とオレンジの使い方(カラーUDの話)|ほうじ | 少数色覚デザイナー

                                                少数色覚者にとって黄緑とオレンジは見分けづらい組み合わせの一つです。この記事のタイトル画像とかなかなか最悪です。 WEB、アプリや印刷物などのメディアではだいぶカラーユニバーサルデザインの考え方が浸透してきており、デザイナーも多様な色覚でも読み違えないように配慮してデザインすることが当たり前になってきていると思います。 Photoshopなどのグラフィックツールには簡単に少数色覚の見え方を確認できるプレビューモードがありますし、AdobeColorを使えば無料で少数色覚の人が混同しやすい色かどうかをすぐに確かめられます。https://color.adobe.com/ja/create/color-accessibility 少数色覚が見分けづらい色の組み合わせだと「-」が表示されるしかし、工業製品の世界では少数色覚にとって見分けづらい緑とオレンジの組み合わせのLEDインジケータ(表示)を

                                                  やってほしくない緑とオレンジの使い方(カラーUDの話)|ほうじ | 少数色覚デザイナー
                                                • シャニマスのチェックボックスから見る色弱者の世界|謝罪P

                                                  先日のアップデートでシャニマスのUI周りに色々と手が加えられた。 その中でも個人的に嬉しかったのは、ソートに関連するチェックボックスのON/OFFが見やすくなっていたことだ。 大多数のユーザーにとっては「まあ確かにね」くらいのものかもしれない。しかし私は「これでようやくまともにソート機能が使える」とひそかに歓喜した。一部のユーザーも共感してくれるのではないだろうか。 なぜなら私の目に映った変化は以下のようなものだったから。 チェックの光沢の有無でかろうじて判別していた(ひよこ鑑定士か?)この見え方の差異は、私が『色覚マイノリティ』、いわゆる『色弱者』であることに起因する。 『色弱者』って何?光(色)を感じる視細胞が何らかの原因により欠損、または十分に機能しないことによって色の見え方が一般とは違う人のことを、本記事では『色弱者』という呼称で表記する。 日本人男性の5%、女性の0.2%がこの色

                                                    シャニマスのチェックボックスから見る色弱者の世界|謝罪P
                                                  • ウェブアクセシビリティ導入ガイドブック|デジタル庁

                                                    デジタル庁では「誰一人取り残されない、人に優しいデジタル化」を実現するため、継続的に「ウェブアクセシビリティ」の向上に取り組んでいます。この度、ウェブアクセシビリティに初めて取り組む行政官の方や事業者向けに、ウェブアクセシビリティの考え方、取り組み方のポイントを解説する、ゼロから学ぶ初心者向けのガイドブックを公開します。 優しいサービスのつくり手になる一助として、ぜひご活用ください。 公開の背景ウェブアクセシビリティの向上に取り組むには、非常に専門的な複数の規格とガイドラインをそれぞれ確認する必要があります。そのため、適切なやり方がわからないままに、現在は間違っている対応の踏襲、不要・過剰な対応、不適切な対応をしてしまうことがあります。ウェブサイトだけではなく、申請・手続等のデジタルサービスの重要性が増す中で、最新の技術動向を踏まえた、初心者が学習できる行政機関向けの研修資料が不足していま

                                                      ウェブアクセシビリティ導入ガイドブック|デジタル庁
                                                    • キャンセルボタンに色をつけてはいけない理由

                                                      キャンセルボタンをデザインする時に、カラーで悩むことはありませんか? キャンセルボタンに色をつけてはいけない理由、ニュートラルなグレーが適している理由を紹介します。 キャンセルボタンのデザインがアクションボタンと同じだと、ユーザーは迷ってしまいます。キャンセルできることを明確にすることで、認知速度が上がります。また、ボタンが3個以上だったり、ラベルが違っていると、ユーザーは余計に戸惑います。 Why Cancel Buttons Should Never Have a Color by UX Movement 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 キャンセルボタンに色をつけてはいけない理由 ニュートラルボタンのためのニュートラルカラー キャンセルに適したラベルとは グレーを使う時は十分に暗くする キャンセルボタンはニュ

                                                        キャンセルボタンに色をつけてはいけない理由
                                                      • 【テスト画像有り】色弱・色盲の僕がとりあえず困ること|今日はヒトデ祭りだぞ!

                                                        実は僕色弱でして、ていっても軽度のなんですけど、細かい色の違いがあんまりわからんのです 特に赤と茶色辺りはもう全然で、あと緑と黄色の辺もちょっと怪しい。絵具とかも色鉛筆も名前が書いてないと「はい詰んだー」みたいなとこありました この画像とか有名ですね これで言うと僕は 左上 見えない 真中上 12 右上 見えない 左下 17    真ん下 70 右下 見えない(4?) って感じ でもそれでそんな困るか? って言ったらね、別にそんな大して困んない 強いて言うなら 絵を書く会の時に先生に 「何であのお花は青色なのに紫色で塗っちゃったのかな?」 って聞かれて 「わかんない」 を連呼して先生を困らせたくらい 別に信号の区別がつかないってわけじゃないし、ざっくりとした色の違いはわかるし、イルミネーションとか鮮やかな絵とか見たら「キレイだなー」って思う ただね、やっぱ日常生活してると「やべぇ……」って

                                                          【テスト画像有り】色弱・色盲の僕がとりあえず困ること|今日はヒトデ祭りだぞ!
                                                        • SPAと覚悟

                                                          Frontend Meetup vol.1 - SPAを語り尽くす会! でのLT資料です。 http://connpass.com/event/38112/

                                                            SPAと覚悟
                                                          • 目が見えなくてもプログラミングできるよ - Qiita

                                                            はじめに こんにちは!@moutendです。私は視覚障害があるので、普段は画面を見ずにMacのVoiceOverというスクリーンリーダーの音声のフィードバックを頼りにプログラミングをしています。ところで最近@ssotoyaさんの記事にて音声を頼りにプログラミングする様子が公開されました。スクリーンリーダーの音声を聞いたことがありますか? - ラック公式ブログ - 株式会社ラック@ssotoyaさんは全盲のため全く目が見えないのですが、超高速でコーディングをされています。控えめに言って最高にロックです。私も負けていられません。ということで、この記事に触発されて、私も画面を全く見ずに音声のフィードバックのみを頼りにプログラミングしている様子をキャプチャしましたので公開してみます。具体的には、QuickTimeのスクリーンキャプチャ機能を使って画面を撮影しつつ、音声はsoundflowerという

                                                              目が見えなくてもプログラミングできるよ - Qiita
                                                            • 制作者のためのHTML

                                                              主にユーザー側の視点から語られることが多いアクセシビリティですが、制作という側からはどのように捉えることができるのでしょうか。2つの切り口から考えてみます。 # アクセシビリティという文脈において、何のためにHTMLを書くかという話になると マシンリーダビリティのため スクリーンリーダーのアクセシビリティのため というように、ユーザーが利用するため、というところにフォーカスした語られ方が多いように感じています もちろんユーザーのために作るというのは正しいのですが、今回はあえて視点を変えて、制作者自身の作るというところに視点を合わせて話してみたいと思っています 僕がどういうものなのかというと、 # 参照: 全部入りHTML太郎(@_yuheiy)さん | Twitter ツイッターでは「全部入りHTML太郎」という名前でやっています # 参照: シフトブレイン/スタンダードデザインユニット

                                                                制作者のためのHTML
                                                              • 佐川・抜け首・なん on Twitter: "「当時としては、ワガママとされ、暴力的とされ、迷惑とされ、非常識とされ、だけどその騒ぎのおかげで後輩達が恩恵を受けている」 私はいつも「川崎バス闘争」を思い出す。 公共交通機関に「車椅子の人を一人で乗せろ」として、「闘争」があったのだ。"

                                                                「当時としては、ワガママとされ、暴力的とされ、迷惑とされ、非常識とされ、だけどその騒ぎのおかげで後輩達が恩恵を受けている」 私はいつも「川崎バス闘争」を思い出す。 公共交通機関に「車椅子の人を一人で乗せろ」として、「闘争」があったのだ。

                                                                  佐川・抜け首・なん on Twitter: "「当時としては、ワガママとされ、暴力的とされ、迷惑とされ、非常識とされ、だけどその騒ぎのおかげで後輩達が恩恵を受けている」 私はいつも「川崎バス闘争」を思い出す。 公共交通機関に「車椅子の人を一人で乗せろ」として、「闘争」があったのだ。"
                                                                • カラーユニバーサルデザイン推奨配色セット

                                                                  色覚の多様性に配慮した�案内・サイン・図表等用のカラーユニバーサルデザイン�推奨配色セット (バリアフリーに配慮した見分けやすい色の組み合わせ) カラーユニバーサルデザイン推奨配色セット制作委員会 ■ 東京大学分子細胞生物学研究所 脳神経回路研究分野 伊藤啓 ■ 社団法人日本塗料工業会(JPMA) ■ DIC 株式会社(DICグラフィックス株式会社・DICカラーデザイン株式会社 ■ 特定非営利活動法人カラーユニバーサルデザイン機構(CUDO) ■ 石川県工業試験場                前川満良 カラーユニバーサルデザイン推奨配色セット ガイドブック 第2版 カラーユニバーサルデザイン推奨配色セットの塗料用、印刷用、画面用の詳しい情報と、組み合わせる色の注意点、使用する上でのノウハウなどをまとめた冊子の第2版を作成しました。 CUD_color_set_GuideBook_2018

                                                                  • なぜ、富士通は「色覚障がい者のための診断ソフトウェア無償提供」を終了したのか

                                                                    富士通は2013年8月20日、視覚障がい者や色覚障がい者のアクセシビリティを高めるための診断ソフトウェアツール群「富士通アクセシビリティ・アシスタンス」の無償提供を終了した(参照記事)。このニュースはSNSでの反響も大きく、ユーザーから「なぜこのような素晴らしいサービスが終了してしまうのか」との声が多く聞かれた。 同様のツールは他にもあったが、富士通アクセシビリティ・アシスタンスが愛用されるのにはわけがあった。富士通アクセシビリティ・アシスタンスは、3つのツール群「WebInspector(ウェブインスペクター)」「ColorSelector(カラーセレクター)」「ColorDoctor(カラードクター)」から構成されており、それぞれ以下の特徴が挙げられる。 WebInspector ローカルフォルダを指定した場合、サブフォルダのHTMLまで一括でチェックでき、結果をCSVで保存できる C

                                                                      なぜ、富士通は「色覚障がい者のための診断ソフトウェア無償提供」を終了したのか
                                                                    • UX・UI・IAやアクセシビリティの「専門知識」が増えるまとめ - コムテブログ

                                                                      TL;DR コーディングやシステムは分かるけど、最終的に使いやすい設計やクライアントさんが納得するようなデザインにならない。納品後に使いにくい箇所があると言われる。そうなる前に「何となく進めない」ようにサイト制作やサービス・アプリを作成する前の段階で知っておきたい知識。UX・UI・IA の違いが漠然としているときに。 IA(情報アーキテクチャ) 1.基礎知識 情報アーキテクチャとは Web サイト全体の設計図、情報を分かりやすく伝えること。主にIA(インフォメーションアーキテクト)が担当します。国内ではディレクターが担当する会社も多いと思います。情報アーキテクチャはサイトを見た目の印象だけでなく、目に見えないサイト構造をデザインすることで、わかりやすいサイトにする技術。 [スライド] 社内の IA(情報アーキテクチャ)研修の講師をしてみた。:そのフォローアップ | future-proof

                                                                        UX・UI・IAやアクセシビリティの「専門知識」が増えるまとめ - コムテブログ
                                                                      • 最近の Web 開発者が使ってるらしいサービス - Qiita

                                                                        MDN のページのヘッダ部分に、開発者が使っているサービスについてのアンケートがあったので回答してみた。 内容は、開発の上で使える様々なサービスについてだったんだけど、その選択肢が知らないのもいくつかあっておもしろかった。 MDN のアンケートの選択肢にあがるってことは、今こういうサービスがメジャーなんだなーと思ったので貼っておく。 (ただし、 Code Hosting -> Github や IaaS -> AWS みたいな分かりきってるのは省く) ちなみにサーベイは以下。 load-test Loader.io LoadImpact.com Loadstorm.com browsertest SauceLabs BrowserStack W3C validators CrossBrowserTesting Browsera security Nessus WebInspect ? Ne

                                                                          最近の Web 開発者が使ってるらしいサービス - Qiita
                                                                        • 早稲田大学のサイトリニューアルがなぜこんなにひどいのか。 - 隣り合わせの灰と青春

                                                                          久しぶりにセミナー以外でブログ書きます。 このたび早稲田大学のWebサイトがリニューアルされました http://www.waseda.jp/top/ が、かなり論議になりそうなリニューアルなので、 情報設計専門家として内容を見てみます。 1.なにがグローバルなサイトなの? 今回のリニューアルではIE10以降を対象外としていて、 普通に使っているIE7や8では見ることができません、 これはアクセシビリティ上かなり問題だと思います、 多くの人が目にする大学というサイトでノンアクセシビリティを貫くというのは、 いまの時代にそぐわないのではないでしょうか。 わざわざIE10にアップデートまでしてみるサイトでもないですしね。 ぜんぜんグローバルじゃありません。かっこ悪いです。 2.レスポンシブデザイン? スマートフォン、タブレットに対応したサイトになったみたいですが、 そもそものとこ

                                                                          • 都知事、ベトナム語しゃべってる…?タガログ語もネパール語も話せるの…!? 各言語でコロナ感染対策を呼びかけた背景

                                                                            Search, watch, and cook every single Tasty recipe and video ever - all in one place! News, Politics, Culture, Life, Entertainment, and more. Stories that matter to you.

                                                                              都知事、ベトナム語しゃべってる…?タガログ語もネパール語も話せるの…!? 各言語でコロナ感染対策を呼びかけた背景
                                                                            • LINE社員1,361名の"色覚に関するアンケート"

                                                                              LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog はじめに こんにちは。フロントエンド開発センター UIT Accessibilityタスクフォース 岡﨑です。私たちは、Webサイトのアクセシビリティに関するガイドラインの策定・推進、社内に向けたアクセシビリティの勉強会やe-ラーニングを通じて、LINEとそのファミリーサービスのアクセシビリティ向上を目指しています。 色に対する配慮 アクセシビリティの国際規格となっているWCAGでは、テキストにおける色の取り扱いで以下のことが求められています。 色に依存した表現にしないこと コントラスト比を確保すること なぜ、色に対する配慮が必要なのでしょうか? 困っているのはロービジョンユーザーだけではない LINE STYLEの"Alwa

                                                                                LINE社員1,361名の"色覚に関するアンケート"
                                                                              • Webエンジニアとしていま知っておきたいWebアクセシビリティ

                                                                                この文章について これは Front-End Study #3「『当たり前』をつくりだすWebアクセシビリティ」で基調講演をするにあたって、登壇内容を整理するために書いたものです。登壇内容とは一部に差異があります。 イベント映像 この文章はむちゃくちゃに長いので、登壇映像を見たほうがいいかもしれません。わたしの発表は13:23くらいから30分ちょっとです 登壇資料(内容は同一です) https://speakerdeck.com/ymrl/webenziniatosite-imazhi-tuteokitai-webakusesibiritei https://docs.google.com/presentation/d/1uhCvhh6sZCPUnReSBVDjvGfNAOTKbZ5Sxs8fYMlxMsI/edit?usp=sharing 目的 Web業界で「エンジニア」の肩書で仕事して

                                                                                  Webエンジニアとしていま知っておきたいWebアクセシビリティ
                                                                                • サイト公開前に役立つ25のユーザビリティチェックリスト:phpspot開発日誌

                                                                                  25-point Website Usability Checklist | User Effect サイト公開前に役立つ25のユーザビリティチェックリストが公開されていましたのでメモしてみました。 サイトの公開前にチェックリストとして使うといいかもしれません。 アクセシビリティ 1. ロード時間が速いか?(60KBぐらいがベター) 2. テキストと背景のコントラスト調整(差異が低く見にくくないか) 3. フォントサイズが読みやすいサイズか?行間、文字間は適切か? 4. Flashやアドオンは控えめか? 5. 画像に適切なALTタグが指定されているか? 6. カスタマイズした404ページがあるか?デフォルトは非常に不親切 7. カンパニーロゴが分かりやすい位置におかれているか? 8. キャッチフレーズが適切に設定されているか? 9. 5秒で大体どんな内容が分かるものになっているか?ユーザは