Webデザイナーになるために「パソコンさえあれば誰でもできる」という広告をみて、本当にそう思っていませんか？
確かにパソコンは必要です。ですが、Webデザインを勉強するのに他にも用意するものがあります。
この記事で紹介する「Webデザインを独学で始めるのに必要なもの」を用意すると、誰でもWebデザインを始める環境を整える事ことができます。
独学でWebデザインを始めようと思った時「勉強に入る前に道具として何が必要か」「初期段階では必要ないもの」を、私がデザインをしている仕事の環境を踏まえてご紹介します。
この記事を参考にデザインができる環境を整えて、Webデザイナーを目指していきましょう！
【必須】webデザインを独学で始める為に必要なもの5つ
環境作業で必要なもの5つ
・パソコン(MacまたはWindows)
・デザインするソフト（Adobe Photoshop/Illustrator）
・テキストエディタ
・フォント
・マウス
独学を始める前に環境作業を整える必要があります。
この5つはWebデザインの現場でも必ず使っているものなので、用意しましょう。
パソコン(MacまたはWindows)
まずはじめにパソコンを購入しましょう。パソコンが無いとWebデザインの勉強が出来ません。
既に自分のパソコンを持っている方もいるかもしれませんが、デザインをするのにある程度スペック必要になるのでパソコンを選ぶ参考にしてください。
MacとWindows、どっちがいいの？
MacとWindowsで言うと、今のパソコンではどちらでもいいと思います。
見た目やOSの好みがあると思いますが、Webデザインする上で、仕事に必須のAdobeソフトは、今はどちらのOSでも使えます。ショートカットが少し違うぐらいで、操作方法に大きな違いはありません。
実際にWebデザインをすると「ユーザーと同じ環境で検証をする」ということが出てきます。
これは、Windowsのシェアは90%近くといわれていて、圧倒的にWindowsユーザーが多いです。なので、Webサイトを見るユーザーのほとんどはWindowsが大多数ということです。
なので、WindowsのInternet Explorer と EdgeでWebサイトがどう見えているのかを表示確認することになるので、WebデザインをするのにWindows環境は必要です。
MacにはBootcampという機能があり、Macの中にWindowsをインストールし動かすことができるので、Mac OSとWindows OSの両方を同じマシンで使うことができます。
実際にWeb制作会社に入社した場合、Windowsの環境もあれば、Macのところもあるので、結論は両方使えるようになるのがベストです。両方使う事が出来れば、どこのWebの現場で働く事になっても対応できます。
選ぶポイントは、いずれにしてもWindowsは利用するということです。 それを踏まえた上でMacとWindowsのどちらを選んでもかまわない、と思います。
デスクトップかノートパソコン、どっちがいいの？
結論から言うと、デスクトップとノートパソコン両方揃える事が出来ればベストですが、独学で始めたばかりで両方はとても予算がない…という場合は、最初のパソコンはノートパソコンを購入し、次に余裕が出来たら自宅用のデスクトップパソコンを購入するのがおすすめです。
ノートパソコンでも問題無くデザインできますが、デスクトップの方がモニター画面のサイズが大きいので、ノートパソコンに比べると快適に作業ができます。
ノートパソコンで作業がしにくいな…と思ったら、別でモニターを用意するでもよいと思います。
パソコンのスペック（性能）は？
Webデザインするのに、ある程度性能の高いパソコンを用意することが必要になります。
スペックが低いパソコンだとPhotoshopなどのデザインソフトの立ち上げや、デザイン・コーディング・サイト検証などを同時進行で行うことをしたときに、ファイルの読み込みが遅くなり作業効率が悪くなってしまうからです。
必要なパソコンのスペックは以下を参考にしてみてください。
- CPU：Intel社 Core i7またはi9推奨（Macの場合はM1チップでも良い）
- メモリ：最低8GB以上(16GB推奨)
- ストレージ：500GB以上
- OS：Windows10もしくはiOS最新版
デザインするソフト【Adobe Photoshop/Illustrator】
AdobeソフトはWebデザインをするのに必要なソフトです。
Adobe以外にもさまざまなデザインができるツールはありますが、AdobeのPhotoshopやIllustratorのソフトは、多くのWebデザインの現場で使用していますし、求人の必須スキルに必ず書かれているので、独学をするにしてもWebデザインを勉強するうえで必要不可欠なソフトです。
金銭的に厳しい場合はPhotoshopだけ使えるようにフォトプランを契約するのがおすすめです。Photoshop単体でも大体の作業は行えますし、月額1,078円から利用可能です。Illustratorも一緒に必要な場合は月額2,728円から利用可能です。
コーディングするソフト【 テキストエディタ】
コーディング、プログラミングを行うのに使用するのがテキストエディタです。
もちろんデフォルトで用意されているメモ帳のようなやテキストエディタを利用しても問題ありませんが、コーディング用に最適化されたエディタを使ったほうが機能が充実しているため、快適に作業を進めることができるのでとても便利です。
有料のAdobeのDreamweaverを使うのもありですが、最初は挙動が軽い「Atom」や「Visual Studio Code」「Sublime Text」などが使いやすいエディタです。 色々ありどれを選べばよいのか分からなってしまいますが、まずは有名なHTMLエディタをどれかひとつ試し、コーディングに慣れてきたら後々他のHTMLエディタにも触れて見るのが良いと思います。
フォント
デザインをするのに必要なものの1つ「フォント」です。
購入したパソコンに元々入っているフォントではデザインとして使えず幅が狭くなるので、まずは汎用性高いフォントをGoogle FontsとAdobeFontsから使用するのがおすすめです。
Google FontsはWebフォントでいくつか日本語対応フォントが公開されているので、最初のサイト制作にとても便利なフォントです。
AdobeFontsは、Adobe CCのいづれかのプラン（Photoshop単体もOK）を契約すればフォントが使えますので、こちらもダウンロードするのがよいでしょう。
マウス
ノートパソコンの場合はタッチパッドでの操作が可能なので、マウスは必要ではないことが多いですが、Webデザインをする場合、作業の速さを求められるのでマウスは必要なアイテムです。
使用時の快適性や持ち運びのしやすさを考えると、コードレスのマウスがおすすめです。
【任意】webデザイン独学で作業がしやすいもの
集中できる部屋・場所
Webデザインの勉強はまとまった学習時間の確保が必要になってきます。
そのためには集中できる部屋・場所、環境を用意して進めます。
自宅で自分一人の場所を確保できるといいのですが、難しい場合は近くにコワーキングスペースなど、作業できる場所があるかなど、事前に調べてみてください。
机、イス
Webデザインの独学を始める上で、パソコンなどの道具と同じぐらい重要なのが机とイスです。
Webデザインの仕事は、パソコンの前に長時間座りっぱなしになるので、腰が痛くならないイスを選ぶことが重要です。
安い数千円のイスではなく、実際に座ってみて壊れにくく座り心地も良いイスを購入することがおすすめです。
机も高さが見合ったもの、奥行きがあり広いものを選ぶと良いです。
ネット環境
調べごとをしたり、参考のWebデザインを探したりするときに、パソコンがネットに繋がることが必須になります。
まだネット環境がない場合は自宅にネット環境を契約するか、持ち運び可能なWiFiルーター（ポケットWiFi）が必要です。
WiFiルーターがあれば、ノートパソコンなら家のどこでも作業ができて便利で、カフェなど外出先でも作業がしたい時は、持ち運びができるので揃えておきましょう。
PC用のメガネ
長時間パソコンに向かってコーディングをしていると、目を酷使し続けなければならないため、すぐに目が疲れてきます。
眼精疲労やドライアイ、目が疲れると肩こり、頭痛などにも繋がります。
私は普段メガネをしていますが、PC用にフルーカットライトメガネも愛用しています。
長時間の作業に耐えるためと、目を悪くしないためにもPCメガネを1つ持つのもおすすめです。
【任意】Webデザイン独学の一番最初に必要ないもの
Webデザイン独学で始めるのに色々用意する必要があることがわかってもらえたと思いますが、まだWebデザインを始ようと思ったばかりなので、初期投資は最低限にしたいと思いますよね。
なので、Webデザイン独学の一番最初に必要ないものをご紹介します。
Webデザインが楽しくなってきたり、自分で仕事にしていきたい、就職してプロとしてWebデザイナーをやっていきたい！と決めてから購入・契約をしたほうがいいものをリストアップしましたので参考にしてください。
Adobe CC（コンプリートプラン）
Adobeのソフト全て使うことができるAdobeCC（コンプリートプラン）は独学の最初には必要ないものです。
最初は必要な使うソフトのみ契約することがおすすめです。
色々デザインが出来るようになってきたり本気でこの道に進もう！と思ったら、Adobeのコンプリートプランをサブスクリプション契約することをおすすめします。Adobe XDや、Dreamweaver、動画編集、PDF編集、ファイル管理などのソフトをすべて使う事が可能です。
有料のテキストエディタ
コーディングするテキストエディタも同じで、独学の最初に有料のエディタを契約する必要ないものです。
AdobeのDreamweaverが有料になり、制作会社でも使っているところが多いですが、独学初期の段階では無料で使えるエディタがあるので、無料の中から使いやすいものでコーディングの勉強を進めることをおすすめします。
フォント/モリサワパスポート
Webデザインをするのに、フォントの種類は多いほうが幅が広がりますが「GoogleFontsとAdobeFonts」でも表現は可能です。本格的にデザインをする！となった時は、年間約5万円くらいがかかりますがプロが使っている「モリサワ書体」がある「モリサワパスポート」を契約するのがおすすめです。
モニター
最初は持ち運びがしやすいノートパソコンを選ぶ方が多いと思います。
実際にデザインをするとモニターが小さいので、別でモニターを購入することをおすすめしますが、自宅に場所を確保するなど出てくるため、モニターも本気でWebデザイナーになりたい！仕事としてやっていく！と決め手からの購入でよいと思います。
ドメイン、レンタルサーバー
ドメインとはWebサイトのURLのことです。Webサイトを公開するために必要になります。
レンタルサーバーとはデザインしてコーディングしたWebページのデータをアップロードする場所のことです。
Webデザインを独学で進めていくとデザインするだけではなく、サーバーの基本的な仕組みについても理解しておく必要が出てきますが独学初期には必要ないものです。Webサイトのデザイン、コーディングができるようになってもう少しWebのことを詳しく知りたい、勉強をしたい！と思ってからの契約でいいと思います。
Webデザイン【独学】に必要なもの・必要ないものまとめ
Webデザイン【独学】に必要なもの・必要ないものをご紹介しました！
「パソコン1つあれば」と言われますが、そのパソコンの中には色々インストールして使えるように準備をしています。
一番始めは、必要なもの5つを用意し、実際にWebデザインをやってみて「自分に向いていそう、続けられそう！」と思ったら買い揃えたり、契約することがおすすめです。
今回紹介した内容を参考に、独学の環境を整えて、勉強をより効果的なものにしましょう。
