2021年6月1日 記事

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

こんにちは! 吉田です!

 

今日は、

昨日、日南本先生がデザイン実演を行った

「スマホ版オプトインLPのコーディング」を

お届けしたいと思います!

 

 

オプトインというのは、簡単にいうと

ユーザーさんにメルマガ登録を促して、

コンテンツに興味のある方の

メールアドレスを取得するような

ページの総称です。

 

 

「デザイン作るところ、

まだ見ていない!」という方は、

まずはこちらからご覧ください^^

↓↓

https://salesdesign-school.jp/blog/kiji/lp-sp-business/

 

 

今回のコーディングは、

ちょっとレベルアップして本格派です。

 

 

ポイントは2つです!

 

1つは、チェックリスト(ブレットともいいます)を、

画像を使わず、テキストと

CSSでコーディングしていきます。

 

もう1つは、

メルマガの登録フォームの

簡単なコーディングを

お見せしていきます。

 

 

ランディングページにおいて、

この2つのパーツは必ずといっていいほど

顔を出してくる、定番中の定番のパーツになりますので、

コーディング初心者の方、苦手意識のある方は

ぜひご参考ください。

 

 

 

またしても緊張で

cssを1つ入れ忘れてしまいました。。

 

―――

 

.sec-wrap img, .formBtn{

        width: 100%;

}

 

―――

 

上記を動画内のcssにいれていただければ、

下記URLと同じものになります。

 

実際にコーディングしたものはこちらです。

↓↓

https://salesdesign-school.jp/sample/lp-sp-business-opt-coding/

 

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

 

 

 

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

 

 

p.s.

 

セールスデザイン講座入門編では、

コーディング初心者の方、

苦手意識のある方でも

 

 

今日の動画のような

画像の切り出しからはじめて、

最終的にお申し込みフォームまで

自分でデザインしたものを

一通りコーディングでき、

1人でwebページを起こせる

実践的なスキルを習得できます。

 

 

もしご興味ある方は、

まずはセールスデザイン講座

オンライン説明会にご参加ください↓

https://salesdesign-school.jp/taiken/briefing/

 

 

6月度スタートは残席2名となっております!

 

 

ではでは!

 

今なら無料でデザインが学べます


 

デザイン未経験でも
フリーランス・副業で
しっかり稼ぎたい方

 

デザイン未経験でも
amazonカタログや楽天LPを
自分で作りたい方

 

講座をご検討の方へ


 

デザイン独学方・未経験から
在宅WEBデザイナーとして
収入の柱を作りたい方はこちら

 

自社デザインをご自身で作る起業家、
スタッフをデザイナーに
育成したい経営者の方はこちら

スキルアップコンテンツのご紹介

スキルアップコンテンツ
のご紹介

初心者のための無料のデザインコンテンツ集

初心者のための
無料のデザインコンテンツ集

デザインのまとめをご紹介

デザインの作り方をピンポイントで解消

お申込みをご検討される方へ

お申込みをご検討される方へ

説明会や個別相談で直接お伺いいただけます。

説明会や個別相談で
直接お伺いいただけます。