【Web制作超初心者向け】模写にちょうどいいLPページ

2019 12/21
【Web制作超初心者向け】模写にちょうどいいLPページ

HTML/CSSを勉強しようと思い立ち、Progateで勉強してみました。

HTML/CSS、Javascript、jQuery、PHPを一通り学んだのですが、Progateを学んだからと言っていきなりWeb制作案件を受注できるほどの技術力は身についていません

ではどうしたらいいか?
調べたら、実際にあるLP(ランディングページ)を模写して練習していくのがいいとのこと。

そこで、いろんなサイトで模写に良いと紹介されていたiSaraの模写をしてみようと思ったのですが、なんか難しそう。。。

もっと簡単なLPはないの?

ついでに、もっと可愛くてオシャレなLPはないの?

と思いまして、超初心者向けで可愛いLPを集めてみました!

LPを探したのはこちらのサイトから↓
https://lp.webdesignclip.com/

簡単そうで、可愛いorおしゃれなLPと、オーソドックスなLPを10個まとめました。

まず初めに何を模写すればいいのか悩んでいるあなたの参考になれば嬉しいです☆

目次

【超】初級のLP ~これはできる!~

超初心者向けのLPです。

超初心者向けの模写を1つ完成できたら、自信がつくので、次の「初心者向け」に取り組めますよ!

KNEIPPゆず

kneipp(クナイプ)
クナイプ バスソルト ユズ&ジンジャーの香り 全身にぬくもり巡る発汗バスタイム | Kneipp(クナイプ)
クナイプ バスソルト ユズ&ジンジャーの香り 全身にぬくもり巡る発汗バスタイム | Kneipp(クナイプ)待望の“発汗できる”ユズのバスソルトが新登場! 爽やかでほろ苦いユズに、ピリッとスパイシーなジンジャーをブレンドした香りで、体の芯からじんわり発汗できるリフレッシ...
KNEIPPユズのLP

ほとんど画像でできているLP。

画像を配置していけば完成しちゃいます。

私も模写してみましたが、慣れない超初心者でも4~5時間で完成しました!

キッズコレッチオ

ぬいぐるみ|子どもの絵から一点モノが作れる。暮らしを彩るハンドメイドサービス|キッズコレッチオ
ぬいぐるみ|子どもの絵から一点モノが作れる。暮らしを彩るハンドメイドサービス|キッズコレッチオ子どもの描いた絵をいつでも持ち歩きたくなるようなぬいぐるみに変身させるサービスです。お子さまのとびっきりの笑顔を作る、そしてその笑顔を見てご家族もHAPPYになる、...
キッズコレッチオのLP

子どもの絵を縫いぐるみにするサービスのLP。

ボリュームは多いけど、難しい部分はなさそうな印象。

モデル脚 美脚シート

repeat store
【公式】モデル足美脚シート|足スッキリ美脚シートモデル足十六草シート
【公式】モデル足美脚シート|足スッキリ美脚シートモデル足十六草シート日々の生活の中で気持ちよくリラックスして美脚・健康・を目指す女性へのフットケア用品ショップ!美脚シートの専門店
モデル脚美脚シートLP

おしゃれで可愛いLP。
でもシンプル。

JSなしで作れちゃいそう。

こういうおしゃれなLPが作れたら、自信が付きますね!

初級のLP ~調べつつできる!~

オーソドックスな、ザ・初級のLPです。

Progateを学び終えて取り掛かると、ちょっとつまづくかも。
ググりつつ模写していけば、時間がかかっても完成できるLPです。

PAS-POL

PAS-POL -旅のモノづくりブランド-...
PAS-POL -旅のモノづくりブランド-|TABIPPO
PAS-POL -旅のモノづくりブランド-|TABIPPOPAS-POLはTABIPPOのモノづくりブランドです。 ⾃分と世界を繋げる新しい時代のパスポートのようなモノを作りたいと思い、PAS-POLという名前をつけました。
PAS-POLのLP

いろんなサイトで、「初心者の模写におすすめ!」と紹介されているPAS-POLです。

実際私も模写してみて、まぁなんとか完成させることができたので、初心者向きと断言できます!

ただ、Progateやっただけで挑むと、挫折しかねない
できるだけ上記の超初心者向けをやってからPAS-POLに挑むのがいいと思います。

ロッテのど飴

ロッテのど飴|お口の恋人 ロッテ
ロッテのど飴|お口の恋人 ロッテ
ロッテのど飴|お口の恋人 ロッテスッキリ、うるおう。ロッテのど飴。厳選ハーブエキスとカリンポリフェノール入りの、こだわりの のど飴。
ロッテのど飴LP

ロッテのど飴のLP。大企業のLPとしてはシンプル!

ページをスクロールしていったら「ほわっと」製品写真が出現するのが、ちょっと難しいかも?
ググりつつチャレンジしてみましょう。

OKURU

フォトギフトサービス OKURU
フォトギフトサービス OKURU
フォトギフトサービス OKURUおあずかりした大切な写真がカタチを変えてあなたの元へ 家族に、友人に、自分に 写真をカタチにして贈れます。
OKURUのLP

典型的なLPといった印象。
特に難しそうな箇所は無いけど、ボリュームが多めなので、途中で飽きちゃいそう。

ソネスのケータリングサービス

世界でここだけのパーティーを。 | 福岡のケータリング SONES
世界でここだけのパーティーを。 | 福岡のケータリング SONES世界中で、今ここにしかないケータリングを。
ソネスのケータリングサービスのLP

見ているとお腹がすいてくるLP。

固定ヘッダーや、サイドも固定しているので、ちょっとテクニックが必要。

果汁グミ

とろけるふたつの果実|果汁グミ|株式会社 明治
とろけるふたつの果実|果汁グミ|株式会社 明治とろ~りコラーゲンジュレ入り、こだわり品質の「果汁グミとろけるふたつの果実」。
果汁グミのLP

石原さとみ可愛い!というかLPが全体的にカラフルで可愛い!!!

ページ飛んでもらうと分かりますが、JSが大変そうなLPです。
ボリュームは少ないんだけどね。

スポンサーリンク

中級よりの初級のLP ~頑張ればできるはず!~

私の体感的に、「これって初級というより中級では?」と思うLPです。

iSara

iSara[イサラ]|バンコクのノマド...
iSara[イサラ]|バンコクのノマドエンジニア育成講座
iSara[イサラ]|バンコクのノマドエンジニア育成講座iSaraとは「稼ぐこと」にフォーカスしたエンジニア育成講座です。なお、iSaraで「基本的なプログラミングスキル」は教えません。基礎的なプログラミングスキルは無料で学べ...
iSARAのLP

でました、iSara!!

いろんな人が模写すべきページとして「iSara」を紹介しています。

典型的なLPで、特に難しい箇所もなさそうですが、とにかくボリュームが多い
途中で飽きちゃいそうです。
実際、私はiSaraを途中まで模写した状態で止まっています(汗)

iSaraのLPは、条件を満たせばポートフォリオとして提示していいそうなので、ぜひ模写しておきたいLPです!
(ポートフォリオにする場合は、自分でルールを調べてくださいね)

いち髪

いち髪|クラシエ
いち髪|クラシエ
いち髪|クラシエ使うたび、傷みにくい髪へ。いち髪のブランドサイトです。
いち髪のLP

最後は「いち髪」のLP!

川口春奈可愛い~

動画埋め込みとか、スライドショーとか、いろいろ大変です。

大変な分、この「いち髪」のLPが模写できれば、もう初心者を卒業して中級者になれるのでは?

私はiSara模写が終わったら、いち髪に取り組む予定です!

自分好みのLPを見つけて模写しよう♪

今回紹介した模写したいLPは、

・超初心者でも模写できそう
・可愛い or キレイ

なものを選びました。

やっぱり、模写して完成したときにテンションが上がるようなLPのほうが、やりがいがありますもの。

女性向けになってしまったかもしれません。
男性でも、自分好みのLPを探してみてください!

LP探しページ:https://lp.webdesignclip.com/

模写に挫折したら、もっと簡単なLPを探して、それを完成させて自信を付ける!
これに付きますね!

私はまだiSaraの模写の途中なので、早く完成させて、実際にWeb制作案件を受注できるようになりたいと考えています!

私と同じような超初心者のあなたも、諦めずに頑張りましょう☆

んじゃ、また~

関連記事

応援よろしくお願いします☆

コメント

コメントする

目次