beginners?」と、Boldewynによる最も評価されていた回答を翻訳したものです。翻訳は完全ではありませんし、だいぶ意訳している部分がありますので、ぜひ原文もご参照ください。Unportedですので、この記事も同様のライセンスで公開しています。私はウェブデザイン・開発の世界に入りたいと考えているミドルスクールの学生です。私は小さいころからウェブ(を使うこと)に興味を持っていましたが、今は“作る”側になりたいと思っています。ウェブデザインと開発について調べてみて、スクリプト言語よりも先にマークアップ言語から学び始めたほうがいいと思いました。そこで、新しいHTML5/CSS3から始めるべきか、それともまずは現行バージョンのHTML/CSSを着実にやるべきか、迷っています。どれから始めるかは特に問題ではありませんか?また、お勧めのHTML(5)/CSS(3)に関する良書、またはウェブサイトを教えていただけたら嬉しいです。:)Boldewynによる回答まずは簡単なものから始めようほとんどの場合(初めて学ぶ場合は特に)、HTML4はHTML5の一部であり、またCSS2とCSS3も同様です。初めは“古い”技術から学ぶことをお勧めします。HTML5とCSS3の仕様は古いバージョンより多岐に渡っているからです。"HTML5")HTML5のチュートリアルには別の問題があります。HTML5は穏やかな春の朝の雛菊のように突然現れました。それ自体はいいことです。初心者(またはその可能性が高い人)向けなのか、HTML5はどう違うかと学びたがっている(X)HTMLの経験者向けなのか、そういったドキュメントの違いをあなたのようなルーキーが判断するのは難しいと思います。HTML5への入門は、HTML4のチュートリアルよりも混乱する可能性が高いです。学習方法は人それぞれですので、私がウェブ開発で歩んできた過程をまとめておきます。私は物理学部に入るまで、ウェブ開発にこれといった興味はありませんでしたが、しばらくして「自分のブラウザ用にカスタマイズされたスタートページがあると便利だな」と思いました。それは2004年のことで、iGoogleはまだありませんでした。小さなプロジェクトを作り、そこから始めるのです。幸運なことに、ドイツ語圏にはSelfHTMLというHTMLを始めるための素晴らしいリソースがあったのです。残念ながらSelfHTMLはサイトが復活してからほとんど更新がないので、英語対応のクオリティは分かりません。前述のW3Schoolsを使わないでください。そのサイトではなく、また仕様書とは別のHTMLの優れたチュートリアルをまとめておきます(以下を参照のこと)。《訳註:W3Schoolsリンク先はW3Foolsです。自分のブラウザ用のスタートページが完成したあと、私は自分が所属するRPGグループのホームページを作りました。それは複数のHTMLページからできていました。そのときに私は1つのスタイルシートで複数のHTMLページに適用できるCSSというものを知りました。これは、それまで溜めてきた多くのファイル構造について私が考え始めた最初の地点でした(「どのフォルダにどのファイルがあるか」という観点から)。それとは別に、その他の技術をたくさん学ばなければならないことに気づくと思います。私は、自分たちのグループ用のプライベートエリアがほしかったので、HTTP認証について学びました。サブディレクトリにファイルを置くことで、URLと相対/絶対パスの重要性を早く学べます。私はFAQコンテンツのために、質問をクリックすることで非表示になっている回答を表示させるというものを使いたいと思いました。これは私にとってJavaScriptのスタート地点でした。“本物の”で基本的なJavaScriptと、ググってコピペしただけはないjQueryスニペット(当時それはPrototypeでしたけども)を学んだことで、現在、私はとても恩恵を受けています。次のステップは、静的なHTMLからサーバー上で生成されるものに移行することです。私はPHPとMySQLの非常に良い初心者コースを取り(私見ですが、サーバーサイドの技術を始めるのにもっともシンプルな方法だと思います)、大学内でPHPの使えるちょっとしたウェブスペースを得ることができました。World”は、当時のRPGサイトにとって、いいゲストブックでした。(まあ現在では、あなたはDisqusにリンクを投げるだけで済む話です)今や私はチュートリアルとリファレンスの最先端にまでやってきました。最初は本当に覗き見だけだった仕様書を読み始めました。CSSプロパティの定義、その他色々と読み進めていきました。後知恵ですが、強調したいもう1つのポイントがあります。できるだけ早く仕様書を読むようにしてください。理解できない部分があるでしょうが、仕様書より良いソースはありません。それから後は、少なくともちょっとした注意、しかし時には基本的な理解を必要とする、多くの新しい技術を常に学び続けることです。最終的に、あなたは何らかを専門とする必要に迫られるでしょう。その範囲はざっと見ただけでも「私はデザイナーだ。JSONはJBossとHibernate以来の最高のものだ。このためにPhotoshopを必要としないのは素晴らしい」というものまであります。私は未だにできるだけ多くの範囲で最新の情報を得るために、シンプルなアプローチを続けていますが、このやりかたは長くは続かないと予想できます。今から5年未満のうちに(今日でも)、あなたは以下のような職務記述書をみつけるでしょう。“canvasデベロッパー”、“マルチメディアマークアップストラテジスト”、“クロスプラットフォームユーザエクスペリエンスの専門家”、“レガシーなFlashコードとテーブルベースのHTMLメールテンプレートのスペシャリスト”、“オフラインキャッシュセキュリティの達人”、“ウェブストレージデータベース技術者”などなど。あなたが主に興味を持っている分野で少なくとも基本的な理解を持っていることは、新しいアイディアとアプローチのために、あなたが柔軟な対応ができるようにしてくれるでしょう。重要なことは、古くて試されてきたアイディアと問題へのアプローチ方法だとあなたが考えいるものは、本当は新しいものだということです。他にも学ぶことが山ほどあると言われたことで、がっかりしないでください。それらの技術はクールなものを作るための、すぐ身近にあるチャンスとテクノロジーのワンダーランドだと私は思っています。注意すること問題なのは、間違ったリソースから学ぶことです。Overflowで尋ねてみることをお勧めします。招待するともっといいかもしれません)これは個人的な警告ですが、WYSIWYGやDreamweaverのようなエディタから手を離してください。IDEやコード補完機能のあるエディタを使うべきです(Eclipseなど)。私は違う道のりを歩みましたが(GoLiveからNotepad++を経て、最終的にはVimに行き着きました)、それは好みの問題です。私が使うべきだと言っているソフトウェアが、あなたから何かを隠したり、はっきりと指定しなくても自動で何かを作ってくれるものだという考えを少しでも持っているのなら、その考えは捨て去ってください。UTF-8ファイルにBOMを付加するかどうかを選択できることです。お勧めのウェブサイトもう一度言いますが、この後に挙げるリソースのどれかで混乱してしまったとしても気を落とさないでください。次に挙げるリンク集はプロが普段からリファレンスとして使っているものなのですから。基礎W3.orgHTMLとCSSの標準化組織です。developer.mozilla.orgFirefoxを作っている組織Mozillaによる開発者向けリソースです。HTML/CSSとウェブ開発における最先端の素晴らしいチュートリアルがあります。個人的な意見ですが、現在オンラインで見ることのできるベストなJavaScriptリファレンスです。msdn.microsoft.comマイクロソフトのHTML/CSSドキュメントです。LibraryAppleとSafari中心ですが、色々と良い文書があります。Curriculumは重要な技術がよくまとまっています。ValidatorValidatorはコードのエラーをチェックしてくれます。これはW3Cが公開していて、ウェブ開発者のツールボックスの中で最も重要なものの1つです。BoilerplateHTML5やjQueryなどをベースとするウェブサイトとウェブアプリケーションを素早く構築できるようにすることを目指すプロジェクトです。多くのベストプラクティスがバンドルされているので、ソースコードを読み通すだけの価値があります。Apartウェブ開発者とその関係者へ向けて公開されている文書です。便利で重要な方法と、HTMLとCSSを仕事としている人へのプラクティスが数多く公開されています。HTML5同じ名前の書籍に付随するウェブサイトです。HTML5を教えることを目標としているので、入門者がついていくのは難しいかもしれません。内容は良く書かれていて、正確です。ベースのデザインでどれほどの外観のものができるかというデモンストレーション”このサイトは、HTML4とCSS2の驚くべき例を見せてくれます。Waysウェブ開発者のアドベントカレンダーで、有名人による素晴らしい記事が年に24個のパックとして公開されています。概説などquirksmode.orgブラウザと互換性テストを主な内容とするサイトです。Operaで全て違って見える場合は、ここを訪れるべきです。WWWウェブの初期(1995年まで)はどのように過ぎたかというW3Cの概論で、良い読み物です。zvon.org“リファレンス”と“チュートリアル”のセクションで、ついていくのが大変ではありますが、かなり正確なものを見ることができるでしょう。Nielsenによるユーザビリティ研究の巨大なセットを提供しています。ElementsHTML5の全要素をとても上手く直感的に表示しています。Nichollsによる多くの最新CSSトリックの実験場です。CSSに関連したもの)。w3.org/TR/html4全ての要素と属性が説明されている、HTML4の公式仕様です。関連:whatwg.orgは、W3CにXHTML2をやめさせてHTML5に移行するように強制した裏切り者です。彼らの多くはブラウザベンダーです。2.1の公式仕様です。1738URLがどのように構成されているかの定義です。