架空企業サイトのLPを制作しました。(PC/SP・実装)
※画像をクリックしていただくとページ遷移します。
【キーワード】
・冷静でスタイリッシュ
・しっかりした
【使用言語・カンプ】
HTML / CSS、SCSS、JavaScript 、jQuery、AdobeXD
【カラー】
ベースカラー:#F3F3F3
ベースカラー
メイン・フォントカラー:#3E3E3E
メイン・フォントカラー
アクセント(ボタン)カラー:#FFAA3B
アクセント(ボタン)カラー
【フォント】
游ゴシック(日本語)
Montserrat(英語)
【素材元】
Unsplash(https://unsplash.com/)
【工夫した点】
・全体的にシックなデザインのため、フォントは柔らかい印象のものを使用しました。
・ページ内スクロールをした際の高さ調整。ヘッダーの高さを考慮してmarginを用いて調整することで、スクロールした時にセクションタイトルが十分に見えるようにしました。
【学んだこと】
・パララックスデザインを使用した実装
・カルーセルスライダーの実装
・必要事項が記載されている場合にのみ送信ボタンのカラーを付ける実装(Contactセクション)
気をつけたこと
1、デザインカンプとのズレがないか(PC・SP)
2、タブレットサイズや大画面ブラウザなど、カンプで指定した以外の画面幅でも最低限デザイン崩れなく表示できているか