HTMLとCSSってご存じでしょうか?
簡単にご説明してしまうと、“ウェブサイトを形作っている文字の集まり”です!
「それがわからんからこの記事読んでんだけど」と思っているでしょうから、ここからかみ砕いて解説していきます。
この記事をご覧くださったすべての人にとって有益な情報となりますように。
HTMLとは
HTMLとは「HyperText Markup Language」の略です。
読み方は「ハイパーテキスト マークアップ ランゲージ」です。
日本語にするならば、“ハイパーリンクを埋め込んだテキストの意味を定義する言語”というところです。
ハイパーリンクとは、別のところにあるファイルや位置を参照するものです。単純に「リンク」と呼ばれることのほうが多いでしょう。
ハッカーとかの映画で見たことありますか?
厳密には違うのですがイメージそんな感じです。
“意味を定義する”の部分ですが、HTMLにはそれぞれ固有の意味を持った「タグ」と呼ばれるものがあらかじめ用意されています。
今回書き方は割愛しますが、
例えば、タイトルタグというもので定義をすると、そのウェブサイトのタイトルを指定することができます。
<title>Marketing-life</title>
このようにそれぞれの構成要素の役割を定義していきます。
その定義された文字を読み取って、適正に表示するものがsafariやchromeといったブラウザになります。
CSSとは
CSSとは「Cascading Style Sheets」の略です。
読み方は「カスケーディング スタイル シート」です。
日本語にすると“階段上に連続する滝の様式のシート”です。
ちょっと意味わからないですよね。Sheetsの和訳もちょうどいいのが見つからなかったですし笑
意味合い的には、「HTMLで記述している文章の構造にスタイル=デザインを加える」ということです。
HTMLで定義している要素の見栄えを整える言語だと認識ください。
実はHTMLだけを記述していくと、“意味を持った要素”が上から順番に並んでいくだけになります。
こんな感じです。
これを普段皆さんが見ているウェブサイトのように、オシャレに見やすくしていくものがCSSです。
マークアップ言語とは
HTMLとCSSは「マークアップ言語」と呼ばれます。
前述の“文章に意味を定義してそれの見た目を装飾していく”作業をマークアップと呼び、それを行うこの2つのをマークアップ言語と呼びます。
「ここ文章はサイトのタイトルだよー」
「この文章は見出しだよー」
「この文章は○○のサイトにリンクするんだよー」
といったように意味を定義していってあげます。
まとめ
今回はここまで。
超基本のことなのでご存じの方も多かったと思いますが、最後までお読みくださりありがとうございます!
感想。CSSのカスケードって無理やりに感じますね。