• 個別サポート事例

飲食店の実案件の添削

Webデザインオンライン講座 個別サポート事例

私が初めてお客様に提供させて頂いたサイトです。

サイトを添削頂き、ご経験から、

・サイト構成
・掲載記事

などのアドバイスを頂けたら・・、と考えております。

飲食店の実案件の添削

こちらの受講生の方は、すでにWeb制作の受注をされていましたが、さらに、スキルアップをなさりたい、ということでWebデザイン講座をご受講いただきました。

Webデザイン講座

サポート内容

黒を貴重とし、お店の雰囲気、お酒、料理を上手く印象つけられていると思います。

サイト構成も上手くまとめられていると思います。

SEOを考慮したタイトルの付け方もさすがです。

独学でここまで作りこまれたのだとしたら、素晴らしいですね。

以下、気がついた点をお伝えします。

Webページを開いた時

〇〇市にある〇〇料理の居酒屋であることがわかるのはよいと思います。

ただ、何が特徴なのかが、わかりつらいです。

たとえば、

誰が(〇〇の人?〇〇でどれくらいか料理経験があるシェフ?)

どんな風に〇〇の食材を手に入れて料理しているのか?

〇〇の〇〇〇〇

・・・とういう情報であったり、

metaタグ内の
「〇〇〇〇〇〇〇〇〇〇」

の情報を、ページに配置してもよいと思います。

SEOを考えた時、トップページの情報が少ない。

metaタグと絡めて、トップページ内の何気ない文章の中に、狙っている「〇〇,〇〇」のキーワードを配置するとよいでしょう。

黒背景に白い文字は読みにくいです。

黒背景でのデザインは、高級感や洗練感、個性的なイメージを出すことができますが、その分、見せ方にもテクニックを要します。

すべてが同じ「黒」の背景に「白」の文字という構成が単調なので情報を読み取りにくいです。

このサイトのアピールする点、どこを目立たせたいのかを見直して、メリハリをつけられるといいですね。

特に、読ませたい長文、〇〇の部分は、白など薄めの背景にしたほうがよいと思います。

予約ボタンや電話番号が目立たない

ナビゲーションメニューの中の「ご予約」以外にも目立つように予約ボタンや電話番号を配置するとよいと思います。

HTMLのファイル名

今回は、納品されているので、

page1.html、page2.html・・・・でもよいかと思いますが、

次回からは、HTMLファイル名には内容と関連のある名前をつけましょう。

特に、ファイル名の付け方にルールや規則はないのですが、自分なりのファイル名の付け方を作られるとよいと思います。

SEO対策として、検索エンジンもファイル名を見るようです。

当サイト、Webクリエイターズチップスの場合、

運営者情報のページには、aboutus.html

メルマガのページには、magazine.html

などとしています。

いろんなWebサイトを見て研究してみてください。

「お店の人の顔」が見えるサイト

クライアント側の考えにもよりますが、私なら「お店の人の顔」が見えるサイトをご提案します。

Webサイトの一部にお店のオーナーやスタッフの顔を掲載する。

添付画像参照

サイト構成やデザイン等、大幅に変更するのは大変だと思います。

CSSの設定ですぐに修正できそうな部分に解説をつけてみましたので参考になさってみて下さい。

Webデザインは情報のブロックの集まりです。

この情報のブロックを意識してみると、全体的に余白が少ないです。
(ブロック同士がくっつきすぎています。)

情報のブロックを意識して余白をあけ、見出し文字のフォントサイズを上げるだけでメリハリがつきます。

 


この記事が気に入ったら
いいね!しよう

最新情報をお届けします

TwitterでWebcreatorsTipsをフォローしよう!

この記事をシェアする



Web業界で生き抜ける!
フリーランス
Webデザイナーになる方法

現在、メルマガリニューアル中です。2017/11/24 公開予定です!

  • Wordpressオリジナルテーマ作り方講座
  • Webデザイン講座
  • レスポンシブWebデザイン作り方講座
  • Webデザインまとめサイト

PAGE TOP