harappa Office

大阪府堺市を中心に中小企業、個人事業主のみなさまのウェブマーケティング支援を行っています

スマホ対応のホームページって一体なんぞや。

   

8404993806_a1a3742c44_bphoto credit: 014/365 – Geek’s stuff via photopin (license)

ブログを更新しなかったここ1年間。仕事の立ち位置が変わったり、沖縄に行ってたり、家を買ったり(!)してました。いろいろインプットするばっかりで、そろそろアウトプットしないとな、とか思いはじめてます。harappa岡本です。

突然ですが。

ホームページのスマホ対応とはなんぞや。

なんだと思いますか?

猫も杓子も「スマホ対応」と叫ばれてきた時代はとうの昔に過ぎ去ったと思います。総務省も言ってます。まあこれは販売台数なんで、実際の人数とは違いますし、ひとり数台持ってることも珍しくない。猫も杓子も、と敢えて言わずとも、当たり前の世の中ですね。

スマホネイティブ、なんて言葉ももう古く感じます。

ホームページを運用している人は肌で感じているでしょうけど、よほど特殊なターゲットのホームページでない限り、スマホからのアクセスは日に日に増えていることでしょう。こうやってる今もどこかで。

そんな時代の「スマホ対応」とは一体なんぞや。

 

スマホでキレイに見えるのがスマホ対応か。

まあ、解のひとつといえばそうでしょう。

写真がスマホ画面目一杯に見える。文字がスマホで読みやすい大きさになる。メニューが左右に格納されてコンテンツを読むのに邪魔にならない。どれも「スマホ対応」と言えばそうでしょう。スマホ対応させる一つの目的に「PC向けに作成したホームページを、増えてきたスマホ来訪者にも見やすく情報を提供する」というものがあるからでしょう。とはいえ、とはいえですよ。普段スマホでホームページを見る時に「あ!キレイにスマホ対応されてる!見やすい!」なんて思うでしょうか。いちいちそんなこと考えながら見てないですよね。

スマホにはたいていアプリが入ってます。アプリはもちろんスマホでしか使わないので、スマホで見るためのレイアウト、デザインになっています。そんなアプリを使い慣れてる人にしてみたら、見た目がキレイにスマホにハマってるホームページなんて、当たり前。

 

フリック(※)できるスライダーを付けるのがスマホ対応か。

ついやりたくなりますよね。作り手としては。

ぶっちゃけ既にあるホームページをスマホ対応させるとき、やりたくなるんですよ。PC画面より小さいスマホ画面は明らかに情報量が減る。だったら横にスライドさせてたくさん見せられるようにしよう。うんうん。

下にスクロールさせる時に指に引っかかって邪魔です。

※フリック:タッチスクリーン上で指を素早く動かしたり弾いたりして行う操作全般のこと。「フリック」(flick)とは、「素早く動かす、弾く」という意味であり、この場合、指のスライド(弾き)のことを表しており、タッチスクリーン操作全般に用いられる表現である。タブレットPCやタッチパネル式の液晶ディスプレイでのスライド操作のことを、単にフリックとも呼ぶ。〜Wikiより

 

じゃあ、どうするねん。と。

 

ホームページをスマホでどう見る、どう使うかに合わせて、最適な環境を準備することではないか。

と思うんですよね。全てはそのホームページに訪れた人が、何のためにそのホームページに訪れて、何を見て、どう行動するのかを見定めて、そのサポートをするイメージで、見た目、機能、環境を準備すること。これがスマホ対応なんじゃないかと。

 

ECサイト

  1. 膨大な商品群の中から、目的の商品を発見しやすく、視認性が高い状態
  2. 比較検討をする商材の場合、スペックやその他情報が横並びで見えること
  3. 個人情報を入力させる場合、極力短時間、少ない項目で完了すること
  4. これらすべてを、イスに座って、パソコンの前に腰を据えて行わないということ

実店舗(サービス業)

  1. 第一印象でサービスの特徴が分かること
  2. 価格、サービスメニューが簡潔に書かれていること
  3. 連絡先、店舗への道案内コンテンツへどこからでもアクセスできること
  4. ホームページを閉じた後、再度、連絡先、道案内コンテンツへ素早くアクセスできる環境を用意すること
  5. サービス利用後、二度目以降に思い出してもらうこと

ブログ

  1. 第一印象でどんなコンテンツが書かれているブログか分かること
  2. 文字サイズ、配色、行間が適切であること
  3. スキマ時間で読める、適切な長さの文章であること
  4. 屋外で閲覧するに耐える配色、コントラストであること
  5. SNSへの連結がスムーズであること

 

ざざーっとこんな感じでしょうか。まだまだ考えられます。もともとホームページを最初に作るときに考えるべきことがほとんどです。ただちょっと「スマホで見ている」ということを念頭において、ユーザーを想像するだけだと思います。

ヘタに今のPC向けのホームページを前提に、スマホ対応を考えると、あれも必要、これも必要、入らないからここに押し込めて、ってなる。

スマホで見ているということは…

  • 長々と見ている時間が無いのかもしれない
  • すぐにそのサービスを求めているのかもしれない
  • そもそも落ち着いた環境、シチュエーションじゃないかもしれない
  • SNSでシェアされるかもしれない

などなど。少し想像(妄想)してみると、必要なものと不必要なものが精査されてくるような気がします。

 

スマホ対応されてないこまったちゃん。

実際のブツは見せませんが、今まであったこまったちゃんを最後に紹介しましょう。

 

縦長コンテンツ。親指つりそう。

きっとPCではキレイな文章でライティングされているのでしょう。でも長い。せめて2ページに分割してくれ。フリック疲れる。親指つる。

 

よさげなお店なんだけど、一体どこに?

デスクワークで身体バキバキ。ちょっくらほぐしてもらいたい。値段も手頃で近くらしい。って住所しか書いてない。いちいち住所コピーして、マップアプリにペーストして、ってまた指つる。めんどくさいから電話して道案内してもらおうと思ったけど、電話番号どこ?

 

SNSで流れてきた!アクセスしたけど間違えた?

友達から面白い情報がキレイな写真と一緒にシェアされてきた。アクセスしてみると、さっきの写真はどこに?あれ?全然違うサイトにきちゃった?うーん。

 

なんだかんだで技術的な話に流れそうなスマホ対応。

もうちょっとじっくり考えてみてはどうだろうー。

この記事を書いた人

harappa 岡本
harappa 岡本harappa 代表/Web解析士/愛玩動物飼養管理士
1980年大阪府堺市生まれ
広告・ウェブ制作ディレクター、プロデューサーを経て、2012年harappaとして活動開始。紙媒体、ウェブ媒体問わず、企画、要件定義、プロジェクトマネジメント、制作に関わるひととおりのディレクション、プロデュースの実務。ウェブサイトのアクセス解析、ヒューリスティック分析など調査実務、最近ではSNS運用やウェブに関連する講師もやっています。
もうちょっと詳しい自己紹介はこちら。
facebookページでは裏話なんかも。

 - スマホ, マーケティング思考

  関連記事

超回復って知ってますか?筋トレしまくるのはダメかもしれない理由。

photo by kamshots 梅雨なのにあんまり雨降らないですね。水不足大 …

広報活動は計画的にね!
広報活動は計画的にね!

ご無沙汰しています、愛媛県松山市の「ぬこファクトリー株式会社」の門屋と申します。 …

EC/通販サイトのメールマーケティングにまんまとハマった一部始終。

photo by jjsala 今日2013年10月27日は大阪マラソンでした。 …

ゴールばかりを見ていると、大事なものを失くすかも。というリスク。

photo by Elsie esq. この仕事するようになってから男らしくなっ …

Youtubeで動画をやりたい人はとにかくYoutubeを見まくれ!話はそれからだ!

「Youtube メリット デメリット」で検索されてます 多いんですよ、最近この …

アメブロのリンクがnofollowになってたらしい。で、いつ独自ドメインに乗り換えるの?

photo by Hunter-Desportes はいはい、今でしょ今でしょ。 …

徳田耕太郎 (Tokura) は4位で残念。しかしレッドブルのイベントはいつもニクい。

photo by by *_* 9月も後半だというのに、まだ蒸し暑いですね。短パ …

釣れるかな。不安です。
「ウェブサイトどうしよう?」漠然とした不安を解消する3つのポイント

by robeposse [flickr] 今日は僕のこれまでの制作サイドの経験 …

Youtubeを使うメリット・デメリット

    昨今 “Youtube”とい …

タスクで一杯になったらすべてを吐き出す。ホワイトボードを使った脳内整理のススメ。

photo by Karen Roe 2013年後半〜2014年前半までの約半年 …

mautic is open source marketing automation