カテゴリー別アーカイブ: 作業日記

スマートフォンサイトの開発環境

スマートフォンサイトを制作するにあたって、開発環境を整えようとしました。
これまではブラウザの持つ機能で、ユーザエージェントを切り替えて表示確認してきました。

Android用では、「Android SDK Tools」が公式のエミュレータとして出ているので、それをインストールして使ってみました。
結論から言うと、「使う気になれません」。
動作が相当重く、私の持っているプアなスペックのパソコンでは使い物にならないのです。

iOS用では、Appleが提供している「iOS シミュレータ」があります。
これは動作も軽快みたいですが、いかんせんMacでしか動かないのです。
Windowsマシンしか持っていない私は使うことができません。

最終確認は実機で行わなければならないのですが、大手の制作会社でない限り多くの端末を用意するなんてことはできません。
当面はWebブラウザによるユーザエージェント切り替え機能で制作中のデバッグは対応し、最終段階でいくつかの実機を借り受けて確認することになりそうです。

新しくスマホ購入

格安SIMとセットになったスマホを購入しました。
タブレットはすでに持っているのですが、スマホは持っていなかったので思い切って購入しました。

ただ月々の出費を抑えるため、「格安SIM」で最低限の契約にしました。
月1500円程度の出費でスマホを持てるのですから、まずまずです。

Android端末なのですが、自分のWebサイトを表示してみると色んなことが新たにわかりました。

Android標準のブラウザとChromeでは表示が異なるのです。
標準ブラウザでは、文字がはみ出てしまう部分があります。
Androidタブレットも持っているのですが、そちらではそんなことはありません。

Android OS バージョンの問題なのか、端末の問題なのか原因がわからなかったため、表示が見苦しくならないようにWebサイトに微修正を加えました。
しかし、その後の調査でスマホのフォントを「大」にしていたためと判明しました。
フォントの大きさを変える機能はどのスマホにもあるのですが、それによりWebページの表示が制作者が意図しないものになってしまうリスクがありますね。

また、Chormeで表示させてみると、portraitモードの時にコンテンツ本文の文字が若干拡大されて表示されます。
landscapeモードではこちらが意図したサイズで表示されます。
この現象もAndroidタブレットでは発生しません。

これはいまのところ原因は不明で、放っておいています。

しかしモバイル端末に関しては、Web制作者が考慮すべきことがたくさんありますね。
種類が多いだけに全部対応し切れないというのが本音です。

Tips記事には目次をつける

特定の分野におけるさまざまなノウハウを、Tips記事として掲載しているWebサイトがあるのですが、少し見直しを行いました。

ユーザー視線から眺めてみると、どういう内容が書いてあるかをすぐに把握したいと気がつきました。

つまりWebサイトに訪れた時、パッとみて自分が求めている情報がそこにのっているかどうか、これが最初のユーザー判断です。

長い記事を最後までスクロールしてみてくれるとは限りません。
気が短かったり、時間がないユーザーは、目的の情報があるかどうかを数秒で判断するでしょう。
自分だって他のサイトを閲覧するときはそうしています。

そこで、Tips記事には先頭に目次をつけることにしました。
これなら目次だけをみても、ある程度判断できます。
これまでは先頭に概要だけしか記述してなかったのですが、「概要」と「目次」の両方を記述するようにすべて更新しました。

Webサイトの改善は、ユーザーの立場だったらどうかと考えていくことが第1ですね。
管理側の運用しやすさとか、クローラーのためのSEOとかは二の次です。

Chrome拡張機能 Google Publisher Toolbarのインストール

AdSense情報を確認できる拡張機能ですが、非常に便利。
AdSense管理画面に行かなくてもだいたいの情報を閲覧できるし、
広告掲載ページをみながら、どの広告が有効に働いているか把握できます。
直感的に情報を把握できるところがGoodですね。

しかしChromeには便利な拡張機能がたくさんあるもので、
Googleアカウントでログインしていればデバイスを問わず
設定が有効なのがまたまた便利です。

各種ソフト・ツールは、そのような付加機能が非常に重要です。
知ってると知らないでは効率に大きな差が出ます。

それと、ツール同士の連携もまた大事です。
そこらへんをうまくマネージできるようになると、
仕事の成果は何倍にもなるでしょう。