用語集フレーム版ノーフレーム版
はじめに10

第8話:困ったサイト

重量級 | 視覚級 | ブラウザは? | コラム:リンク、フリー?

重量級
空間 空間 空間
空間
重いサイトは避けられがち
 
→画像・マルチメディアファイルは多用を避ける
テーブルは読み込みが遅い
→フレームは読みこむページ分重くなる
→長文はほどほどに
→HTML文法を間違えると表示が遅かったり正しく反映されなくなる
ヤマト 重いサイト嫌〜い!!
アリババ 俺も。ブラウザ落ちちゃうもん。
ヤマト ねぇ、何で重いサイトは画面に映るのが遅いの?
フッド まあ、「重い」とはこの場合、ファイルデータの総量が多いということだ。
ブラウザは、そのファイルのデータを回線に合わせて一定量でしか読みこまんから、データが多ければ多いほどブラウザに反映される時間が長くなる。
男ジャック 最近は高速回線も手ごろな値段で使えるから気にならない奴もいるだろうけどよ、ド田舎の聖動源や聖夢源じゃつかえねぇもんなぁ。
ヤマト 違うもん!ここ螺エリアじゃん。無線電波が届きづらいだけだもん!!
一本釣 ま、そりゃいいとして、サイトが重くなるのは何が原因なんだ?
フッド まあ、思いつく限りではこんなもんかな?
  • 解像度が高い・大きさが大きい・多色過ぎる画像
  • マルチメディアファイル(Flash・MIDIなど)
  • JavaScript・DHTMLの多用
  • テーブルの多用
  • フレームの多用
  • 文そのものが長すぎる
ピーター 画像は解像度が高い・大きさが大きい・多色過ぎるとそれだけデータも多くなるんだ。
画像は減色する・画像の大きさ「そのもの」を小さくすることで幾分軽くなるよ。制約があっても綺麗な画像は描けるから、安心して♪
フッド ちなみに、一度読みこんだ画像は一時ファイルが消されるまでは読みこまれるため、使いまわしても重くはならない。サムネイルや壁紙などで活用したいな。
男ジャック マルチメディアファイルっつーのは、動画系(GIFアニメーションやFlashアニメ、ストリーミングビデオなど)とか音楽系(MIDIやMP3など)みたいなもん。
そういうのは、ブラウザがサーバから受け取ったマルチメディアファイルのデータから、どのアプリケーション(プラグイン)で再生するか決める、ってところで時間を食う。
ヤマト あのさ、「このページを見るためにはプラグインが必要です」ってサイトに入るとさ、何か変なもんダウンロードしようとするんだよな。なんか怖くてダウンロードしてないんだけど・・・。
男ジャック だからそれが、マルチメディアファイルを再生するやつなんだ。ダウンロードしてもかまわねぇけど、パソコンの環境によってはダウンロード禁止ってのもあるからな。そうなるといちいち出てくるダイアログがうぜぇんだよな。
アリババ JavaScriptやDHTMLが何なのかは【とほほのWWW入門】見てもらうとして、俺達はサイトを飾ったり動かしたりする便利な呪文、ぐらいに覚えててもいい?
フッド 良くないが、今回は内容につっこむまでもないからな、まあいい。重くなるのは、ブラウザがこれらの言語を読み込み、ブラウザサイドで判断して効果を出すからだ。
これらはスクリプトを無効に設定してある輩もいるから、注意が必要だ。
ピーター テーブルはテーブルそのものを最後まで読みこまなきゃ内容が表示されない。だから重く感じるんだよ。2重くらいでやめといたほうがいいと思う。
フッド 個人的に、レイアウトのためにテーブルタグを利用するのは邪道と考えてるが・・・。
ヤマト このサイト、ばりっばりテーブル利用しまくってるよね(笑)
牛若 フレームは・・・あの、別々のページが同じページに映る、アレですよね?
男ジャック そ。別々のページを読みこんでるんだから、その分重くなるのは当たり前。
一本釣 ま、文が長すぎってのも当たり前か。
俺は重いとかなんかより、文が長いってだけで嫌になるけどな(笑)
男ジャック これらは使うな、とまでは言わねぇけど、おいらは30秒以内に反映しねぇサイトは即逃げるぜ。
ピーター タグを閉じ忘れたりとか、HTML文法を間違えてると重くなったり、ブラウザによっては反映しないこともあるから注意してね!
空間
空間 空間 空間

視覚級
空間 空間 空間
空間
見づらいサイトは避けられがち

→マルチメディアファイルはスキップ・停止できるべき
→なるべくブラウザ側を操作しない
→大きい画面基準でデザインすると横スクロールが出るユーザーも多くなる
色合い・背景に注意
小さすぎるフォントは使わない
フッド WAI Content Accessibility Guidelines 1.0】(日本語訳)というのがある。
ヤマト 何??いきなり。
フッド いや、アクセシビリティの指針みたいなものだが、その中で、「視覚的効果のあるオブジェクトはユーザ側でも制御が可能である」というものがあるんだ。
男ジャック 簡単に言うと、FlashアニメとかJAVAアプレットとかストリーミングビデオとかな、そんな動くもんは見る側でも止めれるようにしろっつーこと。
フッド 本来は、画面をちらつかせるMARQUEEやBLINKタグは使わないようにせよ、というものだ。
これらがIEもしくはNN特有のタグであることが少し気になるな・・・。
がだ、点滅効果は、光反応性てんかんのある方の発作を引き起こす場合がある
アニメか何だったかで色差のある点滅を行って、大勢の子供達が具合が悪くなっただろう?あれを思い出せばいい。
ヤマト え?アニメとかだめなの??おいてあるトコ、いっぱいあるじゃん。
ピーター だめっていうわけじゃないよ。ブロードバンド化が進んで、今じゃある程度の重さのファイルでも、素早く取り込めるようになったからね。ただ・・・。
アリババ うあああああっ!畜生!!また固まったっっっ!!!!!
ヤマト 何見てたの?
アリババ ピーターに言われてさ、「JAVAアプレット」で検索したらさ、検索結果巡るたびにブラウザが固まりやがんの!!また再起動だよ〜!!!
ピーター って感じで、あんまり重いマルチメディアファイルを置いているサイトを、ナローバンドや旧型パソコンなど環境が悪い人が見ると、ブラウザが落ちる、もしくはパソコン自体が言うこときかなくなって再起動、というはめになることがあるんだ。
アリババ 最近流行ってるハーなんたらってのも重いよな、あの丸っこいキャラのやつ。しかもWEBリングとか回ってたときに、いきなり出て来るとムカツク。
フッド 先ほどの指針は、他にリフレッシュのようなものも制御可能にすべきだとしている。
一本釣 リフレッシュ?
ピーター 自動リロードみたいなもん。同じページのリフレッシュだとチャットでよく使われるし、別ページだと、ほら、「○秒後に新しいページへジャンプします」ってやつな。
フッド これらはすべて置くな、とは言えないと思うが、せめて多くの人が来るトップページに置くのは避けるべきなんじゃないかな?
アリババ 「このサイトはこういうことしてます」っていう前置きも欲しいな。ブラウザ固まる前に逃げられるもん。
男ジャック ま、さっきみたいに検索先で遭遇、ってんなら、どーしよーもねーけどな。
 
 
アリババ 画像だけじゃなくさ、他のやつもこっちから制御出来ればいいなぁ。
牛若 たとえば、どんな?
アリババ うーんとさ、ブラウザの大きさを固定するやつとか。メニューバーとか、意味のある固定だったらいーけどさ、固定された大きさが俺のモニターより大きいとなんかムカツク。
ピーター MIDIとか、音楽も、勝手に鳴るのはどうかと思う
アリババ あ〜、ある〜!!俺、夜中に最大で鳴り響かせてみんなを叩き起こしたからなぁ(笑)
男ジャック ま、こいつの場合夜中なのに音を絞らなかったっつー自業自得なわけだけど、学校のパソコンとか、設定をいじることができない環境もあるってことを忘れんな。
フッド 確かにサイトのデザインは管理人が決める。だが、管理人が想像する環境以外の環境で、インターネットを楽しむ人も多いことを、肝に銘じておくべきだな。
 
 
ピーター けっこう気付かない人もいるけどさ・・・。
一本釣 何がだよ?
ピーター
一本釣 ・・・見ーづーれー!なんじゃこりゃ!!
ピーター それっぽい環境を作って画像にしてみたんだ。
男ジャック なんか、環境によっては普通に見えるのもあるんだけどさ、こういう風に見える奴も多いと思うんだよな。
ピーター 例えば柄ものの背景とかはさ、テキストをテーブルで囲んでその中に書くだけでもけっこう違うよ。ただ、読ませたいテキストよりも、背景に目がいっちゃうだろうから、そもそも派手な背景は使わないほうが無難。
アリババ こういうのって、言われなきゃ気付かないところもあるよね。直さなきゃ。
空間
空間 空間 空間

ブラウザは?
空間 空間 空間
空間
→すべての客が同じ環境にいるわけではない
→対象を絞るのは必要悪?

→ブラウザを特定する必要がない場合もある
→ブラウザやバージョンによっては反映しないタグ・CSS等もある
ヤマト 僕、ネスケ使ってんだけど。
男ジャック おいら、Opera使ってるんだけど。
ヤマト 「このサイトはWindowsのIEで見て下さい」っての、変じゃない?
男ジャック 他人のブラウザにケチつけんじゃねぇよ!!
一本釣 ・・・つーことは、ブラウザってのはIEとかネスケとかOpera、みてーなやつのことか。
フッド ブラウザとは、WWWを見るためのアプリケーションソフトのことだ。WWWブラウザとも言う。前述のInternet Exproler(IE)やNetscape Navigator(NN、ネスケ)、Operaなどが有名だな。
アリババ なんで「〜〜で見て下さい」になっちゃうの?
ピーター 原因はこの二つ。
  • 動作を確認したのが特定の環境のみ
  • 使用したスタイルシートやDHTMLが特定の環境のみ反映
ちなみに、インターネットで「環境」といえば、パソコンが置いてある場所・OS・OSのバージョン・ブラウザ・ブラウザのバージョンを指すよ。
フッド 前者は、個人のサイトならともかく、企業ならば管理人の職務怠慢だな。OSもエミュレーターを使えばある程度なんとかなるし、無料で手に入れられるものが多いブラウザは確実に確かめておきたい。個人単位でも、IEとNNくらいは確かめたいものだな。
男ジャック 後者だったら、そういうあやふやな言語は使うなって話。
ピーター だけどさ、みんな環境しぼるのは悪いっていうけど、「みんなが見られるサイト」っていうとさ、けっこう難しくない?
アリババ なんで?
ピーター だって、「俺の環境はWindows3.1・IE2だが、お前のサイト見られないぞ!」って言われても、僕は困るし。
アリババ さすがにそんな古いもの使われてもなぁ・・・
ピーター それに、デザインを凝るならスタイルシートも使いたいけど、IE以外のブラウザに対応してないスタイルシートもけっこうある。
だいたいスタイルシートを完全に対応してるブラウザ、最新のバージョンでもないじゃん。あんなんで「表現を表すHTMLタグは廃し、それらはすべてスタイルシートで補う」ってできるの?
牛若 BLINKやMAQUEE以外で使ってはいけないタグがあるのですか?
フッド 少し専門的な話になるが、HTML文書にもバージョンがあってな、現在最新のHTML4.01では視覚的なタグを排除し、視覚的な表現はスタイルシートで行う方が良いとなったんだ。
そのため、「<FONT>・<BASEFONT>・<CENTER> ・<DIV> ・<U> ・<S> ・ <STRIKE> ・<DIR>・ <MENU> ・<ISINDEX>・<APPLET>」などは非推奨(Deprecated)タグとされ、将来廃止されるだろうと予想されているのだ。
牛若 ・・・あの、このサイトは<FONT>タグを多用してますよね・・・
ピーター だけど、それに代わるスタイルシートは「color:〜;」っていうんだけど、NN3には対応してないんだ。
フッド NN3はスタイルシートに弱いからな・・・。
ピーター NN3いなくなれー!ってのは横暴だと思うし、かといってスタイルシートを使わない手はないし。難しいところだと思う。
男ジャック ・・・まあ、正直、おいら中身がまともに見れればデザインとかはどーでもいい気がするけどな。
そんくらいに考えてもいーんじゃねぇ?
ピーター デザインうんぬんは納得いかなーい!僕が日々どれだけどんなブラウザでも完璧に見えるよう努力してるか分かってる!?
フッド そのくらいの心意気があれば、管理人としては合格じゃないか?・・・ということにしとけ。
牛若 この問題は管理人にまかせる、というところでしょうか?皆さんも対象をしぼるべきかどうか、考えてみてくださいね。
 
 
一本釣 ・・・あのさ、この章、茶々入れる気力ないくらい訳分かんねぇ単語ばっかなんだけど(汗)
フッド うむ、やはり、用語集が必要か・・・。後ほど用意しよう。
空間
空間 空間 空間

重量級 | 視覚級 | ブラウザは? | コラム:リンク、フリー?
 
前へ戻ります はじめに 注意 登場人物紹介 | ネチケット メール 掲示板 チャット コミュニケーション
次へ進みます
サイト作成マニュアル 管理者心得 困ったサイト 反省会 | 終わりに リンク

神帝隊のネチケットしゃべりば!
yangling100@yahoo.co.jp