ホームページとブログの教室、第4回は、Chromeブラウザを選んで開くことと、リンクタグの復習です。
ダウンロードした圧縮ファイル『ZIP』の展開も学びます。
配布資料

ブラウザとは
ブラウザとは、インターネット上のウェブサイト(ホームページ)を見るためのアプリ(アプリケーションソフトウェア)です。
ブラウザには様々な種類があります。
パソコンの初期状態では以下のブラウザが入っています。
- IE(インターネット・エクスプローラー):Windows8.1以前
- Edge(エッジ):Windows10より
- Safari(サファリ):Mac
その他に、Google Chromeや、FireFoxなどがあり、もともと入っていないブラウザはインストールして使います。
※当『ホームページとブログの教室』では基本『Google Chrome』を使いますので、ない方はインストールしてください。
既定のブラウザ
htmlファイルをダブルクリックして、自動的に開くのが既定のブラウザです。
初期状態でウィンドウズの方はIEかEdgeになっています。
既定のブラウザが何になっているかは、htmlファイルのアイコンの画像を見ればわかります。
↑既定のブラウザが『IE』になっている場合
↑既定のブラウザが『Chrome』になっている場合
既定のブラウザの変更
よく使うブラウザを『既定のブラウザ』にして置くと便利ですが、場合によっては、既定じゃないブラウザで開きたい場合もあります。
(たとえば、ある銀行はIEでないとログインすることができません)
その場合は、アイコンを右クリックして

『プログラムから開く』から選択すればOKです。
ファイルの解凍と確認
20170516サンプルファイルの中身を確認します。
ダブルクリックして、『すべて展開』をクリックし展開します。

※ダブルクリックするだけで、中身は見えますが、展開(解凍)されていないので、さまざまな操作をすることができません。

hello.html
base.txt
/img
それぞれのファイルをダブルクリックして、確認してください。
『index.html』をブラウザで開く
『img』フォルダの中の画像が表示されています。
HTMLの基本(ベース)
base.txtの中はこのようになっています
<html lang=”ja”>
<head>
<meta charset=”UTF-8″>
<title>タブのタイトル</title>
</head>
<body>
(ここに内容を書きます)
</body>
</html>
各タグの意味
<!DOCTYPE html> :html5の形式で書くよという宣言
<html lang=”ja”> :言語の宣言 ja は日本語
<head> :ヘッダー、表には表示されない設定
<meta charset=”UTF-8″>:文字コード設定、原則UTF-8
<title>(タイトル)</title> :ブラウザタブに表示されるタイトル
</head> :ヘッダーがここで終わる、終了タグ
<body> :ボディ、ページの本文がここから始まる
</body> :ボディがここで終わる終了タグ
</html> :htmlの終わり、一番最後に必ずつく
実践ワーク
ファイルのコピー
hpフォルダに
base.txtと
imgフォルダをコピーします
index.htmlの入れ替え
base.txtをメモ帳で開き『index.html』と名前を付けて保存
上書き確認。
ファイルを開く
『index.html』をダブルクリックして、ブラウザで開いてみます。
『index.html』をメモ帳でも開いてみます
※base.txtは書き換えないように注意!
BODY内の編集
表に表示される部分は
<body></body>
に挟まれた部分です。
現在の『index.html』は、(ここに内容を書きます)と書かれています。
この部分を書き換えます。
リンクタグを記入してみる
前回書いたリンクタグを(ここに内容を書きます)の部分に書き加えてみましょう。
<a href=”https://www.yahoo.co.jp/” target=”_blank”>ヤフー</a>
リンクがちゃんと作動するか確認します。
Google Chromeで開いてみましょう。
まとめ
- 既定のブラウザと、Chromeで開く開き方を知る
- 『ZIP』ファイルを展開する
- base.txt(ベースのテキストファイル)から、index.htmlを作る
- BODYの中にリンクタグを記入することを知る