前回は「WEBサイトを運営する目的」をお伝えしました。
目的はわかったものの「具体的にどのようなサイトを作れるのか、よりリアルなイメージを見たい」という人は多いでしょう。
ここでは、ジャンルや業種別に「WordPressでこのようなサイトを作れる」という事例で、特にすぐれたものを紹介させていただきます。
ご自身に近い業界やジャンルの事例はもちろん、他の業界やジャンルのデザインも良いヒントになることが多いため、それぞれの事例をざっと確認していただけたらと思います。
WordPressで作られているWEBメディア
大手企業や上場企業が運営しているWEBメディアでもWordPressが活用されていることは非常に多いです。
上場企業などが運営しているメディアはエンジニアやデザイナーが0から作成したオリジナルのサイトしかないと考えている人もいるかもしれませんが、決してそんなことはありません。
WordPressは大手企業をはじめとしたIT人材が豊富な企業も積極的に活用するWEBサイト作成ツールなんです。
WordPress事例｜大手サイト
WordPressでつくられている大手サイトの事例を紹介していきます。
マイナビウーマン
出典：マイナビウーマン様
マイナビの女性向けメディアである『マイナビウーマン』様のサイトです。
サイト全体は、装飾や色使いを抑えた非常にシンプルなデザインです。
それでも女性らしい華やかさがあるのは、一つひとつの写真・イラストのクオリティの高さ、その配置の妙、コンテンツごとの合間などの細かい計算が緻密にされているためでしょう。
メディアの1つの理想形として参考になります。
女子SPA！
出典：女子SPA！様
『日刊SPA！』の女性向けである『女子SPA！』のサイトです。
あらゆるタイプのコンテンツが、わかりやすく華やかに配置されています。
WordPressのメディア系テーマは、この女子SPA！のレイアウトに近いものが多く、その点で非常に参考となる事例です。
色使いなども、ワンポイントのカラーであるピンクをブルーに変えるだけで男性向けとなるため、男性向けのメディアでも参考となるデザインでしょう。
東スポWeb
出典：東スポWeb
大手新聞社のサイトもWordPressで作られています。
このサイトはスポーツ紙のサイトということもあり、男性的なデザインです。
特に男性向け＆情報量が多いメディアを作りたいときに参考になるでしょう。
ダ・ヴィンチニュース
出典：ダ・ヴィンチニュース
このような人気のコラム記事が数多く掲載されている大手メディアでもWordPressが使われています。
本や漫画といった容量の大きな画像ファイルが多いサイトであってもWordPressでサクサク動くサイトを構築することが可能です。
nippon.com
出典：nippon.com
公益財団法人ニッポンドットコムが運営する「海外の方に日本をもっと知ってもらうためのサイト」です。
公的なサイトということもあり、特に堅実なメディアを作りたいときの参考となるでしょう。
美的.com
出典：美的.com
女性ファッション誌『美的』のWeb版です。
『マイナビウーマン』や『女子SPA！』よりも女性誌的なデザインを強く残しています。
女性向けのファッショナブルなメディアを作りたいときに参考となるでしょう。
テック・クランチ
出典：テック・クランチ
スタートアップ企業やインターネットの新しいプロダクトをレビューする『テッククランチ』の日本版です。
ビジュアルが少なくテキスト主体で、情報の正確性・速報性で勝負するというメディアを作りたいときの参考となります。
中規模サイト
続いて中規模サイトでWordPressを活用している事例を紹介していきます。
沖縄経済新聞
出典：沖縄経済新聞
沖縄のイベント・新商品・ビジネスなどの情報を発信する『沖縄経済新聞』（Web限定の新聞）です。
新聞の紙面を模したサイトデザインでWordPressという例は希少であるため、同様のWeb限定新聞を立ち上げたい方は、必見の事例です。
離島経済新聞社
出典：離島経済新聞社様
NPO法人離島経済新聞社が運営する、全国の離島に関する情報のポータルサイトです。
万人に好まれるソフトでバランスのいいデザインであるため、NPOだけでなく、あらゆる企業・個人のデザインで参考となるでしょう。
フリーペーパー『熊取うまいガイド』
出典：熊取うまいガイド様
大阪南部の熊取町で発行されているフリーペーパー『熊取うまいガイド』のWeb版です。
「グリッドデザイン＆WordPress」の組み合わせで、個人やアート系以外のサイトというのは希少な例です。
（フリーペーパーはアート系ともいえますが）
特にグリッドデザインを用いたい方は、ジャンルを問わずに参考となるでしょう。
WordPressで作成しているランディングページ
次にランディングページ（LP）をWordPressを使って制作している事例を紹介していきます。
WEB集客やネットを使って売上を大きく上げるならLPは必須と言っても過言ではありません。
LPは業者に頼むと１ページ作るのに50万円から100万円以上かかるのはザラですが、WordPressを使えば自分で作ることができます。
◆LP＝ランディングページとは
LPはネット集客においてもっとも重要なWebページのひとつです。広告やメルマガ、DMなどから集客したお客さんをLPに集めることであなたが売りたい商品やサービスを購入してもらうことができます。LPについてはネット集客講座やWEBマーケティング講座で詳しく解説しています。
遺品整理漫画LP
出典：遺品整理のエクシア
「漫画LPをWordPressで制作している」という希少な例です。
漫画LPで一番重要なのは漫画とその他のグラフィックデザインであるため、漫画LPだけならWordPressのテーマごとの違いはあまりありません。
しかし、LPと合わせてサイト自体も構築する予定であれば、特に中小企業の方はエクシア様の事例が参考となるでしょう。
サービス付き高齢者住宅（サ高住）LP
漫画ではない通常のLPで、シンプルに洗練されたデザインです。
派手さを抑えて落ち着いたトーンで、情報を丁寧にまとめるというLPのデザインで参考となります。
（なお、こちらはLP1ページのみのサイト様です）
訪日外国人専用Wi-Fiサービス
出典：SHINOBI様
ビジュアルのインパクトが大きいことに加え、エフェクトを多用している点で特に参考になる事例です。
WordPressはエフェクトの類とぶつかることが稀にあります。
さほど不自由はないのですが、同じようなエフェクトを使ってLPを作りたい方には、特にプラスとなるでしょう。
匂い名刺
出典：匂い名刺様
こちらもビジュアルのインパクトが大きく、エフェクトが控えめに使われているLPです。
特に「このくらいのエフェクトがちょうどいい」と考えている方の参考となるでしょう。
WordPressで作られている店舗・事務所WEBサイトやホームページ
実店舗を構えたり、士業の事務所のようなビジネスにおいても、ホームページなどをつくって新しいお客さんを集める必要性がありますよね。
店舗型ビジネスやオフラインビジネスにおいても、WordPressをつかってWEBサイトを立ち上げることで、売上を大きく伸ばしていけるようになります。
店舗型・事務所などのビジネスをされている会社がWordPressを活用している事例をご紹介しましょう。
士業事務所
まずは士業事務所の事例です。
士業はネット集客の仕組みを構築すると売上を安定成長させやすい業態ですから、WordPressでWEBサイトをつくるのに適しています。
会計事務所
出典：広瀬税務会計事務所様
士業事務所向けのTCDのテーマ『Law』を使われている事例です。
税理士事務所様・会計事務所様はもちろん、同様に『Law』を使ってサイトをつくりたいという事業者様の参考となる事例です。
法律事務所（弁護士）
出典：代官山綜合法律事務所様
動画とエフェクトを大胆に使われている事例です。
法律事務所のなかでも、特にインパクトが大きいタイプのデザインといえます。
士業事務所様はもちろん、近い業種でこのように芸術性の高いサイトを作りたい、というときの参考となります。
リアル店舗
つぎにリアル店舗ビジネスでWordPressを使っている事例です。
ペットショップ
出典：オカメインコ販売専門 Bay Birs Yokohama様
ペットショップの中でもオカメインコの販売専門という、珍しいショップ様の事例です。
ワンカラムでかわいい系・ほのぼの系のサイトを作るときの良い参考となります。
フォトスタジオ
お子さんの写真撮影を手掛けるフォトスタジオ様の事例です。
ワンカラム・トップに動画を設置・随所にエフェクトを用いているなどの点で、同様のサイトを作りたい方に特に良い参考となるでしょう。
美容院
出典：no.11様
埼玉県川越市の美容院・ヘアサロン『No.11』様のサイトです。
- 1カラム
- ビジュアル中心
- エフェクトを多用
という点に特徴があります。美容院や理容室、ネイルサロンやエステサロンなどの店舗様を中心に、良い参考となるでしょう。
質屋・質店
佐賀県武雄市の質店『かえる質店』様のサイトです。
シンプルでかわいらしく、洗練されたデザインです。
公的なサイト・NPO・学習系・子供関連など、人を安心させる必要がある業種で特に参考となる事例です。
書店・本屋・古本屋
おそらく日本初である「猫本専門」の書店『吾輩堂』様のサイトです。
芸術性が高く、レトロ系・アンティーク系・大正時代系のデザインを実現したいときの良い参考となります。
こども園・教室・スクール
教育領域でのビジネスにおいてもWordPressを活用したWEBサイトが多数あります。
こども園（保育園・幼稚園）
出典：小浜こども園様
長崎県雲仙市小浜町にあるこども園『小浜こども園』様のサイトです。
丸字のフォントを用いた可愛らしく華やかなデザイン、随所に見られるさりげないエフェクトの使い方などがとても参考になります。
音楽教室
出典：椿音楽教室様
東京23区を中心に200以上のスタジオでレッスンを展開されている『椿音楽教室』様のサイトです。
クオリティの高い写真を全面的に大胆に用いており、女性に好まれる可愛らしく上品なデザインは、女性を対象とするすべての業種で参考となるでしょう。
パン教室
出典：momokoパン教室様
香川県高松市のパン・お菓子・お料理教室である『momokoパン教室』様のサイトです。
TCDのテーマ『every』を用いられています。
バナーなどをおそらく先生や近しい方が手作りされているかと思いますが、デザインが可愛らしいのはもちろんのこと、自ら作られていることで、お人柄やものづくりへのこだわりが伝わります。
バナーなどのデザインは、プロに頼むことと自ら作成されること、それぞれにメリットがあるものです。
「自ら作成される場合の好例」として参考にしていただけるでしょう。
クリニック・病院・薬局
医療領域でもWEB集客が欠かせない時代になっています。
とくにクリニックや個人院だと小規模運営体制のため、WEBサイトを０から立ち上げることが難しいことに加え、運用にも手間が掛かってしまい、手が回らなくなる場合があります。
しかし、WordPressなら1日でサイトを立ち上げることができ、運用も知識がなくても簡単にできるので、最適な選択肢といえます。
WordPressで作られている医療系のサイトの事例をみていきましょう。
歯科医院
出典：いのうえ歯科・矯正歯科様
長崎県諫早市にある『いのうえ歯科矯正歯科』様のサイトです。
清潔感と信頼性のあるピュアホワイトをベースとし、安心感を与える緑と黄色をアクセントカラーに用いています。
特徴部分の写真への数字の重ね方や、トップビジュアルへのロゴの重ね方、縦書き文字でのコンセプトの重ね方など、随所で高度な技巧がこらされています。
鍼灸治療院
出典：高塚鍼灸治療院様
京都府木津川市にある『高塚鍼灸治療院』様のサイトです。
トップで治療風景の写真を全面に大きく表示している点、行書体のフォントを用いていることで、伝統の技術を感じさせつつ、強いインパクトを出すことに成功しています。
皮膚科・美容皮膚科
福岡県北九州市にある『ケーズ皮膚科・美容皮膚科』様のサイトです。
医療で要求される信頼性と、エステなどの美容分野で問われる芸術性を両立されているデザインです。
トップの横スクロールのイメージ部分が曲線でカットされている点など、高度な技巧が随所で見られます。
薬局
出典：ナカジマ薬局様
北海道と関東で多数の店舗を展開されている『ナカジマ薬局』様のサイトです。
白をベースとした清潔感と信頼性の感じられる配色で、ビジュアルを大胆に使っている点などが参考になります。
動物病院・獣医
出典：16動物病院様
福岡市西区の『16動物病院』様のサイトです。
フォントやボックスがすべて丸みを帯びており、動物病院らしい可愛らしく、安心感のあるデザインが参考になります。
飲食店
飲食店のWEBサイトもWordPressで作成することが多いです。
店長さんが1人でサイトを立ち上げて集客体制を作ることができるので、負荷も少なくて済みます。
どんなサイトが実現できるのか、事例を元にみていきましょう。
カフェ・コーヒーショップ・喫茶店
福岡県久留米市・福岡市で複数の店舗を展開されている『コーヒーカウンティ』様のサイトです。
シンプルなデザインで、1枚1枚の写真の美しさが伝わりやすくなっています。
カフェだけでなく、ギャラリーやアーティストの方々のホームページの参考ともなるでしょう。
イタリアン
出典：carborocco様
大分県大分市にある、川沿いの隠れ家的レストラン『carborocco』様のサイトです。
背景は白と黒のみで、写真の色彩が映える配色です。
また、フォントや線などの装飾は細いラインで統一されており、この細さが洗練された印象を与えます。
パン屋・ベーカリー
出典：ヤマダベーカリー様
京都・北白川で手作りパンを製造・販売されている『ヤマダベーカリー』様のサイトです。
歴史を感じさせる縦書きの採用や、トップページ後半で見られる商品一覧の部分が非常に特徴的なデザインです。
（特に商品一覧は、ただの一覧でなく一つのアートのような陳列の仕方になっています）
菓子店・菓子工房（パティシエ）
茨城県守谷市にある『スペイン菓子工房ドゥルセ・ミーナ』様のサイトです。
おそらくスペインの国旗をイメージされた、赤とオレンジの配色が美しいサイト様です（同じ配色をされるときに特に参考となるでしょう）。
随所でお菓子の手描きイラストが配置されており、写真でなくイラストであることで、よりインパクトのあるデザインとなっています。
和菓子店・和菓子屋
出典：菓子処さかした様
福岡県宗像市にある和菓子店『菓子処さかした』様のサイトです。
おまんじゅうの色を連想させるホワイトグレーをベースとした非常に上品な配色です。
トップメニューで縦書きや明朝体を使われている点も、和菓子店ならではの特徴といえます。
工務店・建設事務所
工務店や建設事務所もネット集客で新規のお客様を集めることで売上を伸ばすことができる業態です。
ビジュアルデザインが凝っているサイトが多い業種ですが、やはりWordPressで作られているサイトが多いです。
具体的な事例をみていきます。
浅井良工務店
出典：浅井良工務店様
和歌山県和歌山市にある『浅井良工務店』様のサイトです。
写真の大きいブロック、小さいブロック、テキスト中心のブロックがリズムよく組み合わされています。
トップのスライダーの動きもダイナミックで、WEBサイトであまり見られない六角形を採用している点など、あらゆる部分で参考となるハイレベルなデザインです。
大栄鉄工所
出典：大栄鉄工所様
千葉県高津市にある『大栄鉄工所』様のサイトです。
鉄工所の堅実なイメージを保ちながら、ビジュアルを全面に用いたトップや、写真の美しさによって斬新なイメージを実現しています。
スタイリッシュなデザインであるため、鉄工所だけでなくあらゆる業種で、黒をベースとしたデザインをしたいときに非常に良い参考となるでしょう。
水道工事会社
出典：水道工事本舗様
東証マザーズ上場企業・株式会社アクアライン様が運営する『水道屋本舗』様のサイトです。
水道工事のサイトであるため、情報のわかりやすさが徹底しており、パンダのキャラクターを用いた親しみのあるデザインが特徴です。
メニューの写真がパンダの枠でくり抜かれており、カラフルな配色になっている点など、随所で遊び心のあるデザインも参考になります。
ガーデンデザイン・空間デザイン事務所
和歌山県紀の川市にある『ヒロガーデニング』様のサイトです。
庭園デザインの会社様であるため、フォントなどのメインカラーを緑とされています。
全体的に写真を大胆に用いており、その写真一つひとつの芸術性が高いことが特徴です。
各所のエフェクトの使い方も参考になります。
WordPressで作られているコーポレートサイト
中小零細企業のホームページはWordPressで作られていることが多いというのはなんとなくイメージがつくかと思いますが、大手企業や上場企業、あるいは有名な会社のコーポレートサイトでもWordPressが使われていることも多々あります。
WordPressでコーポレートサイトを構築している事例をみていきましょう。
星野リゾート
出典：星野リゾート様
有名な『星野リゾート』様のサイトです。
特徴はトップがマップ系のイラストになっており、遊園地のマップを見ながら行く場所を決めるように、星野リゾートの各ホテルの情報を見られる点です。
そこから先はシンプルであり、多くのWordPressテーマで再現しやすいデザインになっています。
ポーラ美術館
出典：ポーラ美術館様
神奈川県足柄下郡箱根町にある『ポーラ美術館』様のサイトです。
デザインで最も特徴的なのは「POLA MUSEUM OF ART」の文字が、対角のスミに白と黒で配置されている点でしょう。
美術館ならではの斬新なロゴ配置といえます。
また、スライダーをめくるためのボタンが数字で、こちらも白黒になっている点が、個性的な部分です。
山口朝日放送
出典：山口朝日放送様
山口県のテレビ局『山口朝日放送』様のサイトです。
テレビ局だけに情報量が多くなりますが、それを見やすく華やかにまとめている点が参考となります。
番組ごとのバナーなど、他業種に比べてバナーが多くなりますが、そのバナー一つひとつのデザインが美しい・かわいい・コミカルと、さまざまなタイプでハイレベルな点も特徴です。
SAPIX・代々木ゼミナール
代々木ゼミナールグループ・SAPIX様の英検対策講座のサイトです。
トップで写真を大胆に使っていますが、この写真が縦長の画面でも横長の画面でも、うまく配置される点が特徴です。
また、ページをめくっていく際の写真スクロールのエフェクトも高度なものです。
特に終盤の「赤・白・黒」の配色で構成されている、テキストでの説明部分などは、写真なしでも美しいデザインを作る場合の参考になります。
まとめ
今回の講座の要点を3行でまとめると、下のとおりです。
- WordPressではどんな業種のどんなタイプのサイトでも作れる
- ECサイトや会員サイトなど、複雑なサイトも作れる
- ニッチなニーズにも特化したテーマがあるため、どんなデザインでも簡単にできる
次の講座では『WordPressを覚えると身に付くスキル』について解説します。
