スマホ対応とフロントエンドフレームワークの導入

2015/01/06 11:53 JST

スマホからのアクセスがPCからのアクセスを上回るサイトもありますが、
特にiPhoneの人気はアメリカ、日本など根強い人気です。
Twitterでどの機器からつぶやいているかがわかるマップ「TweetMap」をみると、その傾向がわかります。

TweetMap
http://tweetworldtom.herokuapp.com/[*1]

1日実行した結果

※赤がiPhoneです。

弊社では、過去のGeeklogサイトに対して、スマートフォンやパッドからのアクセスにも同時に対応できるように対応するサービスを行っています。

弊社のスマホからの閲覧

丸で囲んだアイコンをクリックすると、スマホ対応メニューが表示されます。
PCでも、ブラウザを狭めることでご確認いただけます。

なお、この画面キャプチャーの画像は、記事などGeeklogサイトでは、
[media:20150106115414721 src:orig]
と記述しています。
これを、自動タグ(Autotag)と呼んでいます。

Geeklogでは便利な自動タグが多数用意されています。
本体の自動タグは、こちらをご覧ください。
http://wiki.geeklog.jp/index.php?titl...F%E3%82%B0[*2]

さて、上記のスマホ対応メニューは、Geeklogにフロントエンドフレームワークを追加するサービスを活用しています。

フロントエンドフレームワークには様々な種類がありますが、弊社では種々検討した結果、UIkitを活用しています。

フロントエンドフレームワーク
http://usablica.github.io/front-end-f...mpare.html[*3]

UIkit
http://www.getuikit.com/[*4]

弊社サイト以外に多くのサイトで対応していますので、ご覧ください。
http://www.ivysoho.com[*5]
https://www.ossj.jp[*6]
http://www.geeklog.jp[*7]
http://www.hum.otsuma.ac.jp/[*8]

旧Geeklogサイトのアップグレード、スマホ対応メニューの追加、他CMSからGeeklogへの移行等をお受けしていますので、どうぞお問い合わせください。

https://www.ivywe.co.jp/staticpages/i...hp/contact

コメント (0件)


株式会社アイビー・ウィー - スマホ対応とフロントエンドフレームワークの導入
https://www.ivywe.co.jp/article.php/newsletter-20150106

[*1] http://tweetworldtom.herokuapp.com/
[*2] http://wiki.geeklog.jp/index.php?title=%E8%87%AA%E5%8B%95%E3%82%BF%E3%82%B0
[*3] http://usablica.github.io/front-end-frameworks/compare.html
[*4] http://www.getuikit.com/
[*5] http://www.ivysoho.com
[*6] https://www.ossj.jp
[*7] http://www.geeklog.jp
[*8] http://www.hum.otsuma.ac.jp/