デザイン ワークス・オンサイド

前エントリーに続いて、リニューアルをしました。

Home のこの部分を変更したのですが、今回も見た目のレイアウトは変わっていません。
前回、”Lightbox” を導入したので、ここにも使いました。

サムネイルをクリックすると、左の画像が切り替わるのは同じです。
以前は、この左の画像が切り替わるだけだったのですが、今回はその切り替わった画像もクリックできるようにして、”Lightbox” で大きな画像を表示するようにしました。
以前と今回の見た目は同じなのですが、 HTML の構造はかなり違います。
どちらも CSS と JavaScript を使って画像を切り替えているのですが、その方法が違います。
それに合わせ HTML の構造を無理がないと思われる範囲で変えているのですが、本当に構造上おかしくないのかは疑問です。
一応、文書構造に気をつけてコーディングしているつもりなんですけど…..

また、前回も書きましたが Accessibility は、実際どうなんだろう。
Cynthia Says™ でチェックする限り、WCAG - Priority 1,2 の場合だと大丈夫みたいなんですけどね。（WCAG - Priority 1,2,3 の場合は、”tabindex”、”accesskey” で Warning になりますが…）
まぁ、この結果を見ると大丈夫なのかなぁ?

では、Home で効果を試してみてください。
そこそこ大きな画像が表示されますよ(^ ^)