WordPress初心者でもユーザーエージェントで違いを確認するべし

WordPressでブログを開設して3ヶ月程。
苦にならないペースでポチポチ投稿して楽しんでいます。

先日、スマホアプリ『Google アナリティクス』から、
「Internet Explorerでのパフォーマンスが悪いよ〜」とメッセージがありました。

「Internet Explorerでは確認してないもん!
だって、だって、自分Macだもん……。」

という言い訳は通用せず、初心者だけど自分でサイトを開設したからには責任を持たなければならない!
ブラウザごとに確認する方法を探りましょ!
そう!ユーザーエージェントって奴です。

Macで『Internet Explorer』の画面を確認する簡単な方法

まず、MacでWindowsの画面を確認したい!と思ったら、ブートキャンプなどで仮想環境を作ってWindowsをインストールする……?
いえ、そこまでする程、Windowsを必要としている訳ではないです。

家族の持っているWindows PCを借りるのもありですが、できるだけ自分の環境で何とかしたいですね。

簡単な方法がありました。
Macのブラウザ『Safari』を利用するべし!
『Safari』を開いたら、
「環境設定」→「詳細」→「メニューバーに”開発”メニューを表示」にチェックを入れる。
自分のサイトを開いて、メニューバーから「開発」→「ユーザーエージェント」を開いたら、あら、ビックリ!
主要なブラウザの画面が確認ができちゃいます。

Macのブラウザ『Safari』のユーザーエージェント設定画面

古いバージョンの『Internet Explorer』では、書体が全然違っていました。
自分で少しCSSをいじっていましたが、ブラウザによっては表示のされ方が違うらしく、まだ初心者の段階で気付いて良かったです、ふう…。

↓『Safari』での自分のサイト画面はこんな感じです。

サファリブラウザでの自分のサイト画面

↓『Internet Explorer8』では明朝体になりました…。

インターネットエクスプローラー8での自分のサイト画面

ところで…、

ユーザーエージェント変更とは

自分のように何処かで聞いたことがあるという程度のブログ初心者も多いでしょう。
ユーザーエージェントにはブラウザの違いの他、機種の違いも含まれます。
確認できるものは全部確認するべし。

パソコンの主要ブラウザなら手順は様々ですが、大抵はユーザーエージェントを変更できるようですね。
もし、もっと特殊な環境を確認したい(ガラケーとかね)場合は、『Google Chrome』の「Developer Tool」や「機能拡張」から追加するのですが、初心者には手を出しにくいですね…。
まずは自分のパソコンで利用しているブラウザのユーザーエージェント変更方法を検索して確認しておきましょ。

そして、さらに気になる…、

スマホではユーザーエージェント変更できる?

パソコンで作業している時は問題ないですが、外でスマホやタブレットを使用している時にユーザーエージェント変更は出来るのでしょうか?

スマホやタブレットのブラウザなら、設定(または共有)の中に「パソコン版で表示」がある事が多いですね。
「パソコン版で表示」にする事で、AndroidスマホからiCloudに入る事だって出来るんですよ、重たくなりますけど…。

スマホやタブレットでも、少しカスタマイズにこだわったブラウザなら、設定の中に「ユーザーエージェント」があり、「Android」「iPhone」「PC」などを選ぶ事もできます。

↓下記画面は、
Androidアプリ『Yuzu Browser』(GooglePlayストアで無料/2018年11月時点)
でのユーザーエージェント変更画面です。

Androidのユズブラウザのユーザーエージェント設定

自分のスマホは「Android」ですが、「iPhone」の画面も確認出来ちゃいますね。
『Yuzu Browser』はカスタマイズ好きにはたまらないブラウザですよ。

その他に試しに、Windowsのデフォルトブラウザである
Androidアプリ『Edge』(GooglePlayストアで無料/2018年11月時点)
を、自分のタブレット「HUAWEY MediaPad M3 Lite10」の中にインストールしてみました。
Microsoftで同期する環境を整えるなら、とても便利なブラウザです。
『Edge』の設定内ではPCサイトか?モバイルサイトか?の二択だけのようで、『Internet Explorer』版への変更はできないようでした。

Androidとiosでは同じアプリでもかなり違う

実は、Androidなら前述の『Yuzu Browser』、『FireFox』でアドオン追加など、ユーザーエージェントを変更できるブラウザが見つかります。

「iPad Air2」(iPhoneは持っていませんので)でもユーザーエージェント変更できるブラウザアプリを探してみました。
あまり無いのです…。

そんな中で、
『Lunascape』(App Storeで無料/2018年11月時点)
はユーザーエージェント変更が出来るブラウザとの事、「iPad Air2」にインストールしてみました。
↓なかなか特殊な9種類で…、開発者様の好みでしょうか?(笑)

iPadのブラウザ『Lunascape』ユーザーエージェント設定画面

『Lunascape』ならGooglePlayストアにもあるので、Androidタブレット「HUAWEY MediaPad M3 Lite10」にもインストールしてみました。
↓なんと!ユーザーエージェント24種類!!ただし、最新のIEやEdgeは無い!!!

Androidのブラウザ『Lunascape』のユーザーエージェント設定画面

同じブラウザでも、Androidとiosではこんなに違うのですね。
この『Lunascape』がブラウザとして使いやすいかどうかは別問題ですよ。
*下手なブラウザは邪悪なウイルスが入り込む危険があるので、むやみにインストールはおすすめできません。

パソコンでインターネットのイメージ

多くのWordPressのテーマでは、レスポンシブデザイン対応になっているとは思いますが、少なくとも自分のデバイスで、パソコンとスマホの違いは確認するべし、するべし!