リフォーム工房 vol.014

■【ナルナル星】（ゆーりさん）

閲覧環境：WindowsXP IE6.0 解像度1152*864

【ナルナル星】はゲーム「幻想水滸伝III」「ファイアーエムブレム」シリーズ等の二次創作の展示を目的とした個人サイトです。（ご本人のサイト紹介より引用）「天ニ非ザル」というコーナーで、五十のお題を使ったオリジナル連作小説を発表なさっています。
サイトインデックス・小説コーナートップ・小説本文を中心に見せていただきました。

（１）トップページについて
限られたスペース内にきちんと情報が整理され、たいへんわかりやすいレイアウトだと思いました。リンクに下線がないことも記述方法でフォローしてあり、コーナー名もわかりやすくつけてあるので、行き先に迷わない親切なデザインだと思います。
やや気になったのは２点。
ひとつは、リンク関連の色です。マウスカーソルをリンクに乗せた場合の文字色は明るい黄色ですが、やや見づらく感じました。ノートパソコンの液晶画面などで見ると、文字が読みづらいのではないだろうかと思います。ほんの少しばかり、濃い色を使ったほうがいいかもしれません。また、未訪問のリンクと訪問済のリンクで文字色が変化しないのもやや不便に感じます。確かに同色を使うとデザイン上すっきりとまとまるのですが、訪問者からするとどこは見ていてどこは見ていないのかがわかるほうがより便利になります。もっともわかりやすいのは全く違う色を使うことですが、同系統の濃淡で表現するのでも、全く変わらないのよりはかなり使い勝手が良くなるはずです。この場合、リンクに使っている青色をやや濃くするか、逆に薄くするかした色などどうでしょうか。検討してみてください。
ふたつめは、中央左側のInfomation部分の色使いです。ピンクとオレンジと赤と青、という色使いが、やや眩しく感じました。見出しにオレンジの□をつけるルールは統一されていますが、その次に来る色がばらばらで、目立つ色が複数使われているため、散漫な印象を受けてしまいます。オレンジ色は説明的な部分に使われているようですので、この色の彩度を落とすか更新履歴の文に使っているグレイに揃えるほうが、落ち着くように思いました。……と言っても、このあたりはほとんど好みの問題ですから、参考程度にお読みください。

（２）小説コーナートップについて
トップページと同じく、小さな欄に必要な情報をすっきりとまとめてあり、たいへんわかりやすいレイアウトです。リンクのみ赤系統の色でほかはグレイという色遣いもシンプルで美しく、クリックすべき場所に悩みません。未訪問のページと訪問済みのページの区別もわかりやすく、それでいてページデザインを損なっていないと感じました。
「はじめに」で表記ルールを説明しておくという手法など、見習いたいところです。読まなくても迷わずに済む上に、読んでおけば次からさらにわかりやすく使えるというのは、メインと補足の理想的な関係ではないでしょうか。

少し気になったのが、私がふだん使っているやや大きめの解像度（1152*864)で見た場合に、背景画像が右側にも表れることです。これはトップページにもいえることですが、こちらのページの場合画像の左サイドが直線的な形状をしているため、わずかに違和感があります。1024*768で見れば全く問題はありませんし、閲覧に問題の出るような不具合でもないので気にしなくてもいいようなことではありますが、もし大き目の解像度でも表示を統一なさりたいのでしたら、スタイルシートでy方向のみのリピートを指定しておくことをおすすめします。

（３）小説本文について
行間や左右の余白、配色などは申し分ありませんが、いくつか背景画像と文字の一部が重なってしまうページがあり、重なってしまった部分はかなり読みづらく感じました。画像は固定で文字のみスクロールするので、うまく画像から外れるようにスクロールすれば読むのに支障はないのですが、小説の中身に没頭したい時にそうした手間を強いるのはあまりすすめられません。
回避策としては、二通りの方法が考えられるかと思います。
ひとつめは、絶対に画像に重なることがないよう、本文の表示される幅を調整することです。右下に幅200ピクセルの画像を置くのでしたら、右に200ピクセル以上の余白ができるように指定してやれば、文字と画像が重なることはありません。現在どのページでも一定の左右余白をとっておられるようですが、背景画像に合わせて微調整を行ってみてはどうでしょうか。少し手間は増えてしまいますが……。
考えられるふたつ目の方法は、文字が重なっても支障がない程度に、背景画像の濃さを変更することです。PhotoshopLEをお持ちと伺っておりますから、このソフトで不透明度を変更して、より背景に溶け込むような画像に変更してみてはどうでしょうか。ただし、画像素材を配布しているサイトさんによっては、画像の改変を一切禁じているところもありますから、こちらの方法を採用する場合は素材サイトの規約の確認をお願いします。
また、細かいことなのですが、本文はページごとに雰囲気を変えて作っていらっしゃるのに、スクロールバーの色指定だけがすべて白地に濃ピンクで揃っているのが、逆に不揃いな印象を受けました。ページによって雰囲気を変えるのでしたら、ここもその雰囲気に合わせてしまったほうが良いのではないかと思います。小説コーナー内の統一感は、ページレイアウトで充分に実現できていると思いますので。

以上が、【ナルナル星】さんへの、文月からのアドバイスです。今後のより良いサイト運営への参考にしてくださると幸いです。

最終更新日：2004.05.09