2018年9月24日に開催した「クロコラボ #16 WordPress もくもく会」のレポートです。前回にひきつづき、WordPressに関することを、もくもく試してみました。今回はなんと、四国を超えて関西からの参加者がっ!遠いところからご参加いただき、レポートまで書いてくださり、ありがとうございました。
さて、もくもくした内容をまとめていきます。先日行われたWordCamp Tokyo 2018に参加したので、その振り返りや学んだことを試してみることにしました。参加したセッションのスライドをリストアップしていたのですが、このイベントの直後に、各セッションのスライドがリストアップされていたので、そちらをリンクさせてもらいます。
アクセシビリティのチェックをしてみた
WordCamp Tokyo 2018のセッションのうち、一番印象に残っているのは柴田宣史さんの「事例から見る、アクセシブルな WordPress サイトの運用現場の実際 」でした。そこで、全盲の方がWordPressの更新をされているということを知りました。私は今まで、情報を得る側のウェブページをスクリーンリーダーで読み上げてみることはありましたが、情報を発信する側のもの(WordPressでいうダッシュボード)を読み上げてみたことはありませんでした。自分の中で、記事の更新は難しいという偏見があったのだと思います。柴田さんは、実例から動画を使ってわかりやすく説明してくださいました。
「自分のサイトはどうだろう……」ということで、教えていただいたA11yc アクセシビリティ バリデーションサービスでサイトをチェックしてみました。
大きくは次の3つのErrorやNoticeがありました。
- 1. alt属性の値がない(特に古い記事)
- 2.「○○ 様」という記述のときに「○○」と「様」の間にスペースいれている場合などの、空白による整形
- 3. リンク先があるのにリンク文字列のない要素
1. alt属性の値がない(特に古い記事)
現在ぼちぼち対応中。最近の記事は意識して入れるようにしてたのですが、古い記事は空のものもありました。また、最近の記事でも横に並ぶタイトルと同じものを入れていたり、画像の説明になっていないものもあるので、全体的に見直したいです。
ただ、altに入れる言葉に結構悩む……。確か3年ほど前の岡山WEBクリエイターズさんのセミナーで、澤田望さん(SAWADA STANDARD DESIGN)のセッションを聞いてから、コーディングするときは「写真:○○」「イラスト:〇〇」「図:○○」といった書き方にするようにしたのですが、自分のサイトしてないやないかいっ!!とりあえずそれを統一したとして、どこまでの説明をするのがいいのかが難しいですね。
2. 空白による整形
制作実績の箇所に「○○」と「様」の間に空白を入れていました。そのほうが見やすいかなと思っていたんです。次の説明書きがありました。
「○○」と「様」という使い方ではちゃんと「〇〇さま」と読み上げてくれましたが、空白で整形することで意味が変わってしまい、違う読み方になってしまうこともあるので注意が必要なのですね。気をつけよう。
3. リンク先があるのにリンク文字列のない要素
アイコンフォントを使用している箇所で、次のようなエラーがいくつかありました。
これはもくもく会の少し前にチェックしてて、テキスト入れてCSSで飛ばすのもあかんよなと思ってツイートすると……
そうか!WAI-ARIAだ!「aria-label」でラベルを付けるのか。さすがです。澤田さん、ありがとうございました。
「aria-label=”ページ最上部へ”」を追加して、無事スクリーンリーダーで読み上げられました。
<a class="btn-pagetop" href="#"><i class="fas fa-arrow-circle-up" aria-label="ページ最上部へ"></i></a>
※スクリーンリーダーは、Voice Overを使いました
その他
その他にも次のような内容を話していました。
- WordCamp Tokyo 2018のお話
- GDPRについて
- WordPress.comについて(プラグインやブロガーさんのお話など)
- 松山駅と松山市駅は違うという話
GDPRについては、先日までIP Geo Blockを使ってアクセスを制限していたのですが、現在はIPアドレスで完全に国がわかるわけじゃないらしいというのと、設定を見てもらうと「それ、サイト重くなってそう……」っていうのを聞いて、Cookie Consentを使って承認をつけることにしました。合わせてプライバシーポリシーも設置しました。
おわりに
WordCamp Tokyo 2018で参加できなかったセッションなどは、また動画が公開されたら順jい見ていきたいと思います。遠方から来ていただいたのに少人数で申し訳なかったですが、逆に話しやすいこともあったり濃い話もできてよかったです。また観光がてらお越しをお待ちしております!
次回は10月24日(水)13:30〜16:30を予定しています。会場の申請完了したら告知いたしますので、よろしくお願いいたします。