スマートフォンサイトの構築に積極的に取り組み、DynamicViewer など既にいくつかの事例も手がけた大日本印刷株式会社 C&I 事業部とデジタルコムに、最近の、サイトのスマートフォン対応に関する顧客の状況についてお話を伺った。“今年になってから、サイトのデバイス対応についての問い合わせが多くなった印象” とのことで、制作業務にも大きな影響が出ているそうだ。

クライアントも目を向け始めたデバイス対応

－－ スマートフォンサイトに取り組みを始めたのはいつ頃からでしょうか？

「1 年半くらい前です。iPhone 3GS が出たころまずはチーム内で調査が始まりました。 HTML5 を始めたのは去年の春からです。まだデスクトップ環境ではブラウザを指定できないと使い物にならなかったのですが、iPhone 限定であれば使えるよね、ということで。そこに Android も出て来たので、スマートフォン全体がターゲットになりました」（生田）

「DNP の新しいビジネス構築を考えたときに、HTML5 のサイト制作は相性がよいと考えました。それは、既存システムとの親和性が高いこと、開発者の確保がネイティブアプリよりも容易なこと、が主な理由です。iOS アプリは審査が必要なので、リリースのコントロールに不安があったという面もあります」（森嶋）

－－ 会社全体としての取り組みも行われているのでしょうか？

「昨年 12 月に HTML5 の勉強会をしました。社内の各組織が提案案件ごと独自に取り組んでいた、という状況だったのですが、関係者が集まって改めて情報や状況の共有を行いました。それから横のつながりもできて、いろいろと話ができるようになっています」（森川）

「そのときの様子はサイトにも公開されていますよ」（生田）

－－ クライアントから、どのような要望が来ているか教えて頂けますか？

「以前は “単発で何か面白いアプリをスマートフォン向けに作りたい” というケースが殆どだったのですが、やっと最近になって Web サイトの話が増えました。要望としては、大きく 3 種類あって、携帯からスマホに切り替えた人にも同じコンテンツを伝えたい場合、今後のデバイスの戦略的な使い方を模索する中で最適化を進めたい場合、それから漠然とビジネスのネタ探しをしている場合、です」（武藤）

－－ なぜ最近になってデバイス対応の話が増えたのでしょう？

「去年の後半から、携帯キャリアからの広告としての露出が多くなったのが大きいと思います。それから計画を立て予算を取って、今年になって始められる状況が整ったということではないでしょうか」（武藤）

「競合他社が対応を始めたので、という話もありますし、地震などを契機にソーシャル機能の重要性が改めて見直されたというのもあると思います。Twitter とスマートフォンは相性がよいですから」（森嶋）

サイトか、ネイティブアプリか

－－ デバイス対応の際、Web サイトではなく、ネイティブアプリとして提供することもありますか？

「情報の質、利用するシチュエーションといった特性を検証して決定します。ユーザーが毎日使うものであればアプリ向き、いつでも読みたいものもですね。逆に、たまにしか見ないものや、その場で急に必要になったものは Web で探したいでしょう？」（武藤）

「状況に応じて使えるようネイティブアプリと Web を両方提供できれば理想的です。ただ、提供するだけでなく見つけてもらわないといけないので、ネイティブアプリはアプリストアから探せるように、サイトは検索エンジンから探せるように、それぞれの SEO が必要です。特にアプリはダウンロードして貰うための施策も必要になります」（森嶋）

－－ 開発効率やメンテの観点から比較すると？

「ネイティブアプリは特定の OS 上でしか使えないので、同じソースコードが複数の環境で閲覧される Webがよいです。ただ、ネイティブアプリでないと利用できない機能があるので、Web だけというわけにはいかないですね」（宮崎）

「既存のサイトのデバイスに対応させる場合、HTML サイトとして提供する場合は、必要な箇所だけ部分的に、少しずつ対応を進められます。一方、ネイティブアプリとして提供する場合は、HTML とは異なる技術を使うため、必要な機能はまとめて一度で置き換えなければなりません」（森嶋）

デバイス向けサイトを視野に入れた制作手法

－－ デバイスを意識することで、従来のサイト制作手法への影響はありますか？

「導線、操作感はどうなっているべきか、という点を制作とデザイナーが一緒になって詰めます。まず使い易さを最優先で設計、そこからプラットフォーム間の機能差に応じて仕様をそぎ落とします。 この手順で、全てのプラットフォームで動く仕様へ落とし込みます」（武藤）

「PC だけでなく iPad で見ることも考えて、Flash で作っていた簡単なアニメーションは JavaScriptで作るようになりました。iPad 向けの最適化としては、タッチし易いレイアウトや大きさを考えたり、アニメーションはスクリプトではなくて CSS3 を使ったりとか」（吉川）

－－ 作業量も増えたのでしょうか？

「あるプロジェクトでは、Android 用に大中小の 3 サイズと、iPhone、iPad、PC 用の 6 種類のテンプレートを作成しました。これは、プラットフォームによって表示されるコンテンツが変わる可能性があったからです。ソースを共有することで邪魔な依存関係ができるリスクを避けるために個別に作成しました。最初に 3 つのサイズのインターフェースを考え、それをコピーして 6 つにしたので、制作はある程度楽にできましたが、その後の更新作業は 6 つ別々に行っています」（吉川）

－－ そうすると、全般的に手間が増えてきているのでは？

「大変になりました。デバイス版は PC 版とは別に作るのですが、プラットフォーム間の差が大きいので、どうしても手間がかかってしまいます。特に Android 端末は画面サイズとバージョンがばらばらで、最適化がとても難しいです。最近は Sencha を使ったりしています。このフレームワークはプラットフォームの差を吸収してくれてます。ただ、JavaScript でアプリを組むことになってしまうのですが」（吉川）

－－ 開発の難易度が上がったということになるのでしょうか。

「はい。昔のタグを組むだけで良かった HTML とはずいぶん違います。Dreamwever CS5.5 ではjQuery Mobile が使えるようになったという話なので期待したいですね」（吉川）

デバイス向けサイトを制作する上での注意点

－－ デバイス向けのサイトをデザインする際には、どんなことに注意していますか？「 まだ、提供する側にとっても使う側にとっても新しいので、いろんな人が対応できるよう考えています。

例えば、フリックが使える人と使えない人、それぞれのためにフリックとボタンによる操作の両方を提供したり。画面サイズを考えると詰め込みたくは無いので、できるだけ簡素化するようには考えています」（宮崎）

「ユーザーの評価がストアに載ると、判断基準ができてきて、作る側の答えも変わります。デバイス向けのサイトはアプリ的な使い方をすることがあって、標準的な HTML サイトの使い方からははみ出ます。ところが新しい使い方についてはベストプラクティスが無いので、出してみて、評価を見て、作り直す、というフローは当面必要ではないでしょうか。 自分も、普段から使っていないと分からないと感じています」（武藤）

－－ 最後に、これからサイトのデバイス対応を始める場合、どのような点に気をつけるとよいでしょうか？

「とりあえず安くやっておこうでは、見てもらえるかは疑問です。見てもらえなければ、そもそもお金をかけることが無駄になります。画面が小さいから簡単に見えるかもしれませんが、 最低限、理にかなっているかどうかは確認するのが大切です」（宮崎）

「どこにお金がかかるか見えにくいという問題もあります。各プラットフォームの細かい仕様を知らないと、何が簡単で何に造り込みが必要かも分かりません。 最初から予算ありきではなく、やりたいことを明確にしてから、最終形までのステップを具体化し、1 ステップずつ予算化するのがよいと思います。実際に、予算化する前の企画段階から知識のある人を入れて調査するケースは多いです」（生田）