The New York Timesのホームページに見るCSS時代の文字装飾(コラム)

最近、英語のホームページをよく見ています。そんな中、たまたまニューヨークタイムスのホームページを見ました。新聞社のホームページは、コンテンツが多く、また見るだけではなく記事を読んでもらわなくてはならないので、ユーザーにストレスを感じさせないサイト誘導が大切だと思いますが、なるほどと思う構成になっています。情報の多さと、見やすいレイアウト・デザインを両立させているように思えます。もちろん、アメリカの場合はリハビリテーション法第508条の影響もあるのでしょう。

具体的に見ていくと、コンテンツは、見出しに色を付けてリンクであることを知らせると共に、内容の要約があるのは親切ですね。ちょっと色の違いがわかりにくいかもしれませんけれども。また、写真の他に動画、バナー広告も載せているのに、まるで新聞の紙面の様で、とてもまとまっています。このサイトもそうですが、枠の様に囲ったり、背景に画像を使わないレイアウトのやり方は、参考にしたいと思いました。

他にも、気になるところがありました。有名な新聞にもかかわらず、省略しているドメインを使ったり、Googleのページランクが10であったり。いろいろと工夫されていることが伺えます。

なぜ英語で書かれているホームページを見ているかというと、どうも漢字圏に比べて文字装飾がスマートだな、と思い参考にしたいからなんです。

最近は、CSSとxhtmlでサイトを作ることが増えてきました。同業の人からも、「フルCSSで作ってみました」と、ホームページを紹介されることが多々あります。

デザインはデザイナーの領分だから立ち入らないということもありますが、個人的には、CSSでサイトを組む時には、特に文字装飾を考えます。インターネットの世界では、文字飾りというのは結構悩みどころ。太文字や色を変えたり、ましてやアンダーラインなどは、使い所を間違えると、ユーザーの方に適切にサイトを見てもらえなくなる可能性があると考えるからです。

具体的にいうと、日本のインターネットでは、「青い文字にアンダーライン」の箇所は、リンクが張ってあるという暗黙の了解があるように思います。その箇所が紫になっていたら、既にクリックして読んだということ。これらをサイトに盛り込むことで、見ている方にストレス無くコンテンツを回ってもらえると思うのです。

ところが、CSSを使うことによって、その了解が通用しなくなってきました。アンダーラインはサイトのデザインから見ると、ごちゃごちゃしているように感じる場合もあるので、使うのは避けたいところ。ですが、特定の文章の上にマウスを持ってくると、初めてクリック出来ることがわかるようにデザインすることは、サイトナビゲーション上問題がないか。強調のつもりで色を付けたら、ユーザーはそこにリンクが貼っていると勘違いしないか。ではこれまでの通りの書式でサイトを作るか。

たかだか文字装飾ですが、されど文字装飾。正解がない問題ですので、試行錯誤が続いています。

コメント

タイトルとURLをコピーしました