Paul Gubbay は、デザインおよびウェブ担当エンジニアリング担当副社長です。アドビ。過去 25 年間、クリエイティブおよび Web プロフェッショナルのツールとソリューションに特化してソフトウェア業界で働いてきました。
たくさんありました話す最近についてHTML5そして、それが何であるか、今日それを使って何ができるか、それを学ぶための最良の方法などについての混乱。
市場ではこれほど誇大宣伝が行われているため、HTML5 を活用したいと考えているものの、どのように始めればよいかわからないクリエイティブなプロフェッショナルから最もよく聞かれる質問に取り組みたいと思いました。
1. HTML5とは何ですか?
最も単純な形では、HTML5 は HTML の進化版です。興味深いことに、この用語は、CSS3、SVG、Canvas など、Web を前進させることができる多くのテクノロジを「包括する」用語になっています。ほとんどの Web プロフェッショナルに提供されるのは、複数の画面にわたる Web サイトやアプリケーションのより豊かな対話性を作成するための新しい機能セットです。の採用により、ウェブキットモバイル デバイスでは、スマートフォンやタブレットの開発において HTML5 が大きな注目を集めています。 HTML5 は初期段階では、ユーザーがそれをどのように活用できるかという点で漸進的に感じられるでしょう。しかし、エコシステムが進化するにつれて、フレームワークとツールによって、Web プロフェッショナルは、さまざまなデバイスでアクセスできるアプリケーションなど、興味深いエクスペリエンスの新しい世界を作成できるようになります。
2. ユーザーが古いブラウザを使用している場合でも HTML5 を使用できますか?
HTML5 はまだ初期段階にありますが、サポートされていないブラウザーでコンテンツが適切に機能低下するようにしながら、ユーザーが新しい言語要素を採用できる方法がいくつかあります。これらのテクニックについて説明した記事が Web 上にたくさんあります。例えば:
開発者は、同じ名前のクラスを作成し、それをユーザーのページ内の div にアタッチすることで、ヘッダーやフッターなどの新しい構造要素を概念的に操作できます。
新しい HTML5 要素と JavaScript および一部の CSS を組み合わせて使用することで、さらに一歩進めて、古いブラウザーとの互換性を確保できます。
開発者は、次のような JavaScript ライブラリを活用できます。モダニズ新しいテクノロジー (HTML5、CSS3) を利用しながら、この機能をサポートしていない古いブラウザーを制御できます。
開発者は、新しい入力要素とタイプを持つ HTML5 フォームを使用して、テキスト入力に正常に劣化する古いブラウザーにペナルティを与えることなく、HTML5 フォームをサポートする最新のブラウザーでより豊富な機能を提供できます。
もちろん、モバイル ブラウザだけをターゲットにしている場合は、さらに多くの HTML5/CSS3 機能を利用できます。主に WebKit に基づいたモバイル ブラウザーは、より多くのサポートを提供しますが、実装が異なると依然としていくつかの不一致があります。
3. デザイナーと開発者は最初に何を学ぶべきですか?
開発者は、すでに理解しているテクノロジーを使用してスキルを段階的に拡張することから始める必要があります。 CSS3 の新機能を活用することから始めるのが最適です。また、ブログをフォローして何が起こっているかを常に把握し、新たに登場するさまざまな JavaScript フレームワークに注目することをお勧めします。現在、モバイル フレームワークとランタイムに関して多くの革新が起こっています。注目すべき優れたリソースには次のようなものがあります。
また、現時点での決定要因はブラウザーのサポートであるため、開発者は構築対象のプラットフォームを必ず念頭に置く必要があります。
4. 私は時代遅れですか?
特定のテクノロジーについての誇大広告は、デザイナーや開発者に自分たちが時代遅れであると感じさせることがよくありますが、HTML5 ではそうではありません。いくつかある一方で、本当に素晴らしい例今日、実際には、コンテンツを作成できる Web 開発者はさらに少数のサブセットであり、コンテンツはさらに少数のデバイスで動作します。
デバイス向けの開発時には、誰もが経験する典型的なブラウザ間のデスクトップ互換性の問題に加えて、大きなハードルに直面する必要があります。ハードウェア アクセラレーションをどのように活用しますか?デバイス API (タッチ、位置情報、オフライン キャッシュなど) をどのように活用しますか?ブラウザ実装を通じてデバイス API に一貫してアクセスできない場合はどうすればよいでしょうか?
これらの違いを抽象化し、ターゲットとするデバイス間で一貫して動作する一連の構成要素を提供できる JavaScript フレームワークとツールを探してください。多くの魅力的な機能が利用可能になっていますが、ほとんどのユーザーは現実的なアプローチをとる必要があります。
5. なぜ待つのか?
現在、HTML5 の普及を左右するのは、ブラウザ ベンダーと HTML5/CSS3 仕様です。 Web 初期のブラウザ戦争と同様に、ブラウザ自体の内部でもかなりの革新が起こっています。 WebKit はモバイル デバイスの主流のブラウザになりつつありますが、実装は複数あります。Firefoxそしてクロムデスクトップの限界を押し広げ続けます。IE9HTML5/CSS3 のサポートを強化して競争に加わりました。急速なイノベーションは Web プロフェッショナルにとって朗報ですが、同時に不整合も生み出します。ここは、スペックが登場します。この仕様は、すべてのブラウザが準拠する必要がある標準を推進します。ただし、この仕様は何年も承認されません。
ほとんどの Web プロフェッショナルは、まだ遅れているブラウザで適切に機能を低下させながら、新しい機能を活用できるフレームワークとツールを標準化することで十分な恩恵を受けることができます。などのサイトHTML5 への対応状況ユーザーは、ブラウザー全体で何がサポートされているか、何がサポートされていないのかを知ることができます。
HTML5 に対する Adobe のスタンスは何ですか?
これはアドビによく寄せられる質問です。現在の状況が急速に進化し続ける中、ビジネス ニーズに応じて Flash と HTML5 テクノロジーの両方を利用するハイブリッド戦略を導入することで利益が得られると私たちは考えています。たとえば、強力な開発フレームワーク、デバイス間のユビキタス性、およびテクノロジの背後にある 1 つのベンダーを必要とする多機能チームでエンタープライズ RIA を構築している場合、Flash は非常に意味があります。デスクトップ、タブレット、モバイルをターゲットとした動的な Web サイトを構築している場合は、HTML5/CSS3 が適切なテクノロジである可能性があります。つまり、HTML5 が最も合理的で基本的なインタラクティブ性を提供する場所もあるでしょうが、より豊かなインタラクションと保証された一貫性を実現する場所も常に存在し、そこが Adobe が Flash テクノロジーが優れていると感じている点です。
結論
デザイナーと開発者が HTML5 に慣れ、現在どのような機能がサポートされているか、そして最も重要なことに、対象としている視聴者に基づいてそれらの機能がどこで利用できるのかを学ぶ必要があることに疑問の余地はありません。ユーザーは、特定のサイト要素に夢中になり、先に進んで、顧客にとって重要なブラウザーではまったく機能しないことが判明するという間違いを犯すべきではありません。
今はデザイナーと開発者にとってエキサイティングな時代です。私たちの目の前には、ウェブの将来に大きな影響を与える大きな課題と機会がいくつかあります。待ちきれない。
Mashable のその他の開発および設計リソース:
-意欲的なブロガーのための 5 つの注目のデザイン トレンド