これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ - てっく煮ブログ

2013/02/14 1141 users viewport HTML 見た目 web 使い勝手

スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewpor... 続きを読む

1時間で携帯サイトをスマートフォン対応にする方法 | GREE Engineers' Blog

2011/04/25 2278 users GREE Engineers Blog matsu スマー

初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマー... 続きを読む

スマートフォン向けサイトの作り方｜ユージック

2011/01/22 1903 users ユージック viewport iPhone height 範囲

iPhoneとAndroid両方に対応するスマートフォン向けサイトの作り方をまとめてみました。 スマートフォン独自の仕様 viewportについて スマートフォンでの可視領域やズームなどの設定をするmeta要素がviewportです。 viewportの各プロパティ width(幅) 可視領域の幅。デフォルト値は980px。 200pxから10000pxまでの範囲を指定できる。 height（高さ... 続きを読む

HTML5とCSS3を使ってスマートフォン向けサイトを構築　－ iPhone版Yahoo!JAPANトップの開発事例紹介（1/4）：CodeZine

2010/12/15 1026 users CodeZine タッチセンサ ネイティブアプリケーション

はじめに　スマートフォン版Yahoo! JAPANトップでは、ユーザーへ高品質なユーザーエクスペリエンスを提供するために、対象端末をiOSとAndroid OSのスマートフォン端末に絞り、最新のブラウザ仕様に基づいたサイト構築を行っています。スマートフォン版Yahoo! JAPANトップ 画像の使用を抑えるためCSS3や、ネイティブアプリケーションに近づけるためCSSアニメーションや、タッチセンサ... 続きを読む