Semantica11y - Semantic HTML for Everyone セマンティック11y - すべてのためのセマンティックHTML
記事 海外
セマンティックHTMLの正しい使用がアクセシビリティに与える影響を解説。divやspanではなく意味のあるHTML要素の選択と実装を扱う
#見出し構造
headingoffset is Not the Document Outline Algorithm 見出しオフセットはDocument Outline Algorithmではない
記事 海外
見出しの階層構造設計とDocument Outline Algorithmの誤解を正す技術解説。headingoffset概念が提案されているが、HTML仕様とは異なることを論じる。
Testing heading accessibility on a navigation sidebar | Accessible Web Audit ナビゲーションサイドバーの見出しアクセシビリティテスト | アクセシブルウェブ監査
YouTube 海外
ナビゲーションサイドバーの見出し要素コーディング検証をRAMP監査ツールで実演。見出しコーディング漏れがアクセシビリティに与える影響と検査方法を解説。
セマンティックHTMLの基本と正しい使い分けを解説。タグの役割とアクセシビリティへの影響、実装時の落とし穴を紹介。
Sisyphus would have loved Skip Links & Page Structure | Trusted Tester Study Group 6 シジフスはスキップリンクとページ構造を愛したはず
記事 海外
ウェブアクセシビリティ認定試験対策として、スキップリンクとページ構造の重要性を実践的に解説した学習資料。
Structure, Code, and Accessibility: Building with Purpose 構造、コード、アクセシビリティ：目的を持った構築
記事 海外
ウェブ開発において明確で構造化されたコードを基盤に、アクセシビリティを実現する設計思想と実装方法を解説した記事。
Framer Academy SEOコース日本版。検索エンジンがWebコンテンツを理解するための構造化マークアップ・メタデータの重要性を解説し、SEOとアクセシビリティの共通基盤を示す。
Gerard does Fireside – HTML Accessibility Gerardのファイアサイド – HTMLアクセシビリティ
記事 海外
HTMLセマンティック要素とアクセシビリティ属性の関係を実装例で解説。見出し、ランドマーク、ARIA属性の使用方法を中心に扱う。
スクリーンリーダーで初めてWebサイトを体験した新入社員による研修レポート。alt属性空白と見出し構造崩れが与える影響を実感。
HTMLランドマーク要素を見た目ではなく意味的構造に基づいて実装し、スクリーンリーダーユーザーの情報移動を支援する設計方法を解説。
A compelling title that is cryptic enough to get you to take action on it 行動を促すほど謎めいた、思わずクリックしたくなるタイトル
記事 海外
セマンティックHTMLとスキップリンク、段階的情報構造によるアクセシビリティ対応Webページ設計を解説。キーボード操作と読み上げに対応した実装手法が学べる。
Heading Anchors with Eleventy EleventyによるHeading Anchorsの実装
記事 海外
見出しにアンカーリンクを自動生成するEleventy実装パターン。cherioライブラリを用いたビルドタイム変換で、サーバーサイドに見出しIDに対応するアンカーを自動挿入し、クライアント側JavaScriptを削減する設計を解説。
HTML仕様の再学習を通じて得た気づきをまとめた第2弾。セマンティック要素の正確な使い方とアクセシビリティに関連するHTML仕様の理解を深める内容だ。
AIエージェントがWebを読む時代において、セマンティックHTMLとアクセシビリティ対応の有効性を論じた記事だ。
HTMLタグのセマンティックな使用法の重要性を再学習する過程で得られた実践的気づきをまとめ、スクリーンリーダーへの情報伝達におけるセマンティック要素の役割を具体例で解説している。
福祉ポータルサイト100記事の構築経験をもとに、アクセシビリティとSEOを両立するHTML構造（見出し階層・セマンティックHTML・構造化データ）の最適解を解説した記事。
文書構造化の標準化に長年携わってきた村田真氏が、W3C標準化の困難と時代の要請によって努力が報われるまでの経緯を語る講演。
LLM-Driven Optimization of HTML Structure to Support Screen Reader Navigation スクリーンリーダーのナビゲーションを支援するLLMを用いたHTML構造最適化
論文 海外
視覚障害のあるユーザーがECサイトをスクリーンリーダーで操作する際の困難を解消するブラウザプラグインを提案した研究。LLMがウェブページのHTML構造をリアルタイムで再構成しナビゲーションを支援する。
In-Page Navigation Aids for Screen-Reader Users with Automatic Topicalisation and Labelling 自動トピック化とラベリングによるスクリーンリーダー利用者向けページ内ナビゲーション補助
論文 海外
スクリーンリーダー利用者向けに自動トピック抽出・ラベリングでページ内ナビゲーション補助を生成する手法を提案。見出しが不適切なウェブ文書でも構造を自動補完できる。