スマホサイト：Webアプリモードで意外と書かれていない落とし穴 - Kaleidoscope

ちょっと今回はまめ知識的な内容です。 最近、「iPhoneでWebアプリを作成」といった記事をよく見かけます。 （jQuery Mobileなどを利用した開発方法は置いといて） HTML5+CSS3+JavaScriptで一から作成する方法について、意外と肝心な注意点が抜けてるように思います。 とくに、よくmetaタグを使った「Webアプリモード（フルスクリーンモード）」にする方法が書かれていたりします。 <meta name="apple-mobile-web-app-capable" content="yes" /> これをやると、URLバーとかが無くなって、サイトがネイティブアプリっぽくなってかっこいいんですよね。 これで、サイトをアプリっぽく見せられる！ってちょっと興奮しちゃいますよね。 ただ、これって意外な落とし穴があるんです(￣▽￣;) 今回は、僕が知ってる大きな２つの注意点を

[typex2]

メモ。iOSのSafariにはWebアプリモードとWebブラウザモードがある。Webアプリモードはアドレスバーが表示されずフルスクリーン表示になる。iOS7ではWebStorageがモード間で分離され共有できない。

[naohor]

<meta name="apple-mobile-web-app-capable" content="yes" />

[sanata0130]

ふつうのリンク記述だとWebアプリモードから抜けて、Safariに飛ぶ

[t32k]

appleの嫌がらせ

[Journey]

Webアプリモードでのリンクの取り扱い方

[sw_lucchini]

webアプリモードについて

[amayan]

Mobile jQueryでaタグをフックし、hrefを削除→location.hrefに差し替える

[toshi3221]

apple-mobile-web-app-capableのはなし。アプリっぽくみせるには

[nink]

なるほど。アプリっぽく見せるのは意外と面倒やなぁ。

[torimoku]

iphoneでwebページをアプリっぽくみせる話　の落とし穴の話

[edo_m18]

これを知りたかった。

[Kei19]

スマホサイト制作時のポイントがまとまっていて、わかりやすい！

[homihoo]

WebClipモードではaタグの通常リンクを使用するとSafariが立ち上がる。JavaScriptで回避する必要がある。

[blogpants]

WEBアプリは通常リンク処理だとsafariを開いてしまう。 jquery mobileなどを使えば、問題ないけど ハマった時の対処などに頭に入れておくと吉。

[mirrored]

metaタグによるWebアプリモードとその際の画面遷移について

[watarun7]

メモ

[benkeiblog]

後で読む

[glat_design]

リンクは全てJavaScript化しないとwebアプリモードが外れる、戻るもJSで設置する

[lkeli000]

ぅ～ん、スマホ専用サイトに限らず通常のサイトでも意識する部分があるような？？コーディング規約として、まとめてしまえば。。。

[mumincacao]

全画面もーどってあどれす確認できる機能もちゃんとついてるのかなぁ？（・【みかん

[ysk_lucky-star]

これってformで遷移した場合どうなるんだろ

[gigs123]

Webアプリ化落とし穴

[matuix]

1.基本的にリンクは全てJavaScript化、もしくはページ内リンク（#使ったやつ）にする必要がある 2.「戻る」ボタン的な用意がほぼ必須になる

[gachakku0131]

metaタグ使ってWebアプリモードってのにする時の話。デザインきれい

[yocchi24]

WebアプリモードでHTMLのいいTips

[hagi0626]

メモ:

[hama_shun]

" 僕が知ってる手っとり早い方法は、リンクはJavaScriptのonClickイベントで処理することです。 わざわざページ内リンクにして、どうにか他のページに遷移する仕組みを作るのはけっこう大変です。 "

[don2don]

ページ遷移

[rainbowsazaki]

多分、httpプロトコルのリンクが選ばれたからhttpプロトコルをサポートするアプリ=Safariが起動するって流れ。formでもSafariに行かなかったはず。

[takigawa401]

HTML5 + JavaScript + CSS3 でスマートフォンのアプリを開発する際に気をつけるべきこと。通常のWebアプリと同じ様に開発すると戻るボタンや他ページリンクが使えなくなる危険がある。防ぐ方法まで合わせて解説されている。