個人サイト作るならwordpressがおすすめな話

ここ2日、「ツイッターがなくなったらどうする」というツイートを散見します。なぜ急に?と思って調べたらTwitter社の大量解雇が原因なんですね。本当に終わるわけじゃないようですが、SNSも永遠じゃないんだと思わされます。個人サイトを持ってる自分としては、そっか…くらいのもんですけど、10年とかツイッターやってるヘビーユーザーからしたら大打撃だよなあ。かくいう私のサイトもTwitterからのアクセスがほとんどなので、他人事じゃないなと思います。

思えば、物心ついた時からサイトを作ってきました。最初はWix、次にWeebly、Jimdoときてペライチに行ったりはてなブログに行ったり。常に新しい理想のデザインを探してました。小学生の頃からpixivをやってましたが、作品置き場を自由にレイアウトしたいというこだわりが強かったです。だけど学生のうちはHTMLとかCSSをいじって1からサイトを作るという発想がなく、無料ブログサービスを必死に調べて一喜一憂してました。でも高校のときに、ハマってたジャンルがたまたま個人サイトのサーチが盛んなジャンルで、特に絵の上手いフォロワーさんのサイトがwordpressで出来ていたのをきっかけにwordpressというものの存在を知りました。以来ずっとwordpressユーザーです。このサイトもwordpressで作ってます。

wordpressに辿り着くまでにも色々試したし、使い始めてからも紆余曲折あったので、もしツイッター終了した時のためにサイト作りたいと思ってる人がいたら、この記事が近道になるかなあと思いこれを書くことにしました。

wordpressをインストールするまでの手順もざっくりまとめてあります↓


wordpressとは

無料で使えるCMS(コンテンツマネジメントシステム)です。PHPというプログラミング言語で構成されています。個人サイトから企業のサイトまで様々なサイトを構築することができます。

wordpressのメリット

  • 初心者でも感覚的に操作できる
  • HTML・CSSが分かればカスタマイズも自由自在
  • 世界中にユーザーがいるので、分からないことはググれば大体解決する
  • コードを上書き追加できる機能があるためコードが反映されないトラブルが起きない
  • プラグイン(拡張機能)を使えば欲しい機能が大体手に入る(Web拍手やメールフォームなど)
  • テーマと呼ばれるテンプレートが豊富
  • サイトの管理・更新が楽

wordpressのデメリット

  • サーバー代がかかる
  • phpファイルをいじって失敗したらおしまい
  • 設置するまでが少し手間
  • ブログ向きのCMSなのでデザインがブログっぽい
  • デモテーマそのままのデザインにすることがむずかしい

他サービスと比較した雑感

私は今まで試してきた中でダントツでwordpressが使いやすかったので、他のサービスと比較して気に入ってるところとか挙げていきます。

Wix

Wixはページビルダー機能があり、ドラッグ&ドロップで簡単に綺麗なサイトが作れてしまうのがいいところでした。ただ、動作がめちゃくちゃ重かった。調べたところ下位プランの通信速度が制限されているためで、上位プランに移行すれば直るみたいです。でもWixにお金払うくらいなら自分ならwordpress使うかな…と思います。自分はブログページも欲しかったので、ブログ機能が充実してるサービスに乗り換えたいと思ってました。Wixはブログ向きではなかったです。その点、wordpressは固定ページもありますしブログ向きで、テーマによりますが動作も早くとても満足してます。

Tumblr

Tumblrを個人サイト代わりに使ってる人もめちゃくちゃ多いですね。テンプレートも色々出てるし、海外の人が見てくれるのでイラスト用のSNSみたいな感じで私も使ってました。ただTumblrの気に入らない点が、間違って消してしまう可能性があるというところです。複数のブログ(投稿ページ)を持つことができるTumblrですが、以前使ってない方のブログを消そうと思って削除ボタンを押したらアカウントごと消えてしまいました。説明をよく読んでなかったとはいえ、分かりにくいんだよォ〜ッと思ってしまいメインで使うのをやめました。それがきっかけでこのサイトを復活させたんですけど、wordpressは間違って削除する可能性はほぼないので安心して使ってます。

Jimdo

Jimdo使ってた時は高校生で、習い事と部活でなかなか家にいる時間が少なかったのでスマホで作業してました。結論から言うと、Jimdoはスマホからだとかなり扱いづらかったです。スマホからもカスタマイズ可能だといいですよね。そんな願いを叶えるのがwordpressです。wordpressゴリ押しです。この記事もスマホから打ってます。

Weebly

Weeblyは結構良かったです。ドラッグ&ドロップで構成できるのがいいですね。でも海外のサービスっぽくて「Weebly」で検索かけても日本語の情報があまり上がってこないので、長く続けるなら他のサービスにした方がいいのかなと思います。

ペライチ

無料でランディングページを持てるのが魅力なサービスです(広告は表示されます)。昨今、「個人サイトを持つまではいかないがSNSアカウントの情報をまとめるページは持ってる」方をちらほら見かけます。1ページあればいい!という人には有益なサービスかもしれません。プロフィールとイラスト数点とSNSのリンクを貼って、Web名刺みたいに使うのもいいですね。こちらは日本のサービスで、運営側が活発にユーザーとコミュニケーション取っているのでオススメです。有料プランに入会すれば複数ページを持つこともできます。ただ、Jimdo同様スマホからの操作に対応してないので、パソコン持ってる人向けかなと思います。

余談:HTML名刺

こちらは使ったことはないんですが、見かけたときにデザインがシンプルで素敵だなと思ったので入れました。ペライチよりもっと簡素で本当に名刺のようにプロフィールをまとめられます。ただTwitterに登録しないと使えないようなので、SNS勢向けかなと思います。わざわざ個人サイト持つ人ってSNSから離れたい人だと勝手に思ってるのでそういう人には向かないかもしれないです。

まとめると、ブログをやる予定がなくてイラストサイトを作りたいならWixやTumblr、1ページで名刺風ならペライチで十分、といったところです。


wordpressの素敵な機能

とはいえwordpressはすべてを網羅しています。「イラストページをプロ並みに綺麗なものにしたい」「小説も載せたい」「ブログも頻繁に更新したい」という私の望みにすんなり答えてくれました。そんなwordpressの”推しポイント”を紹介します。

1. プラグイン(拡張機能)

イラストポートフォリオが超簡単に作れるプラグイン

このプラグインがめちゃめちゃ便利です。たとえば私のサイトの作品ページなどは、「Portfolio Gallery」というプラグインで作成しているのですが、これをHTMLで一から作るとしたらかなりの知識と時間が必要になります。でもプラグインをインストールすれば、ダッシュボードでドラッグ&ドロップで画像を移動することができ、簡単にメイソンリーグリッドのポートフォリオが作れます。便利!しかもレスポンシブ!
作ったギャラリーはショートコードで表示させられるので、「やっぱ別のページに表示させたいな」と思った時もすごく楽に切り貼りできます。
(ポートフォリオ用のプラグインは色々ありますが、FooGalleryも有名です。私も最近まで使ってましたが、サムネイルがぼやけて汚いのと画像がふわっと表示されないのが嫌でPortfolioGalleryに変えました。フィルター機能がついていてタグごとに作品を表示させられるのが最高です。ただフィルターが4つしか設定できないのがネックなので有料版にしようか悩んでます)

Web拍手が設置できるプラグイン

この記事の下の方についてるWeb拍手(いいねボタン)もプラグインで作られています。こちらはまろやかPHPさんの「まろやかWeb拍手」です。デフォルトのデザインをカスタマイズしてフラットデザインにしました。(こちらこちらの記事を参考にさせていただいてます)かわいくて便利で気に入ってます。やはり個人サイトにはWeb拍手があると活気が出ますよね。まろやかWeb拍手は拍手コメントをダッシュボードで確認でき、別サイトにわざわざ確認しにいかなくていいのが使いやすいです。お礼絵を設定したり、荒らしユーザーのIPアドレスをブロックしたりもできるので、ストレスフリーな運営ができるかと思います。


2.検索除け機能

二次創作サイトの味方・検索避け。タグベタ打ちサイトだと<head></head>内にメタタグ入れて…という作業がありますが、wordpressならダッシュボードの「設定」→「表示設定」→「検索にインデックスしない」にチェックを入れるだけで検索避けできます。ただ私は使ってないです。理由は、今の時代Googleでもツイッターでもバンバン二次創作がヒットしてる中で、検索避けの意味があるのかな…て思ってしまうのと、見られてまずいものは載せないようにしてるからです。それに検索避けしてもしなくてもGoogle検索に引っかかるようなサイトじゃないので…(まさに陸の孤島)

でもトラブル回避のためには使った方が良い気がします。検索にサイト内の画像が引っかかって無断転載されたとか無念ですもんね。するもしないもチェックボックス1つで完結できるので便利です。


3.豊富なテーマ

wordpressで唯一不満な点は、個人サイト向きのテーマが少ないことなんですよね。全部ブログとかコーポレートサイト向けなんですよ。個人サイトっぽいデザインを探すなら、断然HTMLテンプレートの方が綺麗で可愛いと思います。かといってwordpressのテーマが悪いわけではなく、量だけは大量にあるので自分の目的にあったテンプレートを探せないこともないです。

■テーマを選ぶ時に見るところ

  • レスポンシブ(スマホ対応サイト表示)かどうか
  • 動作が軽いかどうか
  • そこそこダウンロード数があるテーマかどうか
  • 自分の目的にあった構成かどうか(ポートフォリオ向きとかサイドバーがついてるかとか)
  • カスタマイズ機能が充実してるかどうか

■おすすめのポートフォリオ向き無料テーマ

先ほど、イラストを「固定ページ」でプラグイン表示させてるという話をしましたが、ポートフォリオ向きテーマというのはほとんど「投稿ページ」から画像を投稿する形式のテーマを指します。要はブログのかわりにイラストを投稿して、そのアイキャッチ画像一覧をポートフォリオのように表示させる形式です。この形式は、既に大量の作品を持ってる人には向かないかもしれません。イラストの説明を長々書いたり、絵日記みたいに使いたい人に向いています。私はイラストが増えていちいち投稿するのが大変になったので、一括管理できるギャラリープラグインに移行しました。それでもポートフォリオテーマを使う利点は、自分でデザインしなくてもイラストを投稿するだけで綺麗なデザインにしてくれるところだと思います。オススメなテーマを紹介します。

Fukasawa

綺麗なメイソンリーグリッドで投稿一覧を表示できます。サイドバー付き。ミニマルデザインの有名なテーマです。初期設定だとフォントがデカくてダサいですが、CSSをいじれば何とでもなります。レスポンシブ対応。カスタマイズの種類は最低限ですが、イラストサイトを作るだけなら問題ないです。

Pure

パステル調でゆめかわなピンタレスト風デザインのテーマ。無料テーマの中でもかなり機能が充実していて、とても素敵なテーマです。レスポンシブ対応。こちらのテーマは公式サイトに会員登録しメールでファイルを送ってもらう必要があります。(TwitterやFacebookで呟いてダウンロードする方法もあるようですが、仕様が変わったのか見つけられませんでした)デモサイトそのままのページをダウンロードできるので、「見本と違う」現象が起こらずに済みます。でもちょっと動作重いかな。ポートフォリオ用のカスタム投稿ページがあるのは便利ですが、途中で他のテーマに移行したくなった時に、1から投稿し直さなきゃいけないのが不便です。デザイン重視の方に。

Pixgraphy

大きなヘッダーと動的なメイソンリーグリッドが美しいテーマです。去年まで私も使っていました。人気のテーマです。レスポンシブ対応。動作は若干重めです(ヘッダーが表示されるまでにタイムラグがある)

「ミニマル wordpress テーマ」とか「ポートフォリオ テーマ」とかで調べると他にも色々出てくると思います。無料テーマはピンキリなので、自分が今まで使った中で良かったものをご紹介しました。


4.追加CSS

この機能、めちゃめちゃ便利です。「wordpressに慣れてるけどHTMLでもサイト作ってみたい!」と思って作ってた時にこの機能が恋しくなりました。HTMLサイトだと「タイトルのフォント変えたいけどどこにCSS書かれてるんだろう」と探さなきゃいけなかったのが、wordpressなら「変えたいところを右クリック」→「検証」→「CSSを変更・コピーして追加CSSに貼り付ける」だけで楽に変更できます!ライブプレビューで作業できるのがとても良いです。


5.その他

■記事の自動保存機能

記事を書いてて手が止まっていたら自動保存してくれます。このよくできる小姓みたいな感じ。「殿!自動保存しておきましたぞ!」みたいな。この機能のおかげで書きかけのものが全消えする心配がなくて助かってます。

■ブロックエディタ

ページビルダーと似た機能です。文章や画像をブロックとして配置したり、動画を埋め込んだりできます。私は従来のクラシックエディタを使ってますが、ブロックエディタにしかない機能(画像をワンクリックで角丸にできたり、引用元を斜体にしてくれたり)はより直感的に作業ができて重宝します。近いうちにクラシックエディタは使えなくなるようなので、今からwordpressを始める人はブロックエディタに慣れておくと良いと思います。


さいごに

wordpressの諸々についてお話しました。とても便利なCMSなのでこれから個人サイト作ろうと思ってる方の参考になれば幸いです。