クライアント名
Leben
業種
ホームページ制作会社
サイト種類
コーポレートサイト
担当範囲
企画、ライティング、デザイン、コーディング全て自身で担当しました。
使用ツール
・figma
・Photoshop
・Visual Studio Code
期間
2025年8月〜9月上旬
実際のページ
・自社サイトがない。
・実績を一覧で見えるようにしたい
・ポップで楽しい感じにしたい
・料金面など分かりやすくまとめたい
・自分んで学んだことをアウトプットするノートが欲しい
広島県呉市のホームページ制作会社として、自社サイトを制作しました。
個人事業主なので、情報は多くはありませんが整理された情報でユーザーが、必要な情報をすぐに発見できるよう工夫しました。
またレスポンシブにも対応しており、スマホから見てもタブレットから見ても綺麗に表示させることができます。
ホームページの配色は、親しみやすさとポジティブなイメージがあるオレンジと、オレンジと相性の良い濃いグリーンを使用。
BLOGにアクセスしたユーザーがメニューが目に入るようPC版では左に固定ヘッダーを設置しました。
愛犬と仕事をしているので、各ポイントに犬のイラストを置きました。
全体的に楽しいホームページにしたかったので、背景に緑や茶色の円を置いてデザインにアクセントを加えました。
TOPページを見るとどんな会社なのか分かるように多めに情報を入れました。
料金や制作な流れは、ユーザー的にも気になるところなので専用のページはありませんが、すぐに飛べるようにアンカーリンクを付けています。
SP版ではお問い合わせに繋がるよう、下に「お問い合わせ」と「ラインで相談」ボタンを追尾させています。
お問い合わせフォームの他にも、LINEで気軽に相談できるよう公式ラインを取得しました。
動くロゴはjsonファイルを使用して、容量を小さくしています。
文字やコンテンツを動かしながら表示出せることで、見ていて楽しいサイトにしました。
SEOに強いサイトにしたいので、alt属性を抜けなく入れmetaタグを最適化しました。
また今後アップしていく記事が管理しやすいようにカスタム投稿やカスタムフィールドを使っています。
その他
お客様のホームページを作る時同様、必要な情報の洗い出しから始めサイトマップを作成しました。
その後テキストを作成しつつワイヤーフレームを作って行きました。
デザインはfigmaで作成し、完成後にコーディングしました。
公開後も、コンテンツを増やしていく予定です。
フレッシュ
ワクワク感
親しみやすさ
信頼感
分かりやすい
#FC6B3F
#0F9C56
#F3F6F9
Noto Sans JP
Rubik