プログラミング2日目:HTMLでのホームページ作成
プログラミング2日目です。
ソフトを使い始めてプログラミングをやっているなって感じになってきました。
今回はHTMLを使ってホームページを作成していきます。ホームページは、「ホームページビルダー」というソフトを使って作ったぐらいであまり作ったことはないです。
前回の記事はこちらです。
マイルール
-
一日2講座以上やらない
一日に何講座もやると分かった気になるが、実際には頭に入ってないことが多いため。 -
最低でも一週間以内に次の講座をやる
一週間以上あくとやる気が無くなるため。 -
動画学習は基本的に使わない
2時間も集中できない。2時間かかると考えただけでやる気が無くなるため。
最初は、ソフトのインストールからスタート。「Visual Studio Code」というソフトです。今日はこのソフトを使ってプログラミングをしていきます。今回も丁寧にソフトのインストール方法を教えてくれます。前回と違って今回はわからないことだらけなのでとても助かります。
インストールが終わったらソフトの起動。かっこいいですね。さっそくHTMLを作成していきます。保存をしてコードを打ち始めます。指示されたとおりに新規ファイルを保存し、「html:5」と入力していきます。
青い枠が表示されTabキーを押すと
一度にコードが入力されます。テンプレートとして保存されているみたいで、いちいち入力しなくても大丈夫みたいです。
言われたとおりにコードを編集し、google chromeで確認していきます。
しっかりと表示されました。とてもシンプルですが、自分の手で書いたコードがホームページになるのはうれしいですね。
次に練習課題をやります。今回の課題は「<br>」というタグをつかって俳句をホームページに表示させます。
課題もすぐに終わりました。今のところは、わからないところも無くサクサクできるので楽しいです。これも教え方がいいからかもしれません。
最後に発展課題として自分の好きなものを作ります。今回は私の好きな食べ物をHTMLファイルに書いていきます。
覚えた「<br>」を使って作ってみました。やっぱり自分のものを作るのが一番楽しいですね。今回はタグを全く使っていないのでとてもシンプルですが、次はいろいろなタグを使って作るようなので、もう少しキレイなものになるかもしれません。楽しみです。
余談ですが、Windows10のスナップ機能を使うと講座をみながらできるので、とてもやりやすいです。
今回のタイピングはHTML5を選択してみました。
前回よりも記録が落ちてる...。たまたま出来が悪かっただけだと信じたいですね。N予備校のプログラミング講座は章仕立てになっているので、章が終わるごとにタイピングの結果をグラフにしたいと思います。右肩上がりのグラフになっていればいいのですが...。
今日覚えたこと
- HTML:5と入力するとコードが入力される。(事前に名前をつけて保存)
- <html lang=en> を <html lang="ja">に変更
- <title> は ブラウザタブのタイトル、<body>が中の本文
- <br> は 改行