初心者でもできる!HTMLを使ったホームページの作り方

ホームページを作るにはHTMLの習得は必須です。ただし、タグを覚えただけでは、ホームページを作成できるわけではありません。ホームページをインターネット上で閲覧できるようにするには、さまざまな手順を踏む必要があります。作成するWebサイトの規模が大きくなるほど、サイト構造も複雑になり、HTMLのタグ入力作業も手間がかかってきます。今回は、HTMLのタグ入力が楽にできるサービスやソフトの内容を紹介しながら、ホームページの作り方を説明していきましょう。

ホームページのHTMLを作る手段

ホームページのHTMLを作成するもっともシンプルな手段は、手入力でタグを記述する方法です。Windowsに初めからインストールされているメモ帳にタグを入力してデータ名の末尾に「.html」で保存すればHTMLファイルの出来上がりです。

初心者でも、一つひとつ手入力することでタグのスペルや役割などを覚えていけるでしょう。ただ、いきなりメモ帳にタグを入力していくと、ホームページの構造がわからなくなったりタグを閉じ忘れたりなど、ミスが出やすくなります。まずは紙にホームページのレイアウトを書いてから、タグを入力するのがおすすめです。

複数ページに渡るホームページを作る場合は、タグの自動作成サービスを利用してみましょう。無料の自動作成サービスは、テーブルを組んだりリンクを生成したりするなど、部分的にタグを作ってくれます。有料の自動作成サービスになると、ドキュメントタイプ宣言からヘッダ、内などの複雑なタグも簡単に自動生成してくれます。規模の大きいWebサイトはページ数が増えるためファイルの管理も大変です。有料のページ作成ソフトを購入しておけば、階層ごとにファイル管理ができるのでおすすめです。タグの入力補助機能もついているので、本格的にホームページを作るようになったら、ぜひ導入してみましょう。

HTMLファイルを作ってホームページをUPするまでの手順は?

ホームページの作り方の手順は「タグ入力によるHTML文書作成」「HTMLファイルとして保存」「FTPソフトでWebサーバーへアップロードする」の3段階です。まずは、前述した方法でHTML文書を作りましょう。拡張子を「.html」で保存をすれば、HTMLファイルになります。

HTML初心者のなかには、FTPという言葉を初めて聞く人も多いかもしれません。FTPとは「File Transfer Protocol」の略で、日本語に訳すと「ファイル通信の約束事」という意味になります。HTMLファイルをWeb上で閲覧するには、FTPソフトを使ってパソコン内のローカルファイルをWebサーバーにアップロードする必要があります。オープンソースで高機能なFTPソフトがいくつかありますので、使いやすいソフトを利用してみましょう。

FTPはファイル転送時のセキュリティが甘いという問題があるため、より安全性の高い「SFTP」が多く使われています。SCPやSSHなど通信が暗号化されるタイプかどうか、しっかりチェックしましょう。また、ホームページをアップロードするためのWebサーバーは有料での契約が必要です。小規模なWebサイトなら、月額数百円から利用できるレンタルサーバーで十分です。

HTMLタグを覚えればホームページの簡易な修正ができるようになる

HTMLの習得は、イチからホームページを作れるようになることはもちろん、すでに完成しているホームページの修正やアレンジも行えるようになります。会社でいきなりWebサイトの運営を任された場合でも、HTMLを覚えておけば急な変更指示にも対応可能です。

HTMLの知識が無くてもホームページの運営ができるサービスというものも存在します。タグの知識がなくてもページの更新ができるうえに、無料テンプレートを利用すればタグをいじらなくても体裁の整ったWebサイトが完成します。しかし、HTMLの知識があれば、毎日更新するブログ記事内でも正しくタグを打ち込めるようになります。タグの誤った使用は検索順位に影響を与えるため、ページを更新するならHTMLの知識は必要です。テンプレートのアレンジもHTMLに詳しければ、より個性的なデザインにできるでしょう。

ホームページ作成経験者が考える初心者向きのHTMLの作り方

具体的なホームページの作成方法を、経験者のみなさんに聞いてみました。

初心者は便利なツールは使わず地道に書いていくのが良い

  • 初めはあまり凝ったものにしようとせず、写真の挿入やリンクなどを貼る練習をしました。(20代/女性/正社員)
  • 最初は面倒でもHTMLを理解するために、ホームページビルダーやWordPressは使わず、テキストエディタ(秀丸やサクラエディタ)を使って手書きすることをおすすめします。(40代/女性/専業主婦(主夫))
  • タグを書く前に手書きでもWordでも良いので、作りたいページの「イメージ図」を書くことです。そこにページに必要なタグを書き込んでいき、実際に作ってみましょう。「タグの辞書」みたいな本がありますので、それを使うと割と簡単にページを作れます。(40代/女性/無職)
  • とにかくシンプルなものをコピペしてみることですかね。(30代/女性/正社員)
  • 本を買って読むことです。始め方の本なら「最初から最後まで」やり方が載っていますので、一からやる人にはおすすめです。動画を見ながらやってタグを組んでみてもいろいろとわかります。(30代/男性/派遣社員)
    • 【質問】
      初心者におすすめのHTMLの作り方を教えてください。

      【回答結果】
      フリー回答

      調査地域:全国
      調査対象:年齢不問・男女
      調査期間:2018年07月09日~2018年07月16日

      ホームページ作成ツールを使わずタグは手入力して覚える、簡単なホームページから作るといったコメントが多く見られました。HTMLをマスターするなら、初心者のうちは手間をかけて覚えていくのが効果的と言えそうです。

      まずは基本の作り方を押さえよう

      HTMLの意味や仕組み、ホームページを作る手順、作成に使用するソフトなど、ホームページを作るにはさまざまな知識を習得する必要があります。初心者のうちは覚えることが多くて大変かもしれませんが、基本の作り方を押さえたうえで手順を繰り返しながら進めていけば、よく利用するタグやホームページのレイアウトパターンなどがわかるようになります。焦らず地道に学習していきましょう。

      「仕事終わりに通いやすいHTMLベーシック講座を見る」
      「スクールに通いながら就職準備もできるWebデザイン講座の続きを見る」