制作メモ

デモサイトなので、デフォルト機能のみを使って簡単なデザインに留めさせていただきました。
雰囲気や操作性をご確認いただければと思います。

本番環境では、ちょっとしたアニメーションなども交えながらオリジナリティのあるデザインに仕上げます。

5/23(金)追記
見本サイトのリンクを追加しました。デザインの参考になさってください。

目次

使用ツール

WordPressWordPressを利用すると、ノーコードで簡単にサイトの更新ができます。
このサイトはブロックエディターで制作しました。
テーマ
SWELL
テーマとは、WordPressでサイトを作るためのデザインテンプレートのことです。
各テーマにはデザインや機能に特徴があり、作りたいサイトの内容に合わせて自由に変更できます。

【このテーマを選んだ理由】
・デフォルトのデザインが美しい
・エラーやアップデートの対応が早い
・利用者が多いのでトラブルシューティングが見つけやすい

テーマはどれを選んでも良いのですが、有料テーマの購入をおすすめします。
無料テーマに比べて備わっている機能が格段に多く、短時間で凝ったデザインを再現できるからです。

無料テーマを使ったとしても、オリジナリティは出せます。
テーマを構成しているコードを直接書き換えれば自由にデザインができます。
しかし、そうすると作業者が限られます。作業時間もそれなりに必要です。

「複数名での運営」を目指すのであれば、なるべく簡単に更新できる仕組みを用意するのが相応しいと思います。

おすすめのテーマは後述します。

制作費用

  • WordPress 無料
  • テーマSWELL ¥17,600円

SWELLは買い切りライセンスです。
一度買ってしまえば複数サイトに使用可能です。

このデモサイトでは、自分が以前プライベートで購入したライセンスを使いまわしています。
使い慣れたテーマだと使い方を調べる手間が省けるので私物のライセンスを使いました。

おすすめ有料テーマ

SWELL(17,600円)公式サイト

シンプルで洗練されたデザインが評判です。
管理画面・編集画面の操作性が良く、IT初心者でも扱いやすいテーマ。

シンプルゆえに、カスタムCSSやJavaScriptを追加で書き加えないとオリジナティが出しにくいです。

買い切りライセンスでリーズナブルなところは利点です。
初回の支払い以外、何も追加料金がかかりません。

見本サイト

SWELL使用サイト集

SWELLをベースにCSSとJsvaScriptでカスタマイズすると下記のようなデザインにできます。

Lightning G3(11,000円/年)公式サイト

グッズ販売のオンラインショップにも使用したテーマです。
無料プランもありますが、有料プランにすると使えるテンプレートが増えるので作業時間を短縮できます。
ブロックの種類が多く、組み合わせしだいで様々なデザインを作れます。

ライセンスは1年更新です。

1年11,000円
3年29,700円
5年44,000円
見本サイト

Lightning公式デモサイト

LightnigをベースにCSSとJavaScriptでカスタマイズすると下記のようなデザインにできます。

他にもWordPressのテーマは無数にあります。
気になるテーマがあればそちらで対応しますので、ご相談ください。

HP制作に必要なもの

新しいホームページを作るには下記が必要です。

  1. 作りたいページを決める(製品紹介・リペア・教室・求人情報etc)
  2. 写真とテキストの用意
  3. テーマカラーを決める
  4. ワイヤーフレームを作る

ワイヤーフレームとは

サイトのレイアウトをざっくり示した設計図のことです。
こんな感じです。

ご要望などありましたら

目指しているサイト・載せたいコンテンツ等ありましたらお知らせください。

目次