スマートフォン向けWebサイトの表示速度 高速化手法
対象読者 スマートフォンWebサービス開発者 特に、フロントエンド周りの開発に従事する方 スマートフォン向けWebサイト高速化のテクニック スマートフォンはOS／デバイスの進化が激しく、要求される最適化の内容も半年で別物になることがあります。そのため最適化に際しては、案件ごとの状況や目的、デバイス／OSのシェアに応じて、まずターゲット端末を選定し、問題の検出を行います。 この記事では「iPhone 4＋iOS 5」を想定して話を進めます。実際に「iPhone 4＋iOS 5」はよく現場でも最も動作が重い組み合わせとしてターゲット端末に挙がります。これはiPhone 4がRetinaディスプレイを採用したことで960×460ピクセルの高解像度を備えながら、CPUなどのデバイス性能が潤沢とはいえず、ボトルネックが生まれやすいためです。iOS 4ではなくiOS 5をターゲット端末として扱うのは、
【デブサミ2012】16-C-1 レポート アプリ基盤としての「HTML5」が持つ可能性～あらゆる業界のコアビジネスへ
10年ぶりのWeb標準刷新となったHTML5 羽田野氏は、言わずと知れたHTML5のエキスパート。HTML5の詳細な解説本も執筆しており、日本におけるHTML5の第一人者として広く知られている。本セッションではそんな同氏から、HTML5の現状や今後の見通し、そしてWeb技術者にとってのHTML5の存在意義などについて解説が行われた。 「HTML5とは何か。一言で言えば、マークアップ言語にAPIの機能が加わったものだ。むしろ、マークアップ言語よりAPIの仕様の方が大きくて、『HTML5はほとんどAPIの塊』と言ってもいいほどだ」 セッションの冒頭で、羽田野氏はこう述べる。では、Webテクノロジーの面から見て、膨大なAPIをWeb標準として定義したHTML5の登場にはどのような意義があるのか。同氏によれば、そもそもWeb標準の世界は「この10年の間、まったく進化してこなかった」という。 振り返
HTML5はこれからどうなっていくのか ここが違う！サンプルで見るHTML5（6）
はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回：HTML5が注目を浴びる理由とは？ 第2回：HTML4から変化したHTML5のマークアップ 第3回：HTML5で再定義された要素と属性 第4回：HTML5で実現できるマルチメディア系機能 第5回：HTML5で進化したフォーム機能 オープン・ウェブ 本連載では、HTML5のマークアップについてウェブページという視点で解説してきました。しかしこの視点は、HTML5やそれに関連する新たなウェブテクノロジーが扱う範囲のごく一部でしかありません。本連載の最後となる今回は、HTML5を含む次世代のウェブテクノロジーが進む方向性について見ていきましょう。 本連載の第1回では、HTM
HTML5で進化したフォーム機能 ここが違う！サンプルで見るHTML5（5）
はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回：HTML5が注目を浴びる理由とは？ 第2回：HTML4から変化したHTML5のマークアップ 第3回：HTML5で再定義された要素と属性 第4回：HTML5で実現できるマルチメディア系機能 新たに導入されたフォームコントロール これまでウェブにおける入力フォームコントロールは、非常に限られたものしかありませんでした。皆さんがよくご存じのテキスト（パスワード）入力フィールド、ラジオボタン、チェックボックス、セレクトメニュー、テキストエリア、ファイル選択です。お問い合わせフォームであれば、ほとんどのシーンで十分といえるでしょうが、ウェブアプリケーションにおいては、不足してい
HTML5とCSS3を使ってスマートフォン向けサイトを構築 － iPhone版Yahoo!JAPANトップの開発事例紹介
Android対応 スマートフォン版Yahoo! JAPANトップでは、歴代のiPhone、iPod touchだけではなく、現在日本で発売されているAndroid（一部機種を除く）にも対応しています。AndroidはiPhoneと同じWebKitブラウザが標準で備わっていますが、細かな仕様においてiPhone、iPod touchとは異なっています。いくつか特徴的な面を挙げていきます。 iPhoneではデフォルトの状態では、リンクや、タップ可能な要素（formパーツや、onclickイベントが定義されている要素）にタッチをすると、グレーの半透明の「ハイライト」が表示され、離すと消えます。これは、指という「カーソル」が、リンクにピンポイントでタップするのが難しいために表現されている仕組みですが、Androidのフォーカスは若干異なります。iPhoneではタップしやすい領域を確保するために、
HTML5で再定義された要素と属性 ここが違う！サンプルで見るHTML5（3）
セマンティクスが与えられたインライン要素 i要素、b要素、small要素、s要素などは、旧来のHTMLではスタイリングを指示する要素でした。しかし、HTML5では、これらの要素は廃止されませんでした。これらの要素は、スタイリングを指示する役割の代わりに、文書上の意味、つまりセマンティクスが与えられることになりました。 i要素、b要素は、もともとはイタリック体、太字でレンダリングすることを指示する要素でした。しかし、HTML5では、他の文章から何かしらの理由で区別されたテキストの範囲を表すことになりました。とはいえ、ただ単に目立たせたいためだけに、これらの要素を使うのではありません。i要素とb要素には、利用シーンが想定されています。 印刷慣例に基づいたi要素とb要素 HTML5では、i要素は、印刷慣例でイタリック体で表現される単語やフレーズに使うことと規定されました。とはいえ、これではスタイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTML5で実現できるマルチメディア系機能 ここが違う！サンプルで見るHTML5（4）