今からWeb制作を始める方へ!

はじめまして!
ファイブスター・コーポレーションに入社して、半年が過ぎたクリエイティブ事業部の與世山(よせやま)です。沖縄県内でフロントエンド(主にWebデザインとHTML&CSSコーディングなど)を生業として、20年ほどになります。

今回、私のこれまでの体験から「今からWeb制作を始める方」におすすめの書籍やサイトをご紹介したいと、この記事を書きました。すこしでも参考になり、フロントエンド(Webサイトを構築する技術)に興味をもって頂ければ幸いです。

情報紹介に入る前に、Webサイト(日本人はホームページと呼びますがこの記事ではWebサイトで統一します。)に必要な技術を簡単に紹介します。

Webサイトの構築には、大きく分けて三つの技術が必要です。HTML(ハイパーテキストマークアップランゲージ)とCSS(カスケーティングスタイルシート)、そしてJavaScript(ジャバスクリプト)です。特にHTMLとCSSは、Webサイトを構築するうえで必須技術です。

まず、HTMLですが「タグ」と呼ばれる決められた記号で、Webサイトに表示されるテキスト情報に指定(マークアップ)する言語です。このマークアップにより、Web上ではただのテキストが、見出しや本文、リスト情報と識別され、検索サイト等で識別されます。

●マークアップ
<h1>タイトル</h1>

HTML&CSSの入門書としてご紹介するのが、「いちばんよくわかるHTML5&CSS3デザインきちんと入門(狩野祐東|著)」です。Web上の仕組みや、サイト構築のファイルの扱いから、スマートフォンに対応したレスポンシブ・デザインの構築方法まで紹介した良書です。

いちばんよくわかるHTML5&CSS3デザインきちんと入門|SBクリエイティブ

次にCSSは、HTMLでしっかり構築したサイトを元に、見た目のレイアウトやデザイン(文字の色や書体、大きさや装飾など)を設定する技術です。
このHTMLとCSSの記述にエラーがないか確認する方法として、下記のサイトでチェックが可能です。

・HTMLの文法をチェック(バリデート)
The W3C Markup Validation Service

・CSSの文法チェック(バリデート)
The W3C CSS Validation Service – Jigsaw

今ではこの二つの技術を主に、Webサイトの構築が行われます。

この二つの技術を使いことで、静的なWebサイトなら構築することは可能ですが、写真をスライドさせたり、クリックしたあと何かの動的な動きを演出的に施す際は、JavaScriptの技術が必要になります。
印刷物などと違い、Webサイトでは画像はもちろん、動画も表示する事が可能です。また、閲覧者の環境に合わせ形や大きさを変えることも可能です。そのような状況にインタラクティブな効果を実現するためにJavaScriptなどのプログラムが必要になります。

JavaScriptプログラムの入門書として評価の高いのが「確かな力が身につくJavaScript「超」入門 第2版(狩野祐東|著)」です。私のようなプログラムを書けないWebデザイナーでも、プログラムの基礎から入ることのできる良書です。

確かな力が身につくJavaScript「超」入門 第2版|SBクリエイティブ

今では、HTMLやCSSを分からなくてもWebサイトが更新できるCMS(コンテンツ・マネジメント・システム)などのシステムが多く普及していますが、その基本になる技術であるHTMLやCSS、JavaScriptの技術を知ることは、管理しているWebサイトの状況を理解する上で必要最低限の知識だと思います。
このような技術をブラックボックスのままではなく、身近な道具として活用してください。

この記事を書いた人

與世山廷
この著者の最近の記事
  • このエントリーをはてなブックマークに追加
  • follow us in feedly

何でもお気軽にお問い合せください。

お問い合せはこちら