フリーランスエンジニア営業なしで案件受注

Web制作会社案件で最低限必要なスキル6つ

制作会社案件でコーディングをするときに使うスキルは限られています。

なので、まずは最低限使うスキルのみをしっかり押さえておきましょう。

今回はWeb制作会社でコーディング案件のみを行う場合に必要なスキルを回答します。

Web制作会社案件で最低限必要なスキル6つ

  1. HTML、CSS、jQueryが書ける
  2. 模写コーディングを含め、サイトを作った経験がある
  3. Sassが書ける
  4. Photoshopでデザインデータの書き出しができる
  5. SEOを意識したコーディングができる
  6. 作ったサイトを本番にアップできる

 

HTML、CSS、jQueryが書ける

最低限HTML、CSS、jQueryはできるようになっておきましょう。

Progateの中級編までの知識は必須です。上級編も数回はやって、どんな感じか押さえておきましょう。

phpが書けなかったり、WordPressが使えなくとも、

HTML、CSS、jQueryが書ければ静的サイトを作る案件を受注できる可能性が高いです。

とにかく速く受注したいという人は、HTML、CSS、jQueryをまずはProgateでしっかりやっておくと良いです。

 

模写コーディングを含め、サイトを作るスキルがある

Progateだけで、いきなり案件を受注するのは無理なので、

  • 模写コーディングをする
  • 架空サイトを作ってみる
  • ポートフォリオサイトを作ってみる

などして形にできるサイトを作ってみましょう。

制作会社に営業メールを送るときに使えたり、面談してスキルレベルを掴むために提出を求められる場合があるます。

Progate終わったらやること3つは模写・PSDコーディング・ポートフォリオ作成です

 

Photoshop書き出しのスキルがある

制作会社でデザインがくるときはほとんどがPhotoshopデータなので、

Photoshopからのデザイン書き出し方法を学びましょう。

具体的な方法は以下の記事をどうぞ。

Photoshopからコーディングする方法【10分】

 

Sassが書ける

SassはWeb制作案件で必須とも言っても良いもので、CSSを効率的に書く方法です。

CSSとは別のSassファイルにコードを書いて、最終的にCSSに変換させます。

Progateにたくさん講座がありますが、最低限ネスト、変数表記、コンパイルというファイル変換方法ができるようになっておけばOK。

本を買わなくても済むくらいシンプルです。

本だと実務で使わないような詳細な知識がたくさん載っているので、勉強に時間がかかります。

詳細な方法は以下の記事をどうぞ。

sassコーディングの勉強/参考書は不要。最低限覚えることは3つだけ

 

SEOを意識したコーディング

単純にコーディングするのではなく、SEOを意識したコーディングができることが必要です。

例えば以下のようなコーディングが挙げられます。

  • h2やh3タグを適切に使用しているか
  • 画像のaltタグにテキストを入れているか
  • 画像を使いすぎていないか

詳細は以下の記事をどうぞ。

初心者向け!コーディングで必要最低限の内部SEO知識

 

作ったサイトを本番環境にアップできる

サイトを制作したら、本番環境へのアップまで任されることがあります。

各1つのサーバー・ドメインを持っておくと、サブドメインを利用して何個でもサイトを作れるため、本番環境へアップする練習もできるし、自分のポートフォリオサイトやブログを作ることができるので持っておいて損はしないと思います。

必要なもの

  • サーバー(月額1000円、初期費用3000円)
  • ドメイン(年間670円)

おすすめはエックスサーバー

最も初心者向けで使いやすくコスパが良く、性能も良いのはエックスサーバーです。エックスサーバーは利用者が多いため、何かわからないことがあってもググればだいたい誰かが解説をしてくれています

Xサーバーがホームページ作成に最適な理由は「ホームページ作成するならエックスサーバー一択【初心者向け】」の記事をご覧ください。

エックスサーバーは10日間無料でお試しキャンペーンをしています。

 

おすすめはお名前.com

最もメジャーで使いやすいドメインはお名前.comです。

安くて設定方法が簡単で、さらに利用者が多いためネット上に色々な設定情報が載っているからです。

 

具体的な方法

具体的な方法は、以下の記事が参考になると思います。

WordPressで企業のホームページを簡単に制作【6時間】

 

Web制作会社案件であると有利なスキル

次に、制作会社案件を行うのに、あったら良いレベルのスキルを解説します。

私はnpm scriptsやGitをここ3ヶ月ほど案件で使っていますが、全ての制作会社で使うわけではないし、最初はかなり難しいと思うので、まずは上の最低限必要なスキルを身につけましょう。

npm scripts

npm scriptsを使うとコーディングの面倒な作業を自動化してくれます。これを使えばコアラなどのアプリを使わなくともSassのコンパイルも行ってくれます。

これと似たものとしてgulpもありますが、最近は脱gulpしてnpm scriptsを使っている人も多いようです。

ゴロニャン

詳細は、下の引用元の記事を見てみてね

私は最近、多くのオープンソースのプロジェクトがnpm scriptsを使っていることに気づきました。本当にgulpが必要なんでしょうか?そう立ち返ったとき、もはや不要なのだと私は気付きました。

引用:[意訳]私がGulpとGruntを手放した理由 – QiitaQiita

gulpやgruntなどのタスクランナーを使わず、npm-scriptsを主軸とした今っぽいフロントエンドの開発環境を作ってみたいと思います。脱タスクランナーです。

引用:【脱・gulp】npm-scriptsでシンプルなフロントエンド開発環境を作る – KAYAC engineers’ blog

ゴロニャン

初心者は初期設定でかなりエラーが出て嫌になるかも
無理して使わなくともOK!

ニャンニャン

 

私がnpmでつまずいたポイントを載せておきます。

npm scriptのつまずきポイントまとめ

 

Git Sourcetree

Gitはソースコード管理ツールです。Sourcetreeはソースコード管理ツールの一つで、メジャーなツールです。私が前職のIT企業にいたときもSourcetreeを使っていました。

Gitを使うならまずSourcetreeを使えるようになると良いでしょう。ただ、初心者フリーランスは覚えることがたくさんあって大変なので最初はできなくてOKです。最初は、Gitが出来なくても制作会社の案件は受注できるはずです。

SourcetreeでのGit管理を超簡単に説明した記事

多くのSourcetreeやGitの概念の説明を無くして、超シンプルに解説した記事です。この記事の方法では、一人でソースコードをローカルで管理したいときに使えます。

ゴロニャン

まずはGitを使ってウォーミングアップしたい方にオススメです。
便利なので今は個人で小規模サイトを作るときでもGitを使うようになったよ! 

ニャンニャン

Sourcetreeの使い方が5分でわかる!最低これだけでOK

SourcetreeでのGit管理をBitbucketも使って行う方法を説明した記事

制作会社で実際にSourcetreeを使うときは、Bitbucketでオンライン連携して使うことが多いと思います。

この記事では、簡単に、Bitbucketでオンライン連携しながらSourcetreeでソースを管理する方法を解説しています。

この記事ではWordPressの管理方法を書いていますが、WordPress以外でもこの方法で管理が出来ます。

一番わかりやすいsourcetree/bitbucketでのwordpress管理方法(ローカル環境)

Sourcetreeのつまずきポイント

 

Web制作会社のスキルまとめ

Web制作会社で仕事をする必要最低限のスキルを紹介しました。

実際の仕事の流れを知りたい方は以下の記事をどうぞ。

Web制作の仕事の流れとコーディング手順【制作会社案件編】