スマートフォンサイトで電話番号やメールの自動リンクを解除したい – helog
iPhoneやAndroidなどスマートフォンサイトでは、電話番号やメールアドレスらしき文字列があった場合に、自動でリンクが設定されます。 リンクをタッチするだけで、電話をかけれたりメールを送ることができるので、一見して親切な機能のように思われます。 しかし、あくまでブラウザが自動で検出しているので、その精度は完全ではありません。 長いメールアドレスがレイアウトの関係で折りかえってる場合や、電話番号の間にハイフンやスペースがある場合など、ブラウザがリンクの範囲を認識できずに、誤った番号への通知リンクとなる危険性があります。 例えば「aaaaa.bbbbb.ccccc@abc.jp」をクリックすると「ccccc@abc.jp」があて先にセットされるなど、実際起こるとなると恐ろしい事ですね。 自動リンクを無効にする このような問題を回避するために、自動リンクを無効にする方法があります。 電話番
要チェック。iPhone/iPadで表示しているWebサイトに対して使えるWebインスペクタ·Mobile Safari Inspector MOONGIFT
Mobile Safari InspectorはMobile Safariの表示画面に対してデスクトップブラウザを使ってデバッグできるソフトウェアです。 WebKitにはJavaScriptやHTMLのデバッグを行うインスペクタが内蔵されています。それをiPhone/iPadのMobile Safariでも使えるようにするのがMobile Safari Inspectorです。 iPadのシミュレータで任意のサイトを表示します。 デスクトップのブラウザからアクセスするとインスペクタが表示されます。 こんな感じでJavaScriptを実行することもできます。 iPad側でアラートが出ます。 iPhoneでも同様に使えます。 表示しているページの一覧が出ます。 構造をたどれます。選択しているDOMがハイライトします。 ネットワークも使えます。 スクリプトも使えます。 JavaScriptで色々
スマートフォン向けサイトの作り方 | ユージック
スマートフォン向けサイトの作り方 2011年1月22日 iPhoneとAndroid両方に対応するスマートフォン向けサイトの作り方をまとめてみました。 スマートフォン向けサイト作成にあたっての基本概要 まず最初にスマートフォン向けサイトを作成する際に気になる点は画像の扱いだったりすると思います。 横幅ですが、解像度は機種によって様々ですが、縦向きで320px～640px、横向きで480px～960pxが主流となります。 標準となるものを設けるとなると、320px(横)/480px（縦）を標準として良いかなと思います。 ※iPhone4、4Sは640px/960pxの解像度ですが、内部解像度で320px/480pxと解釈してくれるため。 ですので、クライアントに見せるデザインカンプなどを作成する際も縦を標準とする際は320px（横）で作成すれば問題ないといえますが、iPhone4、4SやAn
スマートフォン対応サイトの作り方、教えます (1/3)
「WebサイトをiPhoneやAndroidで見やすく表示したい」「スマートフォンをターゲットにしたWebサイトをデザインしたい」――そんなWeb制作者のための新連載がスタートします。PCサイト制作のノウハウさえあれば、「モバイルサイトは未経験」でも大丈夫。スマートフォン（iPhone/Android）向けサイト制作の基礎知識から実践的なテクニックまで、H2O Space.のたにぐちまことさんが解説します。（編集部） iPhoneの快進撃とiPhone 4の登場、Android端末のXperiaとDesireのヒット、au初の国産Android端末「IS01」の発売――と、スマートフォンの勢いが止まりません。いまや一部マニアやビジネスマンにとどまらず、女性やお年寄りなどの幅広い層にまでスマートフォンの利用は広がり、「1台目の携帯電話」として購入する人も珍しくなくなりました。 PCとの連携、
スマホのタッチイベントを一気に実装できる13KBの軽量ライブラリ「QUOjs」:phpspot開発日誌
QUOjs - Micro JavaScript Library スマホのタッチイベントを一気に実装できる13KBの軽量ライブラリ「QUOjs」 タップ、ダブルタップ、ホールド、スワイプ、スワイプ上下左右、ドラッグといったイベントを実装するのに使えそう モバイルということで3G回線にも配慮した13KBは嬉しい。 今後はローテートやピンチイン・アウトにも対応予定だそう 実装はjQueryライクで超簡単。 関連エントリ たった2KBで動作するスマホ用マルチタッチジェスチャーライブラリ「Hammer.js」 スマートフォンでの指ジェスチャの説明に使えるアイコンセット「Cue」
スマートフォンのボタンサイズ UI
スマートフォンのデザインをする際の UI のサイズには誰もが最初は悩んでしまいます。そんな時に役に立つのが、Android や iOSのUI のガイドラインです。その中から、ボタンのサイズに関する部分だけを抜き出して集めました。 ボタンのタッチ部分のサイズは最小で高さと幅は44ptが推奨されているみたいです。ただし、2010年に開催された Apple Tech Talk にてApple のUIデザイナーの Eric Hope 氏は、垂直方向へボタンがかさならないのであれば、例外として高さは 最小で22ptをOKとしていると話しています。事実、iPhone のランドスケープモードでは44px x 44px ではなく、48px x 38pxの高さのボタンも見受けられます。
画像を使わずCSS3だけで尖ったBack・Nextボタンを作る方法
CSS3だけで、iOS風のBackやNextの尖ったナビゲーションボタン作る方法ないかな〜と探していたところ、良記事があったので紹介します。Androidで確認してませんが、webkit向けなのでたぶんAndroidでも大丈夫だと思います。Androidはひと工夫必要そうです。 CSS3 Wizardry -Back and Next Buttons Revisited- CSS3 Wizardry -Subpixel Rendering- Buttons Revisitedの方が改良版で疑似要素バージョンみたいです。原理はSubpixel Renderingの方がわかりやすいです。 ポイントとなるHTML ボタンを構成する要素はこれだけ。 <!--ボタン要素--> <div class="button bordered back"> <span class="label">Back</s
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
これが無料とは！ スマートフォン向けサイトやアプリのワイヤーフレームを作成するソフトウェア -Prototyper