Webページの作り方入門
インターネットとWebの違いは？
日頃よく聞く言葉である、「インターネット」と「Web」ですが、「インターネット」=「Web」でとらえている方も多いかと思います。簡単に説明すると「インターネット」とは、コンピュータ同士を繋げて、ありとあらゆる情報のやり取りをする仕組みのことです。「Web」とはインターネットの中にWebが含まれる機能で、インターネットにはWeb以外にもメールやファイル転送など様々な機能があります。今見ているこのWenページもWeb上のものです。
Webページの作り方
Webページの作り方の手段
Webページの作り方には、もちろん自分でWebページの作成ソフトで作成する方法やテキストエディタで作成する方法がありますが、自分で作成するのが苦手、勉強してみても自分には無理だと思う方には、Webページ作成業者に依頼して作成してもらうことも可能です。
Webページ作成のための準備
Webページを作成する前の最低限の準備として、ブラウザとテキストエディタの準備が必要です。ブラウザは「Internet Explorer」、「Microsoft Edge」、「Google Chrome」などたくさんありますが、おすすめは「Google Chrome」です。同様にテキストエディタも「メモ帳」、「TeraPad」、「サクラエディタ」などたくさんありますが、今回は、最初から使うことが出来るメモ帳を使って紹介します。この2つの準備が完了したら、各種ファイルを保存しておくためのフォルダを作成します。フォルダを作成する場所は任意で大丈夫です。
また、Webページを作る際には拡張子が非常に重要です。拡張子とはファイル名末尾の 「.txt」 や 「.html」 などの文字のことです。下記の手順で拡張子を表示するモードに変更しておくことを強く推奨します。
・エクスプローラの [表示]→[ファイル名拡張子] のチェックボックスを ON にする。
テキストエディタでHTMLを書く
それではテキストエディタでHTMLを書いていきましょう。HTMLとはマークアップ言語と呼ばれ、この言語で書いた内容がWebページに反映されます。「メモ帳」を起動して下記の文章を入力してみてください。
【各タグの役割】
・「html」...HTML文書であることを示すタグで、DOCTYPE宣言後の最初に「html」、最後に「/html」と記述します。内部には「head」「/head」と「body」「/body」がひとつずつ入ります。
・「head」...文書全体の基本的な情報を定義するタグです。以下の「title」のタグはこの中に入ります。
・「title」...ブラウザのタブ内表記や、ブックマークされた際に表示されるサイトのタイトルを入力します。
・「body」...コンテンツの中身を書く部分になります。以前は、サイト全体の文字の大きさや色・背景などをこのタグ内で指定していましたが、HTML5ではそれらの属性は廃止されスタイルシートを使用することになっています。
入力が完了したら、メモ帳のメニューから [ファイル]→[上書き保存] で入力した内容をファイルに保存してください。
保存をする際のファイル名に注意点がいくつかありますので下記を参照してください。
・半角英数字と一部の記号文字のみを用いてください。
・スペース文字を含んだファイル名は使用しないでください。
・拡張子(ファイル名の最後のドット(.)から後ろの部分)は通常 .html としてください。
ブラウザで開いてみる
作成したファイル(今回の例ではEx.html)を実際にブラウザで開いてみます。
エクスプローラーから「 Ex.html」 ファイルをダブルクリックしてください。ブラウザが起動し、「Webページの作り方入門」と表示されれば成功です。仮に修正をしたいとなった場合は「body」に入力した「Webページの作り方入門」の内容を修正して「上書き保存」をしてください。
Webサイトのデザインについては「CSS」という言語を使いますが今回は入門的なのため、紹介はしませんので、気になった方は調べてみてください。「CSS」では、文字の色を変えたり、線を引いたり、余白の大きさを調整したりすることができます。
Webサイトを公開するには？
作成したWebサイトを公開したいとなった場合は、以下の手順で公開することが出来ます。
①「サーバーの用意」
作成したWebページを公開するには、サーバーを用意する必要があります。サーバーは自作もできますが、業者からレンタルした方が簡単です。
②「ドメインの取得」
よく見る「.com」や「.jp」というもので、ドメイン管理業者を通して、自分の好きなドメインを取得することができます。
③「サーバーにWebページ情報をアップロード」
ファイル転送ソフト（＝FTPソフト）というものを使えば、自分のパソコンからサーバーに簡単にデータをアップロードすることができます。ファイル転送ソフトを使い、作成したHTML文書のWebページ情報をサーバーにアップロードします。
まとめ
今回はWebページの作り方の入門的な内容を紹介しました。実際に凝ったデザインやWebページの公開をしようとなると少し手順が複雑になるので、作りたいWebページのイメージが固まっている方は調べてみてください。