23.トップページの内容を書き変える
ヤミー「今回は、前回作ったトップページ index.html の内容を少しだけ書き変えます」
サイトウ君「はーい」
ヤミー「前回のファイルをEmEditorで開いてください」
サイトウ君「どうやって？」
ヤミー「頑張って」
サイトウ君「突然闇に放り出された僕ら。僕はもう、死ぬしかないのか……」
ヤミー「分かったよもう。開き方は色々あるけど、うーん、検索窓にEmEditorと書いて。そしたらEmEditorが見つかるから、それをクリックしてEmEditorを起動してくれ」
サイトウ君「起動しました」
ヤミー「オッケー、じゃあここの「閉じる」を選択して、謎のやつを閉じてくれ」
サイトウ君「閉じました」
ヤミー「オッケー、じゃあ上部メニューの「ファイル」→「開く」を選んでくれ」
ヤミー「どのファイルを開きたいかを選択できるので、Cドライブの中のhtmlフォルダの中のindex.htmlファイルを選択してくれ。まず、左メニューの「Windows(C:)」を選べば、Cドライブを選べる。そして、htmlフォルダを選ぶんだ」
ヤミー「htmlフォルダの中に入ったら、index.htmlファイルがあるはずだから、それをダブルクリックしてくれ」
ヤミー「index.htmlファイルがEmEditorで開けます」
サイトウ君「文字に色がついてる」
ヤミー「そうです。htmlファイルをEmEditorで開くと、分かりやすいように文字に色を付けてくれます」
ヤミー「そして、初心者はむしろ文字に色がつくのに拒否反応を起こすのも知っている」
ヤミー「でも我慢して色つきのテキストエディタを使ってくれ。だんだん慣れてくるから。むしろプロなら文字に色がつくテキストエディタを使うのは当たり前だぞ」
ヤミー「あと、素人考えで「文字に色がつく分、ファイルの容量が重くなるのでは……」みたいなことを考える人もいますが、べつに容量も重くならないよ」
ヤミー「titleタグの中の「こんにちは」を「トップページ」に変えよう。mainタグの中の「元気かな」も「ここはトップページです」に変えよう。つまり、最終的にこうなる」
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>トップページ</title>
</head>
<body>
<main>
ここはトップページです
</main>
</body>
</html>
ヤミー「変更し終わったら、上メニューから「ファイル」→「上書き保存」を選んで上書き保存します」
ヤミー「上書き保存が終わったら、もうEmEditorは閉じていいよ」
ヤミー「よし、これでもう完璧にトップページが出来たな」
サイトウ君「めちゃくちゃズルをした気分」
ヤミー「いや、htmlファイルってゼロから作ることはむしろ少なくて、今あるhtmlファイルをコピペして、必要な部分だけ書き変えるのは、結構普通だよ」
サイトウ君「そうなの！？」
ヤミー「そうだよ」
ヤミー「というわけで次回、24.index.htmlファイルをレンタルサーバーにアップロードする」