パケット容量がいっぱいでも安心！「オフラインファースト」なホームページを作る3つのメリットと実装方法

スマートフォンでホームページを閲覧することは、現在は一般的な行動となりました。
しかし、こうした日常の中でも、瞬間的に私たちを悩ませている問題があります。
電車の中で電波が届かなかったり、月末にパケット容量を使いすぎて通信制限がかかったりして、ホームページがうまく繋がらなくなってしまう場合です。

インターネット通信を行わないモバイルアプリケーションであれば、インターネットに接続をしているかどうかにかかわらず利用することができます。
しかし、インターネットに接続をしないと利用できない場合は、通信環境が悪くなるとそれだけUXが悪化してしまいます。

UXを高めるほとんどの施策はエンジニア側で操作することができます。
ところが、インターネット環境に関して言えば、ほとんどこちらの打つ手はないように思えます。
結局は外部要因によってUXが低下してしまうのは、避けることはできないのでしょうか。

そのような問題を解決するために注目されているのが、「オフラインファースト」(offline-first)という考え方です。
インターネットに接続していなくとも、キャッシュやクッキーにあるデータを利用することで表示できるものは表示してしまおうという考え方です。

今回は、オフラインファーストの概要を紹介しながら、オフラインファーストなホームページを作る3つのメリットと実装方法をご紹介していきます。

オフラインファーストとは何か？なぜ必要か？

オフラインファーストとは、一般的なネイティブアプリのようにホームページでもオフラインで利用できるようにする考え方や具体的な施策のことを指します。

オフラインファーストという言葉自体は今から5年以上前の2012年頃には提唱されていた考え方です。
しかし、近年、モバイル端末でのインターネットの閲覧が4分の3を超えているとも言われており、改めてオフラインファーストの重要性が見直されています。

世界規模で考えてみましょう。
インドではスマートフォンユーザーは年々増え始めていますが、実のところまだ回線はほとんどが2G程度です。

▲ Source: How Internet in India Will Look in 2020: 12 Exciting Statistics!

CISCOによれば、急速な技術革新のなかで、2015年に5.1Mbpsだった回線速度は2020年には12.9Mbpsにまで上がるとも言われています。
しかしながら、どんな回線速度でも(もちろんオフラインの場合でも)よいUXを実現するためには、オフラインファーストでホームページを設計する必要があるのです。

(ちなみに2016年時点で世界のインターネット平均速度は6.1Mbps、日本は第9位の17.1Mbpsになっていますが、前年比では日本はあまり速度が速くなっていません)

参考：
Akamai State of the Internet / Q2 2016 Report (pdf)