Web(2)アドレスについて、リンクの張り方

前回の確認(画像のはりつけ方)

アドレスについて

基本的には自分のトップページに作成されたファイル名を追加して閲覧する。
例えばpublic_htmlフォルダ内でhoge.htmlというファイルを作成した場合、 ブラウザで確認する場合
http://roy/~自分のID/hoge.html
となる。ただしindex.htmlだけは特別で、 ブラウザのアドレスバー入力時ファイル名を省略することができる。

ちなみに public_html 内で新規フォルダを作成し、その中にファイルを作成し たときのアドレスは、
自分のトップページ/作成したフォルダ名/ファイル名
となる。
public_html 内にabcというフォルダを作成し、そこにaiueo.htmlというファイルを作成した場合アドレスは
http://roy/~自分のID/abc/aiueo.html
となる。(index.html の場合は省略できる)

リンクを張る

マニュアル ハイパーリンクを張りめぐらそう

他のWebページのアドレスをテキストに入力し、 クリックで移動できるようにすることを「リンクを張る」という。 (「貼る」ではない)

試しに東北公益文科大学とgoogleのWebページリンクを張ってみる。 index.htmlに赤文字部分を追加する。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>Koeki Taro's Home Page</title>
</head>

<body>
<h1>公益太郎のページ</h1>
<p>
<img src="anonon.png" alt="あののんイラスト" width="300" height="283">
</p>
<p>
公益太郎の部屋へようこそ
</p>
<p>
今日の一言<br>
ラーメン食べそびれた
</p>
<h2>リンク</h2>
<p>
<a href="https://www.koeki-u.ac.jp/">東北公益文科大学</a><br>
<a href="https://www.google.co.jp/">Google</a><br>
</p>
</body>
</html>

例では改行タグ<br>をつけているがつけないと横に並ぶ。 改行タグはつけてもつけなくてもどちらでも良い。 .

ブログ開始

本日からブログを開始し、第13回の授業までに完成させる。 ファイル名はdiary.htmlとする。
ブラウザで確認するときのアドレスは
http://roy/~自分のID/diary.html

h2(見出し2)を使用したブログの例

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>日記</title>

</head>
<body>
<h1>日記</h1>

<h2>3000年6月26日(木)</h2>
<p>
今日は1日授業で大変だった。レポート期限は明日まで。
</p>
<p>
バイト終わったのが22時だったのでそこからレポート作成に励んだ。
</p>

<h2>3000年6月27日(金)</h2>
<p>
授業後サークルのメンバーで集まって今後の予定を計画した。
</p>

</body>
</html>

各自アクセスし確認してみる。.

このベースを使いブログを作成してみる。
ブログは今後 定期的に更新し、14日以上記録する。 過去にさかのぼってもOK。

本日の課題


Back