Webサイト制作時に制作者が気にすることとは何でしょうか。
フォントの単位、リンクホバー時のUI設定……
などなど気にしなければいけないことは多々ありますね。
最初の最初に決めておいたほうがいいことは、やはりこれではないでしょうか。
【対応ブラウザ】
これを決めないことにはマークアップ、CSSの対応や使用するjQueryの決定がしにくいですね。またモバイルファーストと言われているこの時代、スマートフォンのブラウザも気にしなければならないでしょう。
この辺りは、ターゲットユーザーのブラウザ利用状況によっても設定が変化してくるのではないかと思います。
さて、世の中にはたくさんのサイトがありますが、そのうちの何割がターゲットユーザーの動向にフィットしたサイトに仕上がっているのでしょうか。
今回ジャンルの異なる２つのサイトを例にとり、Google Analyticsレポートからそのサイトの抱える問題点をピックアップしてみました。
このサイトならこんな仕様にしたほうがいいのに……。
ユーザーの傾向がこうならここをもっとこうして……などなど、サイト制作の方針を一緒に考えていきましょう。
※最近の動向を知るためにデータは直近３ヶ月のものを使用しています。
ケースA：あるグラフィックデザイナーのサイト
ターゲットユーザー：グラフィックに興味のある人、グラフィックの仕事を依頼したい人。
現在のブラウザ対応状況：Internet Explorer8～11、Google Chrome最新版、FireFox最新版、Android4.0以上に搭載のブラウザ。
ではこのサイトを訪れるユーザー層を調べてみましょう。
解析結果によるとこのサイトのユーザーには以下のような特徴がありました。
- ユーザーの住んでいる国層が幅広い
- 使用しているOSはWindows、次にAndroid
- 使用しているブラウザはGoogle Chromeが主流、次いでOpera。FireFox、Internet Explorer、Safariはごくわずか
- 新規訪問ユーザーがわずか20％で、8割はリピーターによる訪問
- ユーザーの5割がモバイル端末からのアクセスで、そのうち9割がAndroidユーザー
ケースAは名づけるならば国際派サイト。
ブラウザ対策がよくされていますね。
気になるのはSafari、iOS対策がされていないところでしょうか。
訪問モバイルユーザーの9割がAndroidユーザーなのですが、ユーザーの中にiOS使用のユーザーもいるので、取りこぼしのないように、という意味ではiOS対策をしておいてもよいかもしれません。
今後タブレット端末からのアクセスも増える可能性があります。
また、デザイン系の業種の方の中にはMacユーザーも多くいらっしゃいます。そちらも取りこぼさないように、Safari対策をしておくのもよいと思われます。
先を見越した対策というものをしておくとなおよいと思います。
世界中から閲覧されていることが大きな特徴のこのサイト、外国の方がよりコンテンツを楽しめるように、2ヶ国語対応をするとよいかもしれません。また、どの国の人でも容易にわかるUI設計をするとよいと思われます。
また、リピーター率が高いようですが、それは言い換えると新規ユーザーのサイトへの定着が停滞しているということになります。新規ユーザーの方を取り込む施策が必要なようです。
ケースB:あるエンジニア系ブログサイト
ターゲットユーザー：エンジニア系の仕事をしている人、エンジニア系の技術に興味のある人。
現在のブラウザ対応状況：各種PCブラウザ最新版に対応。Wordpressのモバイルサイト表示機能を利用。
ケースBはとがったブログ系サイト、とでも名付けられるでしょうか。各種最新ブラウザにのみ対応させた、ちょっと珍しいサイトです。この設定には理由があり、最新ブラウザで自らCSS3等の動きを確認するためだそうです。
そんなとがったブログ系サイトのユーザー層は、以下の通りです。
- ユーザーの国は9割以上日本
- 使用OSはWindows、Macがそれぞれほぼ40%、AndroidとiPhoneはそれぞれ3%前後
- 使用ブラウザは70%以上がGoogle Chrome
- 訪問パターンはリピーターが4割、新規が6割
サイトの性質上から最新バージョンの各種ブラウザにしか対応していないこのサイト。サイトのあり方が明確なので、細かなクロスブラウザ対応は必要ないでしょう。注目すべきところは、MacユーザーとWindowsユーザーの数がイーブンだというところです。各OSの主要ブラウザでの動作確認をきちんとしておくことが望ましいと思います。
こちらのサイトはWordpressを使用されているということで、モバイル端末で見た時にもほぼ崩れなくサイトが表示されていました。モバイル端末からのアクセスが少ないので、対策を立てるかどうかは迷うところですが、ユーザーの取りこぼしを減らす、という意味では、対策をしておいてもよいのではないかと思います。
2つのサイトを例に、ユーザー対策の在り方を見てきました。
ユーザーの動向はサイト構築、更新に際して大事な要素です。ユーザーが9割以上モバイル端末からアクセスしているサイトでInternet Explorer対策をしても無意味です。
ユーザーの動向を正しく認識し対策を立てることが大切です。
今回対策を探していく中で悩む局面が、ありました。それはごく少数派の項目をどう扱うかです。少数派は、先にも述べたように取りこぼしを防ぐ、という意味で対策をとることもありますが、日々進化するWeb制作技術との兼ね合いで切り捨てることもあります。
ケースBのとがったブログ系サイトのようにCSS３をフルに使いたいがために最新ブラウザ以外を切り捨てる、というのは、その極端な例となるでしょう。実装したい技術のブラウザとの相性がとても重要な切り捨て判断基準になってきます。
また、取りこぼしを防ぐという観点からのブラウザ対策については、本当に行う意味があるかを吟味する必要があります。
吟味材料の一つとして、最近のブラウザシェア状況があります。
WebブラウザシェアランキングTOP10（日本国内・世界）
https://webrage.jp/mobile/data/pc_browser_share.html
日本国内スマートフォン(スマホ)・シェアランキング（2015年8月）
https://webrage.jp/mobile/data/sp_share.html
このサイトの情報を見ると、国内では依然としてInternet Explorerの利用が多いようです。それと双璧をなすGoogle Chromeは対策から外せない要素となるでしょう。
一方海外ではGoogle Chromeの利用率が高いです。ケースAの国際派サイトでは、場合によってはInternet Explorer対策を省略してもよいかもしれません。
こういった国内外のブラウザやOSのシェア状況は制作時には無視できません。
こまめに情報を取得して適切な対策をとっていけるようにしたいものです。
さて、あなたのサイトはどんなサイトでしょうか？
どんな対策をとっていますか？
これをきっかけにブラウザ対策を見直してみませんか？
- 1431 views
- キム
