ホームページ制作|大阪

奈良県のワークサロン、PRISMATICA(プリズマティカ)さまのホームページをスマホ対応(レスポンシブ)にリニューアルさせていただきました。(以前のデザインはこちら

前回のデザインを気に入ってくださっているということで、前回のデザインを踏襲し、レイアウトを変えレスポンシブ対応にしています。

従来のホームページのデザインを使ってレスポンシブにして欲しいというご依頼を頂くことが多いです。お気軽にお尋ねください。

ここ数日、とあるワードプレスサイトの作業を行っていました。

今まであまりなかったリクエストを受けて叶えるべく普段以上に色々と調べていたんですが、おかげで「ワードプレスってこんなことまで出来たのか!」とウキウキする技を仕入れることが出来て、あぁ、やっぱりホームページって楽しいなぁ〜と改めて感じました。

ある技の面白いところは、ホームページの知識をお持ちでない方も、ブログ上でレイアウトやデザインが整ったコンテンツを作ることができる点。

文字を太くしたり色を変えたり、画像を左右どちらかに寄せたり程度ではなく、ボタン一つで会話風の吹き出しにしたり、デザインされた枠を挿入したり、色々出来ます。

プラグインを入れるとまぁ色々出来るんですが、余計なものを足すと動作が重くなるし(SEO上不利)、他のプラグインと干渉が起きたり、ワードプレスのバージョンによっては対応できなかったり問題が発生する場合もあるので、やたらめったらにプラグインを使うのは避けたい・・という気持ちがWEBデザイナーにはあります。
プラグイン無しで色々出来るとよりホームページを充実させていくことが出来るので、今後どんどん取り入れていきたいなと思います。

このほどワードプレスの新しいバージョンがリリースされ
自動でアップデートされているサイトも少なくありません。

今までも自動でバージョンアップはされてきているのですが、
4.XXから5.XXバージョンへアップデートされ、
編集画面が大きく変わっています。

新しい編集画面は最新の機能を取り入れた優れものーーということですが、
使いにくさを感じる人も少なくないかと思います。
・・・私もその一人です。

また、お使いのサーバによっては、新しい編集画面のプログラムとの相性が悪く
記事の公開ボタンをクリックしても動かないという不具合がでる場合もあります。
不具合については、順次アップデートで解消されていくものと思いますが、

不具合が出ている方、
今までの編集画面で使いたい方は、下記の方法を試してみてください。

●これまでの編集画面をインストールできます。

ワードプレス管理画面(PC版)左サイド「プラグイン」→「新規追加」で
「Classic Editor」を検索してインストール→有効化。

これで編集画面を従来のものに戻すことが出来ます。

さて、今日は、ハズキルーペのCMのどこが凄いのか考えてみたいと思います。
少し前になりますが「ハズキルーペのCMの凄さ」についてネットニュースにも出ていましたね。

*「ハズキルーペ」CMに広告のプロが「負けた」と脱帽するワケ

渡辺謙さんと菊川怜さん以降のバージョンについて書かれていて、うんうんと納得するのですが、その前のバージョン、舘さんと娘さんバージョンの展開があってこその開花だと思います。

元々は石坂浩二さんがCMに出られてました。普通ですよね。
石坂浩二さんがCMするくらいだから、そこらのルーペより品質が良いのかな?程度です。

でも、その後のCM、舘さんと娘さんバージョンでは シニア世代より若い世代に訴求できています。しかもターゲットは一気に3者へ。

あのCMで「私も使っていい商品なんだ!」と思った人は多いのではないでしょうか。
ワインのラベルを見るのに、スッとルーペを出した舘さんもインパクトがありましたが、翌日、その娘さんがネイルの手入れにルーペを使ってるんですよね!

シニア世代と言ってしまうには抵抗がある舘さん世代、
さらにもっと若い娘さん世代にまで、あの1つのCMでターゲットを大きく広げてしまったわけです。

おまけに「ギフトにも最適」と。ルーペって贈り物にしてもいいんだ?!と驚いた方も少なくないのではないでしょうか?

シルバー手前世代、若年世代、&ギフト。
一気に3者に訴えているんですね。

ただカッコイイだけ、面白いだけのCMが氾濫する中、ターゲットを明確にして、視聴者が具体的に使用場面を想像しやすいCMになっているのは、ただただ脱帽、本当に凄いと思います。

みなさんのホームページでもアイデアを取り入れて、ターゲットを広げることが出来るかもしれませんね。
ターゲットを広げる時、いきなり広告ページとして1ページデザインするというのはかなりの冒険ですが、ワードプレスやブログ上でまずはそういう記事や写真を出して、ユーザーの反応を見ながら調整することができます。

例えば、若い世代や働き世代が主な顧客層なら、時にはもう少し上世代の方向けの内容やサービスを写真を添えてアップしてみる。同じメニューを紹介するのでも、心に刺さるポイントはユーザーの数だけあるわけですから、視点を変えた説明をするのがお勧めです。

反響があれば、きちんとした広告ページを作って更に訴求を強めたり、サイト内で目立つようにすれば良いわけです。
ワードプレスでは、そういった実験的な試みもいろいろできますから、ぜひチャレンジしてみてください。

前回は7つのSEO内部要素について書きました。
この7要素の中には、WEBデザイナー側がホームページを制作する中で行う施策と、クライアントの皆さんに考えていただかないといけないものがありますので、今日はクライアントの皆さんに考えていただきたい点をまとめます。

まず何より大事なのは「ユーザーのニーズを満たす良質なコンテンツ」。先の記事でも書きましたが、これがなければ始まりません。

こういったことを中軸に原稿を練っていきます。

コンテンツが練れたら、Googleのクローラーがページの内容を見つけやすい構造(ホームページの裏面)にするため&検索結果画面でクリックしたくなるようなページの紹介文を考えます。

ページの紹介文はもう少し長くても良いのですが、長いと検索結果画面(特にスマホ)でカットされますので、100文字程度にまとめます。ツイッターでページを紹介するような感覚でまとめていただくと良いのではないでしょうか。

厳密にいうと、この紹介文は記載しなくても検索エンジン側でページの内容を勝手に抽出してくれます。また、こちら側できちんと書いていても、ユーザーが検索したキーワードが入っている箇所が抽出されて表示されるので、必ずこの紹介文が表示されるというものではありません。
なのでまぁ、必須・・・とまでは言えないですが、真面目にSEOや運営に取り組んでいるサイトはやってます。

*原稿やタイトル、紹介文については、アドバイスも行っていますのでお気軽にご相談ください。

その他は基本的にはWEBデザイナー側が行っていく施策になりますが、モバイルフレンドリーやSSL化については、昔から運営されているホームページの場合、今から施策するには作業費がかかりますので、社内で検討いただく必要はあります。

表示速度については、サイトの仕様やデザインで変わりますので、制作に入る段階でクライアントさんとWEBデザイナーで相談しながら進めていくことになります。

前回、SEOの基本について書きました。
今日は実践に進んでいきましょう。

SEOは「内部要素」と「外部要素」に分けられます。
内部要素はホームページの制作や運営において自社でできる対策、外部要素は外側からの評価となります。

前回の記事「SEOの基本中の基本」でもご案内しましたが、良質なサイトを作っていくことが外部からの評価を上げていくことに繋がるので、「内部要素」を高めていくことについて進めてきます。

1)ユーザーのニーズを満たす良質なコンテンツ

まずは、ユーザーのニーズを満たす良質なコンテンツ
これがなければ始まりません。

2)Googleのクローラーがページの内容を見つけやすいHead構造

コンテンツができたら、Googleのクローラーがページの内容を見つけやすい構造にしていきます。

ホームページの面からは見えない裏面「HTML」にページのタイトルや概要を記載していきます。このタイトルや概要は、検索結果のページでも表示されます。表示される文字数はだいたい決まっているので、コンパクトにまとめます。

ユーザーはこの記載内容をみてサイトにアクセスするため、1番重要な要素といっても過言ではありません。検索順位は悪くないのにアクセスが少ない・・・という方はページのタイトルや概要を見直してみましょう。

検索順位、クリック数、クリック率はGoogleのアクセス解析ツールで確認できるので、日頃から確認しておきましょう。

3)文法に沿って読みやすい構造

ユーザーから見える表面のコンテンツも文法に沿って読みやすい構造にすることが大切です。
適度に見出しを入れたり、重要な箇所を強調しながら読みやすいページに仕上げていきます。ここで欲張って見出しを入れすぎたり、キーワードを強調しすぎると逆効果となるので注意します。

4)ホームページの構造をGoogleのクローラーに伝えるサイトマップ

ホームページの構造をGoogleのクローラーに伝えるサイトマップを作成。
クローラーがサイト内のページを見落とすことがないように、サイト内にあるページを整理したサイトマップを用意します。

5)ユーザーにストレスを与えない表示速度

表示速度も大切な要素です。

せっかくクリックしても、なかなかページが表示されずイライラした経験は皆さんもお持ちではないでしょうか?表示に時間がかかるとユーザーはストレスを感じてサイトから立ち去ってしまいます。
ユーザーにストレスを与えるような表示の遅いサイトはクローラーにも嫌われて検索順位にも影響が出てしまいます。特に、スマホでの閲覧が増えるようになってから表示速度も大切な要素となりました。

6)モバイルフレンドリー(スマホ対応している)なサイト

モバイルフレンドリー(スマホ対応している)なサイトかどうか。

現在はスマホからのアクセスがPCを追い抜いているサイトも多く、数年前からGoogleもスマホ対応していくようアナウンスしています。

新たに作られるホームページはほぼ全てスマホ対応ありきで制作していますが、スマホ普及前に作られたサイトだと未対応のところも少なくありません。
気がつけば順位が下がってしまっていたーーという場合もありますので、日頃から順位や競合他社のホームページも確認しながら対策を考えていくようにしましょう。

7)通信暗号化(SSL/https)

そして最近順位の指標に加えられたのがホームページの通信暗号化(SSL/https)です。

以前はクレジットカード番号を記入するようなショッピングサイトのカート周りだけでよかった通信暗号化ですが、Wifiの普及に合わせてホームページ丸ごとの暗号化が求められています。

Googleの検索順位の評価指標にも加えられましたし、Googleのブラウザ「クローム」ではSSL対応されていないホームページに警告メッセージが表示されるようにもなりました。

実際に問い合わせフォームに入力しようとしたユーザーから「警告メッセージが出ているから問い合わせできない」と苦情が入って、慌てて施策したサイトもあります。
また、安全なサイトと危険なサイトの見分け方として、朝の情報番組でサイトのSSL化について紹介されたこともありました。

SSL対応は検索順位だけでなく、実際足を運んでくれたユーザーにが安心してホームページを利用してもらうためにも重要な要素です。


前回、SEOをしたホームページを育てる重要性について書きました。
今日はSEOの基本中の基本、揺らぐことのない軸について書いておきたいと思います。

まず予備知識として・・・
現在よく使われている検索エンジンはGoogleとヤフーで、双方で約9割のシェアを占めています。ヤフーもGoogleの検索エンジンを使っているため、SEOはGoogleの検索エンジン対策と考えてください。

Googleの検索エンジンは日々進化していて度々アップデートされているわけですが、「ユーザーが検索して求めているもの(ニーズ)に合ったページを紹介する」ためにどんどん改良されていっています。

ユーザーに紹介した(検索結果に表示される)ページが、ユーザーのニーズに合っていなければ、Googleを利用する人が減ってしまい、広告収入も減少しますよね。Googleを使い続けてもらうためにどんどん改良されていっているわけです。

Googleは検索するユーザーのニーズを満たすために進化していることを考えると、SEOの基本は「ユーザーのニーズを満たすホームページを作ること」で、この軸が揺らぐことはありません。

ホームページを作る際、お店やサービス内容についての原稿を準備していただくのですが、

これらを整理して伝えることが大切です。
まずは「ユーザーのニーズを満たすホームページを作ること」を念頭にコンテンツを練ったら、次に大切なのが、「GoogleのWEBクローラーが情報を収集しやすく、評価してくれるWEBページに仕上げていくこと」となります。

  1. WEBページを公開するとGoogleのWEBクローラーが見にきて
  2. クロールしたページをデータベースにインデックスし
  3. 検索ユーザーのニーズ(キーワード)に合ったページを検索結果にランキング形式で表示→ここの順位アップを目指すのがいわゆるSEO。

皆さんも本を購入するには、タイトルや帯、目次をヒントに「どんな本か」「自分のニーズを満たしてくれるか」判断して購入しますよね。
中身がどんなに面白くても、何が書いてあるか見当がつかない本はなかなか手に取ってもらえないのではないでしょうか?

WEBページも同じように、Googleのクローラーが「どんなページか」「ユーザーのニーズを満たせるか」判断しやすい構造(HTML)にすることが求められます。
プロの作るWEBページが”違う”のはこの点で、クローラーが収集しやすい形になっています。

書籍に話を戻すと、読者の口コミや売れ行きも重要ですよね。
話題の本は目立つところに平積みされて、手に取ってもらいやすくなっています。

この点も同じで、ホームページの場合は「他のサイトからのリンク」がそれに当たります。そこに目をつけて、昔は「リンクを買う」手法が流行っていましたが、今ではスパム行為とされているため、この行為はNG。
外部サイトからのリンクを増やすために大切なのは、ユーザーのニーズを満たすサイトを作ることという基本中の基本に戻ります。

  1. ユーザーのニーズを満たすホームページ(コンテンツ)を作ること
  2. GoogleのWEBクローラーが情報を収集しやすく、評価してくれるWEBページに仕上げていくこと

基本中の基本、この2点を軸にSEO、ホームページを作っていきましょう!

インターネット上の集客は大きく3つに分けられます。

  1. 自社サイトからの集客
  2. インターネット上の広告
  3. SNS等のメディア

それぞれに長短や特徴がありますが、主にGoogleやヤフー等の検索エンジンで検索して自社サイトにアクセスしてくれたユーザーは、上質な顧客になってくれる可能性が高いと言われています。

確かにそうですよね。
ネット広告やSNSの投稿に惹かれてクリックすることは私もありますが、本当に欲しいと思っているものや必要なものは、検索して自ら探します。
自分が求めているものにヒットして出会ったサイトですから、広告やSNSでその時惹かれたものよりも熱心にページを見て、購入や申し込みまで至る割合も高いです。

実際にこれまでホームページをお作りさせていただいたお客様からも、ホームページ経由のお客様は、それだけサービスを探していた方なので、お店のファン、リピーターとなってくれる方が多いという声を頂戴してきました。

また、最近は大半の方がスマートフォンを持っているので、「知りたい」「欲しい」「行きたい」と何かニーズが生じればその場で検索することが日常になっていて、この、ニーズが生まれたタイミングを逃さないことも大切だと言われています。
広告やSNSではこのタイミングを掴むことは難しいですよね。

そしてSEOを施策した自社サイトは大きな資産となってくれます。
瞬発力では広告に軍配が上がりますが、広告は出している間はずっと広告費がかかります。けれど、自社サイトの場合は、日々の運営がそのまま積み重なって残っていってくれます。

ドメイン・サーバ代やある程度の運営費用はかかりますが、広告を出し続けることに比べるとうんとコストを抑えることができます。個人事業や小さな企業こそ自社サイトを充実させることが大切です。

運営費用については、最近はWordPressのようなご自身やスタッフで運営できるツールも充実しているので、運営費もほとんどかからなくなりました。
少し前にリニューアルさせていただいたホームページは、それまで検索対策をせず会社案内的に存在だけしていたホームページだったのですが、SEO対策をしながらWordPressで自社でどんどん更新していただけるようにしたところ、それまで年1件あるかないかの問い合わせが、週に何件も問い合わせが入るようになりました。

SEO対策をしたホームページを育てていくことの重要性を知る。
集客力があるホームページの第一歩です。

今日の昼間、とある大阪の有名百貨店で収録された番組を見ていたら、とても面白くためになる話がありました。

売り場の通路は真ん中や両端でお客さんが歩く速度が違うらしいのですね。その速度や目線に合わせて、ワゴンや商品の配置、売り場への入り口の幅も全てデータから計算されていたり、お客さんを無言のうちに誘導する目印が貼られているそう。

考えられているだろうとは思っていましたが、想像以上に緻密に計算されているのには驚きました。

ホームページを作るときも、統計データやユーザー心理を考慮してレイアウトやデザインを考えているのですが、もっと細かく徹底的に考え抜くと面白いだろうなと思います。

ホームページの効果をさらに上げるために、私自身これからも研究を重ねていかないといけないですね。

岡山市のアロマ&ハーブテラピーエステサロン フルール様のホームページをリニューアルさせていただきました。(前回のサイトはこちら

白+ピンクを基調に、サロン独自のメニューとして取り入れられているハワイのヒーリングメニューから、ハワイの写真やハイビスカスをエッセンスに加えています。

ご準備いただいたお写真がどれも光を含んでいて美しかったので、その光を壊さないように心がけてデザインしました。

最近のWEBデザインはシンプルなものが多いのですが、比較的多めに装飾も取り入れ、制作中も楽しく私自身も大好きなサイトの1つとなりました。

ワードプレス、スマホ対応、SSL対応

女性家庭教師派遣専門「エフ学習会」様のホームページをお作りさせていただきました。

女性家庭教師に特化されていることからピンクをメインに使っていますが、学習指導という内容から甘くならず、かといってシャープになりすぎずないように、信頼できて相談しやすい雰囲気を意識してまとめました。


オーパス英語学院様の特進個別コースのランディングページを制作させていただきました。

進学に特化したコースということで、熱心に勉強している受験生、進学後のキャンパスライフが浮かぶような写真を使い、熱意を促す赤をポイントに使いキリリとしたイメージで仕上げました。

*スマホ対応(レスポンシブ)でお作りしています。