未経験からWeb制作会社で働くための3ステップ

こんにちは。りゅーじです。

そろそろ就職のことを本気で考えなくてはならない時期になってきました。「明日から本気出す」というクズは僕のことです。

そんな僕にも一応就きたい職があって、それはWeb制作業なんです。

僕と同じようにこの分野にちょっとでも興味がある人のために、自分が今まで調べてきたことと職に就くために実践しているアプローチをまとめてみました。

なぜ僕がWeb業界で働きたいのか
Web系職業のジャンル
やたらジャンルが多い理由
Web業界で働くための3つのステップ
まとめ

なぜ僕がWeb業界で働きたいのか

本題の前に、なぜ僕がWeb業界で働きたいと思っているのかちょこっと触れようと思います。

どうでもよかったら飛ばしてね。

初めて僕の家にPCが来たのが小学4年生くらいのころで、なんだこれは！とテンションが上がっていました。その頃はまだ初期から入っていたゲーム「ピンボール」で遊んで満足していたのをよく覚えてます...。

次第にネットサーフィンを覚えるようになり、欲しい情報がすぐに手に入ることに感動して「自分も情報を発信したい！」と思い立ち独学でHTMLを学び、自分のホームページを立ち上げました。

はい、いわゆる黒歴史サイトです。

今思い返すと穴があったら生き埋めにしてほしいくらい恥ずかしいですが、自分で書いたコードが形となってブラウザに表現される楽しさは今でもよく覚えています。

Webというのは幼少の頃から触れてきた世界なので、自分がワクワクした体験を今度は与える側になりたい...なんて気持ちがモチベーションになるんじゃあないかと。そんなところです。

Web系職業のジャンル

Web屋として働きたいとは言っても当たり前ながらこの世界は様々な職種があるわけです。

この記事では5つの職種にジャンル分けしてみました。

マークアップエンジニア、コーダー

デザイナーによって作られたデザインをもとに、HTML、CSSを用いてWebページに組み上げていく人を指します。HTMLやCSS以外のプログラミング言語にも対応できる必要があります。

必要となるスキル

・HTML、CSSのコーディング能力

・jQueryの基礎知識

・コミュニケーション能力

フロントエンジニア

コーダーよりも幅広い知識を持った人であり、「誰でも使いやすい」プログラムを組めるコーディング力が求められます。「誰でも使いやすい」というのは、例えばWebに対する知識をあまり持っていないサイト所有者がいたとすればCMS(ウェブサイト更新システム)を導入し、知識が無くても簡単にサイトが更新できるようにすることを指します。結局のところ「コーダーのすごい版」です。

必要となるスキル

・HTML、CSS

・JavaScript

・CMS構築(PHP)

・jQuery

・コミュニケーション能力

Webデザイナー

視覚的な美しさをWeb上で表現する人のことで、クライアントが求めるものや、ユーザーに合ったものを柔軟に対応する力が求められます。会社によってWebデザイナーに求められるスキルが大きく違い、PhotoshopやIllustratorなどのソフトを使えれば良いところもあれば、HTMLやCSSのプログラミングスキルまで必要とされる場合もあるので、募集要項はよくチェックする必要があります。

必要となるスキル

・グラフィックデザイン

・Photoshop,Illustrator

・HTML、CSS

・コミュニケーション能力

Webディレクター

いわゆる現場監督です。クライアントが求めている要件をまとめ制作チームにアウトプットしたり、Webサイトの企画・プランニングなども務めます。元SEの人のように、制作工程を理解した人がディレクターになることもあります。

必要となるスキル

・Web制作知識全般

・プレゼンテーション

・コミュニケーション能力

Webプロデューサー

Webサイトの目的（集客、収益）を達成するための総監督のことです。納期の交渉や会計管理、プロジェクト全体管理など、やることは多岐にわたります。優れた情報収集能力とオールマイティな知識が必要であるため、なかなか大変なお仕事です。

必要となるスキル

・マーケティング

・プレゼンテーション

・情報収集・分析

・コミュニケーション能力

とりあえず、グループでモノをつくるわけだからコミュニケーション能力はどの職種でも必須のようですね。全員でゴールを見据えるチームワークが大切みたいです。

やたらジャンルが多い理由

ディレクターやプロデューサーはともかく、他の職種は色々ありすぎてわけわかんないかも知れませんが、安心してください。だいたいフワっとしてます。企業によってはコーダーなのにWebデザインのスキルを求められたり、フロントエンジニア並の技術を基準としたところもあります。

だったら何でわざわざこんなに肩書きが増えたの？という話ですが、これは技術の発展が背景にあります。もともと「HTMLコーダー」という職業はHTMLやCSSとSEOの知識が業務内容でしたが、時代が進むにつれてJavaScript、HTML5、スマートフォンの登場によるレスポンシブデザインなどの技術が増えてきて「コーダー」という括りだけではまかなえなくなったというのが背景にあります。

そのため

デザイナーが書いたデザインをHTMLやCSSでWebで公開できるようにする人　⇒　コーダー
コーダーの業務がこなせて、より高度な技術をもつ人　⇒　フロントエンジニア
コーダーの業務がこなせて、デザインの分野も扱える　⇒　Webデザイナー

というような捉え方が一般的となりました。

Web業界で働くための3つのステップ

今回の記事で注目する職業は実際にモノづくりの業務がメインとなる「コーダー」「フロントエンジニア」「Webデザイナー」とします。僕が働きたいと感じているのはこの分野なので。

では、働くためのアプローチはどのようにしていけば良いのかを、僕が実践している3つのステップにまとめてみました。

知識のインプット・アウトプット

職場で使える知識や技術を蓄える必要があるわけですが、まったく触れたことが無い人にとっては「何から学べばいいの？」って感じですよね。

とりあえずおおまかな流れとしては

HTMLでWebページの骨組みを知る
CSSで実際のWebページの見え方を学ぶ
JavaScriptを学び、サイトに動きをつける
jQueryでJavaScriptをより簡単に扱う
フレームワークを学び、より効率的にコードを書く

といった具合です。

もちろん、人によって学習フローは異なるので、自分にあった方法を探してみるのもありです。

ただ、おすすめしないのは色々な言語に広く浅く手を出すことです。慣れないうちにあれこれやろうとすると言語ごとのルールがごちゃ混ぜになって、結局全部が中途半端な出来になるのでやめた方がいいですよ...。

知識を蓄えるだけじゃなくて、それを正しくアウトプットすることが必要になってきます。実際に自分の手でコードを書いて実行してみて、結果がどうなってるのかを確認することで学習内容が定着してきます。実際にコードを書きながら学習できる「Paiza」や「Progate」という動画学習サービスがあるので、ぜひ利用してみてください。

Paizaについてはこちらの記事でもまとめているので、気になったら見てください。

jhack.hatenablog.com