WEBデザインスクール「DLL」でLPの講義を受けています!

こんにちは、ソラです。
山田秀平さんのWEBデザインスクール「DLL」に入って、もうすぐ3ヶ月が経とうとしています!
年末年始に思ったより稼働できなかったのと1月少し体調を崩していたので、この1ヶ月あまり講義を進められなかったのが残念です😭
DLLは卒業までの期限がないので、その点では体調を崩しても焦らなくてよかったです!
早く卒業したい場合も、マイペースで卒業したい場合も受ける人の状況に合わせて受講できるのが助かります。
前にWEBデザインではないですが、カルチャースクール的なものに通っていたとき、一度休んだことで完全にリタイアしてしまう人も見てきたので、事情があっても途中で休めないスクールはリスクが大きいと思います⚡️
家族や自分の健康に何かあるとか、急に仕事がなくなるとか…人生何があるかわかりませんし!
最初にちょっと…今後の目標
マイペースに講義を受けてきましたが気づいたら3ヶ月経ってしまいそうなので、今後の見通しを一応立てておこうかなと思いました。
プライベートで出したい公募があり3月までそちらに時間をかけるつもりなので、ちょっと余裕をもって
- 講義を3月まで(2月中)に終了
- 3月は卒業課題に向けて実践の特訓
- 4月には卒業課題提出して卒業
というのを目安にしました。
仕事面や体調面など何事もなければ、ここまでにはぜひ卒業したいですね!
もちろん余裕があればこれより早く卒業したいぞ🎓
と、前置きが長くなりました😅
今回のブログで書きたかったのは、スクールの講義についてです!
スクールで習う内容としてはいよいよ佳境の「LPの作り方」の講義に入りました✨
LPのファーストビューは最も大切な部分!
ずっとワークブックをやっていたので、何だか久しぶりの講義です。
F先生の声がもはや懐かしい…先生の存在を感じるとほっとしますね😌
さて、今回作っていくのはLPのファーストビューです!
LPの最初の1画面に収まる範囲をファーストビューと言います。
「ファーストビューとは」というのは以前の講義で既に習っているのですんなり理解できました✌️
このファーストビューでユーザーがページから離れていってしまうかどうかほぼ決まるらしく、かなり力を入れて作るべき部分なのだそうです。
たしかに自分もネットでLPを開いた時、下まで読まずに閉じてしまうことが多いです…
宣伝する商品やサービスを必要としている人に、ちゃんと下まで読んでもらえるファストビューを作ることがデザイナーの課題なんですね。
LPのファーストビューの作り方
LPのファーストビューの作り方は、バナーの作り方と同じでした!
既にブログにまとめてきたことなので簡単に説明すると、
- ペルソナを確認する
- 要素に優先順位をつける
- 手書きラフを作る
- 単色でデザインする
- 配色する
という手順です。
簡単じゃんッ!と思いますが実際やってみると手順が多い…時間がかかる…😱
バナーの時も一緒ですが、頭で理解するのと実践するのじゃレベルが格段に違います。。
LPのファーストビューとバナーの違い
ファーストビューの作り方はバナーと同じだ!!と思いましたが、全く一緒とはいきません。
バナーとLPのファーストビューの違いとは?という部分をまとめておきます。
画像1枚のサイズが違う
LPは画面いっぱいに表示されるものですが、バナーはページの一部分に表示される画像です。
そのため、サイズ設定はバナーとLPで結構違いますね。
スクールで前回作ったバナーは300×300でした。
LPのファーストビューは1366×768で作ります。
LPのファーストビューはパソコンの画面を想定したサイズです!
情報量が違う
サイズが大きいLPのファーストビューは、バナーより情報量も多くなります。
私が講義で作ったバナーがこちらですが、コンバージョンボタンの内容は「参加はこちら」のみ。

しかし、LPはコンバージョンボタンの範囲に色々と購買を促す情報が配置されることが多いようです。
例えばこちらとか…

画像引用:美味しいいちごづくしセット
「ご購入はこちら」のボタンがある範囲には、「苺づくしセット」の細かい内容と割引情報が書かれています。
このようにLPにはバナーには書ききれない情報も載る場合が多いようなので、優先順位づけをしっかりしないとどこを見ていいかわからないデザインになりそうですね。
次回から実際に作っていく話を書いていきます。
今まで講義内容とは別の素材や文言で実践してきましたが、今回は講義通りの素材で作ってみているので成果物を載せれません💦
気づきやなど中心にできるようになったことを報告していくので、どうぞ応援よろしくお願いします🙇♀️












ディスカッション
コメント一覧
まだ、コメントがありません