LIFE

【未経験者向け】Webコーダーの仕事内容と必要なスキル【実務経験1年】

こんにちは、Webコーダーのりんです。

システムエンジニアからWebコーダーに転職して、そろそろ1年が経ちます。

この記事では、Webコーダーを1年継続して分かったことをまとめました。

この記事を読むメリット

  • Webコーダーがどんな仕事をしているのかが分かる
  • Webコーダーに必要なスキルが分かる
  • Webコーダーになりたい未経験者が覚えておきたい必須スキルが分かる

ぜひ参考にしてみてください。

 

Webコーダーの仕事

コーダーとは、WebデザイナーがデザインしたWebサイトが実際にインターネット上で見ることができるように、HTMLやCSS、JavaScriptといった言語を使用してコーディングする(Webサイトを作る)ことが仕事です。

HTMLコーダーとも言われています。

 

LP制作

Webサイトを作ることをLP制作(ランディングページ制作)とも言います。

 

Webデザイナー/フロントエンドエンジニアとは違う

Webコーダーに似た職業に、Webデザイナーとフロントエンドエンジニアがあります。

その違いについて説明します。

 

Webデザイナーとは

現代におけるWebデザイナーは、PhotoshopやIllustratorなどを使ってWebサイトのレイアウトをデザインする仕事です。
レイアウトに使う画像のデザインや、広告バナーなども担当するようです。

昔はWebデザイナーがコーダーを兼任することが多かったようですが、スマホの新しいデバイスの普及によるWebサイトの複雑化により、コーディングを専門的に担うWebコーダーが必要とされるようになりました。

 

フロントエンドエンジニアとは

少し前まではWebコーダーと境界があった

少し前までのWebコーダーは、デザイナーが仕上げたWebサイトのレイアウトをHTMLとCSSで再現することが作業範囲でした。

それに対して、それ以上の知識や技術を持ち、JSやPHPなどのプログラミング言語などでWebサイトを構築できる人のことをフロントエンドエンジニアと言われていました。

動きのないサイトを作る → Webコーダー
動きのあるサイトを作る → フロントエンドエンジニア

という感じです。

 

Webコーダーと境界がなくなってきている

最近のLP制作においては新しい技術の登場により、ユーザーの目を引きつけるインターフェースなどがトレンドとなっています。

そのため、Webコーダーの業務範囲の拡大により、フロントエンドエンジニアとの境界がなくなってきています。

 

Webコーダーが使用するスキル

ぼくが現場で使用しているスキルは主に下記の通りです。

  • HTML
  • CSS
  • JavaScript
  • Photoshop
  • Illustrator
  • PHP
  • WordPress

 

未経験者の方が見ると多いと感じるでしょうか?

でも安心してください。
ぼくがWebコーダーに転職するときはどのスキルも習得しておらず、1年継続したら身についたスキルです。

 

HTMLだけではダメ。Webコーダーに必須のスキル3つ

これからコーダーの勉強を始めるなら下記の3つは必須です。

  • HTML
  • CSS
  • JavaScript

もし、コーダーに転職する前に勉強をする予定なら、この3つをやることをオススメします。

 

HTML/CSS

必須スキルです。
LP制作において、この2つは必ず使います。

これから勉強を始める方は、まずはこの2つでLP制作することをオススメします。

 

JavaScrpit

こちらも必須スキルです。

HTML、CSSの次に勉強すると良いと思います。

 

画像データをスライスするスキル

下記2つは画像・デザイン編集ソフトです。

  • Photoshop
  • Illustrator

 

デザイナーが上記のソフトでデザインデータを制作していることがあります。

その場合は上記のソフトを使用して、画像データを書き出すスキルが必要となります。

 

案件によって使うスキル

  • PHP
  • WordPress

たまに、HTMLではなくPHPでWebサイトを制作することがあります。

 

まとめ

  • Webコーダーの仕事内容について
  • Webコーダーに必要なスキル
  • Webコーダーになりたい未経験者が覚えておきたい必須スキル

この記事では、ぼくがWebコーダーを1年経験して分かった、上記3つのことについてまとめました。

コーディングスキルは、そこまで難しいものではありません。
毎日実践することで習熟していきます。

フリーランスにも繋がるスキルなので、ぜひ身につけてみてください。

ABOUT ME
りん
フロントエンドエンジニア / 趣味ブログ / 沖縄から東京に就職1年SE→ 1年フリーランスSE→ 沖縄移住2年Webデザイナー → 福岡移住1年目フロントエンドエンジニア / HTMLCSS大好物 / JS / PHP / Laravel / WordPress / VScodeでVim使う人