レスポンシブWebデザイン、CSSフレームワークなど、Webフロントエンド開発に関するBLOGです。
※SYMMETRIC公式BLOGと統合し、ブログ名称を変更しました

PCスマホ変換技術の5W1H:いつどこで変換されるのか

前回は導入方式によって3つの分類に分けましたが、次は変換技術にフォーカスします。一口に変換技術と言っても様々な切り口があります。ちょっと無理やりっぽいですが、5W1Hの形で解説してみます。

5W1Hを、When(タイミング)、Where(コンピュータ)、Who(エンジン)、What(対象コンテンツ)、Why(目的?)、How(実現手段)とします。これを3回に分けて、解説します。初回は、WhenとWhereです。

blogimg1

[When]いつ変換される? – (Webサイト変換のタイミング)

PCコンテンツが変換されるタイミングには4つあります。1. 通信中、2. (スマホ)表示完了後、3. (スマホ)通信完了直後、4. (スマホ)レンダリング中です。いつ変換するかによって、取得コンテンツがPC用かスマホ用か、対象がHTMLかDOMか、AJAXデータにアクセスできるか、PCサイトが見えてしまうか、などの特性が決まります。

取得コンテンツ HTML or DOM AJAXデータ PCデザイン
1. 通信中 スマホ HTML なし 非表示
2. 通信完了後 PC HTML なし 非表示
3. レンダリング中 PC DOM あり 非表示
4. 表示完了後 PC DOM あり 表示
  1. 通信中の変換すれば、コンテンツがスマホ用なので、スマホ施策がし易い点が利点です。
  2. レンダリングを待たないので、PCコンテンツが表示されることがありません。
  3. ブラウザDOMなので、JQueryなどで操作ができます。
  4. Ajaxを始め必要なデータが全て揃っています。

製品やサービスによって、それぞれのタイミングにおける弱点を補完したり、複数のタイミングで変換することで課題の克服を図ろうとしています。

[Where]どこで変換される? – Webサイト変換のコンピュータ

4つのタイミング中、通信中はコンピュータが無いので変換用中継サーバーの導入が必要です。他の3つのタイミングはスマホのブラウザー内で変換を行います。

  1. 中継サーバーで変換する利点は、コンテンツに全く手を入れずに変換できること、スマホ機種に非依存であること、キャッシュ可能であることなどです。課題は、サーバコストがかかることですが、クラウド型であれば直接的なコストではなくなります。キャパシティを十分に取らないとボトルネックが発生することです。
  2. クライアント変換の利点は、追加投資が不要であること、処理が分散するのでボトルネックがないことです。課題は、元コンテンツにコード挿入が必要なこと、機種依存性が高いこと、キャッシュできないことです。

こうしてみれば、サーバーとクライアントのメリットとデメリットは真逆になっていることが分かります。

おわりに

今回は変換技術の「いつ、どこで変換されるのか?その利点と課題」について解説しました。次回は、「Who」と「What」で「誰が何を変換するのか?」の予定です。

bnr_bottom_gc_blue

Page Top