2021.05.28用　＃Webサイトレビュー

≪主旨≫
あるポートフォリオのサイトレビュー

1.【4原則】近接・整列・反復・対比

ポートフォリオについて、大見出しであるaboutなどは文字として大きいが、その内部の小見出しとテキストの対比が乏しいのでテキストの認識がしづらい。整列と反復は整理されており見やすい。

喜多川商店街について、ナビが付いてくる構造なのもあるがfooterのラインが切れているように見えるので、footerのラインは左端まで引くかライン自体をなくしたほうが違和感がない。カルク関数を使わずにpxを使用しているのか画面サイズにより余白がかなり変わるうえに、今月のピックアップで右端の画面をホバーすると横スクロールが発生している。

2.【色感】

ポートフォリオについて、色感は多色を使用しているが、頭文字のみ色を変えるアイデアで一画面で見る色数を減らしているので好印象。色彩のあるナビが四隅にあるためスキル欄のみ色数と色彩面積が多くなっていることや、四隅のナビの色と被っているが同色に充てられた要素同士が共通項目ではないので、ごちゃついた印象がある。

喜多川商店街について、落ち着いた色感で非常に見やすい。

3.【タイポグラフィ】

ポートフォリオについて、aboutなどの見出しの字体を変えているので見出しだと認識がしやすいが、文字が特大過ぎてcontentsが一画面に収まらないことと文字としての視認性が低い。スキル欄は見出しとimageとテキストで全ての字体が異なるため、ごちゃついた印象がある。

喜多川商店街について、特になし。

4.【余白】

ポートフォリオについて、ラインハイト値が多いため、二行以上のテキスト量が多い箇所は見出しとの余白の対比が低いため読みづらく読みたいと感じない。aboutなどの見出しはフォントサイズや字体で特殊性を出しているので、その子要素との余白を取りすぎるとコンテンツとしての認識が難しくなるので、余白はもう少し詰めてもいいと感じる。また、ファーストビューが下に寄っている。

喜多川商店街について、全体的に右に寄っていて、右側の余白が全くない。

5.【操作性】

ポートフォリオについて、contactページがないこととメールの表記が小さいので、就職用のポートフォリオとしては企業に対して印象はよくない。contactをさせる気がないのであれば、いっそのこと載せない方がいいと感じる。

喜多川商店街について、お問合せのコメント欄が小さくユーザビリティにかける。ナビ部が訪問箇所で色が変わるので分かりやすくていい。

6.【写真・ロゴ】

ポートフォリオについて、imageは可愛らしく本人の趣味が表現できていると感じる。

喜多川商店街について、今月のピックアップ品ページの写真の使いたいかたがよく、特にシャドウの掛け方が勉強になる。

7.【レスポンシブ】

ポートフォリオについて、携帯サイズではナビの主張が激しく、特にfooterが被ってしまっている。

喜多川商店街について、iPadサイズでは壊れている。その他でもトップページのコンテンツが全て右に寄っている。

≪総括≫

ポートフォリオについて、全体的に可愛らしい印象なので少し色数を抑えるなど大人な印象を加えると纏まって見えるか思う。

喜多川商店街について、サイズ管理が重要かと感じる。

香水のwebサイトについて、ランディングページとしてあったが外部リンクへ誘導するバナーなどがなく商品らしき物のimageを張り付けているだけとなっているので、何のWebサイトであるのかが閲覧者にはわからない。「何の」とは、「何のために存在し、何をしたいのか」が不明。

全体的な印象として、喜多川商店街は作成前にコンセプトなどが提示されていたので他と印象が異なるWebサイトとなっているが、その他のWebサイトが同じWebサイトの異なるページであると感じてしまうほどテイストが同じであるので、ポートフォリオは個性をだす作品であるので問題はないが、それ以外のWebサイトがコンセプトなどを練らずに作成したことが伝わってしまう。また、見出しを特大文字にするという癖が見受けられる。