プログラミングをやろうと決めたらまずはこれ！｜「HTMLとCSSについて」 - ℙ𝕚𝕜𝕠𝔹𝕝𝕠𝕘

みなさんこんにちは！

今日は

「これからプログラミングをやってみようとしている方」

「プログラミングに興味をお持ちの方」

「プログラミングに将来性を感じている方」

「プログラミングを習得して

ロボットやAIとともに活躍を狙う方」

これらを目的としていて

だがしかし、

「どこから手をつけたらいいか分からない」

「難しい事は置いといてとりあえずつくりたい」

「とりあえずプログラミングをしてみたい」

「そもそもプログラミングって？？？」

そんな方へ向け

【基礎・基本について】

これを他の人にはない

「分かりやすく、僕なりの表現でお伝えする」

そんな内容でお送りします！

では早速

◎基礎その１

【HTMLとCSSについて】お話したいと思います。

まず始めに

「 HTML」とは

・ウェブサイトに表示される情報を記載するもの。

これはこのブログなどを始め、

インターネット上で目にしているものは全てです。

HTMLはウェブサイドの基本、ベースになります。

続いて、、

「CSS」とは

・HTMLをオシャレにデザインすることを言います。

HTMLという情報だけだと、

文字や画像、リンク先などがただただ並べてあるだけ。

これでは読みづらくて分かりにくいですね。

そこでこの「CSS」というオシャレなものを使い、

・強調したいところに色づけ

・文字の種類変更

・画像のリサイズ、並べ替え

・その他いろいろ。。。

こんな事をすることができる！

それが「CSS」です。

これを踏まえた上で、

HTMLについてもう少し詳しく書いてみます。

【HTML】

今目にしているブログの中身を記号化したもの。

「コード」というのですが、

決められたルールに沿ってつくられています。

たとえば代表的なものを２つあげます。

①【目に見えない情報】

これはhead要素と言います。

左側が「開始タグ」と呼び

右側が「閉じタグ」などと呼びます。

このふたつのタグの中に

関連する内容、中身を入れていきます。

このhead要素は、

ウェブサイトの情報をいれる部分です。

ポイントは、

「ここに入れた情報は表示されない事」です。

なので

コードを読み書きするプログラマーは見ます。

しかし

閲覧する方は見る事はありません。

この、上で紹介した〈　〉で囲まれたものを

「タグ」

と言います。

この＜タグ＞というものを使い、

ウェブサイトに表示させたい情報を書いていきます。

②【目に見える情報】

これはbody要素と言います。

画面上（今みているページ）に

視覚的な情報を入れることができます。

この中に数々の手法を用いて、

・動く

・色がつく

・画像が飛び出す

・動画が流れる

といった大きなひとつの

ウェブサイドができあがっています。

大きく分け、

①ウェブサイトに関する「目に見えない情報」

＜head＞要素

②ウェブサイド上に表示させる「目に見える情報」

＜body＞要素

この２つで

HTMLは作られています。

基本的なつくり方は、

【タグの中に関係する内容を書いていくだけ！】

<タグ>　内容を書くところ　</タグ>　

という具合に書きます。

これをイメージしやすくするには、

【タグ　　＝　　積み木】

としてください。

基本はこの「タグ」という名の「積み木」が

上から順に重なって

ひとつのウェブサイドができています。

以上、今回はHTMLとCSSについてでした！

ありがとうございます。