![iPhoneやiPad等にもWebサイトを最適化するレスポンシブWebデザイン構築に役立つフレームワークやTipsいろいろ - かちびと.net](https://cdn-ak-scissors.b.st-hatena.com/image/square/eaceb1a950d8019afbfa6f72b06dfdf87bcacc16/height=288;version=1;width=512/https%3A%2F%2Fkachibito.net%2Fwp-content%2Fuploads%2F2011%2F08%2Fresponsive000000.jpg)
iOS:『Zapd』は、iPhoneやiPod touchから直接ウェブサイトを作成できる、かなりクールなiOSアプリ。 「60秒でサイトが作れる」という宣伝文句はちょっと大げさに聞こえますが、数分あればサイトをアップできます! 筆者は、手元にあった素材を使ってコンテンツを作り、このサイトを作成しました。テーマも数多く用意されていて、iPhoneからサイト全体を直接編集できます。 追加できるコンテンツの種類は「Tumblr」とほぼ同じくらい。「もう少し編集に融通がきくと、もっと活用の幅が広がるのではないか」と原文にはあります。 サイトは定期的にiPhoneから更新可能。編集作業をじっくり行うのであれば、iPhoneよりもiPadのほうが適しているかもしれません。 Zapdは、iPhone/iPod touch用のフリーアプリ。iTunes App Storeから無料でダウンロードできます。
簡単なものですけど、jQuery Mobile でのマークアップ時によく使うっぽい UIのサンプル作ったので配布します。 簡単なチートシート代わりになるのでは 無いかと思ったのでシェアしてみよう かと。良かったら使ってください。 というのも、JQMの日本語サンプルの配布先を見かけなかったので、なかなかお困りの方もいらっしゃるんじゃないかなと。調べるの面倒ですし、手元にサンプルコードあったほうが何かと便利ですよね。 というわけで、以前マークアップサンプルの記事書いたときに作ったサンプルサイトに手を加えた物を丸ごと配布します。 流石にかなり出てるので今更説明不要かもですけど、ざっくり説明するとWebサイトをスマフォ向けに簡単に出来るjQueryプラグインです。 以下のサンプルで使用しているファイルが丸ごと梱包してあります。 サンプル※別窓 いちおうキャプチャ。 目次 サムネイル付きのサンプルと
こんちは、中村です。 先日マピオンラボよりリリースしたiPad用地図「マピオンタッチ デラックス」のコアとなるフリースクロール地図ライブラリの開発を担当させて頂きました。せっかくなのでターゲットブラウザをMobileSafariに設定し、比較的スペックがプアなiPhone3Gや3GSでも十分な速度で動作するようJavaScript部分の高速化をアレコレ調べてみたのでまとめてみます。一番低スペックなiPhone3Gで実際にどの程度早くなるかをタイマーで計測してみましたってのが本エントリーのミソです。 JavaScriptパフォーマンスチェック - Googleドキュメント 1. new Object より {}(Objectリテラル) オブジェクトを1万個生成するならばリテラルで記述することで約26ms高速化! loop=10000; for(var i=0;i<loop;i++){}; /
Fantastic website design in Flintshire, North Wales from Stuff and Nonsense iPhoneやAndroid携帯といったスマートフォンからiPadのようなポータブルデバイス、従来のPCやノートPCにいたるまで、ネットワークにアクセスするデバイスの種類は多様化している。こうしたディスプレイサイズも解像度密度も異なるデバイスに対してそれぞれに適したデザインを提供するというのが、最近のWebデザイナの間で取り上げられることが多いトピックになっている。 こうしたトピックで取り上げられることが多いテクニックがCSS3のMedia Queryを使う方法だ。デバイスの解像度や密度の情報を取得して、それに応じて適用するCSSを切り替えるというもの。これまで多くのブログでこのテクニックが取り上げられ、サンプルコードとともに紹介されている
iPhone用CSSをメディアクエリで分岐する問題点 これまで1つのHTMLソースでPC用とiPhone用のスタイルシートを切り替えるテクニックとしてCSS3のメディアクエリが用いられることが多かったのですが、iPhone 4の登場によりこのテクニックはバッドノウハウになりつつあります。 追記(2010/07/09) 本エントリーはiPhone 4の発売前に書いたものです。 iPhone 4のSafariに関しては画面サイズが320×480として計算されている為、問題ないようです。 参考:Fonland: iPhone 4 の viewport は iPhone 3G と同じ これまでは次のようなコードでiPhone用にiphone.cssをそれ以外のデバイスにimport.cssを読み込むことが出来ました。 <link media="only screen and (max-device
バンダイチャンネルが7月下旬から11月にかけて期間限定でiphone,ipad上で無料動画を配信していたことをご存じでしょうか? 公開中にこの記事を書けば良かったのですがいつのまにやらこんなに日にちが経っていました…。このまま記事を下書きにしておくのももったいないので公開してみようと思います。 UI、デザイン、マークアップディレクションを担当 UI及びサイトデザイン、及びマークアップ関連のディレクションを担当させていただきました。実際のマークアップやAJAXの部分はチームまめこの優秀なマークアップエンジニャーさんによるものです。さすが! iPhone、iPadのような新しいデバイスでのデザインはPCと似ているようで非なる箇所が多く、本サイトをデザインするにあたり多く気付かされた事がありました。 iPhone版について インターフェイス 情報を優先順位にのっとってメリハリがPCのそれよりも
iPhone/iPad独自タグや、便利なタグなどまとめました。それぞれの注意点とか発見した不具合とか掘り下げると色々とありますが、ひとまず以下まとめて列挙してみました。 ■metaタグ:基本のviewport <meta name="viewport" content="width=320, initial-scale=1.0, user-scalable=yes, maximum-scale=2.0, minimum-scale=1.0, ">widthとheight:最初に読み込まれる表示サイズ。widthを指定しないと横幅980px。 initial-scale:最初に読み込まれた際の拡大率 user-scalable:ユーザーが拡大できるか否かを、yesかnoで設定 maximum-scale:ユーザーが操作可能な拡大率の上限 minimum-scale:ユーザーが操作可能な拡大率
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く