folder作り方を知りたい

【2024年版】個人サイトの作り方を難易度別で3つ紹介!カンタンお手軽な方法からガッツリ制作まで!

【2024年版】個人サイトの作り方を難易度別で3つ紹介!カンタンお手軽な方法からガッツリ制作まで!

【2024年版】個人サイトの作り方を難易度別で3つ紹介!カンタンお手軽な方法からガッツリ制作まで! - https://do.gt-gt.org/making-my-site/

SNS時代の今、人気が再熱している創作・同人系個人サイト作り

人が多く、流れも速いSNSから離れて、まったりと創作・同人活動をしたい……そんな思いから、これから個人サイトを作ることを検討する人は多いようです。

しかし、そもそも個人サイトを作るには何から始めればよいのでしょうか?

そんなわけで、これから創作・同人系個人サイトを持ちたい人に向けて、おおまかに3つのサイトの作り方とそれぞれの特徴を紹介します。今はいろいろなサービスやプログラムが登場しており、コードの書けない素人でも、プロが作ったように綺麗なサイトを作ることもできるんですよ

難易度・高!そのぶん自由度とやりがい抜群!自分でサーバーとHTMLファイルを用意する方法

昔から変わらない、最もスタンダードな方法です。HTMLと呼ばれるマークアップ言語(いわゆるコード)を書くことで、サイトを構築します。当サイトで配布しているHTMLテンプレートも、この方法でホームページを作ることを前提としています。

この方法でサイトを作るとき、用意しなければいけないものは大きく以下の通り。

  • レンタルサーバー
  • HTMLテンプレート
  • プログラミング用テキストエディタ
  • FTPクライアントソフト

なんだか見慣れない用語もあるかもしれませんが、すべて無料で揃えることも可能です。サイト制作は大きく4つのステップを踏むことになります。

  1. レンタルサーバーを借りる(無料でも有料でもOK)
  2. 使いたいHTMLテンプレートを選ぶ
  3. HTMLを編集して、イラストや漫画など、コンテンツを入れ込む
  4. ファイルをサーバーにアップロードすると、インターネット上に公開されます

自分でサーバーを用意する必要がある(レンタルサーバーを契約する)他、HTML/CSSファイルの編集に、多少の知識が必要になります。

誤ったところを消してしまおうものなら、表示崩れが起きてしまい、どこが間違っているのか分からなくて、チマチマと修正作業をする羽目になってしまったり……と、慣れないうちはちょっと大変です。

htmlファイルの例
htmlファイルの例です。半角<>で囲まれたものは「タグ」などと呼ばれます

このように、サーバー契約やHTMLの知識が必要で、手間もかかってしまうのがこの方法の難点ですが、そのぶん自由度はバツグンです。

また、レンタルサーバーのサービスも最近はかなり充実しており、無料でも大容量・広告表示なしでのサーバーを使用することができるなど、お金をかけることなくサイトを運営することができます。サーバーによっては、成人向けコンテンツの掲載OKのところもあり。

より詳しい手順は、下記の記事にて解説しています。

当サイトでも初心者向けにHTMLテンプレートを配布しています。その他テンプレートサイトさんでも、オシャレで使いやすいテンプレートをダウンロードすることができます。サイト制作に時間が割ける人には、ぜひ挑戦してみてほしい方法です。

初めての方なら、1ページで完結するプロフィールページを作ってみるのもおススメです。当サイトでも、1ページ向けのテンプレートをご用意しています。

HTML/CSSに初めて触れる方・久しぶりに触れる方向けの情報

HTMLやCSSをイチから学びたい方のために、最新のHTML/CSSのおススメ学習方法を以下の記事にまとめています。

また手前味噌ですが、当サイト「do」の運営者・ガタガタが執筆した個人サイトを作りたい創作者向けのHTML/CSSの入門書がありますので、紹介します。

書籍を見ながら実際に手を動かすことで、確実にHTML/CSSの知識を身に着けることができます。また、この書籍には購入者特典のオリジナルテンプレートもついています。HTML/CSSを学んで自分だけのサイトを作りたいという方は、ぜひチェックしてください!

この方法の良いところ

  • 自由度がかなり高い
  • お金がかからない
  • HTMLなどの知識がつけられる
  • 可愛いHTMLテンプレートが選びたい放題
  • サイトが完成したときは、かなりの達成感がある

良くないところ

  • HTMLについて勉強する必要がある
  • 手間がかかる

難易度・易!手軽にサックリ!ホームページ作成サービスを利用する方法

最もカンタンで、サクッとできちゃうのがこの方法です。企業が提供しているホームページ作成サービスを利用することでサイトを作ります。

有名で、創作・同人などでもよく見かけるのがJimdoWixです。そのほか、比較的新しくて日本製のサービスAmeba Owndもあります。

前述したHTMLを使う方法ではサーバーなどを用意する必要がありましたが、この方法では自分で用意するものはありません。サイト制作ステップも、かなり単純になります。

  1. サービスにユーザー登録する
  2. 使いたいテンプレートを選び、色や文章を変えたり、コンテンツを入れ込む
  3. サイトが形になったら公開する

この方法では、あらかじめデザイナーが用意したテンプレートから好きなものを選び、クリックやドラッグなどのカンタンな操作でデザインを変更します。小難しいコードをいじりまわしたり、エラーに苦しむ必要はなく、HTMLを勉強しなくともキレイに整ったサイトが作れます。

さらに、サイトが形になったらワンクリックでJimdoやWixのサーバー上にサイトが公開されます。とにかくお手軽。

ただ、サービスによってはサイトに広告が表示される場合があるので、デザイン面で少し気になるかもです

時間をなるべくかけず、とにかく手軽にサイトを作りたい方にはオススメな方法です。無料でサクッと利用開始できるので、とりあえず触って試してみるのもアリ。

サイトとまでいかなくても、カンタンなプロフィールページを作るだけなら、下記の記事でいろいろな便利なサービスを紹介しているので、チェックしてみてください。

この方法のいいところ

  • とにかく手軽で手間がかからない
  • デザイナーの作ったキレイなテンプレートが利用できる
  • サービスやプランによっては無料でサービスを利用できる

よくないところ

  • デザイン・サービスなどの自由度は劣る
  • 無料の場合、広告がサイトに表示される

個人サイト向けのホームページスペースもあります

上記で紹介したサービスは一般的なホームページ作成サービスですが、創作・同人系の個人サイトに特化したホームページスペース「erla」もここで紹介します

個人サイト向けにサービスを開発しているだけあり、ブログやメールフォームだけでなく、WEB拍手や作品展示システムなどもカンタンに利用できる、サイト制作初心者にもやさしい仕様になっています

有料のサービスではありますが、趣味でも手の届きやすい価格設定であることも魅力です。詳しくは以下の記事で解説していますので、知識はないけど多少お金をかけても便利にサイトを作りたい……という方はぜひご一読ください!

難易度・中!機能性を求める人向け!WordPressでサイトを作る方法

WordPressとは、ブログのようなものです。アメーバブログなどのレンタルブログとは違って、サーバーを自分で用意してそこにインストールすることで使えるようになります。

この方法でサイトを作るとき、用意しなければいけないものは大きく以下の通り。

  • レンタルサーバー
  • WordPress本体
  • WordPressテーマ(HTMLテンプレートのような役割を果たします)
  • その他、必要に応じてプラグイン(拡張機能)

WordPressでサイトを作る場合、HTMLテンプレートを利用することはできません。WordPressサイトを作るときには、WordPress用のテンプレート(テーマといいます)を使用する必要があります。

WordPressはオープンソースのため自由度が抜群で、有志の方が開発しているテーマ(テンプレート)を着せ変えたり、プラグインを導入することでさまざまな追加機能を使うこともできます。ちなみに、当サイトもWordPressで構築されています。

近年はレンタルサーバー側でWordPressをカンタンにインストールできるツールが用意されていたりして、導入も比較的簡単です。

この方法の場合、サイト立ち上げ手順は以下のような感じです。

  1. レンタルサーバーの契約
  2. サーバーにWordPressをインストールする
  3. 使いたいWordPressテーマを選び、適用する
  4. サイトの設定をし、コンテンツを入れ込んで完成

WordPressは世界中で数多く利用されているため、レンタルサーバーのサービス内容を見に行くとたいてい「このサーバー(プラン)でWordPressを使えるか」が書いてあります。初めてWordPressを使う方は、WordPressの簡単インストール機能が用意されているサーバーを借りると安心です。

無料サーバーでもWordPressを使うことのできるサービスはありますが、安定性を考えると、安くても有料のサーバーを使うのがオススメです。

WordPressの特徴

さてWordPressの特徴ですが、HTMLの知識が全くなくてもキレイで機能的なサイトが作れてしまうのが最大の魅力です。ネットの通じるところならブラウザ上でどこからでも、ブログを書くような感覚で更新できるところも強みです。

WordPressは「コンテンツ・マネジメント・システム(CMS)」と呼ばれるように、コンテンツの管理・追加も非常にカンタンで快適です。例えば、イラストを1点サイト上に追加する場合に必要な手順を、HTMLサイトの場合と、WordPressサイトの場合とで比べてみましょう。

HTMLサイトの場合

  1. テキストエディタを開き、イラストを展示するページをHTMLで作成する
  2. イラスト一覧ページを開き、HTMLを編集して、先ほど作った新規ページへのリンクを追加する
  3. FTPソフトを使って、サーバーにアップロードする

WordPressサイトの場合

  1. ブラウザを開き、WordPress管理画面からイラストを展示するページを作成する

HTMLサイトの場合は、1ページ増やすだけでもステップが多いことに対し、WordPressなら、ブラウザ上で管理画面にログインし、新しいページを作成してコンテンツの中身を書くだけでOKになるんです。管理運営が圧倒的にラクになることが分かりますね。

一度慣れてしまうと、WordPressなしのサイトには戻れないくらい便利です。ガッツリサイトをやりたい方は、是非ご検討ください。

この方法の良いところ

  • サーバーを選べば、サイトの立ち上げがカンタン
  • サイトの管理・運営が圧倒的に楽(コンテンツ量の多い、大型サイトにオススメ)
  • プラグインを使って様々な機能がつけられる
  • ブラウザからサイトを更新できる
  • HTMLの知識がなくてもサイトが作れる

良くないところ

  • PHP、MySQLなどの使えるサーバーが必要
  • 無料サーバーで運営する場合、広告表示などの制限がある場合が多い
  • 創作・同人特化のテンプレートは多くない

創作サイト向けWordPressテーマを配布しています

doでは、創作・同人サイトに特化したWordPress用テーマ「EASEL」を配布しています。WordPressで創作・同人サイトを作る際に「あったらいいな」という機能をてんこ盛りにしていす。ぜひぜひチェックしてください!

おわりに

サイト制作事情は、時代に合わせて複雑化しているのも本当ですが、同時に「サイト制作をもっと便利にしよう」という動きも活発になっています。

初めてサイトを持つ場合、慣れないことも多く大変ですが、自分だけの城を築き上げられたときの達成感は素晴らしいものですし、コンテンツ作りにいっそうモチベーションを与えてくれる存在になるはず。

当サイトは、個人サイトを持ちたい創作者さんを熱く応援しています。ぜひチャレンジしてみて下さい!

この記事を書いた人

ガタガタ

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

関連記事

個人サイト作りに着手できない…!忙しい人向けのサイト作りを気軽に始めるアイデア集
folder作り方を知りたい favorite 57

個人サイト作りに着手できない…!忙しい人向けのサイト作りを気軽に始めるアイデア集

創作・同人サイトをWordPressで作るとき便利なプラグインまとめ
folder作り方を知りたい favorite 50

創作・同人サイトをWordPressで作るとき便利なプラグインまとめ

CSSの優先順位とは?CSSカスタマイズがうまくいかないときに確認したい基礎知識!
folder作り方を知りたい favorite 18

CSSの優先順位とは?CSSカスタマイズがうまくいかないときに確認したい基礎知識!

ローカル環境でWordPressやPHPの動作確認ができる「ampps」の使い方
folder作り方を知りたい favorite 37

ローカル環境でWordPressやPHPの動作確認ができる「ampps」の使い方

【初心者向け】CSS編集の基本を覚えてサイトのデザインを自分好みにアレンジしよう
folder作り方を知りたい favorite 43

【初心者向け】CSS編集の基本を覚えてサイトのデザインを自分好みにアレンジしよう

SNSアカウントをまとめたい人必見!カンタンにプロフィールページが作れるサービス4選
folder作り方を知りたい favorite 18

SNSアカウントをまとめたい人必見!カンタンにプロフィールページが作れるサービス4選