iPhoneの画面サイズに自動で合わせる方法

最近、携帯サイトに力点を移しつつあります。今後、モバイルインターネットの成長が急速に加速することはほぼ間違いないようですので。

ただ、個人的には、いわゆる携帯サイトというのは、あまり重要ではないと考えていて、iPhoneやブラックベリーのようなスマートフォンに対応できるようなサイトをメインに考えています。

今は、まだスマートフォンのシェアはかなり低いですが、いずれはスマートフォンがメインになって、現在一般的に言われている携帯サイトというのは、廃れてくるんじゃないかと思います。

スマートフォンの中でも、iPhoneしか使ったことがないですけど、一度使うとやめられません。携帯電話のハードの進化はこれから急速に進むでしょうし、iPhoneに限らず、形はどうであれ将来的には、パソコンに極めて近い形のものになるのでしゃないでしょうか。

とすると、パソコンからとスマートフォンからのアクセスに対応することができるサイトを作ることが重要で、世間でやたらと騒がれている携帯電話に特化した携帯サイトというものを考える必要性は低くなると思います。

とはいえ、まだまだスマートフォンのシェアは低いので、携帯電話に合わせたサイズをメインに作って、iPhoneからのアクセスに対してだけ別の対応をすることが必要です。

携帯電話用に作ったサイトをiPhoneで見ると、サイズが自動的に縮小されて、拡大しないとほとんど見ることができない状態になってしまいます。

詳しいことはわかりませんけど、原因は、iPhoneに搭載されているSafariが自動で縮小するかららしいです。

そこで、iPhone用のSafari専用のmeta要素であるviewport属性を使うことで、iPhoneからのアクセスに対してだけ画面に合ったサイズで表示させることができます。

例えば、以下の画面が、viewport属性設定前。

20090228-1.jpg

これにviewport属性を設定すると。

20090228-2.jpg

もう一枚、viewport属性設定前。

20090228-3.jpg

そして、viewport属性を設定後。

20090228-4.jpg

うまくmetaタグやjavaScriptを記述することで、携帯電話やスマートフォンに対応できるようです。

今後、5年くらいでモバイルが急速に成長することが明らかですから、サイトの設計段階から考えないといけないことがどんどん増えますよね。

ちなみに、さっきの画面で記述したソースは以下のとおりです。

<meta name="viewport" id="iphone-viewport" content="width=480, maximum-scale-0.6667, user-scable=no" />

↓↓↓iPhoneはこちら↓↓↓

| | コメント(0) | トラックバック(0)

トラックバック(0)

このブログ記事を参照しているブログ一覧: iPhoneの画面サイズに自動で合わせる方法

このブログ記事に対するトラックバックURL: http://will-to-break.com/instal/mt-tb.cgi/157

コメントする

メールマガジン登録

まぐまぐ!からメールマガジン「毎日3分!条文+豆知識で民法完全制覇!」を発行しています。

無料ですので、ぜひご登録を!

メルマガ登録・解除 ID: 0000156969
毎日3分!条文+豆知識で民法完全制覇!
   
バックナンバー powered by まぐまぐトップページへ

ヤフーにあなたのサイトを登録

日本最大のポータルサイトであるヤフージャパンに、あなたのサイトを登録することができます。登録することによって、ヤフージャパンの利用者があなたのサイトを訪問することがありますし、また、日本最大の検索エンジンであるヤフーの検索結果にあなたのサイトが上位表示されます。

あなたの個人のWebサイトや、会社のWebサイトを登録することによって、アクセスアップを目指せます。特に、商用サイトであれば、ヤフージャパンへの登録は必須と言えます。

インターネットでアンケートに答えてお小遣いをGET

リサーチ会社大手のマクロミルでは、アンケートに答えていただけるパートナーを募集しています。インターネットを利用すれば、あなたのパソコンからいつでも、アンケートに答えることができます。

もちろん、アンケートに答えれば、ポイントを取得することができ、現金や商品券などに交換することができます。マクロミルは、大手の信頼あるリサーチ会社ですので、送られてくるアンケートの依頼数も多く、すぐにポイントを貯めることができます。

あなたのパソコンを活用して、空いている時間にこつこつお小遣いを稼ぐことができます。

マクロミルへ登録

次世代携帯電話iPhone(アイフォン)

ソフトバンクから発売されている次世代携帯電話iPhoneをこの機会に!iPhoneひとつであなたの大きくて重たいノートパソコンはもう不要です。いつもでどこでも素早くインターネットを利用することができます。iPhoneは、ビジネスを加速し、ライフスタイルに変革をもたらしてくれるでしょう。

洋書で英語の勉強(リーディング力強化)

英語の力をつけるには、英語の文章を大量に読むことが不可欠です。ただ、自分にとって興味のない文章を読むのは続かないので、自分の興味のある分野の洋書を読むことで、英語の文章を読み続けることができます。

国内で大量の洋書を置いている本屋はほとんどなく、自分の好きな洋書を探すことは困難ですが、アマゾンを使えば、ほぼすべての世界中の本を買うことができます。

最高クラスのステータスとサービス

世界最高クラスのステータスとサービスを提供しているアメックスのクレジットカード。いろいろなクレジットカードがありますが、海外旅行やビジネスのお供には、アメックスが最適です。

アメリカン・エキスプレス

リンク »

英語の勉強 »

ジャパンタイムズ

ニューズウィーク英語版

おすすめPC »

軽くて小さいし、バッテリーの持ちもいいので、持ち運ぶのに最適です。しかも、性能も申し分ないくらいのハイスペックです。パソコンを持ち運ぶことが多い方におすすめのノートパソコンです。

Sony Style(ソニースタイル)

エックスサーバー »

私自信も実際に使っている格安・高機能のレンタルサーバーがこのエックスサーバーです。

格安でドメイン管理 »

格安でドメインの管理をするならムームードメイン。私も使っています。

ヤフオク出品中! »

ヤフーオークションにいろいろと出品しています。

マイ・オークションをごらんください

このブログ記事について

このページは、minoru.monjiが2009年2月28日 02:08に書いたブログ記事です。

ひとつ前のブログ記事は「超凡思考 伊藤真 岩瀬大輔」です。

次のブログ記事は「カシオの電子辞書 x-word XD-GF10000」です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。

格安オンライン英会話のレアジョブ

インターネットで自宅でいつでも英会話の勉強をすることができるオンライン英会話。その中でも、格安で英語の授業を受けることができるのがレアジョブです。

なんと25分129円で英会話のレッスンを受けることができます。

↓↓今なら無料でオンライン英会話体験レッスンを受講可能↓↓