【プログラミング入門】HTML&CSSとは？
こんにちは。ダイスケです。
本日は僕がプログラミングを始めるにあたって、
最初に勉強を始めたHTMLとCSSという言語について書いていきます。
シンプルな言語なので、興味のある方はぜひ見てみてください。
本日の内容
本日のゴール
"HTMLとCSSの基本が理解できる" です。
最後まで読んでいただけたら、HTMLとCSSはどういうものか、
それを使って何が出来るのかが理解できます。
一緒に進めていきましょう！
「HTML」と「CSS」はどんなものか？
「HTML」は「hyper text markup language」の略語で、
ウェブサイトの見た目の骨格を組み立てる言語です。
例えば、ここは見出しを置く場所ね！
ここは画像を置く場所ね！
と太字の様になにでウェブサイトを構成するか印づけるイメージです。
「CSS」は「Cascading style sheet」の略語で、
ウェブサイトに書かれた文字などを装飾する言語です。
例えば、ここの文字は赤色に指定する。
ここの文字にはアンダーラインを引く。
と、文字の色やアンダーラインなどの見た目の施しを指定するイメージです。
どんなものが作れるのか？
HTML&CSSを使うと、静的なウェブサイトを作ることができます。
静的とは、このブログサイトのように文字や画像が載っている、
動きのないサイトのことです。
このサイトは僕が作成したサイトです。
HTMLとCSSのみですが、シンプルでモダンなサイトが作れます。
言語の使い方
この言語はエディターというアプリを使って使用します。
僕が使っているエディターはAtomというアプリです。
※Atomのダウンロード、操作方法などは別の記事で取り上げています。
よろしければ参考にしてください。↓
エディターを開いたら、下のような画面が出てきます。
まず初めに、ファイル(サイト)を作成・保存します。
①左上のファイル→新規ファイルをクリック。
②次に新規ファイルを開いたら、左上のファイル→別名で保存をクリックして、
名前を付けて好きな場所に保存しましょう。
(ドキュメントに保存した方が管理しやすいです。)
これでコードを書く準備ができました。
ここにHTML&CSSで決められたコードを書くことで、
サイトを構成することができます。
本日はHTML&CSSの基本の説明だけなので、
次回からHTML&CSSのコードの書き方を書いていきます。
少しずつ知識を増やして一緒に歩んでいきましょう！
終わりに
ここまで読んでいただけたら、HTML&CSSはどんなものか、
何が出来る言語かなどの基本が理解できたと思います。
実際に使うには言語知識が必要ですが、
僕が初めての方でも分かりやすいように記事にまとめていきたいと思ってます。
気軽に参考に見てください。
最後までご購読ありがとうございました！
