第9回 JavaScriptは控えめに ～クロスブラウザ対策地獄からの脱出～
ついに本連載の最後となりました。今回のテーマはJavaScriptの設計スタイルです。 JavaScriptで様々なアクションを実現しようとすると，ブラウザによって挙動が異なったり，場合によっては動かない場合があります。例えば，標準化されているW3C DOMといえども，ブラウザの種類やバージョンによってその実装の度合が異なるからです。 今日，様々なブラウザがあふれており，またそれらのバージョンも多岐にわたります。すべてのブラウザ，そしてすべてのバージョンで全く同じように動くようにするというのは，もはや現実的ではありません。 そこで，近年，Unobtrusive Scriptingと呼ばれるスクリプティングの考え方が注目されるようになりました。"Unobtrusive"は，"でじゃばらない"，"控え目な"，"つつましい"といった意味を持っています。 Unobtrusive Scripting
2011-05-22
devicePixelRatioとは 1pxの画像をそのディバイス上では何pxで表示するかを指定した設定 webkit系に存在する なぜそんな設定があるのか？ iPhone3G,3GSの解像度と、iPhone4の解像度の違いから考える 機種 解像度 iPhone3G,3GS 480 x 320 iPhone4 960 x 640 iPhone4は前のiPhoneに比べて解像度が4倍ある。 画面のサイズは3.5インチと同じな為、1pxあたりの大きさがiPhone4の方が小さく敷き詰められている このことから、同じ5 x 5 の画像を表示しても通常はiPhone4の方が1/2に小さく表示されてしまう。 そのような自体を防ぐ為、1pxあたりの大きさが小さくなったiPhone4では1pxを2pxとして表示されるようにdevicePixelRatioで制御させれている。 縦と横の両方が2倍になること
「HTML5を使うためのプログレッシブエンハンスメント〜すべての人に確実に情報を届けるために〜」に参加しました | ゆめいろデザイン｜ブランドマネージャー・Web/UX/UIデザイナー・デザインコンサルタント ヒガシナオヤ
セミナー 記事公開日：2011/07/24 ざっくりと(!?)アジェンダ 前置き プログレッシブエンハンスメント：開発手法 <ruby>要素を例にフォールバックという考え方を説明 HTML5の解説。HTML5=Markup+API Web（ウェブ）とは あらゆる対象に情報を伝える。 あらゆる対象に同じUXを見せようとしている。 チラシは誰が見ても同じには見えないが、Webでは同じように見せる必要が無い。同じように見せたいのなら画像で十分。 クロスブラウザ対策：あらゆる対象に同じUXを提供する。 Webとは、本来同じUXを伝えるものではなく、確実に上を伝えること。 本来のWebは非メディア依存。 HTML5で意識されているのは、「マルチデバイス」。スマートフォン・たぶれっと・テレビなど。 リフローが前提（スクリーンやサイズに応じて変形自在）。 リフローをメリットと認識した上でWebを作成。
HTML5・CSS3時代のweb制作コンセプト
HTML5・CSS3対応のブラウザが増えてきて、制作のコンセプトも変化してきました。 プログレッシブエンハンスメントなどユーザーのブラウザ環境に焦点を置いた制作コンセプトをまとめました。 足りない知識を埋めながら書いたので一部認識が間違ってる箇所があるかも知れませんが、その場合はご指摘頂けると助かります。 Progressive Enhancement Graceful Degradation Polyfill Progressive Enhancement(プログレッシブエンハンスメント) どのブラウザでも基本的な水準のユーザーエクスペリエンスを提供をし、 新しく高水準のブラウザにはCSS3やjsなどでよりリッチなデザインや機能を提供するという考えです。 またProgressive Enhancementには下記の原則があります。 基本的な内容は、すべてのブラウザでアクセス可能である必要
Coding for IE6 = Progressive Enhancement
It was disappointing to see the unwarranted uproar that occurred in the comments of my article on Smashing Magazine on cross-browser CSS. But in retrospect, it was probably a good thing, because a more important (but related) issue was brought to light in the discussion. At this stage in modern web design, all front-end coders should at least be familiar with (if not very capable of implementing i
Understanding Progressive Enhancement | MOL
WDEに行ってから個人的にProgressive Enhancementがブーム（謎）なので訳してみた。 原文: Understanding Progressive Enhancement 著者: Aaron Gustafson 1994年の頃からウェブ開発者のコミュニティはGraceful Degradation（以下、GD）を主張してきた。エンジニア業界から持たされたこのコンセプトの核心は、最新かつ高機能なブラウザを使う人にはフルコースの料理を振舞われたかのような体験を提供するとともに、 Netscape 4で満足している悲しくも不幸な人たちには残飯を与えるようなものだった。それは確かに機能したが、ティム・バーナーズ・リーが提唱した「世界中の誰もがアクセスできるウェブ」の理念にはそぐわないものだった。 10年後、幾人かの頭の良い人たちがGDに対して疑問を持ち始め、多くのレベルで欠けて
WDEレポートあとがき - Progressive Enhancementについて | クリエイティブ・タブロイド withD（ウィズ・ディー）
先日、Web Directions East 2008（以下、WDE）のカンファレンスに参加してきました。詳細はカンファレンスレポートの方をご覧いただくとして、今日はそれを補完するような話題を取り上げてみたいと思います。 今回のWDEカンファレンスセッションでは、2つの共通点を見出すことができました。ひとつはJavaScript（Ajax）、Canvas、SVG、HTML 5、CSS 3など、RIA（リッチ インターネット アプリケーション）に関わるような話題が多かったこと。もうひとつは、"Proressive Enhancement"（Wikipedia）（略して"PE"とも）という考え方です。 Progressive Enhancementとは？ Progressive Enhancementとは、簡単にいえば、基本的なコンテンツや操作はすべてのターゲットユーザー（UA）に対してアクセ
プログレッシブエンハンスメント（Progressive Enhancement）という考えかた｜ウェブユーザビリティ向上を支援するWebsite Usability Info
公開日 : 2010年6月6日 (2021年2月2日 更新) カテゴリー : アクセシビリティ 最近、プログレッシブエンハンスメント（Progressive Enhancement）という言葉をよく目にするようになりました。Webユーザーの増加、ユーザーの閲覧環境の多様化（パソコンだけでなく、携帯電話やスマートフォン、支援技術など）、ユーザーの抱える身体的状況の多様化（障害、加齢、怪我、など）、といった背景を踏まえて、より幅広く、多くの人が情報にアクセスできるようにすることを目指したWebサイトの開発理念です（Webアクセシビリティを実現するための技術的方法論のひとつとも言えますね）。以下、簡単にご紹介したいと思います。 基本的な考えかた あらゆるユーザーに対して、基本的な体験ができるようにします（たとえば、そのサイトが伝えたい情報には、どんな閲覧環境下にいるユーザーでもちゃんと到達できる
Adobe Edge: 2009年2月 クロスブラウザからProgressive Enhancementという制作コンセプトへ
みなさん、「Progressive Enhancement」という制作コンセプトをご存じでしょうか？ 「情報やサービスへのアクセシビリティを確保しつつ、ブラウザやデバイスの特徴を活かしたデザインや技術を実装する」という考え方です。日本ではあまり馴染みのない考え方ですが、海外では数年前から制作者間で話題となり、確実に浸透しつつあります。昨年、日本で開催された世界的に有名なWebカンファレンス「Web Directions East」では、多くのセッションでProgressive Enhancementが取り上げられました。これをきっかけに今後日本でも広がっていくと期待されます。本記事では、Progressive Enhancementとはどのような制作コンセプトなのか、そしてどのようなメリットがあるのかを解説します。 Progressive EnhancementとGraceful Deg
クロスブラウザはもう古い！ HTML5＋CSS3時代のプログレッシブ・エンハンスメント
IE 9が登場！ ユーザーの閲覧環境がますます多様化！ 4月26日、ついに日本でもInternet Explorer（以下、IE） 9が公開されました。また、マイクロソフトは早くもIE 10のプレビュー版を公開しており、CSS3やJavaScript周りが、さらに強化されるなどリッチなWeb表現が加速してきています。 IEのみならず、Firefox、Safari、Google Chrome（以下、Chrome）など他のWebブラウザもすさまじい勢いで進化してきており、スマートフォンやタブレットPCなどのデバイスも続々と開発され、ユーザーの閲覧環境がますます多様化してきています。 そうした流れの中で、必然的に欠かすことができなくなる知識が、この「プログレッシブ・エンハンスメント」という概念です。 プログレッシブ・エンハンスメントって何？ Webブラウザや端末などの閲覧環境が多様化してきていま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
真のクロスブラウザとは
Graded Browser Support | MOL
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
A Complete Guide to Progressive Enhancement