2024年のWebアクセシビリティ | gihyo.jp
あけましておめでとうございます。株式会社ミツエーリンクスの中村直樹です。昨年と同じく、2023年のWebアクセシビリティに関連する出来事を振り返りつつ、2024年のWebアクセシビリティの展望について俯瞰していきたいと思います。 WCAG 2.2の勧告とWCAG 2.1の更新 長らく待ちわびていたWCAG 2.2について、2023年10月5日付けでようやくW3C勧告（Recommendation）となりました（日本語訳はまだありません。詳細は後述の「臨時WGの活動状況」を参照）。また、これと連動する形でWCAG 2.1（日本語訳）の勧告も改めて発行されました。 今回のWCAG 2.1の更新では、達成基準4.1.1構文解析に注記が設けられています。これにより、WCAG 2.2で削除された達成基準4.1.1の扱いについて連続性が保たれるようになっています。WCAG 2.1からの変更点は、公
第3回 APCAを活用して文字の視認性を確保したデザインを実践する | gihyo.jp
しかし、実際のデザインではこの表にないフォントサイズやウェイトを使いたい場合もあるでしょう。その場合には、シミュレータやルックアップテーブルを参照することで、より精度の高い確認が可能になります。 ルックアップテーブルでフォントサイズとウェイトから必要なコントラストを確認する シミュレーションの説明の前に、より細かい基準がどのように定められているか見るために、APCAのルックアップテーブルを見てみましょう。 このルックアップテーブルは、WCAG3のシルバーレベルを満たすための基準を示しています。ブロンズレベルに追加して、この基準に準拠することでより精度の高いコントラストの確保が可能になります。 以下は、公式のシミュレーションサイトAPCA Contrast Calculatorにあるルックアップテーブルのスナップショットです。ページの下部、APCA Font Table: Silver Le
第2回 WCAG3のコントラスト基準APCAの考え方と実例 | gihyo.jp
デジタルコンテンツにおけるアクセシビリティ、特にコントラストの基準について解説する連載の第2回目です。前回の記事では、現在のWCAG2のコントラスト基準と課題について解説しました。今回はWCAG3で採用が検討されている新しいコントラスト基準、APCAについて解説します。 APCAとは WCAG 2.0でコントラストの基準が策定されて以降、ディスプレイやWebコンテンツ、CSSの機能、および視覚科学の進歩など様々な状況が変化しました。WCAGの基準についても、コントラストや視認性についてより知覚を正しくモデル化するガイドラインが求められるようになりました。 APCA（Advanced Perceptual Contrast Algorithm）はWCAG3にて現行のコントラストに代わる基準として開発・検討されている、新しいコントラスト基準です。前回紹介したようなWCAG2の基準の課題に応える
第1回 デジタルコンテンツの視認性とWCAG2のコントラスト比の課題 | gihyo.jp
はじめに サイオステクノロジーの伊藤と申します。今回から数回にわたりデジタルコンテンツのコントラストというテーマで、WCAG2のコントラスト基準とWCAG3で検討が進められている新しい基準APCAについて解説していきます。 対象読者としては、ウェブサイトやアプリケーションなどデジタルコンテンツの制作に携わるデザイナーやエンジニア、アクセシビリティに関心のある方を想定しています。 現在勧告されているWCAG2の達成基準では、テキストや視覚要素のコントラストが一定の基準を満たす必要があります。たとえば、レベルAAでは文字色と背景色のコントラスト比が4.5:1以上であることが要求されます。 図1 テキストとの視認性を確保するために、背景色とのコントラスト比を考える必要がある しかし、人間の目は明るい色と暗い色のコントラストを認識する際に、明るい色の相対輝度が高いほど視認性が高くなるという特性があ
CSSの@counter-styleがSafari 17でも対応、すべてのブラウザでサポートへ | gihyo.jp
CSSの@counter-styleがSafari 17でも対応、すべてのブラウザでサポートへ iOSやiPadOSが18日にリリースされ、同OS向けにSafariが更新されてSafari 17.0もあわせてリリースされた。なお、macOSのSafari 17.0は現在パブリックベータ版であり、9月26日にリリースされる予定となっている。 Safari 17.0の新機能の詳細は公式ブログを参照してもらうとして、ここでは、このバージョンのSafariからCSSの@counter-styleに標準で対応したことを取り上げたい。 @counter-styleを使うことで、順序付き箇条書きの連番（マーカー）や章タイトルの見出しなどで出てくる章番号などのカウンタースタイルが単純ではない場合の指定を設定できるようになる。 そして、擬似要素で使われるcontentプロパティで指定できるcount
AI時代のWebブラウザから考えるWebアクセシビリティの本質 ――Vivaldiのアプローチから | gihyo.jp
2023年5月、Vivaldiの日本先行でのiOS版プレビューリリース発表のためヨンが来日したことをきっかけに、インターネットの将来やアクセシビリティについて語る対談の機会が設けられました。 Vivaldiブラウザの創業者ヨン・フォン・テッツナーは、'90年代から長きにわたりWebブラウザ開発に携わってきた、ブラウザ業界のキーパーソンの一人です。彼のブラウザ開発のコアには、ユーザ一人ひとりのニーズに合わせた非常に柔軟なカスタマイズ性や、プライバシー保護があります。また、一部ビックテック企業によるユーザ行動の監視から逃れ、インターネットの安全性を高めるためのオープン標準規格やルール作りなどに貢献する活動も行っています。 聞き手は、ミツエーリンクス社でWeb標準技術の策定やアクセシビリティの啓発に携わってきた木達一仁氏です。 左から木達氏、ヨン、冨田 2023年のホットトピックから～生成系AI
第8回 自社を超えたコラボレーションでアクセシビリティは社会へとつながる | gihyo.jp
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』を補うものです。紙幅の都合で同書に収められなかった原稿を再構成しました。同書の第7章「アクセシビリティの組織導入」の続編にあたります。同書第7章は、会社内でたった一人でアクセシビリティの取り組みを始めてから、正式なチームを立ち上げるまでのノウハウを紹介しました。本連載はそこからさらに取り組みを広げていくためのノウハウをまとめます。 1ヶ月にわたってお届けしてきた短期集中連載、今回の第8回で最終回です。機会がありましたら、ぜひ第1回目からあらためてお読みいただければと思います。ご自身や会社の状況の変化によって、きっと新たな発見があるはずです。 アクセシビリティの取り組みは、自社だけに閉じず他社とコラボレーションしたり公開したりすることで、より進捗します。まとまった形になるまで待たず、少し取り組みを進めたらどこ
第6回 アクセシビリティを必須スキルとし、採用・研修・スキルアップをする | gihyo.jp
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』を補うものです。紙幅の都合で同書に収められなかった原稿を再構成しました。 同書の第7章「アクセシビリティの組織導入」の続編にあたります。同書第7章は、会社内でたった一人でアクセシビリティの取り組みを始めてから、正式なチームを立ち上げるまでのノウハウを紹介しました。本連載はそこからさらに取り組みを広げていくためのノウハウをまとめます。 アクセシビリティに取り組む人を一定以上に増やすためには、開発プロジェクトでコツコツと取り組むだけでなく、「その組織においてアクセシビリティが重視されている」ことが伝わるしくみを整えていくことが必要です。以下のように整えていくと「その組織においてアクセシビリティは当たり前のこと」、つまりカルチャーとして定着していきます。 従業員採用の募集要項にアクセシビリティを入れる 入社
第5回 アクセシビリティを7つの視点で効果測定し、実績を証明する | gihyo.jp
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』を補うものです。紙幅の都合で同書に収められなかった原稿を再構成しました。 同書の第7章「アクセシビリティの組織導入」の続編にあたります。同書第7章は、会社内でたった一人でアクセシビリティの取り組みを始めてから、正式なチームを立ち上げるまでのノウハウを紹介しました。本連載はそこからさらに取り組みを広げていくためのノウハウをまとめます。 全8回でお届けする本連載、第5回のテーマは効果測定です。 さまざまな取り組みを進めていくと、気になってくるのが「アクセシビリティの効果測定」でしょう。社内外に活動が認知され、取り組みの拡大に向けた流れが見えはじめたら、状況把握としての測定が必要です。今後の活動を継続していくためにも不可欠です。 アクセシビリティの効果は測定できる アクセシビリティの取り組みの直接的な効果は、「
第3回 アクセシビリティを新規開発の「当たり前」に組み込む | gihyo.jp
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』を補うものです。紙幅の都合で同書に収められなかった原稿を再構成しました。 同書の第7章「アクセシビリティの組織導入」の続編にあたります。同書第7章は、会社内でたった一人でアクセシビリティの取り組みを始めてから、正式なチームを立ち上げるまでのノウハウを紹介しました。本連載はそこからさらに取り組みを広げていくためのノウハウをまとめます。 2024年4月22日追記：同書の第7章「アクセシビリティの組織導入」も「アクセシビリティを組織で向上させる ──たった一人から始めて、社内に認知されるまで」として公開しました。 Webアプリケーションでは機能改修や機能追加により、成長とともに新しい画面が出現します。時には新しいアプリケーションが作られる場合もあります。「新しく作る画面」がはじめからアクセシブルになるようにプ
第1回 アクセシビリティを経営方針とつなげ、プロダクトマネージャーと合意する | gihyo.jp
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』を補うものです。紙幅の都合で同書に収められなかった原稿を再構成しました。 同書の第7章「アクセシビリティの組織導入」の続編にあたります。同書第7章は、会社内でたった一人でアクセシビリティの取り組みを始めてから、正式なチームを立ち上げるまでのノウハウを紹介しました。本連載はそこからさらに取り組みを広げていくためのノウハウをまとめます。 取り組みを進めると、社内関係者への説明、社外広報、イベント登壇など、ことあるごとに「この会社がアクセシビリティに取り組んでいる理由」を説明する場面が訪れます。これを言語化するには「会社の経営方針とアクセシビリティの関係性」を考えることが有効です。さらに、経営方針をもとにプロダクトビジョンやロードマップを意思決定するプロダクトマネージャー（PM）とも、この関係性について合意するこ
2023年のWebアクセシビリティ | gihyo.jp
あけましておめでとうございます。株式会社ミツエーリンクスの中村直樹です。昨年と同じく、2022年のWebアクセシビリティに関連する出来事を振り返りつつ、2023年のWebアクセシビリティの展望について俯瞰していきたいと思います。 WCAG 2.2 2022年9月版のWCAG 2.2で、文書のステータスとしてはようやく勧告候補（Candidate Recommendation）にまでたどり着き、仕様文書として完成する勧告（Recommendation）が見えてきた…と思っていたところですが、12月になって達成基準4.1.1構文解析を削除するという話が急浮上してきました。 達成基準4.1.1がどういったものなのか、改めて振り返ってみましょう。この達成基準については、もとはWCAG 2.1（原文、参考日本語訳）と同じものであり、WCAG 2.0とも同一です。達成基準4.1.1は、マークアップ言語
Microsoft、「Fluent Emoji」の絵文字データをGitHubとFigmaでオープンソースとして公開 | gihyo.jp
Microsoft、「Fluent Emoji」の絵文字データをGitHubとFigmaでオープンソースとして公開 Microsoftは今月上旬、同社の提唱する「Fluent Design」にもとづいた絵文字「Fluent Emoji」の絵文字データをオープンソースとして公開した。GitHubからダウンロードしたり、Figmaで利用できる。このデータを使って、自分の作品内でFluent Emojiをカスタマイズできる。なお、Clippyはライセンスの問題により、オープンソースの絵文字セットに含まれていない。 Designing in the Open(Source) by Microsoft Design | Microsoft Design | Aug, 2022 | Medium 「Fluent Design」とはMicrosoftが開発しているデザインシステムで，5つの原則5つの原則
Twitter、Card Validatorからプレビュー機能を削除。カード情報のキャッシュは最大7日 | gihyo.jp
Twitter、Card Validatorからプレビュー機能を削除。カード情報のキャッシュは最大7日 Twitterは今月、開発者コミュニティサイトにおいて、Card Validatorからプレビュー機能を削除したことを告知した。また、Twitterカードの情報が通常、最大7日キャッシュされることもあわせてコメントした。 Card Validator - preview removal - Twitter Developer すこし前まではCard Validatorを使うことでTwitterカードをプレビューできていたが、Twitterは、異なるプラットフォーム環境において正しいプレビューとは限らなかったとし、プレビュー機能を削除することにした。Card Validatorは引き続き、ほかのデバッグ目的で提供を続けるとのこと。 Twitterカードのプレビューについては、ブラウザやiO
第1章 進化するHTTPの歩み ～ HTTP/1.1とHTTP/2をおさらいし、HTTP/3の基本を知る | gihyo.jp
HTTP/3入門 第1章進化するHTTPの歩み ～ HTTP/1.1とHTTP/2をおさらいし、HTTP/3の基本を知る この特集記事は2021年6月24日に発売されたWEB+DB PRESS Vol.123に掲載された特集1「HTTP/3入門」を再掲したものです。 先日2022年6月にHTTP/3を含むHTTP関連の仕様が正式なRFCとなりました。ここではRFCの正式リリースに伴い、いち早く変更点を抑え、囲みボックスを用いた加筆解説でわかりやすくお伝えしております。 特集のはじめに HTTP（Hypertext Transfer Protocol）の最新版であるHTTP/3が登場しました。HTTP/3では、より安全で速い通信が行えます。本特集では、今までのHTTPにあった課題と、HTTP/3で課題をどのように解決し、改善が行われたかを解説します。 本章では、HTTPそのものと各バージ
2022年のCSS | gihyo.jp
2022年になりました。矢倉眞隆（@myakura）と申します。昨日に続き、新春特別企画のブラウザとウェブ標準動向について紹介します。 取り上げるトピックの数やそのインパクトから、今回はCSSを独立した記事として取り上げることになりました。「ブラウザとウェブ標準動向」についても寄稿していますので、そちらもお読みいただければうれしいです。 2022年以降のCSSは大きく変化しそうだなと思っています。これまでも、CSS3と呼ばれていた機能による表現力の強化、FlexboxやGridなど強力なレイアウト機能の追加など、大きな変化と言えるだろうものはありました。しかし現在提案・実装されている機能は、CSSの根幹を拡充するものと、これまでと性質が異なるものです。 Compat 2021とInterop 2022で互換性の向上 CSSのつらいところとしてまず取り上げられるのが、ブラウザ実装の挙動の違い
2021年のWebアクセシビリティ | gihyo.jp
あけましておめでとうございます。株式会社ミツエーリンクスの中村直樹です。昨年に引き続き、2021年のWebアクセシビリティの短期的な予測をしてみます。 Web Content Accessibility Guidelines（WCAG）2.2 いよいよ今年はWCAG 2.2がW3C Recommendation（勧告）になる年となります。WCAGを策定しているAccessibility Guidelines Working Group（AG WG）による昨年9月時点でのProject Planの情報によると、勧告までのマイルストーンは次のようになります。 執筆時点では、昨年8月11日付けのWorking Draft（作業草案）が最新の文書となります。WCAG 2.1から9つの新しい達成基準（Success Criteria; SC）が追加されており、具体的には下記に記載しているとおりです。
2021年のウェブ標準とブラウザ | gihyo.jp
2021年になりましたね。 矢倉眞隆（myakura）です。ウェブ標準やブラウザに興味のあるウェブ開発者です。gihyo.jpでは2009年に「Web標準とその周辺技術の学び方」という連載をしていました。 今回は昨年の泉水さんに代わり、2021年のウェブ標準やブラウザの動向を占おうと思います。2020年は世界もブラウザもそれなりに大きな出来事がありましたので、2020年の動きをまずおさえ、そのうえで2021年はどうなるのかを考えてみました。 W3Cのプロセス改訂でLiving Standardライクな仕様の改訂が増えていく W3Cは2020年9月に、新しいプロセス文書と特許ポリシーを公開しました。 新しい文書プロセスはW3Cの組織の定義や標準化の流れ、意思決定などについて定めた文書です。ここ数年は毎年更新されていますが、2020年はこれまでと比べて最大級とプレスリリースでもうたわれています
2020年のWeb標準 | gihyo.jp
あけましておめでとうございます、@1000chこと泉水翔吾です。2019年に続いて、2020年のWeb標準技術について寄稿します。今年は、Webコンテンツの配信の形を拡張するWeb PackagingとWebにおける認証の形を変えるWeb Authenticationについて取り上げます。 Web Packagingを使った新たなコンテンツ配信の形 現在Web Packagingという仕様の策定が進んでいます。Web Packagingは、Webのコンテンツの可搬性を高める技術仕様で、コンテンツを配布元が署名して改ざんされていないことを保証したり、複数のリソースを一つにまとめたりすることを実現します。Web Packagingは以下の3つに分類されます。 Signed HTTP Exchanges：単一のHTTPリクエストとレスポンスに対して署名する Web Bundles（旧Bundle
第158回 2019年特別編 2018年の特徴、2019年の展望 | gihyo.jp
2019年が始まってから、早くも3ヶ月。みなさま、いかがお過ごしでしょうか。『Lançamento - Website, What a Wonderful World!』を運営しているLançamento（ランサメント）です。 『いま、見ておきたいウェブサイト』では、2018年も国内外のウェブサイトやウェブサービス、アプリなどを紹介してきました。2019年の初回は、毎度おなじみの「特別編」と題して遅ればせながら、2018年に登場したウェブサイトやウェブサービスの周辺環境などを振り返りつつ、次第に見えてきた2019年の展望を自由に語っていきたいと思います。 特徴その1 「個人情報」取得の規制が変えるもの 振り返ってみると、2018年ほど「個人情報」について考えさせられる機会が多い年はなかったように思います。 事の発端は、2018年3月。アメリカのマスコミが、選挙コンサルティング会社のCam
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
