HAGANE Blog

  • About
  • Home/
  • PC関連 /
  • 情報は誰にでも平等

情報は誰にでも平等

takeyou 2007-2-21 水 PC関連 Leave a Comment 847

新しく3月から携帯業界に進出するイー・モバイル。CMも見かけるようになりましたね。

モダンブラウザを使ってる人、IE7にアップデートしてる人は、このサイトの違和感に気づいたと思います。

そうです。レイアウト崩れまくりですね。皆さんもWeb標準について考えていただく良いきっかけかなぁなんて思って記事にします。※Web標準=簡単に言うとHTMLを正しく使い、ブラウザを選ばないサイトにしようぜ!って事です。(W3C)

ということで、イーモバイルのサイトをモダンブラウザで見比べてみました。

IE7で表示してみた Firefoxで表示してみた

 

 

 

 

Operaで表示してみた Safariで表示してみた

 

 

 

 

 

どうですか?各ブラウザの名前が書いてあるところが、大きな空白になっているのが分かると思います。

この部分は制作者としてはこう表示させたかったのだと思います。

IE6で表示このように、IE6で見ると製品の画像や説明が表示されています。

実はこの現象、正しく表示されているのは前の4つで、間違っているのが、一見正しいように見えるこのIE6なんですね。

 原因はIE6が非常にお馬鹿なんです。なのに、そのお馬鹿なIE6を基準に作り込んでしまっているので、その他の正しいモダンブラウザでは表示がおかしくなるという理由なんです。

普通制作現場では大まかに「モダンブラウザ基準で作り込む→IE6用に修正を加える→その他のお馬鹿ブラウザ用に修正を加える→完成」という流れなんですが、その流れが一切見られない作りなんです。

まず「これでいくらもらってるんだろう…」という疑問が沸きましたね(笑)モダンブラウザを切り捨てて、IE6のみがターゲットで良いなんて、こんな楽な仕事は無いと思いますよ。altもtitleも無いし、ヘッダー・フッターはイメージマップで済ませちゃってるし…ちょっと正直適当すぎるでしょ?って思った。

依頼者の意向なのか、制作者の怠慢なのかは分かりませんが、新規立ち上げのサイトでこれは勿体ないなぁって思っちゃいますよね。

話を戻して上の画像、Safari以外は全て標準的なブラウザサイズの1024×768でキャプチャしてます。一般的にノートパソコンを使ってる人はこのサイズが多いと思うのですが、製品紹介ページであるにもかかわらず、IE6以外では最大表示にしても肝心の製品の画像が最初の画面に一つも出てきません。

おまけにノートパソコンの場合、マウスではなくトラックパッドをを使ってる人が殆どです。IE6以外でも画面を下にスクロールさせれば、レイアウトが崩れながらも製品画像は出てきますが、初心者の人がトラックパッドを使う場合、スクロールするだけでも結構一苦労だったりします。

だから800×600、それ以上でも1024×768以内である程度の内容が分かり、見る人が一瞬で理解できるようなサイトを作るようにしなければいけないわけですね。

余談ですが、画面を最大化してブラウザを利用する人ってそんなに居ないし、最大化してたとしても左側にお気に入りを表示させている人とかもいるので、やっぱり800×600以内に納めるのがベストだと思います。ちなみに、このブログを見てくれている人の約半分は1024 x 768の解像度です。

数字とか文章ではなく、イメージしやすいようにちょっと意地の悪い事をしてキャプチャしてみました。

Operaでお気に入りを表示中「Operaでお気に入りを表示したまま800×600の解像度で最大化した場合」という、まぁ実際にこんな使い方をする人は少ないでしょうが、数%はいるかな?という例です。(ちなみにtakeyou公式(笑)ブログ閲覧者の約3%の人が800×600を使ってます。)

正直言って、なんのページかさっぱり分からないですね。

それに比べて松尾敬法公式サイトなんてこんな悪条件でもこの通り!

松尾敬法公式サイト同じ条件でも完璧です(笑)携帯からだってキャリアを問わずに見れちゃいます!いやぁ素晴らしい(笑)まぁそれは置いておいて。

いい加減そろそろまとめに入りたいと思います。とにかく、そもそも情報を発信するという役目のサイトであるにもかかわらず、使用環境によって情報が意図したように伝わらないというのはナンセンスだと思うんです。情報は平等であると。

最近では当たり前のように視覚障害者用にサイト内容を読み上げてくれる音声ブラウザを意識したサイト作りなんかが行われています。

本当にそういう点では、一昔前と比べたら手間は非常にかかるようになりました。でもその手間の分見てくれる人が増えるという可能性がある=お店なら集客に繋がる=増益が見込める。なんて式も成り立つと思うのです。分かりやすく言えばバリアフリーですかね?

個人サイトでも同じで、不特定多数の誰かをターゲットに自分の意見を伝えたい場合に、より多くの人が集まり討論ができると思います。身内だけの内容なら先日も書いたように、知らない人間に見られるよりはVOXやMixiのような閉鎖的なスペースで運営するのが良いと思います。今の時代どこで誰が読んで恨みを買うか分かりませんからね。

この記事では詳しく書きませんが、Web標準を心がけると、後々の管理も楽になります。「内容はHTML」「デザインはCSS」というように分離して管理すれば、季節ごとにデザインを一気に変更!なんて荒技も簡単に行えます。サイトを持ってる人は今後Web標準を意識してみると良いと思います。これから作ろうと思ってる人は、ホームページビルダーとかでちょちょいと作るのではなく、面倒でも勉強してWeb標準を強く意識して作ると、後々ハッピーになれると思いますよ。そんなのは面倒だ!って方は、一度HAGANE Materializeへご連絡いただけると超ハッピーになれます(笑)最終的に宣伝です。

かなり長文になってしまいましたが、何を言いたかったのかというと、「イーモバイルって興味があったけど、サイトを見て買う気が失せた」という事です(笑)

今の時代にターゲットブラウザがIE5~IE6のみってあり得ないよ…

しかし、同じ会社なのに会社概要の方はしっかりしてるんだよね。IE5対策は不完全だけど。

ソースのインデントの使い方とかIDの名付け方やコメントの使い方を見る限り別の人(会社)が作ってるんだよね。なんで今までの人(会社)を使わなかったんだろう…事情はあると思うけど、なんだか勿体ない感じがして意味不明です。

あ、最後に、自己中心的電脳空間HAGANEとかその他諸々のめっきり更新していない我が輩のサイトは、イーモバイルの事を言えないような状態です(笑)本当に酷いもんです。酷すぎてリメイクする気にならないのでござる…くれぐれも突っ込まないでいただきたいのでござる…

最後に、Web標準に興味を持った人にはこれが最高にお奨め。

入門したての方はまずこちら↓

よくわかるXHTMLとCSSによるWebサイト作成
よくわかるXHTMLとCSSによるWebサイト作成

posted with amazlet on 07.02.21
富士通オフィス機器 富士通総合デザインセンター
FOM出版
売り上げランキング: 3639
おすすめ度の平均: 4.5

5 土台を据えるのに最適です
4 XHTMLとCSSの連携が“よくわかる”
3 完全に初心者向けです

Amazon.co.jp で詳細を見る

2冊目でバイブルはこちら↓

Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト
Web標準の教科書
XHTMLとCSSでつくる“正しい”Webサイト

posted with amazlet on 07.02.21
益子 貴寛
秀和システム
売り上げランキング: 1867
おすすめ度の平均: 4.5

5 2冊目に買う本
5 「web標準」を知る上で必読の書
5 Web屋なら必読の書。

Amazon.co.jp で詳細を見る
takeyou
2007-02-21
Share story:
← Previousスランプなのか?
Next →ついに…

Written by takeyou

TPOに応じてtakeyouだったり、捨助だったり、Matarializerだったり、フンミルさんだったり。 銀座の隅でwebDirectorな日々の30代空想具現家(まてりあらいざぁ)。 DQXはウェディのすてすけで鯖20。アニメ大好きみのりん大好き。夢はアインクラッドの1層で死ぬまで暮らす事です。 ※ハンドルネームの”takeyou”をエゴサすると、ロリ絵師のtakeyouって人がトップに出てきますが別人な。HAGANEオープン時から知ってましたし、別に同じハンドル同士頑張ろう!なんて勝手に思ってましたが、さすがに歳とって仕事で関わる人間が多くなってくると人格否定されないから一応書いておくわw こっちのtakeyouは『No!ロリ!Yes!貧乳!』これな。 もう一人のtakeyouさん、気分悪くしたら申し訳ないっす。

View all articles by takeyou

Website: https://twitter.com/takeyou

Related Articles

  • Google日本語入力

  • [win7] hello world

  • [win7]まさかの

  • [win7]やっと到着!

  • 2798d

Leave a Comment

Your email address will not be published. Required fields are marked *

You can use WP menu builder to build menus

Copyright © 2001-2015 HAGANE Initiative. All Rights Reserved.