【超初心者向け】Webサイト制作に必要な5つのスキル

僕は2年前にWebの業界に入ってから、ほぼ独学でWebサイト制作のスキルを学びました。

まだまだ学びが足りないところがありますし、ごっそり抜けている部分があるので頑張って埋めている真っ最中です。
それでも現在はまあそれなりにWebサイト制作ができるようになりました。

これからWebサイト制作について学びたい人のために、僕がWebサイト制作ができるまでに学んだスキルをまとめます。

HTML

Webに興味がある人なら一度くらいは名前を聞いたことがあるでしょう。

HTMLはWebページを作成するための言語です。
ページには、見出しや段落、画像などのさまざまな要素がありますね。

HTMLはそれらをWeb上で正しく表示するために意味づけ(マークアップ)します。
顔でたとえると、目、鼻、口などのパーツそのものを形成します。

Web上にある全てのサイトはこのHTMLによって表示されています。

プログラミング言語と思われがちですが、厳密には「マークアップ言語」という位置づけになります。

でも、初学者からすると混乱しちゃうので、とりあえずそこはどうでもいいことです。

音楽の話をしていて、「グリーン・デイはパンクじゃなくてポップ・パンクだから」とか口を挟むようなもんです。
ごめんなさい、ちょっとわかりにくかったです。

Webの勉強をするなら、一番最初に学ぶべき言語です。
全然触れたことない人からみたら難しそうに見えますが、けっこう簡単です。

CSS(カスケーディング・スタイルシート)はWebサイトの見た目をきれいに整えたり、色をつけたり、デザインするための言語です。

CSSを使用せずに作成されたサイトは、あまりに質素で利用しづらいです。
なのでCSSによって色をつけたり、画像の配置や文字の大きさを変えたりして、サイトのデザインを整えます。

先程のHTMLが顔のパーツなら、CSSはお化粧です。
HTMLと同様、Webサイトを制作するなら一番最初に学ぶべきスキルです。

Javascriptはプログラミング言語です。

HTML＝顔のパーツ
CSS＝化粧

ときたら、Javascriptは表情といったところでしょうか。
べっぴんさんがさらに表情豊かならもっと魅力的ですね。

Webサイトを見ていて以下のような動きはJavascriptによって動かしていることがほとんどです。

HTMLとCSSだけでは表現できないユーザーの動きに応じたサイトを作成することができます。

PHPは動的なサイトを作成するためのプログラミング言語です。
動的なサイトとはアクセスした状況や人、時間によって表示が変わるサイトのことです。

具体例を上げると以下のようなことです。

HTMLとCSSだけでは誰がいつ見ても同じ静的なページしか作成することしかできませんが、PHPを利用すれば、動きのあるWebサイトやWebアプリケーションを作成することができます。

有名なブログ作成ソフトウェア「Wordpress」もPHPで動いています。
WordpressをさわりながらPHPを少しづつ覚えていくといいでしょう。

WordPressはブログなどのサイトを簡単に作成するためのシステムです。
上述の通り、PHPから構築されています。

CMS（コンテンツマネジメントシステム）と呼ばれるものです。
他にも、EC CUBEやDrupalなど、世界にはたくさんのCMSが開発されていますが、Wordpressは世界で最も利用されているCMSです。

CMSがなければ、サイト制作するにはゼロからHTMLやCSSを書かなければなりません。
でも、Wordpressを導入して好みのテーマを選べば、もう立派なサイトが1時間あれば手に入ります。

まずは自分のブログを立ち上げるなどして、簡単な操作方法に慣れるところから始めましょう。

この記事を見て、
「意外に学ぶこと少ないじゃん、いけそう」と思ったでしょうか。
それとも「学ぶことたくさんある、きつそう」と思ったでしょうか。

これらをそれなりにマスターすれば、Web業界で仕事をもらえるくらいになります。

まずは、Wordpressで自分のサイトやブログを持ってみて、そこでHTMLやCSSをさわりながら学んでみてください。

ぼくもキーボードを人差し指だけで叩いていたところからWebを勉強し始めました。
Webはこれから先、絶対に無駄にならない知識だと思います。

一緒にがんばりましょう。