folder基本を知りたい

個人サイトを作りたい!HTMLテンプレートとWordPress、どっちで作ればいい?

個人サイトを作りたい!HTMLテンプレートとWordPress、どっちで作ればいい?

個人サイトを作りたい!HTMLテンプレートとWordPress、どっちで作ればいい? - https://do.gt-gt.org/templates-or-wordpress/

「個人サイトを作ってみたい!」……そう思って調べてみても、HTMLテンプレートで作る方法と、手軽なWordPressを使う方法、どちらにするか決められず始められない……そんな悩みを抱えている方も多いでしょう。

この記事では、HTMLテンプレートとWordPress、それぞれの特徴やメリット・デメリットを比較し、個人サイトを作るための手段を選ぶポイントをお伝えします。どちらの方法が自分に合っているか、判断するための参考にしていただければ幸いです!

HTMLテンプレートとは

HTMLテンプレートとは、基本的なWebページの土台となるファイルのセットです。主にHTMLとCSSで構成されていて、JS(JavaScript)ファイルなどが入っている場合もあります。HTMLはWebページの構造を示すためのもので、CSSはページのデザインや見た目を担当します。JSはページに動きをつけるためのものです。

HTMLテンプレートは、HTMLやCSSの知識がある人が、ほぼ完成形に仕上げたファイルのセットです。そのままサイトとして公開できるレベルのHTML・CSSを元に、自分好みにカスタマイズできるため、WebデザインやHTMLの知識が少しあれば、オリジナリティのあるサイトを作りやすいのが特徴です。

個人サイト向けに作られたキレイなHTMLテンプレートを配布するサイトも多数あり、眺めるだけでも楽しいですよ。

HTMLテンプレートでサイトを作る手順

大まかには以下の通り。

  1. サーバーを借りる
  2. テンプレートをダウンロードする
  3. テキストエディタでHTMLやCSSを編集し、サイトの内容をカスタマイズする
  4. FTPクライアントソフトでサーバーにファイルをアップロードする
  5. 画像やコンテンツを随時追加して完成!

用意するものは、サーバー、テンプレート、テキストエディタにFTPクライアントソフトの4つです。

サーバーとは、Web上にサイトを公開するための土地のようなものです。サーバーのレンタルサービスはいろいろなものがありますが、HTMLテンプレートの場合は特に必要なサーバースペックがないので、無料サーバーでも問題ありません。ただし、使いたいプログラムがある場合は、そのプログラムの要件を満たすサーバーを探しましょう。

テキストエディタは、HTMLやCSSを編集するために使います。メモ帳でも編集できますが、プログラミング用のものを用意したほうが使いやすいです

FTPクライアントソフトは、ファイルをサーバーにアップロードするためのものです。テキストエディタとFTPクライアントソフトは、いずれも無料で利用できるものがありますよ

HTMLテンプレートで個人サイトを作るメリット

自由なカスタマイズが可能!

HTMLテンプレートではコードを直接編集するため、ある程度HTML・CSSの扱いに慣れれば細部まで自分の思い通りにデザインできます

サーバーのスペックは問わない!

HTMLテンプレートは、サーバースペックを問いません。無料サーバーでも問題なくサイトを公開できます。ただし、メールフォームやブログなどのプログラムを使いたい場合は、そのプログラムの必要スペックを満たすサーバーを借りる必要があるので注意です。

とにかく手軽!

WordPressなどのCMSを使う場合、セキュリティ対策を行ったり、各プログラムのアップデートに対応する必要があります。HTMLテンプレートの場合、そういった対策は不要のため、一度立ち上げてしまえば放置してしまっても心配はありません。

HTMLテンプレートで個人サイトを作るデメリット

HTML/CSSの知識が必要

テンプレートの編集には、基本的なHTMLやCSSの知識が必須となります。特に色やフォントを好みに変えたり、もっと自由にデザインをカスタマイズしたい場合は、少し発展的な知識が必要です。

HTMLやCSSの扱いに慣れないうちは、自分好みにカスタマイズしようとしてうまくいかず、HTMLやCSSのどこが間違っているのか分からなくて詰まってしまうことはよくあります。

当サイトでもHTMLやCSS編集の基礎や応用を紹介していますので、つまずいたときは参考にしてみてください!

機能をつけるのに手間がかかる

例えばメールフォームやいいねボタンなど、何か機能をつけたい場合、自力でプログラムを導入する必要があります

個人サイトでも使えるような、カンタンな手順で導入できるように作られたフリープログラムはいろいろありますが、慣れないうちはちょっと大変です。

こういったフリープログラムをスムーズに導入するためのコツは以下の通り。いつかプログラムを設置する際には思い出してくださいね。

  • マニュアルをよく読んで、そのとおりに作業する。手順を飛ばさない。
  • わからない言葉は、とりあえずググる。
  • カンでやらない!

更新がちょっと手間

サイトにコンテンツを追加する際にも、テキストエディタを開いてHTMLを編集し、FTPクライアントソフトを使ってサーバーにアップロードする、という手順が必要なため、更新が少し手間になります

当サイトでは、サイトの更新を楽にするためのプログラムを配布していますので、活用していただけると少し手間を減らせるかもしれません。ぜひご検討ください。

HTMLテンプレートはこんな人に向いてるかも

  • HTMLやCSSにチャレンジしてみたい、知識をつけたい
  • 細部まで自分好みにサイトをカスタマイズしたい
  • サイトにあまりコストをかけたくない
  • 展示したいコンテンツはそれほど多くない
  • サイトの更新は頻繁ではない

WordPressとは

WordPressは、Web制作の知識がなくてもカンタンにサイト制作・運営ができる優れたツールです。無料で使えるオープンソースのソフトウェアで、特にブログや企業サイトなどの動的なコンテンツを更新したい場合に重宝されています。テーマやプラグインを使って機能やデザインを拡張できるため、コードが苦手な方でも多機能かつオシャレなサイトを構築できるのが魅力です。

HTMLが静的サイトと表現されるのに比べて、WordPressは動的サイトと表現されます。これは、HTMLで作ったサイトは誰がいつ訪問しても同じ内容が表示されることに対し、WordPressは訪問者のリクエストの内容に応じたコンテンツを表示させるからです。

例えば、訪問者が「〇〇カテゴリーに分類されたイラストを見たい」とリクエスト(リンクをクリック等)すると、それに対応したコンテンツを返してくれる、というわけです。機能的なサイトを作れるというのはこういうイメージです。

そんな多機能なWordPressですが、利用は無料で、マニュアル通りにやればサイト制作初心者でもスムーズに始められます。

WordPressサイトを作る手順

  1. サーバーを借りる
  2. WordPress本体をインストールする
  3. WordPress用のテーマをインストールする
  4. サイトの初期設定を行う(タイトル、キャッチフレーズ、パーマリンク設定など)
  5. 必要に応じてプラグインを導入し、サイト機能を拡張する
  6. コンテンツを追加してサイト完成!

用意するものは、サーバー、WordPress本体、WordPressテーマの3つです。必要に応じてプラグインを使ってもよいでしょう。

サーバーは、Web上にサイトを公開するための土地のようなものです。WordPressサイトを作るためには、WordPressのサーバー要件を満たしたものを借りる必要があるため、適当に借りないよう注意です。たいていのサーバー(プラン)には、WordPressが利用できるスペックかどうかが書かれています。

無料サーバーでもWordPressが使えるものがありますが、速度や安定性、その他のサービスを考慮すると、バリバリ使いこなして個人サイトを満喫したければ、安くても有料のサーバーを使うのがおススメです

WordPress本体は公式サイトから無料でダウンロードできるほか、サーバーの管理画面からカンタンな操作でセットアップできる場合があります。FTP接続やデータベースセットアップなどの操作がうまくやれるか自信がない人は、WordPressクイックインストール機能が使えるサーバーを選びましょう

WordPressテーマとは、WordPress専用のテンプレートのようなものです。無料のものもあれば、有料のものもあります。テーマによってデザインや機能が違います。

プラグインとは、サイトの機能を追加する拡張ツールのことです。例えば、メールフォームの設置や、いいねボタンの設置などの機能も、プラグインを使えばワンクリックで導入できます。必要に応じて利用すればよいでしょう。

WordPressで個人サイトを作るメリット

更新が便利!

WordPressサイトは、HTMLテンプレートで作ったサイトと違い、ブラウザからサイトにログインしてコンテンツを更新することができます。テキストエディタやFTP接続は不要です。

プラグインで機能をラクラク追加!

WordPressにはプラグインという拡張機能を導入することができます。プラグインにもいろいろな種類があり、例えばスパム対策などのセキュリティ強化目的のものから、メールフォームの設置などの機能追加ができるものまでさまざまです。

「サイトを使ってこんなことをしたい」と思ったら、プラグインで実現できないか、検討できるのがWordPressの強みです。

なお当サイトでは、いいねボタンを設置するためのプラグインを配布しています。

ノウハウが豊富!

WordPressは個人から企業まで幅広く利用されているCMSです。そのため、検索すれば大量のノウハウを見つけることができます

ちょっと分からないことがあってつまずいても、自力で問題解決にこぎつけやすいのも利点です。

HTML/CSSを学べばさらにカスタマイズの幅が広がる!

WordPressは、立ち上げるだけならHTML/CSSの知識は不要なのですが、HTML/CSSの知識があればもっと自分好みにサイトをカスタマイズすることができます!

WordPressで個人サイトを作るデメリット

個人サイト特化のノウハウ・ツールは多くない

WordPressは主にブログや企業、ビジネス向けに使われることが多く、創作・同人系の個人サイトに特化したノウハウやツールは多くはないのが実情です。

また、個人サイト向けに配布されているHTMLテンプレートは、WordPressサイトにテーマとして適用することができない点にも注意です。WordPressサイトには、WordPress用に作られたテーマしか、テンプレートとして使えないことは覚えておきましょう。

当サイトでは少しずつ、個人サイト制作者に向けたWordPressのノウハウやツールを発信していく予定なので、ぜひご期待ください。

ある程度のサーバースペックが必要

WordPressを設置するためにはPHPとMySQLの動作するサーバーが必要です。無料サーバーでもこの要件を満たすものはありますが、使用できる容量が少なかったり、速度や安定性に不安があるため、WordPressを使うのであれば、安くても有料のサーバーを活用するのが理想です。

セキュリティなどの観点から、定期的な更新が必要

WordPressには、本体やテーマ、プラグインなどにアップデートが入ることがあります。これらの更新を怠るとセキュリティ上のリスクが高まるため、定期的な保守・更新が必要です。

とはいえ、これらの更新はダッシュボードから「更新」ボタンをクリックするだけで終了します。大した作業ではないので、めんどくさがらずにきちんと更新しましょう。

WordPressはこんな人に向いてるかも

  • HTMLやCSSが難しそうで、コードを編集できる自信がない
  • 機能性の高いサイトを作りたい
  • 管理画面から手軽にサイト更新をしたい
  • 大量のコンテンツを展示したい
  • サイトにコストをかけられる
  • サイトの更新が頻繁

HTMLテンプレートとWordPressの比較表

HTMLテンプレート WordPress
HTML/CSS 必要 不要
覚えるとより幅が広がる
FTPクライアントソフト 必要 不要
サーバースペック 特に問わない
(使いたいプログラムがある場合は別)
PHP、MySQLが使えるサーバー
個人サイト向けのノウハウ ある あまり多くない
機能性 ほぼなし
自力でプログラムを導入する必要あり
かなり高い
欲しい機能はプラグインでラクラク導入
保守の必要性 なし あり

ちなみに……2023年にdoが実施したアンケートでは、個人サイトを作っている人のうち56%がHTMLテンプレート、28%がWordPressを使って構築していました。

まとめ

サイトの更新頻度や求める機能によって、HTMLテンプレートかWordPressかを選ぶのがベストです。例えば、更新が少なく自由度の高いデザインを求める方にはHTMLテンプレートがオススメで、頻繁に更新し、便利な機能を取り入れたい方にはWordPressが適しているでしょう。

どちらの方法で作るにせよ、初めて作る場合は分からないことが多く、つまずいてしまったり、困ってしまうこともあるでしょう。特に初心者には、いきなりカンペキなサイトを作るのは難しいことです。まずはキリのいいところで公開して、少しずつ理想のサイトに近づけていくのも手だと覚えておきましょう

自分のスタイルやサイトの目的に合わせて、ぴったりの方法で素敵な個人サイトを作ってみてください!

この記事を書いた人

ガタガタ

このサイトと、このサイトの掲載記事のほとんどと、このサイトで配布しているプログラムやテンプレートのすべてを作った人。絵を描いたり、文章を書いたりして暮らしています。

関連記事

zipって何?テンプレートファイルのダウンロードからHTML編集までの流れ【超初心者向け】
folder基本を知りたい favorite 18

zipって何?テンプレートファイルのダウンロードからHTML編集までの流れ【超初心者向け】

PHP・MySQL・独自ドメイン…創作・同人サイトのためのサーバー機能用語解説
folder基本を知りたい favorite 38

PHP・MySQL・独自ドメイン…創作・同人サイトのためのサーバー機能用語解説

【サーバー乗り換え】サイトの引っ越しに必要な手順は?ケース別に解説
folder基本を知りたい favorite 19

【サーバー乗り換え】サイトの引っ越しに必要な手順は?ケース別に解説

個人サイトで独自ドメインを使おう!ドメイン取得のメリットとオススメ取得サービス
folder基本を知りたい favorite 45

個人サイトで独自ドメインを使おう!ドメイン取得のメリットとオススメ取得サービス

創作・同人系個人サイトを訪問するときに気を付けたいこと
folder基本を知りたい favorite 223

創作・同人系個人サイトを訪問するときに気を付けたいこと

成人向けコンテンツありの個人サイト運営にオススメのサーバー
folder基本を知りたい favorite 66

成人向けコンテンツありの個人サイト運営にオススメのサーバー