オレ流ランディングページの作り方 #1「基礎の基礎」

ランディングページ？それってバスケットボール選手ですか？な〜んてダジャレを考えていた、おサブイ、ユゲタです。 WEBに関する開発なり、プログラミングに関わる人は、必ず何かしらのwebページを作ると思いますが、 そのページの出来が良いか、悪いかは、作る人のランディングページの制作スキルに依存すると、 最近判定できるようになってきたんですが、 要するに、ランディングページには、webページの制作に関するほぼ全ての要素が盛り込まテレいて、 そのことについて熟知していることが、webページの制作の良し悪しに大きく依存すると言っても過言ではないでしょう。 ということで、ランディングページが上手に作れると、webページのプロとして通用できるという認識で世の中で通用すると思います。 そんな素敵なランディングページを作るためのレクチャーを何回かに分けて、行ってみたいと思います。

ランディングページの定義

そもそも、この「ランディングページ」っていう言葉、企業の広告用のペライチページの事を意味することが多いんですが、 会社や、何かしらの組織のホームページのトップページなども、このランディングページの部類に含まれます。 「ランディングページとは？」という風に、ぐぐってみると、山のようにこの言葉に関するwebサイトが表示されます。 多くがランディングページの制作受託を行っている会社のコンテンツ・メディアとしての集客ブログになっているんですが、 そうした検索結果のサイトを見比べて、どのサイトデザインや内容がいいかを比較してみると面白いと思います。 ランディングページとは そこには、ほぼ同じ内容が書かれていて、良い悪いの判断がしやすいので、気になる人は是非、上記のリンクを辿って、見てみてください。 言葉通りの意味で考えるとLanding（着地）するページという事になるんですが、なんとなく着地と聞くと、コンバージョンページの事を意味するようにも思えますが、 ここでいう着地は、他のドメインからのリンクや、Googleでの検索結果からのリンクで、たどり着いた最初のページという意味になるようです。 そう考えると、ホームページのトップページもランディングページであることには、変わりないと考えるのが普通かもしれませんね。 でも、基本的に無駄なページを作らないと考えると、すべてのページがランディングページと言う風になるのが、ホームページのあるべき姿なのかもしれませんね。

ランディングページの良し悪し

次に、ランディングページの何が良くて何が悪いかをどの点で判断するのが一般的かという事を理解してみましょう。 でも、実は、これには正解はなく、見た人が「良い」と思えば良いページで、 見た人が「悪い」と思ってしまえば、悪いページという判断なので、一概にこれが良くて、これが悪いとは言い切れず、 ページや目的によっても、良し悪しの判断は様々になってしまいがちです。 でも、明確に言えるのは、ランディングページは、着地したページの次に、「目的」が必要になります。 ようするに、ページに来た人に情報を与えて、次のステップである、コンバージョンさせる事が目的になることが一般的になりますが、 この「目的」をキチンと持っていて、それを遂行できるページになっているかどうかが、良し悪しのポイントの一つであると考えられます。 何かの商品ページであれば、それを購入してもらうために、商品購入のためのボタンを押して貰うことだったり、 何かの情報ページであれば、そこから会員登録をしてもらうとか、お問い合わせをしてもらうことが目的になります。 ランディングページの、色や文字サイズ、文言、使われている画像やイラスト、ページ全体のテイストなどに対しての 「良し悪し」を判断するのも一般的ですが、もちろん、こうした見た目に関する判断も重要と言えますね。

web制作者に必要な知識

今回は、ランディングページの基礎知識に関することを書きましたが、次回から、実際に、ランディングページを実際に作ってみて、 ホームページ制作に関わる仕事をする際などに、役立ててもらいたいと思います。 とりあえず、事前準備として、今回のランディングページの作り方記事シリーズ全般に関して、説明をしておくと、 あくまで、ユゲタの個人的な、制作方式と、個人的なルールにのっとって作ることを目的にしています。 ただし、これらを踏まえてランディングページの制作が手慣れてきた時に、プロとして仕事で十分に通用するスキルが身につくことは、 ユゲタがお墨付きを与えたいと思います。（でも、クレームは一切受け付けませんwww） そして、この記事シリーズを読む時に必要なスキルとして、HTML,CSSのある程度のスキルは身につけておいてください。 どうしてもHTMLとCSSという基礎は、webに関してのほぼあらゆる事に対して必要になるので、現時点で不明確である人は、 web上にたくさんある、無料で学習できるサイトを一読しておいてもらえると、この記事を読んだあとでの理解が違うことでしょう。 あと、環境についてですが、実際にソースコードを入力するのは、スマホではなく、パソコンで打ち込むことをおすすめします。 どうしても、テキストエディタや、ブラウザ、それに関する操作環境などは、パソコンベースで記事を書く予定なので、 この辺の環境は、できれば、そうしてもらえるといいかと思います。 そんなワケで、次回より、素敵なランディングページを作るべく、作業と学習を進めて行きたいと思います。