ドットインストールにて、プログラミング言語の学習を始めたので、自分の忘備録とプログラミングの初心者に向けて記事を書きたいと思います。
HTML5はウェブサイトを作成する際に必要となるプログラミング言語となっていて、初心者にとって勉強しやすく、理解のしやすい言語です。
WordPressのPHPファイルを操作するときにも、HTMLの知識があればカスタマイズする時に便利なので、覚えておくと大体どこに何があるのかが分かるようになると思います。
本記事では、プログラミング言語の初歩を学んだ記述方法等をまとめます。
プログラミング言語のHTML5とは
HTML5の役割はHTMLファイルの中に書かれているテキストがどのような役割を持っているのかを、タグというものをつけて示したテキストファイルです。
実際にあなたのブログがあればトップページのなにもない背景の部分で右クリックをして、ソースコードを表示という項目をクリックすると、呪文のような文字列が出てくると思います。
そのコードが全てHTML5というわけではなく、多言語のCSSをなども含まれているのですが、土台となっている部分はHTMLで作成されています。
このようなウェブページを構築する土台となる言語がHTML5になります。
HTML5の主な記述方法
HTMLの主な記述方法について、紹介していきます。
まだまだ技術が身についていないので、基礎的な部分の紹介のみとなってしまいますが、HTMLを勉強する気がない人でも、なんとなくWordPressの運営する中で役立てる事が出来ると思います。
HTMLの全体構造の書き方
HTMLの全体構造として、このような構造の中にコードを書いていくものになります。
<!DOCTYPE html>
<html lang="ja">
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
タグの書き方
タグは基本的に開始タグと終了タグで挟む感じに記述します。
<title>こんにちは、セイタです！</title>
こんな感じに挟んで書くことで、作成しているWebページのタイトルは『こんにちは、セイタです！』になります。
他に通常のテキストを入力する場合は、<p>というタグを使用します。
<p>プログラミング言語を勉強中</p>
このように記載することで、タイトルと通常のテキストで役割を分ける事が出来ます。
属性の書き方
タグには属性と言われるあだ名のような割当をすることが出来ます。
<h1 class="text">
このように属性を設定することで、後々まとめて属性効果を与えることが可能です。
属性の主な名称
- 属性：class="text"
- 属性名：class
- 属性値：text
コメントの書き方
HTMLファイルの中にメモ書きとして残しておけるようにコメント記述というものがあります。
<!--コメントコメントコメント-->
このコメントを残しておくことによって、ここからどんな処理が行われているという目印をつけることが出来ます。
しかし、このコメント記述は、先ほどウェブサイトのトップページでソースコードを表示してもらいましたが、あのソースコードの中にコメントも表示されてしまいます。
そのため、外部の人間に見られては行けない文章やコメントなんかは記述しないほうがよいでしょう。
HTMLは何か作って技術を上げるほうが良さそう
ドットインストールにて、HTML・CSS・PHPの基礎を勉強したのですが、こうやって書き出してみると時折手が止まってしまいますね。
基礎学習をしているときは動画を見ながら記述していたので、大まかなコードが何を示しているのかは理解していても、自分で記述できないという状況です。
おそらくこれは実践を積んでいかないと上達しないものだと思うので、これから更新していく記事はあえて残して、リアルな学習記にしていけたらと思います。
また、学習内容以外に関しても面白いコンテンツを作れそうであれば、今後プログラミングカテゴリーで発信していこうと思いますので、参考になる記事があれば見ていただけると幸いです。
＼ 日頃参考にしているHTML/CSS書籍 ／
