子育て中のママが独学でWebデザイナーになる(1)〜 最初に揃えたい5つのもの

この記事は2年以上前に書いたものですので、もしかすると情報が古くなっているかもしれません。ご留意のうえ、参考にしてもらえたら嬉しく思いますm(_ _)m

机の上

先日は、スクールに通わなくても自分次第で独学でWebデザイナーになれるんだよ!と言うお話をしました。

では、実際に子育て中のママが、未経験から独学でWeb関連のスキルを身につけるにはまず何を揃えていけば良いのでしょう?

スポンサーリンク

まずはこれだけ揃えよう

全部自分のために使えた独身時代とは違い、いくらスキルアップのためと言ったって、あまりそればかりにお金はかけられない。

なんやかんやお金がかかる育児用品。
それに、これからかかってくる習い事や保育園・幼稚園の費用、小学生になればお小遣い、塾、部活…

だから、今手元にあるものだけでできることから始めるのも有り!

パソコンとブラウザ

パソコン

これがないと始まらないですね。

Webデザイナーを目指したいと言う人なら、パソコンくらいは当然家にあるという前提でお話していきます。

最近は、スマホだけでお手軽にホームページが作れることを売りにする便利なサービスもありますが、オリジナリティのある本格的なWeb制作をできるようになりたい人はやはりパソコンで勉強した方が効率がよいと思っています。

OSは、WindowsでもMacでも構いません。お好みで。

ただ、サポートの終了しているOSはウィルス感染や個人情報流出などの危険があるので、絶対に使わないでください。
Windowsなら、Vista、Windows7、Windows8は既にサポート終了しています。
WIndows7も、2025年にはサポート終了予定なので要注意です。

実家に眠っていたお父さんのパソコンを引っ張り出して…などの場合は、入っているOSのバージョンを必ず確認してくださいね。

ブラウザ(無料)

ブラウザとは、インターネットを利用するためのソフトウェアです。

Webサイトはインターネット上で閲覧するものですから、当然必須ですね。

代表的なもので言うと、Chrome、Sarafi、Firefox、Edge などです。
Internet Explorer11は2022年6月にサポートが終了します。

WindowsならEdge、MacならSafariが標準で搭載されています。

プロのWebデザイナーなら、どの主要ブラウザで見ても崩れずに表示させることは基本ですが、まずは今パソコンに入っているブラウザだけで始めてみましょう!

テキストエディタ(無料のソフトウェアで充分)

Webサイトは、基本的にHTMLとCSSと言う言語でできています。
この言語を使ってWebサイトを組み立てることをコーディングと言います。

コーディングは、Webサイト制作を行う上での基本技術ですから、
デザインセンス云々の前にまずコーディング技術を身につけることをおすすめしています。

コーディングをするためのソフトウェアでおすすめなのは、

Atom、Sublime Text
MacならCotEditor(私はずっとこれです)
Windowsならサクラエディタや秀丸エディタ
秀丸は有料ですが高機能です。

ホームページビルダーなどのソフトウェアは?

簡単にWebサイトを作れるかもしれませんが、コーディング力はつきません。
また、今はオンラインでも無料でホームページビルダーのように作れるサービスがたくさんあるので、ソフトウェアにお金をかけるくらいならそちらをお勧めします。

Dreamweaver

ホームページ作成ソフトとして一番メジャーだと思われるAdobeのDreamweaverは便利な機能はたくさん有りますが、初心者が使いこなすには難しいと言われます。
それに、余分な機能も多く複雑で、動作も重くなりがち。
数年前までは私も愛用していました今はほとんど使いません。便利なことは便利なんですけどね…。

だから、初心者でも扱いやすくて、コーディング力が身について、しかも無料で使える、テキストエディタがおすすめです!

参考書やWeb上の学習サービス

私が独学で学んだ頃は、Webサービスはそんなに発達していなくて、本屋さんで参考書を買って勉強するスタイルが主流だったと思います。

私は有名な「できるシリーズ」のHTML入門か何かを買って基礎から地道に勉強しました。

ちなみに、その数年前に、ExcelやWordなど一般事務のスキルを身につけるために使ったのも「できるシリーズ」。本当にお世話になりました。

紙の参考書の選び方

HTMLの参考書は、書店でもAmazonなどでも色々なものが出ています。

だいたいが、実践的にWebサイトを作りながら身につけていくスタイルが多いのかなと思います。理論だけを頭に入れるよりは、実践で少しずつ理解しながら身につけていく方が早いということがよく分かります。

でもレビューを見ていても、人によって相性があるようなので絶対コレがいい!ということが言いづらいし、最近出た参考書は私も使ったことがなくて語りようがないので、自分の過去の経験を踏まえて、テキスト選びで最低限抑えて置いて欲しいポイントを。

出版日ができるだけ新しいもの

何度も書いている気がしますが、Web業界は日々進化しているので、半年前に書かれた本でもすでに情報が古いことがざらにあるからです。古い情報はゴミ同然!

パソコン画面の写真を使って説明しているもの

だって、文字ばっかりだとわかりづらいしつまらないですよね。

カラーのページが多い

画面の写真もモノクロだと見づらいし、何よりカラーの方が読んでてなんだか楽しくないですか?

Webサービスなら

紙の参考書じゃない、Web上のサービス。
これもたくさんありますが、確かなところだけ2つご紹介しておきます。

Progate

https://prog-8.com/

スライド形式で学べる、プログラミング学習サイト。

ドットインストール

http://dotinstall.com/

Web業界の人なら少なくとも名前くらいは知っているであろう、プログラミング言語を3分動画でマスターできる、初心者向け学習サイトです。
HTML、CSS、javascriptなど、Webデザイナーに必要な講座がたくさんありますよ。

学ぶための時間

お子さんの年齢にもよりますが、
子どもが幼稚園や小学校に通っているママならば、その時間を利用して、家事の合間に1〜2時間。

未就園児を育てているママなら、子どものお世話をしながら勉強をするのは至難の技なので、子どもの昼寝や夜寝た後の1時間でも学習に充てる。

私の場合は、Webを独学で学んでいた頃は独身で子どもはいなかったけど、普通に働いていて残業もあり平日は忙しかったです。土日は土日でやりたいこともあり。
だから、寝る前の1〜2時間を使って、コツコツとWebサイトを作っていました。

空き時間にパパッと取り組める環境(ここ重要!)

子育て中のママは、単に忙しいだけではなく、子どもに時間を振り回されやすい。
小さな赤ちゃんなら、一日ぐずっていてなかなか手が離せない日もあるし、幼稚園の子でも急に熱を出して早くお迎えにいったり、ママ友同士の付き合いだってありますよね。
だから、ちょっと時間が作れるかも!という時に、パパッと取り組める環境を整えておくことをおすすめします。

例えば、

デスクトップより、リビングやダイニングなど状況次第で移動が可能なノートPC。

※注:デザインをガシガシやるようになると、逆に大きいデスクトップのモニタが必要になってくるので、もし両方持っているならまずはノートで始めてみてください、という程度です;
ただ、特にフリーランスだとカフェで打ち合わせしたりする機会が多いので、ノートPCは一つ持っているととても便利ですよ〜。

PCの電源を切らずにスリープ状態にしておく。(立ち上げの時間を省ける)
学習に必要なデータはデスクトップに置くか、ショートカットでアクセスしやすい場所に。
Webサービスを利用するなら、そのサイトをブックマークしておく。
会員制サービスを利用するなら、ログインIDとパスワードはすぐにわかる場所に控えておく、もしくは自動ログイン(安全性は考慮してくださいね)

PCのこと以外はとても小さなことですが、その一つ一つがちょっとでも面倒なものだと、取り組むのも億劫になってくるものです。

時間の無いママだからこそ、気軽にパパッと取り組める環境づくりも重要ですよ。

まずはここから、始めて見ませんか?

このたったの5点があれば、まずはWeb制作の基本技術と言えるコーディングの勉強ができちゃいます。

意外とお金がかからないでしょう?
なんだかできそうな気がしませんか?

まずはここから、始めて見ませんか?

コメント

  1. りょうこ より:

    独学で、これからwebデザイナーを目指そうと思っている2歳の娘を育てるママです。
    あまりお金をかけずに勉強したかったので、こちらの記事参考になりました(*’▽’*)
    ありがとうございます♪

    webデザイナーになる上で、もう少し教えていただきたいのですが、バナーやイラストはイラストレーターやフォトショップを使用されているのでしょうか?

    よろしくお願い致します。

    • 在ママ。 より:

      >りょうこ様

      コメントありがとうございます!
      Web業界で頑張るママさんを応援したくてこのブログを立ち上げたので(最近は好きなことを好きなタイミングで書いているのでコンセプトがブレブレですが;)、
      少しでもりょうこ様のお役に立てたならとても嬉しく思います。

      <ご質問への回答>

      デザイナーにより使うツールは色々だと思いますが、
      そうですね、私はデザイン作業はイラストレーターやフォトショップを中心に使っています。

      ・イラストレーター:ロゴ、イラスト
       (使う場所により拡大縮小する必要があるもの)

      ・フォトショップ:Webページのデザイン、バナー
       (サイズが決まっているもの)

      という感じで使い分けています。

      経験者の意見を取り入れつつ、色々試してみて、
      りょうこ様が使いやすいと思うものを見つけていただくのが一番かと思います♪

      他にもご質問がありましたらどうぞお気軽にコメントくださいね。

      今後ともよろしくお願いいたします。
      ありがとうございました!

      • りょうこ より:

        在ママ様

        質問の解答、ありがとうございました。
        イラストレーターとフォトショップの使い分けもあまり分かっていなかったので、参考にしてみます。

        ありがとうございました(*’▽’*)

        • 在ママ。 より:

          >りょうこ様

          こちらこそ、ありがとうございます♪
          ご参考になれば嬉しいです。
          また何かありましたらお気軽にどうぞ〜^^