上毛印刷株式会社

WEBサイト制作においての基本

WEBサイト制作においての基本

2022年06月01日
WEBサイト制作
  • #HTML
  • #css
  • #JavaScript

はじめまして!
上毛印刷コンテンツ事業部のソーヤと言います!

WEB制作についてブログ形式で色々なことを投稿していこうと思います!
よろしくお願いします!!

さて第1回目のブログの内容ですが、WEBサイト制作未経験の方に向けたコーダーになるための「WEBサイト制作においての基本」を書いていこうと思います!

コーダーとは

WEBサイトを作る際の下記のような主な流れがあります。

①企画・要件定義

②サイト設計・スケジューリング

③デザイン制作

④コーディング

⑤検証・確認

⑥リリース

④の「コーディング」という工程を担当するのがコーダーです。
では、コーディングってなに?と思われるかもしれません。
コーディングとは、デザイナーが作成したデザインを元に実際にWEBサイトを構築していく業務です。
かっこいいデザインだけではWEBサイトはできません。
コーディングをして、皆さんに実際に使っていただけるWEBサイトを構築する必要があります。

コーダーって具体的に何してるの?

atomエディタ

皆さんはこんな画面見たことありますか?
コーダーは仕事をしている間のほとんどをこの黒い画面を見て過ごします。
これはエディタと呼ばれるソフトで、HTML(マークアップ言語)やCSS(スタイルシート言語)やJavaScript(プログラミング言語)を書くためツールです。
このエディタ上で、主にHTMLCSSJavaScriptを日夜四苦八苦しながら書いて過ごしています。
つまり、
コーダーはHTMLCSSJavaScriptを組み合わせてWEBサイトを構築しています。

HTML・CSS・JavaScriptって何?

HTMLは人間の体で例えると、骨格や内臓です。
皆さんが見ているこのブログの文章もHTMLで記述して表示されています。
要は、WEBサイトに掲載されている全てのコンテンツがHTMLであるということですね。

CSSは人間で例えると、服やお化粧など身だしなみ全般です。

イラスト屋画像

HTMLだけだと、見るに堪えないページになってしまいます。
ですので、CSSで身だしなみを整えてあげる必要があります。
実際にHTML単体のページとHTMLとCSSが合わさったページを比較してみましょう。

イラスト屋画像

どうですか?
ページが見やすくなったと思いませんか?
CSSはページを見てもらうユーザーにとって、魅力的で見やすいように整えるためのものだということです。

さて、最後はJavaScriptです。
JavaScriptはですね、簡単にいうと魔法です。

イラスト屋画像

JavaScript(魔法)を使うと曜日ごとに自動的にジャケットの色を変えることができます。
オシャレが楽になりますね!

ちなみにですが、あなたが今記事をみている日の曜日を当ててみましょう。
ズバリ今日は曜日です!!

あ・・・別に毎日ページを更新しているわけではないですよ。
JavaScriptを使って今日の曜日を取得して、表示させています。
JavaScriptを使うとわざわざ手作業しなくても、作業を自動化できるんです。

まあ、極論を言えばJavaScriptを使わなくてもWEBサイトの作成自体は可能ですが、
今後この記事をご覧になっているあなたが、将来コーディング業務をしたいと考えていましたら、
JavaScriptは必須のスキルになるので、
この記事では、ざっくり魔法が使えるんだくらいに理解をしておいてください。

まとめ

WEBサイト制作未経験の方に向けたコーダーになるための「WEBサイト制作においての基本」の概要を解説しました。
まとめるとWEBサイトを構築するにはHTML・CSS・JavaScriptを使う必要があるということですね!

次回はHTMLについて詳しく解説していきたいと思います。
今後とも本ブログをよろしくお願いします!!


WEB制作担当ソーヤ

ソーヤ

上毛印刷WEB制作担当
前職は東証プライム企業の本社WEB受託チームにてフロントエンドエンジニアを3年経験。


この記事に対するご意見・ご感想・ご質問等ありましたら、
ぜひ下記フォームにてお送りください。

    お名前必須
    メールアドレス必須
    お問い合わせ内容必須
    PAGE TOP