このウェブサイトはご利用の端末での閲覧に対応していません。
This website does not support your device.

ウェブサイトの“書き方”(1)~メモ帳でウェブサイトを作る

記事May 30th,2015
Feb.22nd,2021
メモ帳を使って簡単なウェブサイトを作る方法を紹介していきます。“HTML”とは何か?

実は意外と簡単な“ホームページ”づくり

ホームページ作成ソフトは安いものでも数千円、高価なものだと1万円を超えるものもあります。これは「趣味でちょっとホームページを作りたいだけなのに...」という人には少しハードルが高いはずです。

しかし、“書き方”さえ知ればホームページを作るのに高価なホームページ作成ソフトを買う必要はありません。Microsoft Windowsに標準で付属している『メモ帳』を使えば高価なソフトがなくても簡単にホームページを作ることができます。

今ではブログなどもあって誰でもワープロ感覚で簡単にホームページを作っていくことができますが、コードの書き方を知っていて損はしません。コードを書くことができれば自由度が格段に高まりますし、もし本格的なホームページを作ろうとエディタソフトを使うようになっても基本的にはやることは変わらないからです。

ちなみにこのウェブサイトも今はHTML用のエディタで編集していますが、もとはメモ帳で作成しました。

ここでは『メモ帳』を使った基礎的なホームページの作り方を紹介していきます。

“ホームページ”?“ウェブページ”?“ウェブサイト”?

「ウェブサイト」、「ホームページ」、「ウェブページ」、よくほぼ同じ意味で使われているこの3つの言葉ですが、正確には意味合いが少し違います。

“ウェブサイト”
インターネット上に公開されている文書、一般に“ページ”と呼ばれるものの集まりのことです。
例えるなら、インターネット上にある一冊の本のようなものです。
“ウェブページ”
インターネット上に公開されている“ページ”のことで、通常は複数集まって“ウェブサイト”を形成します。
例えるなら、“ウェブサイト”という一冊の本の中の一枚ずつのページのことです。
“ホームページ”
本来はブラウザを起動したときに最初に表示される“ウェブページ”のことで、そこから派生してウェブサイトの中で一番最初に閲覧されることを意図した“ページ”のことも指すようになりました。よく“トップページ”や“メニュー”と呼ばれます。
例えるなら、“ウェブサイト”という一冊の本の中の表紙のことです。

“ウェブページ”、それと“ホームページ”が“リンク”でつながれることで“ウェブサイト”となります。

ウェブサイトを形づくる“HTML”

ほとんどのウェブページは“HTML”というコンピューター言語に書かれた“HTML文書”です。ということは“HTML”が書ければウェブサイトを作ることができるということになります。

“HTML”とは“Hyper-Text Markup Language”の略で、どういう意味なのかというと、

“Hyper-Text(ハイパーテキスト)”
“テキストを超えたテキスト”という意味です。
“Markup(マークアップ)”
見出しなどの文章の構造や、文字の大きさや色などの修飾情報、リンクなどの機能を文章中に記述していくことです。
“Language(ランゲージ)”
マークアップするためのルールや文法のことです。

“テキストを超えたテキスト”となる所以は“ハイパーリンク”です。一般には単に“リンク”と呼ばれるハイパーリンクは複数のHTML文書を結び付けたり、HTML文書にほかのデータ、例えば画像、動画、音声を埋め込むことができます。

HTML文書を“書く”ということは文書を人間だけでなくコンピュータにも理解できるように目印をつけることです。HTML文書に、役割が決められている"HTMLタグ"を使用して目印をつけることで、この部分が見出しで、この部分に画像を載せる、ここから他のウェブページにリンクする、などとどのようにウェブページを表示すればいいのかを示すことができます。

例えば以下のようなウェブページがあるとします。

ウェブページの例

このウェブページの“ソースコード”、つまりそのままのHTMLを見てみると以下のようなHTMLでできています。

HTMLのソースコード

コンピューター言語というと難しく思えますが、基本さえ覚えればHTMLはとても簡単です。凝ったウェブサイトを作るとなると複雑なHTMLを書かなければなりませんが、簡単なウェブページであれば複雑なHTMLを書かなくても十分ウェブページを作ることはできます。

“メモ帳”とは?

メモ帳(Notepad)”はWindows 1.0から最新版のWindows 10まですべてのバージョンのMicrosoft Windowsに付属している簡単なテキストの編集に使用することができるテキストエディタです。

Windows 10ではスタートメニューの『Windows アクセサリ』のフォルダに入っているのを見つけるか、タスクバーにある検索欄に『メモ帳』と入力すれば開くことができます。

スタートメニューから見つけた『メモ帳』
検索欄に『メモ帳』と入力

この“メモ帳”はウェブサイトを形づくるHTML文書の作成にも使用することもできます。

一番上へ
トップにもどる
シェアする
シェアする
Facebookでシェアする
ツイート
Google+でシェア
Pocket
はてなブックマーク