サイトを大幅更新

    日常・時事

最近このサイトの様々な更新を集中的に行っています。特に見栄え・分かりやすさ・統一感というデザイン関係の微調整を少しずつ進めています。
具体的には、

・全体的に、枠(Sectionと呼んでいる)のborderを除去
→シンプルになり、清潔ですっきりした印象になった。

・サイト全体的に詳細ページ(末端ページ)にサイドメニューを追加
→ページがさびしい感じだったのがにぎやかになった。またページの行き止まり感が改善。

・各コンテンツの左上の画像を正方形で統一した
→従来サイズがばらばらの正方形でしたが、正方形に統一したところ存在が安定した印象になった。

・画像サムネイルのサイズを「長辺192px」に統一
従来width=192pxや200px等と、横幅だけの指定でしたが、縦長の画像の場合は縦が長くて面積が大きい印象になっていました。これを全体的に長辺統一というルールを決めて改善し、縦長・横長共に印象のばらつきがなくなった。

・写真エリアページ(横浜、京都等のレベル)を改善
各ページの解説を指定文字数まで表示したり、撮影情報の表を表示したりして、1つ1つの印象に重みを付けた。

・写真詳細ページ(豊洲、増上寺等のレベル)を改善
解説の横に撮影情報の表の表示を追加。
→文章だけで単調だったのが、レイアウト印象に多彩さが加わった。

・写真コンテンツは関連ページへのレコメンドを表示
サイドバーの「○○に関連する写真コンテンツ」の実装。
写真データDBから判断して動的に出力するようにサーバ側で実装。
→詳細ページでの行き止まり感を減らす効果がある。

・文章、画像の調整
ページの印象として文章・画像が過剰・不足と思う部分に関して調整。

・ページ印象の改善
印象が近い画像を減らし、視覚的多様性を増す

・リンクを増やす
文章やページに他ページと関連する記述がある場合は意識的にリンクするようにしています。

色々試行錯誤した結果ですがこのようになりました。他にもあったかもしれませんが、たくさんの修正をしたのでもう自分では見えなくなっています(^^;)

そもそも自分はサーバ側実装のエンジニアでデザイナではないため、デザイン面に関しては素人なので苦労しています。デザインはほんの少し変えるだけ随分印象が変わると実感。これらのデザイン改善・統一は、サーバ側の改善と併せてテンプレ構造をなるべく共通化する構造改善を事前に行ったことで実現しました。(ページ数がとても多いのでこれがすごく大変でした…)

最初からちゃんと構造設計をしていればこの苦しい作業も不要だったのですが(^^;)でも合理的な構造になってみて、デザインも機能も手も加えやすくなり管理しやすくもなっています。まだまだデザイン的な改善を模索しつつ、どんどん規模が大きいサイトにしていくので、サーバ側とバランスをとり管理しやすい構造にしていきます。

このサイトを作っていて学ぶことは本当にたくさんあると実感していて、やりたいこと、できそうなことがまだまだたくさんあり、とても楽しみになっています。

   

↓拍手ボタンを押して頂けるととても励みになります。


みやだいのプロフィールアイコン

Written by みやだい

ファゴットが好きな「みやだい」です。コントラファゴットやファゴッティーノやバソンも所有。真面目マイペース平和主義、前向きでいたい。
X(旧Twitter) → @iadayim



記事へのコメント

\コメントを書く/

※絵文字は対応していません。
※攻撃的、乱暴なコメントはしないで下さい。

名前 (必須)

コメント (必須)