Home > ウェブデザイン
ラベリングシステム
今日は、ラベリングシステムについて勉強した。
簡単に言うと、メニュー等の項目の名前付けなのだが、これはSEOから見ても重要だ。
例えば、メニューのトップへ戻るリンクにしても、「トップ」、「TOP」、「ホーム」、「HOME」等いろいろあるが、これがページごとに違うのでは、一貫性がない。
その他、日本語と英語を混ぜる等も駄目である。
普段はあまり気にしないが、こういった細かな点でSEO効果が変わる事が多いらしい。
技術的な部分はまだ勉強中だが、文章の論理構造がしっかりとしたサイトを作るのが大切だ。
SEOだけでなく、使う側から見て使いやすいサイトになると思う。
オンデマンド講義を見る
今日は、オンデマンド講義の「WEBワークフロー概論」を見た。
これは、ウェブ制作の実際の流れを勉強するもので、顧客へのヒアリング項目とかを勉強した。
SOHOなどで仕事をするのなら、これは非常に重要なことだと思った。
備忘ログを兼ね、参考までに、ヒアリング項目を挙げてみる。
- サイトの目的
- 求めているコンテンツ
- 想定されるターゲット
- デザインイメージ
- 公開までのスケジュール
- コスト(予算)
- 告知やプロモーションの方法
- Flashやムービーの有無
- CGIやPHPなどの利用の有無
- データベース利用の有無
- EC決済システムの有無
- メンテナンスや維持契約の有無
ケース・バイ・ケースな所はあるが、これらについて、きちんとヒアリングし、議事録を取ることがスムーズな仕事運びや、トラブル回避などに有効であるので、しっかりと押さえておきたい。
IE6ブラウザのバグを解決
制作課題でサイトを作っているが、ブラウザのバグで全然進まなかった。
と言うことで、オンデマンドの講義で教えられた、「CSSバグリスト」と言うサイトで、IE6のバグを調べたら、それっぽいのを発見。
早速、CSSを修正してみると、問題解決!良いサイトがあって助かったー。
どうやら、IE6では、幅(width)を指定したボックスに、marginを指定すると、指定したmarginより、大きくなるのだとか。
と言うことで、marginを0にして、paddingで調整すれば問題無くなった。
ただ、今回はpaddingをいじれるソース状態だったが、いじれない場合、結構大掛かりな修正が必要になると思った。
CSSで段組をする場合、最初からブラウザのバグを念頭に入れておかないと、後から大変になりそう。
と言うことで、まだ1ページの大まかなところしか出来ていないが、アップしたのでここから見てみて。
まだまだ作りこみが必要だけどね。
ウェブデザイン・ノウハウの身に付け方
デザインの勉強をかねて、「グッドデザインサイト・リンク集」みたいなものを作ろうかと思っている。
やはり、デザインを勉強するのに一番良いのは、デザインやアクセシビリティー・ユーザビリティーに優れたサイトを研究することだと思う。
今、通信講座で勉強しているが、そこの講師の方も、良いデザインのサイトはキャプチャーしてとっておき、後から参考にするといっていた。
芸術の世界もそうだが、良いものを模倣し、技術を盗むのはよくある事で、その上で自分のオリジナリティーを出していくのが良いのではないかと思う。
つまり、単なるパクリサイトや、コピーサイトではダメ。
内容(コンテンツ・デザイン)を盗むのではなく、デザインのノウハウ的なものを参考にするのだ。
これからウェブデザイナーを目指す方は、自分の気に入ったサイトを研究して、良いところ、悪いところを自分なりに整理してみると良いかも。
ちなみに今日は、午前中にハローワークに行き、そのままネットカフェに来た。
やっぱりブロードバンドは快適だ。
早いとこ、うちもブロードバンドにならないかな。
素人には意外と難しい枠

上の画像を見て欲しい。
よく見かけるものだと思うが、メニュー等を枠で囲ってある。
これは、ボーダーと呼ばれるものだが、素人はこれをどうやるか、意外とわからない。(私だけ?)
たった、1ピクセルの線なのだが、以前、勉強もせずにサイトを作っていた時、このボーダーをどうするのか、ぜんぜんわからなかった。
テーブルの枠とは違うしなぁ・・・と思っていたが、CSSを勉強してやっとわかった。
テーブルを入れ子にして作る方法もあるようだが、CSSを使ったほうが、これからは良いようだ。
今更ながら、ウェブ制作にCSSは必須だね、と思った。
これらの方法については、後々と言うことで。