職業訓練校でWebサイト制作を学ぶことに興味はあるけれど、
・実際どんなことを学べるの？
・どこまでできるようになるの？
と、イメージがつかめなくて不安な人も多いと思います。
私も、ぼんやりとしか想像ができませんでした。
そこでこの記事では、Webサイト制作の職業訓練校を卒業したから言える、Webサイト制作の職業訓練校の授業の進め方・使った教材・学んだ内容の実態を、レポートします！
Webサイト制作系の職業訓練校を検討している方の参考になれば嬉しいです。
Webサイト制作系職業訓練校のカリキュラム内容
私が受講したのは、Webサイト制作の基礎コースです。
カリキュラム内容は下記参照。
| 概要 | Web制作の基礎となるHTMLyaCSSの知識に加え、PhotoshopやIllustratorを活用したWebデザイン技術、JavaScriptやPHPなどのWebプログラミング技法や簡単な動画編集技法を習得し、Webアプリケーションにおけるプログラミングに関する知識及び技能を習得する。 |
| 仕上がり目標 | Web制作現場で必要とされるデザイン概論、HTMLyaCSSなどの基礎知識を学び、Webサイト制作、更新業務を行える知識、技術を習得する。 |
| 受講条件 | 文字入力ができ、Word/Excel等の基本的なパソコン操作ができる。 |
| 就職先の職務／仕事 | Webデザイナー、Webエンジニア、Webプログラマー、 Webページ制作に関する企画・立案・事務・デザイン・メンテナンスの業務全般 |
| 訓練終了後に受験できる関連資格 （※受験料別途自己負担） | ・ウェブデザイン技能検定 ・HTML5プロフェッショナル認定試験 ・アドビ認定プロフェッショナル ・Illustratorクリエイター能力認定試験 ・Photoshopクリエイター能力認定試験 |
| 訓練内容 | ・Photoshop／Illustratorを使った画像編集 ・PremiereProを使った動画編集 ・Figmaを使ったワイヤーフレームやデザインカンプ作成 ・HTML＆CSSコーディング ・JavaScripを使ったサイトに動きを出す方法 ・PHPを使ったメールフォーム作成 ・履歴書／職務経歴書の作り方、面接対策などの就職支援 |
| 訓練期間 | 4ヶ月（学科24時間／実技369時間／就職支援39時間／計432時間） |
WebデザインもWebプログラミングも少しずつ体験できる、初心者向けのカリキュラムでした。
最終的に、通販サイトのようなWeb上で金銭のやり取りが発生するサイトは作れませんが、メールフォームで仕事を受注できる個人サイトや企業サイトは作れるところまで教えてもらえました。
▶︎職業訓練校で学べる学科や、募集時期はこちらで確認できます。
使用教材と授業の進め方【自主学習との違いも解説】
使用教材は市販の専門書！
授業で使ったテキストは本屋で普通に販売されてる専門書。
スクリーンに投影しながらテキストをなぞる授業スタイルだったので
「これ、学校来なくても自分でも勉強できたんじゃ？？」
と思ったのが正直なところです。
市販の本だったので、卒業後はメルカリで売却しました
▶︎メルカリでお小遣い稼ぎしてる話はこちらに
自主学習との違い１:わからないところはすぐに質問できる
自主学習でもやろうと思えば身に付く内容ですが、わからない単語がでてくるたびに調べたり、調べてもなかなか答えに辿り着けず行き詰まってしまうと……
自主学習だとお手上げですよね。
でも講師がいると、「わからない」と思ったタイミングですぐ質問できる。
疑問をその場で解消できて、スムーズに学習を進めることができました。
自主学習との違い2：クラスメイトの存在
クラスメイトは基本的にみんな初心者同士。
なので、わからなくなる箇所も、同じところが多いです。
・私だけがわからないわけじゃない
・ちょっと難しいけど、一人だけ遅れるわけにはいかない
そんな感じで、授業も放課後の自習も頑張れました。
仲良くなってくると、生徒同士でわからないところを教え合ったり、「何が何だかわからないんだけど？！」と笑い合ったりしてて、そういうのはやっぱり一人での学習では得られないなと思いました。
私は友達できなかったんですけどね。
だいたい前後左右の席の人と仲良くなるんですけど、なんとなくどこにも馴染めず……。でも、授業受けに行ってるので特に孤独は感じなかったな。空き時間はずっと課題やってたし、一人でも平気でした。グループワークの時もそれで気まずいとかはなく、普通に喋ってました。
▶︎訓練校でぼっちだった話はこちらの記事にまとめています
4ヶ月間の大まかなスケジュールと授業内容
授業内容と大まかな進行スケジュールはこんな感じ。
1ヶ月目：Webデザインと画像編集の基礎
| 1ヶ月目：前半 | |
|---|---|
| 学科 | Webデザイン／Web制作の基礎知識 |
| 実技 | Photoshop／Illustratorの基本操作 |
Webサイトの制作に入る前に、「Webデザインとはなんぞや？」という基本的なことを学びました。
紙デザインとWebデザインの違いや、解像度、視線誘導、デザインの概念などを学び、その後にデザインと関わりのある（？）画像編集の仕方を覚えたって感じです。
PhotoshopもIllustratorも本当に基礎しか触りませんでした。
生徒の9割がIllustratorのパス機能の授業で理解不能に陥り、苦しみ、ちょっとした騒ぎに（笑）。大半の生徒がここで初めて放課後や自宅での自主的な授業復習に乗り出しました。私も授業では全く理解できなくて、Youtubeの動画で自主学習を繰り返しなんとか覚えました。
| 1ヶ月目：後半 | |
|---|---|
| 学科 | ワイヤーフレームとカンプの概念／動画編集の基礎 |
| 実技 | Figma／PremiereProの基本操作 |
この期間はWebサイトのワイヤーフレームと、デザインカンプにの概念を学び、Figmaというソフトで実際に両方を作っていく練習をしました。
ワイヤーフレームとはWebサイトの設計図のようなものです。
私ので例えると、「トップページ」「好きなことをするために」「好きを仕事に」「好きと生活」「好きを楽しむ」などの大きなカテゴリがあり、その下に続く「about me…」などのコンテンツページ、その内容などをおおまかに考えてツリー表記にしてまとめる。
それをもとに、FigmaやIllustratorなどのデザインソフトで作ったサンプルページがデザインカンプ。これをクライアントに提出し、方向性がOKなら、実際にコーディング作業に入って実装していく…というのがWebサイト制作の流れ
です。
動画編集は「サイト制作には必要ないんだけど、なんでかカリキュラムに入っちゃってるからサッと覚えてね」ってノリで、学んだというより一日でザッと詰め込んだ感じ。インスタアプリ上でリール動画作るレベルのことしかやってません。
2ヶ月目：HTML＆CSSでのコーディング実習
| 実技 | HTML＆CSSのコーディング作業 |
2ヶ月目からはひたすらコーディング。
HTMLはサイトの構造を作ってるもので、文字の大きさや色を変えるといった、細かな装飾作業をさせるために必要なのがCSSです。
コーディングは基本的に全部英語で、初心者からしたら見た瞬間理解シャットアウトモノの画面だけど、使ってる英単語もルールも超シンプルなので、慣れたらなんてことないです。英作文作るより簡単。
なんなら、ChatGPTにカンプ画像を読み込ませて「このサイト作りたいからHTMLとCSSを教えて」と聞けば丸っと教えてもらえます。
エラーが出た時も、ChatGPTにコード丸ごとぶちこんで「〇〇が表示できないから原因を教えて」と聞けば解決策を教えてくれます。
とはいえ、本気でこの業界で仕事をするなら基礎は覚えておいた方がいいと思うので、この方法はある程度基礎が身についてからにした方がいいですよ。Webサイト制作には興味ないけど、自分のブログを自力でカスタマイズしたい！って人なんかはこの方法でなんとかなります。
私は元々趣味でサイト制作をしていて、ある程度HTML&CSSの知識があったので、実習中はChatGPTに聞きまくりながらサイト制作してました。
3ヶ月目：JavaScript・PHPのプログラミング
| 3ヶ月目：前半 | |
|---|---|
| 実技 | JavaScriptのコーディング作業 |
JavaScriptはHTML&CSSで作ったサイトに動きを加える役割をするプログラミングです。
スライドメニューや、訪れた時にランダムで現れる画像、時間帯によって変わるメッセージ、カウントダウンタイマー…こういったものを取り入れるために必要なプログラムです。
これもHTML＆CSSと同じく、ルールに則って使うだけなのですが、こっちは普段使わない記号がめちゃくちゃ出てくるんですよね……なので、私は全く覚える気になれず。
これもChatGPTに聞けば教えてくれるので、実習はとりあえずそれで乗り切って、「プログラミング業を仕事にするのはやめよう。Webサイト制作の仕事をするならカンプまででOKなとこでしかやらん。」と決めました。
| 3ヶ月目：後半 | |
|---|---|
| 実技 | PHPのコーディング作業 |
HTML、CSS、JavaScriptは、Webサイト訪問者の目に映るプログラム。
それに対して、訪問者の目に映らないプログラムがPHPになります。
データベースと連携して情報を保存したり、ユーザーの入力に応じて表示内容を変えたり、メールを送信したりといった、Webサイトに様々な機能を持たせることができます。
わかりやすいのがメールフォームやアンケートフォーム。
住所氏名年齢といった、不特定多数の情報を管理し、送受信させるためのプログラムがPHPです。
これも特定のプログラム言語をルールに則って打ち込むだけなんだけど、JavaScriptよりさらに使い慣れてない記号や言語の羅列になってくる……
ということで、JavaScriptで根を上げた私にとってはもう、お手上げでした。
頼みのChatGPTも、元が理解できてないので適切な回答にならず。
卒業制作のサイトでも、メールフォームの実装だけはできず、心残りです。
JavaScriptを実装しなくてもWebサイトとして成立しますが、PHPを実装してないサイトは、メールフォームや物販販売ができないので、訪問者との交流をしない、完全な個人の趣味サイトとしてしか使い道がありません。
PHPま理解できないことでなおさら「私にWebサイト制作におけるプログラミングは無理」と、諦めました。
4ヶ月目：グループ制作と卒業課題
| 4ヶ月目：前半 | |
|---|---|
| 実技 | 企業サイト制作実習（グループワーク） |
最後の月はサイト制作実習。
前半は、グループに分かれて実際にある企業のサイトを作り直すというものでした。
コーディングは絶対にやりたくなくてどうしたものかと悩んでいたら、うちのグループは
・デザインカンプ
・画像編集
・テキスト作成
・コーディング＆CSS
・コーディング＆JavaScript
という、完全分担業で進めることになったので、得意なテキスト作成に逃げてコーディングからは逃げました（笑）
私たちのグループ以外は全班他のグループはみな、「一人一ページ担当」という業務分けでした。
| 4ヶ月目：後半 | |
|---|---|
| 実技 | 卒業課題制作実習（個人サイト制作） |
最後は、卒業課題として個人でのサイト制作。
なんでもいいから、自分でテーマを決めてサイトを作ること。
そしてそれを、全員の前で一人づつ発表する。
これは結構色々、本当多種多様なサイトを作ってました。
知り合いの会社や飲食店のサイトを作る人もいれば、架空のショップサイト、今後の就活で使うポートフォリオサイト、自分が起業した前提の個人サイト、趣味の事柄についてまとめたサイト……
プログラミングの打ち方も知らない集団が、よくぞここまで多種多様なサイト作ったなと。
Webサイト作りの素人でも、4ヶ月あれば立派なサイト作れるんだなと素直に思いました。
ただ、大半の生徒が初期に学んだことを忘れていたので
・フォトショの操作ってどうやるんだっけ？
・イラレのパスの引き方完全に忘れてる……
・Figmaのオートレイアウトってなんだっけ？
ってなってました。
定期的な個人復習ホントに大切（笑）。
月に2〜3回：就職支援授業
以上が大まかなスケジュールで、この合間に、月に2〜3日、就職支援だけの授業日がありました。
就職支援日は、履歴書／職歴書の書き方や面接対策、就労規則の基礎、自己分析といった、就職に役立つであろうことを教えてもらいます。
「Webサイト制作スキルを学びに来てるのにこんな授業やりたくない」と思ってましたが、実際に受けてみると意外とタメになるし、自己分析なんかは面白かったですね。
ただ、やっぱり「不必要」と考える人が大半で、回を追うごとに欠席率が高くなっていて、最後は半数以上が欠席してました。
まとめ：Webサイト制作系の職業訓練校で得られたもの
Webサイト制作系の職業訓練校では、
・Webサイト制作の流れ
・Webサイト制作に必要なソフトの基本操作
・HTMLやCSSを使ったコーディング作業
こういった、Webサイト制作に欠かせないスキルの基礎を一通り学びました。
そして、これらを使って訪問者との連絡が取れるWebサイト（問い合わせフォーム付きサイト）を作るところまで到達できます。
正直、少しでもWeb制作に触れたことがある人や、SNSに慣れている人からすれば、「これ、独学でもできるんじゃない？」と思うかもしれません。
でも、独学と訓練校では決定的な違いがあります。
それは、わからないところをすぐに解決できる環境と、一緒に頑張る仲間がいること。
ひとりで壁にぶつかると、どうしてもモチベーションが下がってしまいがち。
でも、訓練校には講師もクラスメイトもいる。
迷った時にすぐ聞ける、励まし合える。
この環境は、未経験の分野を学び続ける中で、大きな支えになると思います。
そして、独学では気づきにくい、もう一つのポイントが、
学びのスピードと、現場感覚を身につけられることです。
ここまで読んで、「もっと高度な技術を学びたい」という人もいるかもしれません。
でも、高度な技術って、具体的に何でしょう？それで何ができますか？どれだけ価値を生めますか？
もし、この質問に明確に答えられないなら、まずは訓練校で基礎を固めることを強くおすすめします。
基礎を身につければ、確実にWeb業界を目指すスタートラインに立てる。
そして「高度な技術」は、実際に現場に入って、必要なものを必要なだけ覚えていく方が、ずっと効率的です。
ということで、これから職業訓練を検討している方は、カリキュラムの内容だけでなく「環境に身を置いて学べること」にも注目してほしいです。
この価値、あなたが考えている以上のものだと思いますよ！
