実績ゼロでもLP制作のコーディングは受注できるが、練習作の見せ方

結論から書きます。実績ゼロでもLP制作のコーディング案件は受注できます。ただし、条件があります。練習作を「作品集」として並べるのではなく、「仕事の進め方の見本」として見せられるかどうかです。

「LP制作・コーディング 実績ゼロ」で検索する人の多くは、学習を一通り終えた段階にいます。教材の模写はできる。自分でゼロから組むこともできる。でも、応募の欄に「実績」と書かれていて、そこに書けるものが何もない。この状態で止まっている人が非常に多い、という特徴があります。

実績が無いこと自体は、発注側もある程度織り込んでいます。問題は、実績が無い人が何を出してくるかです。教材の模写を3本並べただけのURLを送られても、発注者は判断できません。逆に、練習作であっても、何を考えて作り、どこで詰まり、どう解決したかが分かる形で出されていれば、判断材料になります。この差が受注の可否を分けています。

この記事では、まず発注者が実績の欄で何を見ているのかを整理し、次に評価されない練習作の典型を挙げ、そのうえで練習作の作り方と見せ方を具体的に書きます。

実績ゼロでも受注できる理由と、できない理由

最初に、発注側の視点を押さえておきます。ここを誤解したまま練習作を作ると、労力が無駄になります。

発注者が実績で見ているのは「安心」であって「経歴」ではない

発注者が実績を求めるのは、経歴に権威が欲しいからではありません。「頼んだあとに困らないか」を確認したいだけです。具体的には、指示を理解できるか、途中で消えないか、直してほしい箇所を伝えたら直せるか。この3点です。

過去の受注件数は、この3点を間接的に示す材料にすぎません。だから、別の材料で同じことを示せるなら、件数はゼロでも構わない、という理屈になります。練習作はその「別の材料」になり得ます。

実際、未経験に近い人へ発注した経験を書いている投稿もあります。

最近、フリーのwebデザイナーさんに外注でLP制作を依頼しました。 未経験からスクールに入り、まだこなした案件も少ないという事だったのですが、ポートフォリオのクオリティも悪くなかったのと、デザインのみ作成、うちの社員なら1日で制作するレベルのものを納期2週間で依頼しました 出典: detail.chiebukuro.yahoo.co.jp

ここで注目したいのは、依頼の決め手が「ポートフォリオのクオリティ」だった点、そして依頼された内容が「うちの社員なら1日で終わる規模」だった点です。つまり、実績ゼロの人が最初に任されるのは、失敗しても被害が小さい範囲の仕事です。

これは冷たい扱いではなく、合理的な判断です。そして、その小さい仕事を確実にこなせば次につながります。最初から大きい案件を狙うより、この構造を理解して小さく入るほうが、結果的に早い。

受注できない人がやっている、逆のこと

一方で、実績ゼロのまま何十件応募しても決まらない人には、共通する行動があります。実績が無いことを文章で言い訳している、というものです。

「実績はありませんが、やる気は誰にも負けません」「未経験ですが精一杯頑張ります」。この手の文章は、発注者が知りたいことに何も答えていません。正直なところ、これはどうかと思います。やる気は判断材料になりませんし、頑張るのは当然の前提だからです。

代わりに書くべきなのは、「何ができるか」の具体です。そして、その具体を証明するのが練習作です。文章で補うのではなく、成果物で示す。これが実績ゼロの正攻法になります。

制作会社がどんな体制でLPを作っているかを知っておくと、自分がその中のどの役割を担えるかが見えてきます。企画から広告運用まで一貫して請け負う会社もあれば、コーディングだけを切り出して受ける形も一般的です。

株式会社J・Gripは、豊富な経験と実績があるからこそのノウハウで、成果の出るLP制作を低価格で提供・運用するサービスを提供しています。LP制作に関する作業、企画からデザイン制作、素材提供、HYMLコーディングまで全てをお願いすることもできますし、デザインやコーディングのみといった依頼をすることも可能です。 出典: biz.ne.jp

「デザインやコーディングのみといった依頼をすることも可能」という部分が、実績ゼロの人にとっての入口です。全部を引き受ける必要はなく、切り出された一部を確実にこなせればいい。LP制作とHTML・CSSコーディングの仕事が実際にどう分担されるのかは、LP制作・HTML/CSSコーディングのお仕事に工程ごとの役割がまとまっています。

評価されない練習作の3つのパターン

ここから具体論に入ります。まず、やってしまいがちな失敗から見ていきます。

教材の模写だけを並べている

学習サービスの課題や、既存サイトの模写を並べているケースです。これが評価されにくいのは、判断材料にならないからです。

模写は、正解が用意された状態で手を動かす作業です。デザインが決まっていて、正解の見た目も分かっている。この条件下で完成させられることは、実務の能力とは別の話です。発注者もそれを知っているので、模写作品を見ても「教材をこなした人」という以上の情報を得られません。

模写そのものが悪いわけではありません。学習段階では必要な工程です。ただ、それを見せる作品として出すのは筋が違います。練習の記録と、仕事の見本は別物として扱ってください。

何を意図して作ったのかが書かれていない

作品のURLだけが並んでいるパターンです。見た目は悪くないのに反応が薄い、という人はここに該当することが多い傾向があります。

発注者は、あなたの作品を美術品として鑑賞しているわけではありません。「この人に頼んだら、うちの案件でどう進めるだろう」という目で見ています。だから、完成品だけを見せられても、進め方が読み取れません。

どんな商品を想定したのか、誰に向けたページなのか、なぜこの構成にしたのか。この3点が書かれているだけで、見る側の理解はまったく変わります。作るのに20時間かけたなら、説明を書くのに1時間使う価値は十分にあります。

実際に動く形で見られない

画像のスクリーンショットだけを載せているケースです。コーディングの案件に応募するのに、コーディングの結果が動く形で確認できないというのは、致命的です。

LPは動くものです。スクロールしたときの挙動、スマートフォンでの折り返し、ボタンを押したときの反応。これらは静止画では伝わりません。無料で使えるホスティングサービスもあるので、実際に開けるURLを用意してください。

加えて、スマートフォンで開いたときに崩れているポートフォリオは、逆効果になります。発注者は移動中にスマートフォンで見ることが多いので、そこで崩れていると、それ自体がスキルの評価になってしまいます。

練習作の作り方

では、何を作ればいいのか。ここが本題です。

架空の案件を、自分で設計する

模写ではなく、架空の案件を自分で立てます。手順はこうです。

まず、実在しそうな商品やサービスを1つ決めます。地域の整体院、個人経営のパン屋、オンラインの英会話教室。身近で、想像しやすいものがいいです。次に、その事業者が抱えていそうな課題を設定します。「新規の来店が減っている」「既存客の予約が電話に集中して手間になっている」といった具合です。

そのうえで、LPの目的を1つに絞ります。予約を増やすのか、資料請求を取るのか、来店を促すのか。目的が2つ以上あるLPは構成が散らかるので、1つに絞るのが原則です。

ここまで決めてから作り始めます。この設計の過程そのものが、あとで説明文として使えます。実務では発注者からヒアリングして得る情報を、自分で作っているわけです。

制約を設けて作る

制約のない練習は、実務と離れていきます。だから、意図的に条件を付けます。

たとえば、「写真は無料素材のみ」「制作時間は15時間以内」「動きは最小限」「表示速度を落とさない」といった条件です。実務では予算と納期があり、その中で判断を下すことが求められます。制約下での判断の跡が残っている作品は、それだけで実務的に見えます。

もう一つ有効なのが、「途中で仕様変更が入った」という設定で作ることです。作り終えたあとに、自分で「やっぱりセクションを1つ追加したい」という要望を追加して対応してみる。この経験は、実際の修正対応の練習になりますし、説明文に書ける内容も増えます。

作りっぱなしにせず、あとから直す

一度作った作品を、時間を置いて見直すのも有効です。1か月後に自分の作品を見ると、当時は気づかなかった粗が見えます。文字の大きさが揃っていない、スマートフォンで余白が詰まりすぎている、ボタンが押しにくい位置にある。

見つけた粗を直し、その過程を解説ページに追記します。「公開後に見直して、この点を修正しました」という記述は、改善する習慣があることの証明になります。実務では、納品後の改善提案ができる人が重宝されるので、その素地を示せます。

3本を、性格の違うもので揃える

数は多ければいいわけではありません。3本あれば十分です。ただし、性格が違うものを揃えます。

1本目は、シンプルな縦1カラムの構成。基本ができることを示します。2本目は、フォームや料金表など要素の多い構成。情報整理ができることを示します。3本目は、動きのある構成。実装の幅を示します。

同じような見た目のものを5本並べるより、この3本のほうが伝わります。応募する案件の性格に応じて、どれを先に見せるかを変えられるという利点もあります。

コーディングのスキルをどこまで伸ばせば単価が上がるのかについては、Webデザイナーが学ぶべきコーディングスキル｜どこまでやれば単価が上がる？に、習得の段階と評価のされ方が整理されています。練習作で何を示すべきかを決める前に、目指す位置を確認しておくと迷いが減ります。

練習作の見せ方

作ったら、次は見せ方です。ここで差がつきます。

1作品につき1ページの解説を用意する

作品のURLだけを並べるのではなく、作品ごとに解説ページを作ります。書く内容は次の通りです。

想定した事業者と商品。設定した課題。LPの目的。構成の意図。技術的に工夫した点。制作にかかった時間。対応した画面サイズ。使ったツール。詰まった箇所と、どう解決したか。

この最後の項目が特に効きます。「詰まったところを書いたら弱く見えるのでは」と思うかもしれませんが、逆です。詰まったことを言語化できて、解決方法まで書ける人は、実務でも同じように報告してくれると期待されます。発注者がいちばん困るのは、詰まったまま黙って止まる人です。

コードを見られる状態にする

コーディングの案件である以上、コードそのものも評価対象になります。ソースコードを公開できる場所に置き、リンクを添えておいてください。

見られることを前提にすると、書き方も変わります。クラス名の付け方に一貫性があるか、コメントが適切に入っているか、不要な記述が残っていないか。こうした点は、実務で他の人が引き継ぐときに効いてきます。実績ゼロの段階でここまで意識している人は少ないので、差別化の要素になります。

数字で示せるものは数字で示す

主観的な評価より、測れる数字のほうが伝わります。表示速度の測定結果、対応した画面幅の種類、画像の合計容量。こうした数値を添えておくと、判断が具体的になります。

たとえば「スマートフォンでの表示に必要な読み込みを3ファイルに抑えた」「画像を圧縮して合計400KB以内に収めた」といった書き方です。数字が入ると、こだわった箇所が伝わります。

読み込みの重い作品ページにしない

解説ページに大きな画像を何枚も並べると、開くのに時間がかかります。発注者が移動中に見ることを考えると、これは不利に働きます。表示速度を意識できるかどうかは、コーディングの評価そのものに直結する部分でもあるので、自分のポートフォリオで実演しておく価値があります。

画像は必要な大きさに縮小してから載せ、形式も適切なものを選ぶ。この配慮があるページは、説明を読む前から技術的な姿勢が伝わります。

見せる順番を、応募先に合わせる

3本作ったら、応募のたびに並べ替えます。フォーム実装が含まれる案件なら要素の多い作品を先に、動きの多い案件なら動きのある作品を先に。

この手間を惜しまない人は少ないので、そこで差がつきます。募集内容を読んで、それに合わせて出し方を変えている、という事実自体が、丁寧さの証明になります。

練習作を置く場所と、公開するときの注意

作品をどこに置くかも、見え方に影響します。ここは実務的な話です。

独立したURLで見られる状態にする

無料のホスティングサービスを使えば、費用をかけずに公開できます。静的なファイルを置くだけなら、選択肢は複数あります。重要なのは、ファイルをまとめて送るのではなく、URLを開けば見られる状態にしておくことです。

余裕があれば、独自ドメインを1つ取得して、そこに作品をまとめる形にするとまとまりが出ます。年間の費用は1,000円台から選べるものもあり、負担は大きくありません。ただし、ドメインを取ること自体が評価されるわけではないので、優先度としては作品の中身のほうが先です。

作品の一覧ページは、シンプルで構いません。作品名、想定した業種、対応した内容、そして解説ページへのリンク。この4つがあれば十分です。凝ったアニメーションを付けた一覧ページを作る時間があるなら、作品の解説を書くほうに使ってください。

既存企業の名前や素材を無断で使わない

模写の延長で、実在する企業のロゴや商品写真をそのまま使った練習作を公開してしまう例があります。これは避けてください。権利の問題があるだけでなく、発注者から見ても「権利関係に無頓着な人」という評価につながります。

架空の事業者名を作り、写真は利用条件を確認した無料素材を使う。使った素材の出どころを解説ページに書いておくと、確認して使っていることが伝わります。地味なようですが、こうした点を見ている発注者は少なくありません。

更新日を残しておく

作品を公開したら、制作した年月を添えておきます。2年前の作品しか並んでいないポートフォリオは、今も活動しているのか分からず、問い合わせにつながりにくくなります。

逆に、直近で作ったものが並んでいれば、それだけで現役感が伝わります。実績ゼロの段階では、むしろ「最近ずっと手を動かしている」ことのほうが伝わりやすい材料になります。

作品以外に用意しておきたい2つの文書

練習作が揃っても、それだけでは足りません。応募のたびに書き直さずに済む文書を2つ作っておくと、動きが速くなります。

対応可能な作業の一覧

自分が何をどこまでできるのかを、箇条書きにした一覧です。HTMLの構造作成、CSSの実装、レスポンシブ対応、簡単な動きの実装、フォームの設置、画像の書き出しと圧縮。できるものを並べ、できないものは書かない。

この一覧があると、募集内容と照らし合わせるのが早くなります。応募のたびに「これは自分にできるだろうか」と考え込む時間が減りますし、提案文にそのまま貼れます。

一覧は定期的に更新します。新しくできるようになったことを足していくと、自分の成長が目に見える形になります。学習が続かない人の多くは、進んでいる実感が持てないことが原因なので、この一覧は精神的な支えにもなります。

短いプロフィール文

200字程度の自己紹介を用意しておきます。何をやっている人か、何が得意か、どういう案件を受けたいか。この3点だけで構いません。

長い経歴は要りません。むしろ、読むのに時間がかかる自己紹介は最後まで読まれません。応募先ごとに1文だけ差し替えて使えるように、汎用の部分と可変の部分を分けて作っておくと便利です。

最初の受注につなげる動き方

練習作が揃ったら、応募の段階です。ここでも実績ゼロならではの進め方があります。

最初は範囲の狭い案件から入る

いきなりLP1本丸ごとの案件を狙うより、部分的な作業から入るほうが決まりやすくなります。既存ページの修正、スマートフォン表示の調整、セクションの追加。こうした作業は範囲が明確で、発注側のリスクも小さい。

そして、この小さい仕事が終われば、それは実績になります。実績ゼロの期間は、思っているより短く終わらせられます。

応募の記録を残しておく

どの案件に、いつ、何を書いて応募したか。この記録を表にしておくと、あとで振り返れます。結果が返ってきたら、決まったか落ちたかも書き込みます。

20件も溜まると、傾向が見えてきます。フォーム実装が含まれる案件では反応があるが、デザインから求められる案件では通っていない、といった具合です。傾向が分かれば、応募先の選び方を変えられます。当てずっぽうで数を撃つより、はるかに効率が上がります。

実績ゼロであることを、自分から先に書く

隠すと、あとで発覚したときに信用を失います。むしろ、先に書いてしまったほうがいい。

書き方は、「クライアントワークの経験はまだありませんが、架空案件として3本のLPを設計から実装まで通しで制作しています。それぞれ制作の意図と工夫した点を記載していますので、ご確認いただけますと幸いです」という形です。事実を書いて、代わりの材料を示す。言い訳ではなく提示になります。

隣接する経験は書いてよい

コーディングの実績はゼロでも、別の職種の経験は書けます。前職で顧客対応をしていた、資料作成が多かった、数字を扱う業務だった。こうした経験は、案件によっては評価されます。

たとえば、専門知識を持つ人がその分野のLPを作ると、内容の理解が早いという利点があります。税理士試験合格者の在宅ワーク事情｜科目合格が武器になる理由【2026年版】には、資格や専門性が在宅の仕事でどう武器になるかが整理されています。制作スキルそのものは同じでも、扱える分野の広さで選ばれることは実際にあります。

文章を書く力も、LP制作では効いてきます。コーディングだけでなく原稿の調整まで引き受けられると、任される範囲が広がります。文章の単価がどう決まるかはWebライターが文字単価を上げる方法｜1円→5円にステップアップする戦略【2026年版】に整理されていて、制作と文章を組み合わせるときの参考になります。

隣接領域まで視野を広げるなら、AI・マーケティング・セキュリティのお仕事に周辺分野の仕事の広がりが、成果物単位で発注される制作の仕事という意味では作曲・編曲・効果音・ジングルのお仕事にも似た構造が見られます。単価水準を把握しておきたい場合はソフトウェア作成者の年収・単価相場と著述家，記者，編集者の年収・単価相場が判断材料になります。資格を判断材料に使いたい場合は、文書のやり取りが中心になる仕事ではビジネス文書検定、サーバー側まで踏み込むならCCNA（シスコ技術者認定）といった選択肢があります。

市場を長く見てきた運営者の視点から

20年この市場を見てきた立場から言えば、実績ゼロから抜け出すのが早い人には共通点があります。作品を出したあとに、反応を集めていることです。

応募して落ちたときに、そこで終わりにしない。可能なら理由を尋ね、無理でも自分で仮説を立てて、次の応募までに1つ直す。この繰り返しを10回やった人と、同じ作品で50件応募し続けた人では、3か月後の状況がまったく違います。後者は、落ち続けた回数だけが積み上がります。

私自身、学習を始めた頃に作った練習作を、何の説明も付けずにURLだけ並べて送っていた時期があります。反応はほぼありませんでした。あとから、意図を書き添えるだけで返信率が変わることに気づきました。作品の中身は同じだったのに、です。見せ方が足りていなかっただけでした。

もう一つ、運営者として見てきた限りでは、最初の1件を取ったあとの動き方で差が開きます。長く続く人は、単発の作業をこなすことよりも、「この人に任せると楽だ」という状態を作ることに時間を使っています。納品時に対応内容を整理して添える、次に想定される作業を先回りして伝える。この積み重ねが、実績の数より効きます。

そして、実績が増えてきたときに効いてくるのが、取引の形です。仲介手数料が乗る取引では、依頼者が出した予算の一部が中間で抜かれます。同じ5万円の予算でも、中間マージンが乗らない直接取引なら、依頼者は同じ金額でより多くを頼めますし、受け手の手元に残る額は厚くなります。手数料0%の取引に意味があるのは、金額の派手さではなく、この「同じ予算で双方が得をする」という構造のほうです。実績ゼロの段階では選べる場所が限られますが、実績が積み上がるほど、どこで受けるかを自分で選べるようになります。

実績ゼロは、通過点です。そこに留まる期間の長さを決めているのは、作品の数ではなく、作品の見せ方だと考えています。

よくある質問

Q. 練習作は何本くらい用意すればいいですか？

3本あれば十分です。ただし性格の違うものを揃えてください。シンプルな縦1カラム、フォームや料金表を含む要素の多い構成、動きのある構成。同じような見た目のものを5本並べるより、この3本のほうが判断材料になります。

Q. 教材の模写を作品として出してはいけませんか？

模写は正解が用意された状態での作業なので、実務の判断力を示す材料になりません。学習段階では必要ですが、見せる作品としては架空案件を自分で設計したもののほうが適しています。練習の記録と仕事の見本は分けて扱ってください。

Q. 実績がないことは応募時に隠すべきですか？

隠すとあとで発覚したときに信用を失います。先に書いてしまい、代わりの材料を示すのが有効です。「クライアントワークの経験はまだありませんが、架空案件として3本を設計から実装まで通しで制作しています」という形なら、言い訳ではなく提示になります。

Q. 最初の案件はどんなものを狙えばいいですか？

LP1本丸ごとより、範囲の狭い作業から入るほうが決まりやすくなります。既存ページの修正、スマートフォン表示の調整、セクションの追加などです。発注側のリスクが小さいため受注しやすく、完了すればそれが実績になります。