2015年1月14日の記事（2件）

フォームのアクセシビリティ要件として、第一にラベルとコントロールを関連付けるということが必要です。この関連付けによって、スクリーンリーダー利用者は [tab] キーで入力枠等を移動していった場合に何を入力あるいは選択すればいいか分かります。また、マウスを使ってる場合はラベルのテキストをクリックすればコントロールをフォーカスでき、特にラジオボタンやチェックボックスの選択が容易になります。

しかし、CMS によってシステム的にフォームが出力される場合や、メルマガ配信サービスで出力される HTML を貼り付ける場合に、このラベルとコントロールの関連付けがなされていない場合があります。ラジオボタンやチェックボックスについては、暗示的なラベル付け（コントロールとラベルをまとめて label 要素で囲む）によって関連付けされていることが多いですが、テキストフィールドやセレクトメニューについては関連付けされていない場合があります。

最近上記のような事例があり、フロント側で HTML を編集することもできないため、jQuery を使って関連付けを設定してみました。フォームはよくあるテーブルによるマークアップの単純なもので、一行テキストフィールド、複数行テキストエリア、セレクトメニューに対して、ラベルとの関連付けを設定します。

“jQuery でフォームをアクセシブルに” の続きを読む »

WordPress サイトで Google アナリティクスを導入する場合（トラッキングコードをテーマファイルの header.php などに貼り付ける場合）、そのままでは投稿のプレビュー画面もカウントされてしまいます。また、テストサーバでテーマの編集やプラグインのアップデートを行っている場合も同様にカウントされます。

Google アナリティクス側でフィルタを設定して回避することもできますが、クライアントからトラッキングコードを渡された場合など、Google アナリティクスへのログイン権限がない場合、テーマファイルの中で回避することになります。

プレビュー画面を除外する場合については多くのブログ等で紹介されていますが、WordPressの条件分岐タグ is_user_logged_in() を使います。このタグでログインしているかチェックし、ログインしていない場合にトラッキングコードを適用します。

テストサーバを除外する場合はホーム URL の値を使います。例えばテストサーバの URL に “local” が含まれているのであれば、home_url() にこれが含まれているかをチェックし、含まれていない場合にトラッキングコードを適用します。なお、home_url() の代わりに、php の $_SERVER['REQUEST_URI'] を使ってもよいでしょう。

<?php if ( !is_user_logged_in() && strpos(home_url(), 'local') === false ): ?>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXXX-X', 'auto');
ga('send', 'pageview');

</script>
<?php endif; ?>

!is_user_logged_in() && strpos(home_url(), 'local') === false で、ログインしていない、且つ URL に “local” が含まれない場合にトラッキングコードを読み込んでいます。

なお、Google Analytics Dashboard for WP などのプラグインを使用する場合は、プラグインの設定でログイン中を除外することができます。また、テスト環境ではプラグインをインストールしないか無効にすることで回避します。