Web に関する誤解を学ぶfront-end_html/css_WEB-ITnose-htmlチュートリアル-php.cn

Web フロントエンド学習における誤解

Web ページ制作は、コンピュータ専攻の学生が大学在学中に触れるコースであり、ほとんどの学生が学習するために最初に使用する統合開発環境 (IDE) です。 Web ページの制作には Dreamweaver を使用する必要があります。Web ページの作成に非常に便利な WYSIWYG の「爆発的な」IDE です。

すぐに始められ、すぐに結果が得られるため、私たちは気づかぬうちに Web ページ制作に夢中になってしまいました。このとき、多くの人が誤解に陥るでしょう。つまり、このような優れた IDE の助けを借りて、マウスでメニューをクリックするだけで Web ページを迅速かつ便利に作成できるのです。

それでは、なぜ私たちは html、CSS、JavaScript、jQuery などの難しいコードを学習する必要があるのでしょうか? これは、複雑さのために単純さを放棄していることではないでしょうか?

しかし、研究が深まるにつれて、私たちは次のことに気づくでしょう。 IDE に過度に依存すると、その実装の本質が分からなくなるというジレンマに陥っています。それはわかっていますが、その理由はわかりません。

そのため、ページのパフォーマンスに問題があると、ページを最適化してより高度なアプリケーションを完成させる方法はおろか、途方に暮れてしまいます。理由は明白です。スマート IDE は私たちの怠惰を満たし、豪華な Web ページの背後にある最も重要なコンテンツであるコードを無視させます。

無駄な努力より正しい方向のほうが良いです

壁の向こう側に食べ物を見つけるために壁の一部を乗り越えようとしている2匹のアリがいます。アリは壁の根元まで来ると躊躇なく登っていきますが、途中まで登るたびに疲労と疲労で倒れてしまいます。くじけなかったものの、何度も転んで、すぐに調子を整えて、また登り始めました。

もう一匹のアリはそれを観察し、壁の周りを回ることにしました。すぐに、アリは壁の周りを歩き回って餌を食べ始めましたが、もう一方のアリは落ちてまた歩き始めました。

多くの場合、成功には勇気と忍耐に加えて、方向性が必要です。おそらく方向性が良ければ、想像よりも早く成功が訪れるでしょう。間違った道を走ってしまうと、どんなに頑張っても無駄になってしまいます。 Web フロントエンドの学習にも同じことが当てはまります。まず、正しい学習ルートを選択する必要があります。

私の学習経験、近年の学生指導の経験、および社内の実際のプロジェクトのニーズを組み合わせました

第一段階: HTML 学習

ハイパーテキストマークアップ言語 (略して HTML) は Web の骨格ですpage は、静的 Web ページであっても動的 Web ページであっても、最終的にブラウザーに返されるのは HTML コードです。ブラウザーは HTML コードを解釈してレンダリングし、ユーザーに表示します。したがって、HTML の基本構造と共通のタグと属性を習得する必要があります。

HTML の学習は暗記と理解のプロセスです。学習プロセス中に、Dreamweaver の「分割」ビューを使用して学習を支援できます。「デザイン」ビューで効果を確認し、「コード」ビューで本質を学び、さまざまなビューの利点を最大限に活用するこの比較学習方法は、HTMLのタグと属性をただ覚えるだけの退屈さを補ってくれるはずです。初心者の皆さんへ

HTML を学んだ後、建物を建てたい場合は、これらの「原材料」を使用する必要があります。デザインスキームがまとめられ、いくつかの美化が実行されます。

第二段階：CSS学習

CSSとは英語のCascading Style Sheetsの略で、Webページのパフォーマンスとコンテンツを真に分離できるスタイルデザイン言語です。従来の HTML のパフォーマンスと比較して、スタイルを再利用できるため、開発速度が大幅に向上し、メンテナンスコストが削減されます。

同時に、CSS のボックスモデル、相対レイアウト、絶対レイアウトなどにより、Web ページ内の各オブジェクトの位置とレイアウトをピクセルレベルで正確に制御できます。この学習段階を通じて、私たちは「建物」の建設を無事に完了することができます。

「建物」の建設が完了したら、ユーザーに引き渡して使用することができますが、ユーザーにより良い体験を提供したい場合は、「建物」をさらに「装飾」して、より見栄えを良くすることもできます「贅沢」なところもある。

第 3 段階: JavaScript の学習

JavaScript はクライアント側で広く使用されているスクリプト言語であり、これらのコンテンツを利用して、いくつかの組み込み関数、オブジェクト、および DOM 操作を実装できます。終末期の特殊効果、検証、インタラクションなどにより、ページの退屈さが軽減され、diaosi はすぐに金持ちやハンサムに反撃できるようになります。それは可能ですか?

現時点では、おそらくあなたはまだ驚きに浸っているでしょう。 JavaScript を導入しましたが、プロジェクトマネージャーが突然あなたに怒鳴りました

「このエフェクトは ×× ブラウザでは互換性がありません。もう一度試してください...」

「互換性がありませんでしたか?」拭いてください、何というチートだ! 完成させるのに何百行ものコードを書くのに一晩かかりました!」

JavaScript の互換性と複雑さは、時々頭を悩ませることもありますが、幸いなことに、JavaScript のカプセル化を手伝ってくれる「マスター」がいます。

第 4 段階: jQUery の学習

jQuery は無料のオープンソースの軽量 JavaScript ライブラリであり、さまざまなブラウザーと互換性があります (jQuery2.0 以降のバージョンは IE6/7/8 ブラウザーのサポートを放棄しています)。現在では、多くの jQuery ベースのプラグインから選択できます。これらは、豊富な動的効果を実装するときに、より便利で高速になり、開発時間を大幅に節約し、開発速度を向上させます。これは、do の中心的な目的である書き込みレス機能も完全に反映しています。もっと。これはとても気持ちいいことですよね？建物を建てる必要があるとき、それは実現できるでしょうか?

このような考え方は Web フロントエンド開発にも適しているため、さまざまなフロントエンドフレームワークが登場しています。ここで皆さんにお勧めするのは Bootstrap です。

Bootstrap は、Twitter によって開始されたフロントエンド開発用のオープンソースツールキットであり、レスポンシブレイアウトをサポートしています。これは開始されると非常に人気があり、GitHub で人気のオープンソースプロジェクトになりました。

プロジェクト開発プロセス中、Bootstrap が提供する CSS スタイル、コンポーネント、JavaScript プラグインなどを利用して、ページレイアウトとスタイル設定を迅速に完了し、目的を絞った方法でスタイルを微調整できます。このフレームワークベースの開発により、開発サイクルが大幅に短縮されます。巨人の肩の上に立つのはクールです!

Web フロントエンドを学習するための提案

最後に、Web フロントエンドを学習する際のいくつかの提案と方法について話しましょう。

CSS をレイアウトするときに注意する必要がある問題は、多くの学生がページレイアウトの全体的な分析が不足しており、マクロの観点からページ上のボックス間の入れ子関係を把握できないため、それを行うことに熱心であることです。その結果、ページ上にさまざまな要素間の関係が非常にわかりにくくなり、フローティング時にボックスの位置がずれやすくなります。レイアウトする際には、まずいくつかのボックスを使用してページ全体を分割し、徐々にボックス内にボックスを入れ子にしていくという考え方を採用することをお勧めします。

「紳士は他の人と変わらない、偽物が得意である。」学習の過程で、より優れたウェブサイトを閲覧し、そのデザインのアイデアやレイアウト方法を分析して学ぶのが得意であり、できるようになるべきです。もっと見ることでより多くのことを学び、それを統合し、他の人の長所を自分用に活用することができます。

同時に、Firebug をツールとして使いこなせる必要があります。一方では、Firebug は学習プロセス中に自分のページをデバッグするのに役立ちますが、他方では、Firebug を使用して他の人の Web サイトのソースコードを簡単に表示および分析することもできます

。成長や基盤は人それぞれ異なりますので、実情に応じて実践してください。繰り返しますが、フロントエンドの中核は js です。 CSSは難しいものではありませんが、積み重ねが必要です。私はフロントエンドについて次のように考えています:

CSS はワインのボトルのようなもので、優れています。

HTML と CSS にはタグとセレクター属性しかありませんが、スケーラブルで堅牢、または保守しやすいページを作成するのは簡単ではありません。ここで、ページの基本的な条件付きリフレクションを作成するときに重要なのは、それを迅速に完了する方法ではなく、インターフェースを変更する必要がある場合に、最小限のコード変更で必要なタスクを迅速に完了する方法を考えることです。これは、フロントエンドの持久力、体力、知性の三重テストです。

js は剣のようなもので、研ぐ必要があります。

js は最初は単なる実験用でしたが、テクノロジーと社会の発展に伴い、その役割はますます重要になってきました。私が初めて jQuery を使い始めたとき、私はすでに js を知っているように感じましたが、実際には単なる実験でした。氷山の一角。 js について学ぶほど、それは倒錯的であり、かわいらしく、楽しく、そして制御が難しいものでもありますが、互換性を解決することが私たちが生き残るための基本的な方法です。 ajax から jsmvc までずっと見てみると、成功の潮流はますます高くなっています

人生は夢です、それをやらなければなりません。

テクノロジーは人生の一部にすぎません。以前は野心的でしたが、今はただ頭を下げてコードを書いています。変えられるものは変え、変えられないものは受け入れる。命には限りがあり、兄弟は昼も夜も戦います。人生学習に対する態度は、せっかちでもせっかちでもなく、速くも遅くもなくです。耐えて自分を信じてください。世界を変えようとするのではなく、自分自身の人生を変えようと努めてください。飛躍的な歩幅を求めるのではなく、一度に一歩ずつ求めてください。苦しみのおかげで、私たちは内面的に強くなります。挫折のおかげで、私たちは成長し続けます。バグのおかげで、私たちの思考は深まります。フロントエンドのおかげで、彼は私たちに、空を支えるには 18 種類の武道が必要であることをさらに信じさせました。