自宅サロンママのためのネット集客術

WordPressで作るホームページ制作サービス

【ネットで学ぶHP制作講座】制作事例 アイシングクッキー教室 ジャスミン様

146 views
約 4 分

こんにちは!

伊藤真穂です。

【ネットで学ぶホームページ制作講座】を受講くださった方より、「こんなホームページが出来上がりました!」とご報告いただきました♡

 

アイシングクッキー教室 ジャスミン様

アイシングクッキー教室ジャスミン

実は、前回Web講座での制作事例としてご紹介したmon dou dou 様のホームページを作られた方と同じ方なんです!

事例

すごい!!!両方とも、めちゃくちゃ可愛い♡

このWeb講座を受講し、すっかり自分のものにされました。とても嬉しいです。

おうちで学ぶホームページ制作

スマホ表示へのこだわり

今回すばらしいのが、スマホで見た時のヘッダー表示。

スマホで見ると↓

スマホビュー

完璧です!

 

このWeb講座では、WordPressのテーマ Lightningを使用しながらホームページが完成する流れになっています。

テーマライトニング

たくさんあるWordPressの中でLightningを選んだのはいくつか理由がありますが、

中でもヘッダー画像をPC用とスマホ用、両方設定できるというのは、かなりのプラスポイントでした。

パソコンで見た時とスマホで見た時のヘッダーサイズ

例えば何も設定しないと・・・

<PC表示>

<スマホ表示>
スマホ表示

このように、スマホで表示させた時に全体の1/4ぐらいになってしまいます。

そのため、通常ヘッダー画像は『パソコン表示用』と『スマホ表示用』のサイズ違いの画像を2種類作らないといけないのです。

<PC用>
幅1900px 高さ750px
PC用

<スマホ用>
幅750px 高さ1200px

※サイズに関してはお好みで。
フルで表示させたくなければ高さを調整します。

テーマLightningのいいところは、
無料なのにそれぞれ設定可能という点。

現在はスマホからのアクセスが圧倒的に多いので、スマホ用に画像を作るのは手間ですが必須です。

※Lightningは上記のような文字入りの画像をわざわざ作らなくても、画像だけ用意すれば文字を好きな位置にきれいに配置してくれます。

『スクロールしたい!』と思うような画像

今回制作された方からも、

今回はモバイル版でのヘッダーにこだわりました♪
スマホで表示すると、画面一面にトロピカルな画像を表示するようにしています\(^o^)/閲覧される方が、下へスクロールしたい!と思うような画像にしました♪

とコメントいただきました。

そうです、そうです!

この『下へスクロールしたい!と思わせる』ってすごく大事です。

ランディングページ(縦長の商品紹介ページ)では『ファーストビュー』といって、最初のヘッダー画像をとても重要視します。

ホームページのヘッダーも、こだわりたいですね。

SEO対策

今回もしっかりSEO対策してくださいました。

〜制作された方より〜

SEO対策もさせていただき「アイシングクッキー 豊洲」で検索すると、23位。
より検索頻度の多い「アイシングクッキー 東京 子連れ」では、お教室が多い中64位に表示されます♪

できた直後でこれなので、今後記事を書いていけばもっと上がりますね!

検索上位に表示される記事の書き方については、こちらから無料で説明しています。

SEO対策っていうとものすごく技術的なことをしなくてはいけないと思いがちですが、

『読み手が120%満足する記事を書く』こと、なんです。

ホームページもブログも、
ついつい『自分の伝えたいこと』になってしまいがち。

今回作ってくださったこちらのホームページのように、
お客様が必要な情報を苦労せずに得られるということを意識すると、

集客も勝手についてきます。

 

これから自分で作ってみたい!という方。

アイシングクッキー教室 ジャスミン様 も、

mon dou dou 様 も、

とっても優秀な設計になっています。

是非、参考になさってくださいね!!

 

私も自分で作れるようになりたい!!
お友達のを作ってあげたい!!
WordPressを使ったホームページ制作を副業にしたい!!

そんな方は、是非こちらで技術を手に入れてください↓
おうちで学ぶホームページ制作