プログラミング未経験でもWeb制作を受けられる？AIで補えることと、自分で確かめること

「プログラミングを学んだことがない自分に、Web制作の仕事なんてできるのだろうか」

AIを使えば、ページの形や文章の案を作る助けを得られます。そのため、未経験の分野にも触れやすくなります。一方で、AIが出したものを理解せずに、何でも受注してよいわけではありません。

この記事では、自分で作れる範囲を確かめる方法と、制作を協力者に頼むときの考え方をお伝えします。

AIが助けてくれること

AIは、たとえば次のような作業の助けになります。

• ・ページに載せる情報の整理
• ・見出しや文章のたたき台
• ・画面の構成や見た目の案
• ・Webページを動かすためのコードの作成・説明
• ・分からない言葉を調べるときの質問相手

コードとは、コンピューターに表示や動きを指示するための文章です。AIに「初めての人にも説明して」と聞き、少しずつ意味を確かめることもできます。

僕は、AIによって、自分がこれまで関わってこなかった領域にも挑戦できる可能性が広がると考えています。新しい場所に出て学ぶ「越境学習」につながるのも、その魅力です。

それでも、人が確かめる必要があること

AIは、もっともらしい文章やコードを出しても、依頼に合っていなかったり、誤りを含んでいたりすることがあります。

たとえば「お問い合わせボタンを付けて」と頼んで、見た目にボタンができたとしても、それだけでは問い合わせが届くとは限りません。

• ・押すと何が起きるか
• ・入力した内容はどこへ送られるか
• ・実際に受信できるか
• ・個人情報の扱いに問題はないか

これらを確認して、初めて「どこまでできているか」が分かります。

パソコンで動いても、スマホでは文字が重なる場合もあります。どの画面や端末で確かめるかを、お客様と決めておきましょう。［参考1］

練習作品と、お客様に渡す仕事は違う

練習では、自分でページの内容を決め、自分のペースで直せます。うまくいかなければ途中でやめても構いません。

お客様の仕事では、目的、期限、予算、確認方法など、相手との約束があります。問題が起きたときにも、連絡し、状況を整理する必要があります。

「自分のパソコンに一度表示できた」ことと、「お客様が使える状態で納品できる」ことは別です。その差を確認できる範囲から受けるか、協力者に相談することが大切です。

最初に試す、3つの練習

1. 架空のお店を一つ決める

たとえば架空の喫茶店を題材にし、「営業時間とメニューが分かる1ページ」を目標にします。店名や文章は自分で考え、実在するお店の情報を無断で使いません。

2. 完成の条件を決めてから作る

「見た目を作る」だけでなく、「スマホでもメニューが読める」「地図へのリンクが正しい」など、確認できる条件を書き出します。

3. 直せなかったことも記録する

AIに説明を聞いても分からなかった箇所は、そのままメモします。「何が表示されないか」「何を試したか」を残すと、後で相談しやすくなります。

全部作れないときは、制作を依頼する選択肢も

お客様の希望を聞くのは自分、制作の一部または全部は協力者、という進め方もあります。ただし、お客様と仕事を受けるサイトの両方で、AI利用・協力者への依頼・必要な情報の共有が認められていることが前提です。

相談先が引き受けられるか、金額と納期は合うかを確認する前に、お客様へ完成を約束しないでください。案件によっては、技術、時間、条件、規約などの理由で、依頼をお受けできない場合もあります。

自分のペースで、できることを増やそう

分からないことがあるのは、始めたばかりなら自然なことです。大切なのは、分からないまま納品することではなく、確認できる方法を持つこと。

無料ガイドでは、AIクライアントワークの基本を全8通で順番にお伝えします。自分で作る道も、相談しながら進む道も知ったうえで、次の一歩を選んでみてください。

僕がCodexを使う理由は、作業と確認まで進められるから

僕が実際の仕事で使っているAIの一つが、OpenAI Codexです。文章で説明を受けるだけでなく、ファイルを作る、プログラムを修正する、動きを確かめる、といった作業を目的に沿って進める助けになります。

対応する環境では、ブラウザー操作や、特定の作業手順をまとめたスキル、外部の道具につなぐプラグインも使えます。ただし、利用できる機能はプラン・端末・設定・接続先などによって変わります。どのAIにも同じ機能がある、または他のAIではできない、という意味ではありません。

初心者なら、最初は架空のお店の紹介ページなど、個人情報を使わない小さな練習から始めてください。「何を作りたいか」を伝えるだけでなく、「どこをどう確かめればいいか」も一緒に聞く。作ることと、確かめることを組み合わせるのが大切です。

機能の参考：OpenAI公式・ブラウザー操作、スキルとプラグイン。Plus AIしごとサポートは、OpenAIの公式サポートではありません。外部AIの利用料は別途必要です。

【参考資料】確認日：2026年10月28日

［参考1］MDN「はじめてのブラウザー横断テスト」
https://developer.mozilla.org/ja/docs/Learn_web_development/Extensions/Testing/Introduction
［参考2］クラウドワークス「AI活用に関するポリシー」
https://blog.crowdworks.jp/archives/5811/