HTML5を使い始めるにはどうすればよいですか？
HTML5を学ぶための推奨ワークフローは何ですか？どのツールをインストールすればよいですか？どのSDKですか？どこから始めれば？テストする方法は？デバッグする方法は？私は何を読みますか？
「HTML5開発」というラベルが付いているものは、実際にはHTML、CSS、JSなどが混在していると理解していますが、より大きなプロジェクトがメモ帳で開発されているとは思いません。そのため、ワークフローに関するヒントやコツを明かしていただくようお願いしています。
今すぐ新しいHTML5プロジェクトをゼロから始めるとしたら、おそらく次のようにします。
HTML5 Boilerplate をダウンロードして使用します。これにより、重要なものがほとんど初期化され、テストの準備ができた新しいページが得られます。また、firebugと一緒に使用する必要があるいくつかの素晴らしいデバッグ機能が含まれています
コードの履歴と使用法を確認するには、 Dive in to HTML5 に目を通してください。
私のMacではCodaを使用し、職場ではコードビューでDreamweaverを使用しています。彼らはあなたのためにページを作成するつもりはありませんが、コード補完、ヒント、および色分けはうまく機能します。 Aptanaなどが優れた機能を提供していると確信していますが、HTMLに関しては、よりシンプルである方が常に優れています。
「A Book Apart」から HTML5 と CSS3の本 sを間違いなくピックアップします（CSS3は今月後半にリリースされます）
そして最後に-この全体を試して理解するためにチェックアウトしてください：
Opera Developer Network- http://dev.opera.com/articles/view/html-5-canvas-the-basics/
キャンバスチートシート- http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html
HTML5 Canvasで描画する方法 http://thinkvitamin.com/code/how-to-draw-with-html-5-canvas/
HTML5は単一の統合されたものではありません。これは、HTMLの拡張機能のコレクションであり、その一部は広く実装されていて安全に使用でき、一部はまだ実装されていないものもあり、その中間にたくさんあります。 HTML5を一貫した単一の開発プラットフォームとして扱い、「すべて学ぶ」としようとすると、本当に困難なことになります。
その代わり、学ぶ必要があるのは、基本的なHTML、CSS、JavaScript、コアDOM、HTML DOM、基本的なブラウザオブジェクトモデルなどのWeb全体です。次に、必要に応じて新しいWebの機能を追加できます。ブラウザのサポートにより、HTML5拡張機能、CSS3プロパティ、キャンバス描画、Webソケット、HTML5機能から分離された他のDOMおよびBOM拡張機能...
Webの機能セットは常に進化しており、参照点が1つだけではありません。 W3Schools（偶然にnothingがW3Cと関係している）を試みますが、エラーがぎっしり詰まっています。それが福音と言っていることを信用しないでください。
決定的な HTML4 、 CSS2 を参照する必要がある場合があります。 DOM Core および DOM HTML 仕様を確認してください。また、FirefoxとIEのサポートについては、 MDCのDOM参照 と MSDNのDOM参照 を参照することをお勧めします。 HTML5仕様 には、新しいHTML拡張機能だけでなく、より多くの最新のDOM要素も含まれていますが、これは長く扱いにくいドキュメントであり、標準ドキュメントの標準でさえ使用するのが非常に困難です。不可解な ECMAScript 仕様とほぼ同じくらい悪い（ありがたいことに、ActionScriptでの作業に慣れていれば、おそらくその多くに既に慣れているはずです。）
SDKやIDEでHTML/CSS/JSを開発する必要はありません。IDEを使用することもできますが、とても満足しています。私のお気に入りのテキストエディターですべてを行います。心配するビルド/コンパイル手順はありません。ファイルを保存してリロードを押すだけで、ジョブは完了します。最新のWebブラウザーのほとんどには、デバッガーやその他の開発ツール（IE8など）または拡張機能としてすぐに利用できます（例 Firebug ）。
JetBrains（または、PHPStorm、RubyMine、PyCharmなどすべての IntelliJ ベースの製品）の WebStorm を強くお勧めします。これらはすべてHTMLをサポートしています。 CSS、HTMLオートコンプリート、およびライブ中（入力中）の正確さを確認できます。 JavaScriptのリファクタリングサポート（他では見たことがないもの）、およびIDE（FirebugまたはChrome Developerの場合）でJavascriptをデバッグする機能ツールが不足しています。プロジェクトのサポートに加えて、SVN、Git、Perforce、およびCVSのサポートが含まれています。その他の多くの機能が強く推奨されています...
いくつかの非常に貴重なツール
- FireBug-Firefoxの開発者プラグイン。 JS、HTML、スタイルをデバッグできます。
- 古いバージョンのIE開発者ツールバーIE（6,7）ただし、HTML5はそれほど多くありません。新しいIEにはF12ツールがあります。
- Chromeにはデベロッパーツールがあります
これらのツールは主にJavascriptのデバッグ用で、要素の配置と適用されたCSSスタイルに関するものを理解するためのものです。
IDEの推奨事項を探している場合、Eclipseは非常に優れています。JavaScriptツールを探している場合、Firebugはデバッグに最適です。
ただし、実際には「ツール」は必要ありません。 「より大きなプロジェクトはメモ帳で開発できない、または開発できない」という考え方は、非常に単純に間違っています。私はNotepad ++を使用してすべてのHTML/CSS/Javascriptを記述していますが、これはプロのWebデザイナーにとっても非常に一般的なアプローチだと思います。 Notepad ++には、HTML、CSS、JavaScriptの構文の強調表示と自動補完があります。それ以上の機能を提供するソフトウェアが必要な場合は、どの機能が重要であるかを具体的に説明してください。 （ところで、あなたがMacユーザーなら、BBEditを試してみてください）。
大規模なサイトは、DjangoまたはRuby on Rails）などのフレームワークで作成されることがよくありますが、実際にはHTML5の使用や学習とは何の関係もありません。
私は、Adobe（Flashの作成者）が実際にFlashからHTML5への変換ツールをリリースする過程にあると思います。
http://news.softpedia.com/news/Adobe-Showcases-Flash-to-HTML5-Converter-163709.shtml
事実上、FlashはHTML5を開発するためのツールになります。
そして今週の時点で、MicrosoftはSilverlightでも同様の方向に進むと発表しているため、すべてがHTML5に移行しているようです。
私が持っている1つの質問は、これら2つのツールによって生成されたHTML5コードがどの程度優れているかということです。実際にリリースされるまで、その答えはわかりませんが、生成されたコードが特に優れた品質であることに気づいたことはありません。うまくいけば、最新のMSフロントページに相当するものにならないことを願っています。
私はあなたのJavascriptコードのためにビルドシステムをセットアップし、それを JSLint すべてのビルドに対してチェックすることを強くお勧めします。これにより、早い段階で多くのエラーが検出され、適切なコーディングが促進されることがわかりました（厳密すぎる場合は、オプションを試してください）。良い例として、jQueryのビルドシステム GitHub を見てください。
編集以外は、Notepad ++の大ファンです。IDEは、大量の負荷やGUIの手間をかけずに便利な機能を提供するため、まだ見つけていません。
ただし、最新のDreamweaverを確認することもできます。コードエディターに問題はなく、HTML5のウィジェットギャラリーが用意されています widgets すぐに使用できます。
より大きなプロジェクトをメモ帳で開発できるとは思わない
あなたはそこで間違っているでしょう。私は長い間メモ帳を使用しており、それが最善の方法だと思います。デバッグには、IEの開発者ツール、FirefoxのFireBug、Chromeのインスペクターを使用します。
HTML5に関する限り、それは基本的に通常のHTMLであり、いくつかのおもちゃが追加されています。その上、HTML5ドキュメントを宣言して、古いバージョンのHTMLにあるものだけを使用することを妨げるものは何もありません。
私が絶対に避けることをお勧めする1つのことは、Dreamweaverのようなプログラムです。グラフィカルなデザインツールを使用すると物事が簡単に見えるようになりますが、独自のものを作成したい場合は非常に難しくなります。 （私がこれを言うとき、私がしているコースで他の学生を見ています）