タグ: サイト企画

【コンテンツ部分】きれいな写真やイラストをWebに掲載するためのポイント

28 11月 17
森麗子

No Comments

写真やイラストなどの画像の役割をみなさんはご存知でしょうか?

Webのコンテンツは「文章」と「写真・イラスト」で構成されています。

どちらも重要な要素だといえますが、Webでは特に「写真・イラスト」の効果が大きいと言われています。

Webを閲覧した訪問者は、そのサイトをひらいた時に見る最初の画面(ファーストビューと呼ばれます)が例えば文章のみだと、その内容を読むために時間がかかります。

Webの業界で、現在は「3秒ルール」と言われるものがあります。それは閲覧者がそのWebを見た時に、「ページを開いて3秒以内にそのページが自分にとって役に立つか、有益かどうかを判断する」

というものです。回線速度が緩やかな時代は8秒ルールとも言われてました。回線速度の進化で現在は3秒が勝負なのです!

そのため、ファーストビューへ長々とした文章や、そのWebコンテンツと関係性のない写真やイラストをWebに掲載しても、そのコンテンツ、内容は無意味になります。サイト訪問者もすぐ離脱してしまうのです。

「何をどのように伝えることができるか」を視覚的に、そして瞬時にできるのが、写真やイラストだと言うこともできます。

これはアナログなものでも同様かもしれません。

みなさんは、雑誌や絵本をご覧になる時、写真やイラストを流し読みしたことはありませんか?流し読みしたとしても、だいたいの内容を把握できると思います。

それは、イメージとして頭に「写真」や「イラスト」が残るからです。

Webも流し読みされやすい傾向にあります。そうすると、印象が残りやすい「写真」や「イラスト」がここで重要となってきます。

PCにかぎらず、スマートフォン、タブレットでWebを流し読みするのにスクロールしますが、気になる写真などがあると、一度その動きがストップしませんか?そして、その周辺を「読む」という行動をとると思います。

そうなんです。ここで、「文章」が活きてくるのです。その文章がわかりやすく、閲覧者の心にぐっとくるものであればあるほど、そのコンテンツの価値が自然と上がってくるのです。

結果として、「写真・イラスト」と「文章」はどちらも重要なWeb要素なので、それらをバランスをよく、効果的に利用し、より良いWebの構築をしていきましょう。

まず今回は、そんなに“重要”だった「写真」をより良く活用しているWebサイトに共通したポイントをご紹介いたします。

ショッピングサイトのケース

→ショッピングサイトは「商品を買いたい!」と閲覧者に思ってもらえるように、購入までのビジュアル、商品説明がわかりやすく、導線重視で制作します。

カートボタンやお問合わせボタン等の配置方法、ショッピングサイト使用方法のガイダンスページや、メニューなどなど、すぐ見つけられる、目立つ位置に配置します。

利便性への配慮ももちろん大切ですが、それ以上にショッピングサイトのトップページに表示する写真は、その商品・サービスの特徴をしっかりと捉えたもので、インパクトのあるものが効果的で必要不可欠です。

サービス業のサイト

→飲食業、レジャー施設など、サービスの品質を売りにする業態の場合、そのサービスの見せ方が大事です。

レストランなどのサイトでは、料理などをきれいに大きめに見せることで、みずみずしさや彩り、シズル感のある印象を受けます。

写真をトップページ全体に使う時は、こだわりるものにフォーカスした写真を掲載した方がより効き目があります。

コミュニティサイトのケース

→コミュニティサイトやポートフォリオサイト等、写真自体がコンテンツとなっているWebサイトは、写真の表現方法にこだわりたいですね。

動的なスライドショーなどフォトアルバムにしたり、画像を中心に表現し文字を抑えることで写真を際立たせることができます。

テンプレートのレイアウトで適切なものをチョイスすれば、プロでなくても良質なサイトができるのではないでしょうか。

【コンテンツ部分】サイドに表示する項目を考える

27 10月 17
森麗子

No Comments

サイドの表示項目はユーザーの道しるべ

ユーザーに長時間滞在してもらえるホームページを作るには、どうすればよいでしょうか。

例えば長期間滞在したいホテルを想像してみてください。
・小腹が空いたらすぐにおつまみ的なものが部屋に用意してある。
・のどが乾いたらその時飲みたいものが部屋に用意してある。
・部屋が寒ければすぐにブランケットが用意できる。
・遊びたくなったら、すぐにできるアクティビティを提案してくれる

などなど、お客さんの欲求を「すぐに満たす」ことがポイントになってきます。

居心地の良いホームページも同じことが言えます。

お客さんが見たいものがすぐに見る事ができる。
お客さんがほしい商品が、すぐに見る事ができる。

「お客さんが「すぐに」したいことを提案できるようにする」
それがサイドの役割です。

「あ、この会社はどこにあるのかな」 →会社情報がサイドに必要です。
「この商品以外に類似商品はあるのかな」 →カテゴリーへのリンクや、同種の商品のバナーが必要です。
「問い合わせがしたいな」 →お問合せフォームへ飛ぶリンクや電話番号が必要です。

そのページを見ているお客さんが次にどんなことを考えるかを予測する必要があります。

お客さんに次のアクションを起こしてもらえるよう、サイドには出来る限りたくさんのコンテンツを用意しておきましょう。

では、サイドにはどんなものを表示すればよいのでしょうか?

サイドに必要な項目(下記は一例です)

・カテゴリー(固定ページの主要なページ)、必要があればカテゴリーも種類ごとに分ける(会社情報のカテゴリー、商品情報のカテゴリーなど)
→メニューで表示項目を設定後、表示する場所のウィジェットでそのメニュを選択する

・バナー(上記のカテゴリーでよりわかりやすく表示したいページ、よりアピールしたいページや商品を視覚で印象付ける)
 →ウィジェット内カスタムhtmlで編集

・会社情報(会社の外観写真と会社名、住所、電話番号、FAX番号、メールアドレス、営業時間など、ここを見れば一目で基本情報がわかるようにしておく)
 →ウィジェット内カスタムhtmlで編集

・お問合せや資料請求ボタン(すぐにアクションを起こせるよう、目立つ色で、目立つ場所に置く)
 →ウィジェット内カスタムhtmlで編集

・ブログの更新情報
 →ウィジェット内最近の投稿で設定

・ECショップであれば新商品情報、売り上げランキング、営業日カレンダー
 →Welcartであればウィジェット内にて設定する項目が表示されている。

・FB表示窓、SNSボタンなど
 →FBのページプラグインから表示させたいページの埋込タグを取得、ウィジェット内カスタムhtmlに張り付け

・その他、検索窓、アフリエイト広告、動画など  

サイドの項目をおろそかにするべからず

サイドを作りこんでいくことは、サイトの顔であるヘッダーやファーストビューの次に重要な事です。
サイドの作りこみをおろそかにすると、お客さんに長時間滞在してもらえなくなり、お客さんは「必要な情報」までたどり着けずに
離脱してしまうことにもつながりかねません。
そうならないためにもサイドの項目は熟考する必要があります。

【コンセプト部分】ホームページの構成

12 10月 17
森麗子

No Comments
構成図を作る

構成図の作成は、ホームページを作るときに重要な第一歩です。
手書きでも良いですし、エクセルなどのオフィスソフトを使うのも良いです。ご自分のやりやすい方を選んで下さい。

 1 掲載したいコンテンツを書き出し、ジャンル分けする
   そのサイトに掲載したいコンテンツを出し、ジャンルごとに分けていきます。
   ジャンルには適切な名前を付け、見る人が下層のコンテンツを探しやすいよう留意しましょう。
   場合によってはジャンルを細分化する必要が出てくるとは思いますが、階層が深くなりすぎると
   利用者がコンテンツを探し出すのが難しくなってしまいます。

 2 ページの優劣を決める。
   どのページが最も重要なのかを考えてみて下さい。
   「提供したい内容」「利用者が求めていると考えられる内容」
   逆に、「あまり見られないであろう内容」
   この優劣を決めることで、サイトのメニューの順位やデザインを考える際に役立ちます。

実際のホームページの構図

ホームページの構図は、大きく分けて【サイドメニューがある】か【ない】かの2種類です。
サイトの目的によって適した構図を選びましょう。

 1 1つのページをじっくり見て欲しい   → <サイドメニュー無し>
   例)利用者の目的がはっきりしている・興味のある人にじっくり読んで欲しい

 
 

 2 都度、利用者が求める情報を見て欲しい → <サイドメニューあり>
   例)利用者の見たいものが複数ある・別々の内容を比較して欲しい

 
 
→もっと細かなレイアウトの説明はこちらから
https://honmaru.red/dt/layout.html

ホームページに掲載する主な要素

特殊な構成でない限り、ホームページに掲載する要素は概ね決まっています。
以下に代表的な物を挙げていきます。

<全てのページに掲載>

 ・ロゴ/サイト名
   →サイトの上部に掲載します。左に寄せるのが一般的です。

 ・各ページへのリンクメニュー(ヘッダーメニュー/サイドメニュー)
   →ロゴ/サイト名の下(ヘッダーメニュー)やサイドエリア(サイドメニュー)に掲載します。
    ヘッダーメニューにはそのサイトの主だったコンテンツへのリンクを付けましょう。
    ヘッダーメニューがある場合のサイドメニューは、第2階層以下のページへのリンクや
    外部サイトや「キャンペーン」等の一時的に目立たせたいページへのリンクを掲載します。

 ・ホームページ運営者の連絡先
   →利用者が問い合わせやすいよう、全てのページに掲載するのが好ましいです。
    一般的にはページの最上部右上(ヘッダー)と最下部(フッター)に載せます。
    連絡先の情報を別ページに持たせ、リンクのみを掲載するケースも多いです。

<トップページ>

 ・メインビジュアル
   →ホームページのアイキャッチとなる部分です。
    代表的なサービスや商品のビジュアルを載せると、何のサイトか印象づけられます。

 ・主なコンテンツのアピールエリア
   →主だったコンテンツ、よりアピールしたいコンテンツを、
    簡潔な文章とビジュアルなどを使って表現します。
    コンテンツの詳細を載せたページがあれば、そこへのリンクも忘れずに。

 ・新商品、キャンペーン、イベント等のバナー
   →一時的にアピールしたい事をビジュアルバナーにして掲載します。
    そのサイトの「売り」がひと目で分かる他、
    常時バナーを入れ替えることでホームページに新鮮味を持たせられます。

 ・ニュース一覧
   →上と同じくホームページに新鮮味を持たせ、最新情報を見てもらいやすくなります。
    ここを常々更新することで、リピーターに定着してもらう事も期待できます。

 
 

<サイトマップ>
  サイトの全ページへのリンクを一覧にした物をサイトマップと呼びます。
  このページがあると、メニューに掲載しきれなかった全コンテンツを見ることが出来、
  利用者がサイト検索をする際に役立ちます。

<コンテンツページ>
  オリジナルのコンテンツを分かりやすくまとめて掲載しましょう!

 
 

→もっと細かなサイト構成はこちら
https://honmaru.red/dt/page-configuration.html

そのページに何を入れるのか、何を目立たせるのか、使用者に【分かりやすい】ホームページを意識して、要素を構成していきましょう。

【コンセプト部分】ホームページのタイプ

12 10月 17
森麗子

No Comments

「ホームページを作るための目的は決まった、けれどどの様なWEBサイトを作ったら良いのだろう?」

世の中には様々なタイプのホームページ・WEBサイトがあります。
商品を販売する「ECサイト」、会社情報を載せた「コーポレートサイト」等など。

ここでは、目的に沿ったWEBサイトのタイプを選べるよう、それぞれの「WEBサイトの種類」を解説します。

コーポレートサイト

会社の情報を伝えるためのホームページです。
<目的>
 ・会社の情報を知ってほしい
 ・取引相手を増やしたい
<主に掲載するもの>
 ・会社概要(会社の所在地や連絡先、役員名、資本金、取引先など)
 ・事業内容(サービス、取扱商品など)
 ・活動内容(社として取り組んでいる事業以外の事柄)
 ・企業理念
 ・採用情報
<例>

ショップサイト

店舗の情報を伝えるためのホームページです。医院・学校などのサイトも「ショップサイト」の位置づけになります。
<目的>
 ・来店客(患者・生徒)を増やしたい
 ・予約を取ってほしい
<主に掲載するもの>
 ・店舗概要(店舗の所在地や電話番号、営業時間など)
 ・提供サービス、商品案内
 ・予約受付案内 or 予約フォーム(予約を取ってほしい場合)
 ・コンセプトや店舗写真
 ・採用情報
<例>

ショッピングサイト・ECサイト

ホームページ上で通販ができるWEBサイトのことです。
購入したい商品を選び、届け先や支払い方法を入力するだけで購入手続きが完了します。
作成には、専用のシステムが必要な他、クレジットカードで購入出来るようにするためには代行会社と別途契約する必要もあります。
<目的>
 ・商品・サービスをネット上で売りたい
<主に掲載するもの>
 ・商品・サービスの情報・価格と、購入のためのフォーム
 ・ネット通販の流れや、送料や手数料など商品以外の料金
 ・販売会社の情報や免責事項(法律上必須)
<例>

プロモーションサイト

特定の商品やサービス、イベント等を紹介するためのホームページです。その商品を売りたい・認知して欲しい特定の期間のみ公開するのが一般的です。
コーポレートサイトやショップサイトの一部ではなく、一つのサイトとして作ることで、より商品・サービスのイメージをアピールしやすくなります。
<目的>
 ・商品やサービス、開催イベントを認知させたい
 ・資料請求やお問い合わせを増やしたい
<主に掲載するもの>
 ・商品・サービスの情報
 ・購入案内(販売店の紹介、受付方法など)
 ・販売会社の情報や免責事項
<例>

ブランディングサイト

主に商品やサービスのブランドイメージを構築するために制作されます。
商品・サービスの他に、会社や地域、農産物などの限定的でない物のイメージ向上の手法として用いられます。
<目的>
 ・ブランドイメージを認知・向上させたい
 ・他社と差別化したい
<例>

ランディングページ

1ページのみで構成されたホームページのことを、ランディングページ(略してLP)と呼びます。
主にWEB上のチラシという位置づけで、商品やサービスを案内するために作られます。
<例>

ポータルサイト

インターネットで情報を集める際の【入り口】となるWebサイトです。
検索エンジンから様々な情報へアクセス出来る他、ニュースやショッピング等の外部コンテンツへ誘導します。
大手のポータルサイトとしてはYahoo、infoseekなどが挙げられます。
この他、特定の職業の人や地域住民、美容や旅行に興味のある人など特定のターゲットに絞ったサイトもあり、
飲食店、求人情報、不動産物件情報等を集め、検索できるサイトもポータルサイトと呼びます。
より多くの情報を集めるため、利用者自らが発信できるシステムを備えたサイトもあります。
<目的>
 ・広告収入を得たい
 ・世の中の情報を集約し発信したい
<主に掲載(搭載)するもの>
 ・検索エンジン
 ・外部コンテンツへのリンク
<例>

ブログサイト

ブログは、リアルタイムで情報を発信、同時にアーカイブ(記録に残す)するサイトのことです。
ニュースや、これからの計画等、伝えたいと思ったタイミングで情報を発信することが出来ます。
また、すでに発信された情報を時系列で保存し「カテゴリー」「タグ」「検索」機能等を用いて後から探しやすくなるというのも魅力です。
SEOに強いという特製から、多くのアクセスを得る目的でコンテンツを充実させているブログサイトもあります。
<目的>
 ・広告収入を得たい
 ・自社のニュースや近況をスピーディに提供したい
 ・顧客に親近感を与えたい
<例>

リクルートサイト・採用サイト

求職者へ自社のアピールを行うためのサイトです。
<目的>
 ・新入社員を獲得したい
<主に掲載するもの>
 ・説明会などの就職イベント情報
 ・募集要項
 ・会社概要(会社の所在地や連絡先、役員名、資本金、取引先など)
 ・他、求職者へアピールする情報
 ・募集案内(エントリーフォームの設置など)
<例>

サポートサイト

製品やサービスの取扱、契約方法などを掲載したサイトです。
電子機器や通信サービスなど、取扱いが難解な製品やサービスについて細かく説明しています。
利用顧客が、問い合わせるより前に問題を解決できるよう作成し、問い合わせ対応の手間を減らす効果が望めます。
より細やかなサポート情報を的確に届けるため、アーカイブ機能があるブログを活用して作られたサポートサイトも多数存在します。
<目的>
 ・問い合わせ対応の手間や人件費を削減したい
 ・マニュアルを掲載したい
<主に掲載するもの>
 ・サポート対象商品・サービスの説明
 ・よくある質問(FAQ)
 ・お問い合わせフォーム
 ・サポート元の情報(連絡先など)
<例>

イントラサイト

社内のコミュニケーションのために制作されるサイトです。
基本的には、一般向けに公開することはありません。
<目的>
 ・社内での情報の共有したい

【コンセプト部分】サイトの目的を明確に

12 10月 17
森麗子

No Comments

多くの人にホームページを見てもらったとしても「このホームページは一体何?」と思われてしまってはいけません。
伝えたいものが伝わっていないのですから、せっかくホームページを作ったとしてもその意味を成さないからです。

・そのサイトで商品を売りたいのに、売れない。
・広告を打ったはずなのに、顧客が増えない。

悩みは色々あるかとは思いますが、そもそもそのホームページは顧客になってくれる様な人に見てもらえているのでしょうか?

人は、ホームページに「目的」を持って訪れる

そのホームページにはどの様にして人が訪れるのでしょうか?
訪れる方法は大きく分けて2つ考えられます。

 ・キーワード検索
 ・広告(ネット・チラシ・ポスター等)

多くの場合、GoogleやYahoo!等の検索エンジンでキーワードを打ち込み、
出て来たリンクの中から目的に近いページを選んでアクセスしていると考えられます。
つまりホームページに訪れる人は、この「目的」を達成させられる情報を探しているのです。
この情報が提示されていなければ、その人にとってそのホームページは見る価値がありません。

したがって、ホームページを作る上で大事なことは以下の通り。
 ・提供する商品・サービス・それに関連した情報が明示されていること。
 ・それらの情報が分かりやすいよう配置されていること。
 ・「名前と概要→詳細」という様に、段階的に情報を受けられる構成になっていること。

アクセスしてきた時に探していた情報をすぐに見つけてもらえる様工夫することで、訪れた人は興味を持ってホームページを見てくれます。

「目的」を達成させるコンテンツを作る!

t size-full wp-image-9743″ />

人はどんな目的を持ってホームページを訪れるのでしょうか?
そのパターンを幾つか考えてみますと、

飲食店なら「営業時間はいつか知りたい」「予約はできる?」「カードを使いたい」
メーカーなら「◯◯という製品の情報が知りたい」「不良品の交換や返品をしたい」
病院や歯科医院なら「料金はいくらぐらいになる?」「保険は使える?」

これら、訪れた人が知りたい情報に答えるコンテンツを作ります。

例えば、上に挙げた利用者の目的に対する答えはこちら。
「予約はできる?」→予約フォームを用意する
「◯◯という製品の情報が知りたい」→カタログページを用意する
「不良品の交換や返品をしたい」→返品・交換対応の手順を載せたページとお問い合わせフォームを用意する
「料金はいくらぐらいになる?」→料金表を用意する

見出しをつけて、文章を簡潔に、分かりやすく。

目的を達成させるためのコンテンツを作っても、そのページに文章が長々と書いてあったり、訪れた人は求めている情報を見つけること無くそのページを離れていくでしょう。
だって、その文章の中に自分の求めている情報があるかどうか、分からないのですから。

大事なのは「訪れた人が求めているであろう情報がはっきり分かる」こと。
相手の質問に対して適切に答えるつもりで、簡潔な内容を作成することです。

文章を分かりやすく見やすくするためには「見出し」を付けることが大事です。

見出しを付ける上では、以下の点が
 ・求められている(と考えうる)質問の「答え」となっているか
 ・その文章の内容を簡潔に表現できているか
 ・ターゲットに役立つ情報かどうかが分かるか

ターゲットを明確にして、ブレの無いコンテンツに!

ターゲットとは、サービスを利用するであろう利用者の事です。
ターゲットの設定には、年代や性別・職業や家族構成の他、「◯◯に興味を持っている人」「××に悩んでいる人」など、その人の好みや課題も盛り込んで考えてみましょう。

このターゲットを絞ることで「読む人にとって役立つ情報ばかりが載っている」コンテンツを作ることが出来ます。

「興味のない事ばかりが載っているページ」
「ためになる事が沢山載っているページ」

どちらのページをじっくり読みたいと思いますか?

ホームページに掲載すべきこと

28 10月 15
北川 哲平

No Comments

ホームページ制作において大切なのが、相手が求めている情報を掲載することです。そうすることで、お客様の満足度も高まり、会社の認知度をより高めることに繋がります。ホームページ作成を依頼する前にはしっかりと掲載する情報をまとめておきましょう。
 

企業情報について

 
ホームページに企業の情報が掲載されていないと、お客様は不安に思うかもしれません。そんなお客様の不安を取り除くためにも、企業名をはじめ、代表者名や所在地、事業内容など、企業の情報を詳しく掲載することが大切です。企業の情報を明確に伝えることでお客様からの信頼度も高めることができます。また、代表者と社員、それぞれの写真やコメントを掲載することで、より身近に感じてもらうことができます。
 

内容が充実したコンテンツ

 
お客様は悩みや疑問を解決する情報を収集するためにホームページにアクセスしているため、見た人に対して役立つ情報を提供することが大切です。役立ちそうだと思ってもらってこそ、商品やサイト自体に興味を持ってもらうことができるため、内容が充実したコンテンツを掲載しましょう。
 
例えば単なる商品やサービス紹介をするのではなく、開発に携わった人の想いを伝えるコンテンツや、質問に答えるコンテンツ、この商品を使うことで得られるメリットを紹介するコンテンツなどがあると良いでしょう。このようにコンテンツの質を高めることで好印象を残し、ホームページの滞在時間にも良い影響を与えてくれます。
 

当社では1万円、3万円という格安でホームページを持って頂けるサービスを行っております。ホームページ作成のご依頼はぜひお任せください。オリジナルデザインや運営支援のアドバイス、コンサルといったオプションをつけることもできますので、クリエイティブな部分をお求めの方も安心してご依頼ください。企業の顔ともなるホームページだからこそ、失態は避けたいものです。ホームページに関することならお気軽にご相談ください。