iPhoneデザインボックスみんなが見てる人気のスマートフォン向けWebサイトデザイン
スマートフォン向けサイトの作り方 | ユージック
スマートフォン向けサイトの作り方 2011年1月22日 iPhoneとAndroid両方に対応するスマートフォン向けサイトの作り方をまとめてみました。 スマートフォン向けサイト作成にあたっての基本概要 まず最初にスマートフォン向けサイトを作成する際に気になる点は画像の扱いだったりすると思います。 横幅ですが、解像度は機種によって様々ですが、縦向きで320px～640px、横向きで480px～960pxが主流となります。 標準となるものを設けるとなると、320px(横)/480px（縦）を標準として良いかなと思います。 ※iPhone4、4Sは640px/960pxの解像度ですが、内部解像度で320px/480pxと解釈してくれるため。 ですので、クライアントに見せるデザインカンプなどを作成する際も縦を標準とする際は320px（横）で作成すれば問題ないといえますが、iPhone4、4SやAn
DeNAが明かすHTML5でのソーシャルゲームの作り方【本日のスライド】 / GameBusiness.jp
スマートフォンにてソーシャルゲームを作ろうとすると、HTML5を中心にブラウザで動作するもの、もしくはネイティブアプリでの提供ということになります。モバゲータウンやグリーはその両方をサポートしています。ネイティブアプリの作り方は既に文献も多数なのですが、HTML5となるとまだ十分とは言えません。この資料は必見です。 「HTML5@iPhoneゲーム開発」はディー・エヌ・エーのスマートフォン開発グループの岸弘倫氏が「DeNA Technology Seminar #3」での講演用に作成したものになります。同社では北米のMiniNation向けにiPhone『Pirate Nation』(海賊トレジャー)をHTML、CSS、JavaScriptで開発して提供していて、そのノウハウを凝縮したものです。 『Pirate Nation』は冒頭の括りで分けるとブラウザで動作するアプリということにな
WEBデザインとアプリデザインのためのフリーUIパッケージ「18 free UI elements packs for your web designs and apps」
WEBデザインとアプリデザインのためのフリーUIパッケージ「18 free UI elements packs for your web designs and apps」 インターフェイスを製作するときに時間を節約しながら、クオリティを保ちたいときに、ユーザーインターフェイスに必要なパーツをパッケージした素材が便利です。今日紹介するのはWEBデザインとアプリデザインのためのフリーUIパッケージを集めたエントリー「18 free UI elements packs for your web designs and apps」です。 Modern Web UI Set 様々なタイプのUIの素材が用意されていますが、今日はその中から幾つか気になったものをピックアップして紹介したいと思います。 詳しくは以下 ■Mobility: set of mobile UI elements アプリケーショ
【スマートフォン】 図解！今すぐ直せる、WEBフォーム 6つの課題 (ユーザビリティ実践メモ)
スマートフォン端末の普及で、問い合わせ・申込みなどのWEBフォームがスマートフォンで使われる機会は今後も増えていくでしょう。その際、PC向けに用意していた既存のWEBフォームをそのままにすると、どんな問題が発生するでしょうか？ 今回は、弊社コンサルタントの自主調査から、スマートフォン端末（特にiPhone）でのWEBフォーム利用時の6つの頻出課題をご紹介します。 多くのWEBフォームでは、項目名が入力ボックスの横に配置してあります。 PCでは全く問題のないレイアウトですが、iPhone端末では入力ボックスをタップしてズームインするとラベルが見えなくなり、非常に入力しにくいものになってしまいます。 【改善案】＜推奨＞入力例を入力ボックスの上または下に配置する項目名（ラベル）を入力ボックスの上部に配置する ※項目名の位置が変わるとPCで見にくくなるケースも想定されるため、ご注意ください 課題2
iPhone/Androidアプリのモクアップ作りに便利なPSD・AI・ICON配布サイト｜スマートフォン｜モバイル｜PHP & JavaScript Room
PHP、JavaScript、Ajax、HTML/XHTML、CSS、Webページ埋め込みによる音声・動画配信方法など、実用的なプログラミング・テクニックを解説iPhoneアイコン アプリケーションアイコン Glyphish – Great icons for great iPhone & iPad applications iPhone & iPadのツールバーやタブバーのアイコンがつまったPSD。タブバー用は26x26、ツールバー用は18x18。 Licsense: Creative Commons Attribution 3.0 United States License Free iphone toolbar icons iPhoneのツールバー用アイコン。30x30。白色。PNG形式。色を変える方法がわかるPSD（レイヤー効果でグラーデーションオーバーレイ）が1ファイル入っていま
スマートフォンサイト運用と今後のスマートフォン市場の展望 : LINE Corporation ディレクターブログ
スマートフォングループの藤村です。2か月前まで、モバイルで、livedoorトップ・デコメサイトの運用を担当していました。 10月から新しい部署のスマートフォングループに所属し、すでに、スマートフォン版のlivedoorトップ＆ニュース他の運用を開始しています。実際に運用してみると、モバイルとの共通性が多く、モバイルサイトの運用経験が生きる領域だと実感しました。 まだまだ運用の初期フェーズの段階ですが、今回は、実際にスマートフォンサイトを運用してみて気づいた点及び、今後のスマートフォン市場の展開予想について書いてみようと思います。 ファーストビューの重要性 スマートフォンのサイトを運用してみて、まず一番最初に改修を入れたのが、ファーストビューです。ファーストビューとはユーザーがモバイル端末でアクセスして、一番最初に表示される画面のことを言います。 モバイルサイト運用経験者の方には常識かと思
PC・モバイルSEO ： iPhone/Safari、Xperia・IS/Android用サイトの作り方
iPhone（Safari）やXperia、IS（Android）用のサイト制作について参考になる記事をまとめておきました。 このまとめが、あなたの知識の穴を埋めてるのに役立てば幸いです。 他にも良い情報や、「いやこのサイト・この本だけ見れば万事OKだから」とかそういう情報があれば教えて下さい。 ※紹介する記事に過去エントリと重複するものもありますがご容赦下さい。 初心者向け iPhone用の画面幅調整について、初心者向け。 → 今から始めるiPhoneコーディング iPhoneの画面幅調整について、より深い言及。 → iPhoneとViewPortとXHTML Mobile DOCTYPEと.mobiドメイン 画面幅調整とアクセス制御とCSSに関する知識について。 → iPhone向けサイト構築 基礎文法最速マスター meta name=”viewport”や表示調整に関する
スマートフォン用のサイト作成に役立つテスティングツール７:phpspot開発日誌
7 Useful Tools for Mobile Website Testing | Tools スマートフォン用のサイト作成に役立つテスティングツールが７つ紹介されており、便利そうなものをピックアップしてみました。 サイトチェッカー W3C mobileOK Checker W3Cのモバイルサイトチェッカー。サイトのURLを入れるだけで、対応状態を〜％として表示してくれます。 何を改善すればポイントを上げられるか？についても詳細にレポートしてくれるところがいいですね。 mobiReady URLを入力するとサイトのモバイル対応状態をレポート結果として表示してくれる。 レポート結果は次のようになります 機種が微妙ですが、JAVAをつかったシュミレーターで動作確認できたりします Gomez Mobile Website Readiness Test URLのほか必要情報を入れるとサイトのモ
blog｜解像度に依存しないモバイルユーザーインターフェース(2010/08/24) | Ext Japan Blog
この記事は8/23に掲載された「Resolution Independent Mobile UI」を訳したものです …または… ピクセルはピクセルじゃないんです。 「SASSとCSS3のメリット（the benefits of SASS and CSS3）」（英語、未訳）という記事の中で、解像度に依存しないユーザーインターフェースを実現するためにSencha Touch内で活用しているテクニックについて簡単に解説しました。今回の記事では、読者がUI開発を行う際に役に立つように、そのテクニックについてもう少し詳しく解説してみたいと思います。 概要 この記事はアダプティブなレイアウトや、レスポンスの良いWebデザインについてのものではありません。この記事は、デザイナーにとって比較的新しい関心事となった、「ピクセル密度」に注目したものです。モバイル環境において、画面の解像度は急速に進化しています
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5とCSS3を使ってスマートフォン向けサイトを構築 － iPhone版Yahoo!JAPANトップの開発事例紹介