Webアクセシビリティ:情報バリアフリー化の勧め-実践例で今すぐトライ

2022年4月28日

Webアクセシビリティに関する記事一覧のページです。
何をすればいいのか?」「コストはかかるのか?」「そもそも自分のサイトにとって有益なのか(必要なのか)?」そんな疑問にお答えします。是非できることからすぐ始めてみませんか!!

 

アクセシビリティはクローラビリティそのもの

アクセシビリティのご紹介をする前に、「アクセシビリティ対策はSEO対策としてお勧め」です。是非以下の記事を参照ください(^^)

[SEO対策]の強力な副因、「アクセシビリティ」の強化は検索エンジンの評価にも有効

 

 

Webアクセシビリティとは(ノウハウ編)

はじめて「アクセシビリティ」・「Webアクセシビリティ」という言葉を聞いた方や、聞いたことはあるけれど実態は知らないという方、まずはこの記事を読んでください。

Webアクセシビリティとは?みんなのための「情報バリアフリー化」を具体例でわかりやすく解説!

 

そして、こちらの記事は東京2020オリンピックのアクセシビリティへの取り組みを紹介しています。「アクセシビリティとは」をお伝えするのにぴったりの内容です。「おもてなし」のワードで始まった東京オリンピックですがその心構えは「みんなにおなじように」の精神で貫かれています!是非一読ください!!
アクセシビリティとは[東京2020オリンピック]のガイドラインにその心構えのヒントを見つけた

 

以下はWebアクセシビリティのチェック(検証)をする場合のガイドラインとなるJIS規格チェック方法についての解説です、個人で運営するブログ等では必要ないかもしれませんが、今後「アクセシビリティ化」の波がきたときには大事な知識となります。知っておいて損はないので、一度目を通しておいてください。

Webアクセシビリティのガイドライン「JIS X 8341-3:2016」って何?

Webアクセシビリティ:チェック(検証)方法とレポート記載(報告)について

 

Webアクセシビリティ(実践編)

Webアクセシビリティの実践について、できるだけ具体的に解説しました。思い立ったらなるべく早いうちにできるところから取り掛かって下さい。Webアクセシビリティの実践とは「Webページをあたりまえに作ること」です、特別な内容はありません(^^)

 

以下の項目がご紹介したいWebアクセシビリティを確保するための基本項目です。実践編ではこれらの10項目の設定の仕方や確認方法をできるだけ詳しく解説していきます。順番でなくても大丈夫です、必要なところからできるところから、できるだけ早く始めてください。

  1. ページの内容がわかるページタイトルを記述する
  2. 見出しやリストなどの文書構造をマークアップする
  3. リンクテキストは、リンク先が分かる文言にする
  4. 情報を伝えている画像に代替テキストを提供する
  5. 文字色と背景色のコントラストを確保する
  6. キーボードだけでも操作できるようにする
  7. 文字サイズや画面表示を変更できるようにする
  8. 動画にキャプション(字幕)を提供する
  9. フォーム・コントロールのラベルをマークアップする
  10. エラーメッセージではエラー箇所と修正方法を明示する

ちょとお勧めの記事です→「Webのこと教えてホシイの!」(漫画でとてもわかりすく解説してあります)上記基本項目もこちらの情報を参考にさせていただきました(o^―^o)

 

画像の代替テキストについて

4.情報を伝えている画像に代替テキストを提供する

Webアクセシビリティ:画像の代替テキスト設定方法と確認方法を詳しく解説

文字色とコントラストについて

5.文字色と背景色のコントラストを確保する
Webアクセシビリティ:文字と背景のコントラストを確保する

リンクについて

3.リンクテキストは、リンク先が分かる文言にする
Webアクセシビリティ:ユーザーに負担をかけないリンク設定とは

フォームについて

9.フォーム・コントロールのラベルをマークアップする
10.
エラーメッセージではエラー箇所と修正方法を明示する
Webアクセシビリティ:フォーム(申し込みや購入時の入力欄)はわかりやすさが基本

構造(HTML記述)について

1.ページの内容がわかるページタイトルを記述する
Webアクセシビリティ構造1:ページタイトルは「titleタグ」で記述する、人にも検索エンジンにもわかりやすく!

2.見出しやリストなどの文書構造をマークアップする
Webアクセシビリティ構造2:見出しは「h1,h2,h3」リストは「ol,ul,li」で記述、マシーンリーダブル!


6.キーボードだけでも操作できるようにする
Webアクセシビリティ:マウスを使わない、キーボードだけで操作ができるWebページ


7.文字サイズや画面表示を変更できるようにする
Webアクセシビリティ:ユーザー(利用者)がコンテンツ(Webページ)を拡大縮小できるようにする

 

動画について

8.動画にキャプション(字幕)を提供する
Webアクセシビリティ:動画にキャプション(字幕)を提供する

 

 

りんごからのお知らせ

こんにちは、Ringoです。岡山県真庭市というところで、非常勤のデザイン講師をしながら、ブログやメルマガを利用したネットビジネスをご紹介しています。

このブログと連携して「ゆとりのシニアライフを実現させる」をテーマにメルマガを配信、シニア&初心者向けにネットビジネスの魅力と取り組み方をお伝えしています。噛み砕いた解説がわかりやすいと好評です(^^)
経済的にも心にも「ゆとり」をもたらす収入をゲットしませんか!
ブログを作ったけどアクセスが無い!、アフィリエイトの成果が出ない!
そんなあなたは必見ですよ
SNSやネット活用の実践講座を交えた実りいっぱいの無料メルマガです。

お申し込みはこちらのボタンをクリック、是非この機会に(^o^)ノ゙
↓↓↓↓↓↓↓↓↓↓ *詳細ページが表示されます、すぐにメルマガ申し込みはされません

よろしければ、この記事やブログに関する 感想・聞いてみたいこと・要望などなどお聞かせください。内容と関係ない雑談も大歓迎です(^^)
↓↓↓↓↓↓↓お気軽にo(^-^)o♪
yoko_takano@appli.redまたは お問合せ

りんごからのお知らせ

こんにちは、Ringoです。岡山県真庭市というところで非常勤のデザイン講師をしながら、ブログやメルマガを利用したネットビジネスをご紹介しています。

このブログでは、老後の「ゆとり」を生む資金作りのノウハウを配信しています。
今だけ無料で『資金づくりの種類や手法をわかりやすくまとめたレポート』をお渡し、無料で受け取りたい!ということであれば、今すぐ「りんごのメルマガ」にご登録ください。
登録後、特典の受け取り方法をご案内するメールをお送りいたします。
*特典を受け取った後にメルマガを解除いただいても構いません。
*解除に対しての手数料もかかりません。

ただ、メールを読み続けていただくと、シニアライフに嬉しい「お小遣い」を獲得できるノウハウを紹介。無理なくコツコツと老後の資金を増やしていくためのお得な情報をお届けします。

SNSやネット活用の実践講座を交えた実りいっぱいの無料メルマガです。

お申し込みはこちらのボタンをクリック、是非この機会に(^o^)ノ゙
↓↓↓↓↓↓↓↓↓↓ *クリックだけで登録はされません、表示された案内ページ内の申込フォームからご登録ください。

よろしければ、この記事やブログに関する 感想・聞いてみたいこと・要望などなどお聞かせください。内容と関係ない雑談も大歓迎です(^^)
↓↓↓↓↓↓↓お気軽にo(^-^)o♪
yoko_takano@appli.redまたは お問合せ


お願い記事内の不具合や間違い等をお知らせください。 (キャプチャーの違い、古くなった情報、誤字脱字等些細なことでもかまいません)
↓↓↓↓↓↓↓↓
*お知らせいただいた方にはりんごからささやかなお礼を送らせていただきます。

Posted by りんご