スマホ最適化、スマートフォン制作に関するメモ – T2
1．デバイス依存をどう乗り切るか。 エクスぺリア、iPhone、ギャラクシーはこれといった影響なくできていたのですが、 REGZAでFirefoxなどを使った時はもうね。泣きそうになりましたよね。 原因はmoz系に対応するjsとCSS3の記述を全て行っていなかった事だと思います。 初めにどのデバイスでどこまで対応するのかという仕様策定をしてから始めないと モバイル同様苦しむ事になるので注意が必要です。 androidのopera等。 2．横にした時の見え方。 これは意外と苦戦しました。縦だと綺麗なのにスマホサイトでよく見るwidth:100%とかを 適所に使わないといけない。 float:left; とかで2つの要素を詰めないと、縦では詰まっていたのに、横では両端に広がってしまうとか。 それによってhtmlの記述を変えないといけなくなったりとか。 2012/09/26 以前は上記の様に書い
MdN Design｜総合情報サイト
スマートフォンサイト 6-07 表示サイズ調整の要となるViewportの設定 スマートフォンやタブレットでは、画面サイズも解像度も2倍以上の開きがあり、これまでのPCのノウハウをそのまま使うことができない。ここでは、表示サイズ調整の要になるdpiスケーリングとViewportについて見てみよう。 解説／馬場孝夫（ビヨンド・パースペクティブ・ソリューションズ株式会社） BROWSER iOS…5over Android…2.2over マルチデバイス対応に必須な画面サイズ調整 従来のPC 向けサイトでは、ディスプレイサイズや解像度に極端な差はなく、幅1024px・96dpiなど固定値をターゲットにして問題なかった。しかし、スマートフォンやタブレットが普及してきた現状では、固定値だけで対応はできなくなっている。その対応策として挙げられるのが、dpiスケーリングとViewportである。 dp
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
