HikoPro Blog

IT・テクノロジーで生活と仕事をもっと豊かに

LP案件はコーディング技術だけでは無理です【必須なスキル、理由を解説】

約12分
About|HikoPro

About|HikoPro

1998年生まれ|ITライフクリエイター
Webクリエイター|YouTuber|Blogger

学生時代は、タイピングのテストでクラス最下位レベルのパソコン音痴。
もっと自分の市場価値を高めたいと思い、、、
▷バンコク不動産▷インドIT留学▷ベトナムIT企業エンジニアを経て
Web系のフリーランスとして独立。

その後もっと大きい市場でインパクトのあることをしたいと思い、
ITメガベンチャーに就職。

#GoProAwards受賞 #14ヵ国渡航 #Z大学創業者 #ネコ好き

YouTube

I make videos of computer hack information and useful applications that
enrich people's work and life.


PC Hack

Web Create

Life Style

LP案件はコーディング技術だけでは無理です【必須なスキル、理由を解説】
HikoPro
HikoPro

こんにちは!大学生クリエイターでWebライター|エンジニア|YouTuberとして活動していますHikoProです! 最近は「若者のチャレンジを後押しするメディア」Z大学の編集長をしています!

  • HTML,CSSの学習を終えて、クラウドソーシング系で仕事を受注しようと思うけど、とても不安。
  • 他に必要なスキルなどを実務経験のある人から聞きたい。

今回の記事では、プログラミング学習でHTML,CSSの学習をある程度終えた方で、これからクラウドソーシング系のサイトでLP案件を受注する上で「HTML,CSSだけのスキルでは無理な理由と、身につけておきたい必須なスキル」について現役大学生エンジニアの僕が解説します!

「なんだよ。せっかくお金稼ぎの為にHTML,CSSの勉強頑張ったのに、他に必要なスキルがあるとか聞いていない!」

きっとこのように思う方が多いでしょう。

ぶっちゃけ、HTML,CSSだけでLP制作はできます。しかし以下の事があなたにはできますでしょうか?

  • Illustrator、Photoshopで画像のスライス、アセットの書き出し
  • 適切な顧客対応(即レス、メール、電話対応、納期厳守)
  • SEO対策
  • FTPを使用し、本番サーバーにファイルをアップ
  • サイトの軽量化

HTML,CSSの学習だけをしてきた方は「え!?これ何??」と思う事が沢山あるかと思います。

これからご紹介するLP制作に必要なスキルを極める必要はありませんが、最低限扱えるようにしておく必要があります。

無料の教材作りました▶︎【独学でWeb制作】月5万稼ぐための学習マップ【0円!未経験でもOK】

✔︎こんな方にオススメ

  • HTML,CSSの勉強をある程度終えて、LP案件を受注しようとしている
  • LP案件の受注が不安な方
  • LP制作に必要なスキルが知りたい方
Hiko
Hiko

Web制作の実務経験がある僕がお答えしますね!

LP制作には2パターンある

まずこれからLP制作を受注しようとしている方は、「LP制作には2つのパターン」があることを理解しておかなければなりません。

その2パターンとは、、、

  • Web制作会社からの下請け案件
  • 直案件(飲食店経営者からの依頼など)

この2パターンがあります。

これらの案件を受注する際に必要なスキルが異なってくるので、クラウドソーシングで案件を受注する前にクライアントに聞くか自分で見極める必要があります。

イメージでいうとこんな感じです。

Web制作会社からの下請け案件に関しては、直接クライアントとやり取りすることはなく、Web制作会社があらかじめLPの雰囲気やデザインなどをヒアリングしているので、方向性が固まっています。

それに対し、直案件に関しては、クライアントはLP制作には全くの無知なので、デザイン、方向性、SEOの対策など全て丸投げになってきます。

つまり、クライアントとのコミュニケーションが必要になり、適切な顧客対応やニーズを的確にヒアリングしたりする必要があると言うことです。

✔︎Web制作会社からの下請け案件

  • 方向性が固まっている
  • クライアントのやり取り不要
  • 指示書など作ってくれる場合がある
  • デザインができている事が多い
  • 単価が安い
  • クオリティは会社に依存する

✔︎直案件

  • クライアントとの対応が必要
  • ニーズや要望をヒアリングする必要がある
  • web制作について無知な事が多い
  • デザイン作成〜サイト公開までする必要がある
  • 方向性が途中でずれる可能性がある
  • 単価は下請けと比べて高い

つまり、受注する案件によって必要なスキルが変わってきます。

基本的にWeb制作会社からの下請け案件に関してはコーディング技術と、Photoshopが使えれば大体はOKです。

しかし反対に直案件の場合ではコーディング技術だけでは無理な事がお分り頂けたかと思います。

Hiko
Hiko

直案件のLP制作に必要なスキルを詳しく解説しますね!

適切な顧客対応

まず始めに、どんな仕事でもそうですが適切な顧客対応ができないと円滑に案件を進めることはできないので、まず始めに基本的なビジネスマナー、スキルを身に付けましょう。

(※社会経験のある方は飛ばし読みしていただいてOKです。)

大学生などで、社会経験がないと言う方は「ビジネス本」を読んでおくと良いでしょう。

メールやチャットで、正しい文章のやりとりができるかどうかで、継続して仕事を貰えるか、貰えないかが大きく変わってきます。

案件を受注したら、相手を尊重する言葉を用いて相手に気持ちよく、チャットでのやり取りをして貰えるように心がけましょう!

✔︎学んでおきたいビジネススキル、マナー

  • 適切なメール対応
  • 電話対応(言葉遣い)
  • 納期厳守
  • 即レス(予め業務する時間を伝える)
  • ビジネスツールの使い方(Gmail、エクセル、スプレッドシートなど)
  • 論理的思考能力

これらのスキルがないと、仕事を受ける資格なし!と言っても過言ではないので、必ず身に付けるようにしましょう。

これらに自信がないと言う方は、フリーランス向けのエージェントを利用するといいでしょう。

ニーズをヒアリングする能力

次に、クライアントがどんなLPを作りたいのかニーズをヒアリングする必要があります。

基本的にはスプレッドシートやエクセルなどで、「ヒアリングシート」を予め作っておいて、そこに記入してもらうようにしましょう。

ヒアリングシートはクライアントが想像しているLPをイメージしやすくするための物で、今後の方針にも繋がるので必ず作るようにしましょう。

✔︎最低限ヒアリングしておきたい事

  • LPの雰囲気(ポップ、明るめ、暗め、ビジネス系)
  • その商品を売るターゲット像
  • LPのメインカラー
  • コンバージョンはどこになるのか(商品の販売orお問い合わせ)
  • 商品の詳細
  • 使いたい画像素材はあるか
  • アニメーションを導入するか否か
  • テキストもこちらで決めるのか否か

ヒアリングシートはクラウド共有で管理できるGoogleスプレッドシートがオススメです!

【サンプルあり】Web制作ヒアリングシートの作り方【必ず聞くべき30のコト】

ワイヤーフレームの作成

次に、ヒアリングが終わった後にワイヤーフレームと言うものを作成する必要があります。

ワイヤーフレームを簡単に言うと、LPの設計図のことです。

LP制作には人間の購買心理を利用した作り方があるので、「LP 制作作り方」などと検索したりして、予め勉強しておく必要があります。

ワイヤーの作り方については割愛しますが、ワイヤーを作る事ができるツールをいくつかご紹介します。

  • Adobe XD (無料)
  • moqups
  • excel
  • Photoshop

主にこれらで作る機会が多いですが、最もオススメなのがAdobeのXDもしくはPhotoshopです!

無料で使用できる容量はありますが、初心者の方でも分りやすいシンプルなデザインになっていて直感的に操作できます。

動画で「売れる」ワイヤーフレームの作り方を学ぼう!

WebデザインのためのPhotoshop実践講座 は「美容院」「クリニック」「Webメディア」などの実際のwebサイトのワイヤーフレームを作りながら学んでいく、学習教材で「お客様の目的」を達成するためにはどのような動線やレイアウトを組めばいいかを学べます!

デザインの作成

次にデザインカンプの作成ですが、これが最もハードルが高いスキルです。

デザインカンプはIllustratorかPhotoshopで作るのですが、デザインを作るにはこれらの操作を学習する必要がありますし、デザイン性はすぐに習得できるものではありません。

よっぽどクリエイティブか、高いデザインのスキルが無いと、クオリティの低いLPになってしまうので、オススメとしてはクラウドソーシング系でデザイナーに外注するのがオススメです。

外注する際は、費用を安く外注できる ランサーズを使用するといいでしょう!

アニメーションの実装(jQuery)

ただHTML,CSSでコーディングしたLPには動きが全くなく、ユーザビリティが低いサイトと言えます。

例えば、要素をフェードインさせたりパララックス効果を加えるだけで、全く違った印象のLPに変るのでできるようにしておきましょう!

僕のポートフォリオサイトにも取り入れてます

簡単なアニメーションを実装するにはJavaScriptのライブラリの一つであるjQueryを使用します。

JavaScriptってなんだか難しそう!」と言うイメージがありますが、jQueryはとっても簡単で、Progateを1週くらいすればOKです。

あとはネット上に、アニメーションのテンプレートコードが沢山公開されているので、必要な時に参考にして実装するといいでしょう。

【jQuery入門】jQueryとは〜導入まで、初心者向けに使い方を解説

お問い合わせフォームの設置(PHP)

LPの目的をもう一度おさらいすると、「商品を売るため」の物になるので、ただ商品の良さ、詳細が書いてあってもなんの意味もありませんよね!

お問い合わせ、商品の購入(コンバージョン)に繋がってこそLPの存在価値があります。

つまり、お問合わせフォームを設置するスキルを身に付ける必要があると言う事です。

お問合わせフォームを実装するにはPHPと呼ばれるプログラミング言語を習得する必要があります。

  • inputタグのnameの意味
  • 入力確認画面を作る
  • 送信完了画面
  • 自動返信メール

これらの4つはPHPを使って実装できるようにしておきましょう!

初心者の人が、PHPでお問い合わせフォームを作ろうとすると、セキュリティーの低いフォームになるので、テンプレートを使うのがオススメです。

【PHP工房】テンプレートを使用してお問合わせフォームを作る方法の記事で、お問い合わせフォームの作り方を解説しているので、参考にして下さい。

↓PHPの学習が嫌だ!と言う方はGoogleフォームを活用すると簡単に作れます↓

サーバーの契約、ドメインの取得

Web制作会社の下請け案件の場合は、コーディングしたファイルをzipに圧縮して納品で終了ですが、直案件の場合はサイトが公開する所までする必要があります。

当然クライアントは、サーバーとは何か、ドメインとは何か、取得方法など一切知らない事が多いので、代行して契約する必要があります。

これらのサイトをチェックして、契約〜ドメイン追加までの流れを予め把握しておきましょう。

お問合わせフォームがついているサイトに関してはHTTPS化をする必要があるので、そこもクライアントに説明できるようにして、実装できるようにしましょう。

サーバー・ドメインの契約WordPressの導入までの完全マニュアルはこちら!

FTPで本番環境にファイルをアップする

サーバー、ドメインの取得が完了したら、いよいよコーディングしたファイルをサーバー(本番環境)にアップします。

この工程も当然クライアントはできないので、代わりにする必要があります。

↓FileZillaを使ったファイルのアップ方法はこちら↓

✔︎バックアップも忘れずに!

なんらかの不祥事でせっかくコーディングしたデータが無くならないように、ファイルをzipにしてクライアントに送信するのと、納品後も1ヶ月程度は自分のPC上に保管しておくようにしましょう!

LP制作における必須スキルまとめ

いかがでしたでしょうか!

HTML,CSSの学習を頑張ってきた人は、「なんだよ〜!!」と思う方もいるかと思いますが、仕事が失敗してプログラミングの事を嫌いにならないためにも、最低限の準備、スキルは習得してチャレンジするようにしましょう!

最後までご覧いただきありがとうございました!

Leave A Reply

*
*
* (公開されません)

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)