プログラミング

Webサイトの構成

更新日:

 

こんにちは、Nanayakuです。

今回は、Webサイトはどのように構成されているのか解説していきます。

 

Webサイトは何で構成されているのか

Webサイト(ユーザーが操作するページ、ブログやニュースサイトなど)は、「構成」「見た目」「動き」の3つの要素から成り立っています。

 

HTML

HTMLはマークアップ言語で、ホームページの文章に意味や役割を付ける事が出来ます。

Webサイトの「構成」を担当しています。

また、HTMLは目が不自由な人にも分かるよう開発されたもので、何を伝えたいかちゃんと考えた上で構成しなければなりません。

↓HTMLについて非常に丁寧に説明してあるので是非参考にしてみて下さい。

【HTML入門】#01. HTMLの基本を学ぼう!

↓左がユーザーから見た状態で、右がHTMLの状態です。

メモ

大見出し

見出し

○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○。

○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○大事な部分○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○

 <h1>大見出し</h1>

<h2>見出し</h2>

<p>○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○。</p>

<p>○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○

<strong>大事な部分</strong>

○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○</p>

 

CSS

CSSはHTMLと同じマークアップ言語です。

CSSの役割は、文字を装飾(色や大きさの変更)など、「見た目」を担当しています。

他にもレイアウト(配置・配列)も変更できます。

 

JavaScript

JavaScriptとは、スクリプト言語に分類されるプログラミング言語です。

HTMLとCSS(マークアップ言語)は厳密には、プログラミング言語ではないので注意しましょう。

JavaScriptは、「動き」を担当しています。

例えば、広告や見出しにアニメーションをつけたり、スクロールしたら画面が変わるなどです。

JavaScriptはユーザーが使い易いようにと使用されているため、必ず使わなければならないものではありません。

HTML・CSSを土台にして、JavaScriptは役割をはたせるため、HTML・CSSをちゃんと理解しておく必要があります。

JavaScriptとは?初心者向けに概要や使い方をわかりやすく解説

専門知識いらず!スクリプト言語とは?言語の種類やオススメを解説

 

まとめ

HTML・・・Webサイトの枠組みの役割

CSS・・・Webサイトの装飾(レイアウト)の役割

JavaScript・・・Webサイトに動きをつける役割

 

最後に

備忘録がわりに作ったので、間違っている所とかあったら、コメントくれると嬉しいです。

-プログラミング
-

Copyright© Nanayaku blog , 2019 All Rights Reserved Powered by AFFINGER5.