スマホ版オプトインLPをコーディングしてみよう！

こんにちは！　吉田です！

今日は、
昨日、日南本先生がデザイン実演を行った
「スマホ版オプトインLPのコーディング」を
お届けしたいと思います！

オプトインというのは、簡単にいうと
ユーザーさんにメルマガ登録を促して、
コンテンツに興味のある方の
メールアドレスを取得するような
ページの総称です。

「デザイン作るところ、
まだ見ていない！」という方は、
まずはこちらからご覧ください＾＾
↓↓
https://salesdesign-school.jp/blog/kiji/lp-sp-business/

今回のコーディングは、
ちょっとレベルアップして本格派です。

ポイントは２つです！

１つは、チェックリスト（ブレットともいいます）を、
画像を使わず、テキストと
CSSでコーディングしていきます。

もう１つは、
メルマガの登録フォームの
簡単なコーディングを
お見せしていきます。

ランディングページにおいて、
この２つのパーツは必ずといっていいほど
顔を出してくる、定番中の定番のパーツになりますので、
コーディング初心者の方、苦手意識のある方は
ぜひご参考ください。

またしても緊張で
cssを１つ入れ忘れてしまいました。。

.sec-wrap img, .formBtn{
width: 100%;
}

上記を動画内のcssにいれていただければ、
下記URLと同じものになります。

実際にコーディングしたものはこちらです。
↓↓
https://salesdesign-school.jp/sample/lp-sp-business-opt-coding/

（スマホ版なので、お手持ちのスマホでご覧ください。）

それでは今日はこの辺で！

投稿者プロフィール

吉田 祥太

フロントエンジニア出身の叩き上げセールスデザイナー
セールスデザイナーとしては５年目。

ノンデザイナー出身でめちゃめちゃ苦労した経験から、
感覚的になりやすいデザインの指導を
理論的かつ再現性ある形で伝えることをモットーにしている。

⇒ 詳しいプロフィールはこちら

最新の投稿

この著者の記事一覧

• 記事2023年9月19日ヒアリング実戦会 | 超簡易開催レポート
• 記事2023年9月13日腰と足がつながる感覚
• 記事2023年8月25日【限定10名企画】オフラインで会いましょう！！
• 記事2023年8月24日【明日限定告知あり】思考アルゴリズムを変えると…