【WEBデザイン初心者】プログラミング言語勉強法

トラコマ

2020年2月20日 12:34

こんにちわ。トラコマです。

私は、10代の頃なんちゃってHTMLで、自サイトを作ったことがあります。
いわゆる同人サイトですね！

それから数年経ち、現在なんちゃってWEBデザイナーになってるわけですが、なんちゃってでもWEBデザイナーをできるのは、やはり勉強。インプット。そして慣れですよね。

WEBデザイナーを目指してる方、やってみたい方など、少しでもお力になれればと思い、私の勉強法をまとめてみました。

【まずはじめに】

WEBコーディングで必要な言語は、HTML・CSS。
この2つを勉強していれば、なんとか形にできます！
ここにjQuery(javascript)を追加すれば、もっと素敵なHPが作れます。

尚、私はまだjQuery勉強中ですので、めちゃくちゃGoogle先生に頼ってます。偉大。
近年ではjQueryと近いことができる、CSSアニメーションというのも普及し出したので、最悪CSSアニメーションを極めるのも手です(笑)

ちなみに…HTMLとCSSは細かく言うと、プログラミング言語ではなく、マークアップ言語になります。

【その①GoogleさんでHPの作り方を確認】

10代の頃、同人サイトを作りたかったので、作り方を検索しまくりました。
「何か必要で、どうしたらHPになるのか」という部分を、軽くでもいいので、理解しておいた方が良いと思います。

Googleさんで”「HTML反映　なぜ」とかって、検索すれば先輩方が丁寧に教えてくださります！
↓こんな感じに。

『どうしてブラウザから世界中のWebページ（htmlファイル）を見られるの？【番外編】』

『今さら聞けない！HTMLとは【初心者向け】』

『1章.ホームページの基礎知識』

【その②WEBサービスで基礎を学ぶ】

HPの作り方をなんとなく確認したら、どのようにコードを書くのかを学びました。
私がはじめてHP制作をした頃は、今みたいにパソコンもネットも普及していなかったので、WEBサービスもなく本で学ぶのが当たり前でした。

今は、無料でも全然学べる素晴らしいサービスが、ネットに落ちていますので、それを活用しまくるのが良いと思います。

以下オススメWEBサービス様です。

『Progate』（基本無料）
有名な学習サイト様。
HTML・CSS・javascriptだけではなく、Ruby・PHP・Python・Gitなど、一通りのプログラミング言語を学べます。
実際にコードを打ち込みながら、コンテンツを作っていくので、感覚的に覚えやすいです。
基礎の導入として重宝しています。

『ドットインストール』（基本無料）
WEB学習サービスの先駆けに位置する、超有名な学習サイト様。
動画で丁寧に説明してくれるので、初心者の方も導入しやすいと思います。また、3分台という丁度いい動画の長さなので、飽きずにサクサク学べます。
実際に自分で書き込みながら見ると、更に覚えやすくなります。

『CODEPREP』（無料）
残念ながら2018年9月に更新終了となりましたが、無期限公開で現在もサービスを利用できます。
穴埋め形式でコードを打ち込みながら学ぶのですが、基礎を覚えていないと難しいと感じるかもしれません。
ですが、学べる言語も多く、「HTMLとCSS3でつくる通知ベル」や「javascriptでつくるおみくじを」など、実践で使える応用ブックがあるので、ワンランク上を目指す方はやってみる価値はあると思います。

この3サイト様で、基本勉強しています。