EMT

俺的グッジョブ

http://sac.my-sv.net/

dt要素

初めてサイトを見て思ったのが見出しの背景画像の長さでした。パーセントで幅を決めてあるのでウィンドウのサイズを変えてみたりすると、見出しの画像が下にある文章より短くなってしまう現象がありました。これはdt要素が60%の幅に指定されているからだと思います。これの幅を指定しない、もしくは100%にするなりで解消できます。

それと、この要素の文字色と画像のコントラストがちょっと高めかなと思います。黒から白に近い灰色のグラデーションがかかっているので白文字では少々読みづらいかもしれません。グラデーションをもう少し濃くしてみるとかdt要素に高さを設けて灰色のグラデーションと文字を遠ざけるなどしてみてはいかがでしょうか。

リンク

先ほど挙げたdt要素にリンクが貼ってあるものがいくつかありますが、これも先ほどのと同様に読みづらくなってしまています。付け加えて言うとあのリンクは、訪問済み時の設定がないために濃い紫になっていて更に読みにくくなっていると思います。あのリンク色はTextで使用しているので仕方ないといえばそうなんですが、こればっかりは背景画像とのバランスが悪いと思います。もう一つdt要素内のaタグ専用にスタイルシートを作ってみてはどうでしょうか。

リンクの貼られていないコンテンツ

これは結構見受けられたんですが、TextのShortstoryなどです。TextのShortstoryのようにページ内にその内容があるのならば、トップページのようにページ内リンクを貼っておきましょう。

コンテンツが出来上がっていないものはメニューに載せたりすると見ている人に余計なことをさせてしまいます。出来上がっていないものはメニューに載せないようにしみあしょう。

Text

ここの人消人というページですが一番下の右に次のページへのリンクがあるのは分かりにくいと思います。序などの見出しの近くにPage1のようにページ数のリンクをそれぞれ貼っておくといいと思います。その際に今自分がどのページにいるのか、今いるページの文字を目立つようにしておくのとより分かりやすいと思います。

要素の並び順

テーブルレイアウトをせずCSSのみでデザインされているのは関心しますが、もう一手欲しいところです。その一手とは要素の並び順。スタイルシートを外してみるとメインのメニューが一番下に来てしまっていています。

HTMLは本と同じようなもので目次があり見出しがあり本文がありますので、それに沿ってサイトのタイトルから順番に配置していってそこからCSSでデザインなさるといいと思います。普通はサイト名・メニュー・見出し・文章となります。

細かいこと

この先、ある程度真面目にHTMLやCSSを書こうと思っているのでしたら、ソースの書き方に気をつけた方がいいと思います。今回気になったのはCSSの書き方でした。クラスを書いてそのままプロパティを書いてらっしゃるのですが、クラスごとに改行して書かれたほうが綺麗で見やすいソースになると思います。aタグなどの短いプロパティしかあてない場合は1行で書いてしまってもいいと思いますが。

それと、トップページのJavaScriptのソースですが恐らくレンタルのところでソースが配布されていて、それをコピー&ペースとしたんだと思うんですが、HTMLのソース自体、小文字なのでそれに合わせてJavaScript内のHTML(この場合imgタグの部分です)を小文字にしておきましょう。大文字から小文字にしたからってエラーが起こるわけではありませんが、将来XHTMLを書くことになったら、ソースは小文字で書かなければなりませんから。

デザイン

メールにシンプルかつクールとありましたが、こればっかりはアドバイスのしようがありません。デザインというのはあくまでも頭の中にあるもので何かに影響を受けて、それをデザインに固めていくことでそのデザインの方向性が決まっていくものだと思っています。

一番いいのはとにかく色々なサイトを見ること。特に海外のサイトはデザインレベルが高いです。いや日本のサイトもデザインレベルは高いんですが、どっちかというと海外のサイトの方が面白いことやってる印象があります。そういうサイトを紹介しているサイトの1つにCSS REBOOTというのがあります。このサイトで色々なサイトの色々な部分を勉強してアレンジされるとよりよいデザインになると思います。その上でシンプルかつクールなサイトになると思います。

シンプル、クールと聞くと即かっこいいですが、それは決して手抜きを意味しているわけではありません。単に白背景に四角形を並べたようなデザインは手抜きと言えましょう。一番誤解されやすいのがシンプルです。大抵の場合はシンプル=手抜きですのでそうならないように注意しましょう。

05/05/30

c2005 BAC AllRightsReserved