ホームページ  >  記事  >  ウェブフロントエンド  >  Web フロントエンドにはどの 3 つの部分が含まれますか?

Web フロントエンドにはどの 3 つの部分が含まれますか?

青灯夜游
青灯夜游オリジナル
2022-08-23 16:53:437014ブラウズ

Web フロントエンドの 3 つの部分: 1. 構造レイヤーは、HTML または XHTML マークアップ言語によって作成された Web ページのスケルトンであり、ドキュメントの構造を構築し、コンテンツの定義に使用されます。タイトル、テキスト、画像などの Web ページ ; 2. プレゼンテーション層は CSS によって作成される Web ページのスタイルであり、色、フォント、ドキュメントのプレゼンテーション効果を設定するために使用されます。背景など; 3. 動作層は、JavaScript 言語によって作成された Web ページの動作であり、リアルタイムで更新できます。Web ページ内のコンテンツ (サーバーからデータを取得して、それをWeb ページをより鮮やかにすることができます。

Web フロントエンドにはどの 3 つの部分が含まれますか?

このチュートリアルの動作環境: Windows 7 システム、Dell G3 コンピューター。

Web フロントエンドの 3 つの部分

W3C は、World Wide Web Consortium (World Wide Web Consortium) を指します。 1994年10月設立。 W3C の登場は、Web 開発の標準をカスタマイズして、同じ Web ページが異なるブラウザで同じ効果を発揮できるようにすることを目的としているため、カスタムで作成された Web ページは W3C 仕様に従う必要があります。

W3C 標準によれば、Web ページは主に構造層 (HTNL)、プレゼンテーション層 (CSS)、および動作層 (JavaScript) の 3 つの部分で構成されます。

構造レイヤー

構造レイヤーは、HTML または XHTML マークアップ言語によって作成され、ドキュメントの構造を構築するために使用されるページのスケルトンです。

HTML は、タイトル、テキスト、画像などの Web ページのコンテンツを定義するために使用されます。

プレゼンテーション レイヤー

プレゼンテーション層はページのスタイルであり、CSS (Cascading Style Sheets) で構成され、作成を担当し、ドキュメントのプレゼンテーション効果を設定するために使用されます。

CSS は、色、フォント、背景など、Web ページの外観を制御するために使用されます。

動作レイヤー

動作層はページの動作であり、JavaScript 言語はドキュメントの動作を実装するために作成されます。

JavaScript は、サーバーからデータを取得して Web ページに更新したり、一部のタグのスタイルやその内容を変更したりするなど、Web ページ内のコンテンツをリアルタイムに更新するために使用されます。これにより、Web ページがより鮮明になります。

簡単に言うと、JavaScript、HTML、CSS が一緒になって私たちが見る Web ページを構成します。

  • HTML は、Web ページのコンテンツを定義するために使用されます。 Web ページ。たとえば、タイトル、テキスト、画像など。

  • #CSS は、色、フォント、背景など、Web ページの外観を制御するために使用されます。

  • JavaScript は、サーバーからデータを取得して Web ページに更新したり、一部のタグやタグのスタイルを変更したりするなど、Web ページ内のコンテンツをリアルタイムに更新するために使用されます。そのコンテンツなどを追加して、Web ページをより鮮やかにします。

HTML は、ハイパーテキスト マークアップ言語 (HyperText Markup Language) で、Web ページの作成に使用される標準のマークアップ言語です。 HTML は Web ページの 3 つのコンポーネントの構造を担当し、タグを使用して Web ページのさまざまなコンポーネントを識別します。いわゆるハイパーテキストは、あるページから別のページにジャンプできるハイパーリンクを指します。

CSS は Cascading Style Sheets を指します。スタイルは HTML 要素の表示方法を定義し、Web ページの外観を制御するために使用されます。 CSS は Web ページの 3 つのコンポーネントのパフォーマンスを担当し、スタイルは通常、外部の .css ファイルに保存されます。単純な CSS ドキュメントを編集するだけで、すべてのページのレイアウトと外観を変更できます。

JavaScript はスクリプト言語 (略して「JS」) であり、Web ページの動作を制御するために使用される軽量プログラミング言語です。 JavaScript は、Web ページの 3 つのコンポーネントの動作を担当します。JavaScript は HTML ページのプログラミング コードに挿入できます。JavaScript を HTML ページに挿入すると、最新のすべてのブラウザで実行できます。

#HTML、CSS、JavaScriptの学び方

1. htmlとcssの体系的な学習

HTML と CSS は比較的単純ですが、それでも体系的な学習が必要です。

2. Javascript の深い理解

優秀なフロントエンド プログラマは、JavaScript の原理、メカニズム、起源、オブジェクトベースの性質を深く理解する必要があります。実践することで真の知識が得られるため、オープンソース プロジェクトをもっと読むことをお勧めします。

Web フロントエンド開発技術は、簡単なものから難しいものへとプロセスをたどります。Web フロントエンド開発技術者は、基本的な Web 開発技術、Web サイトのパフォーマンスの美化、SEO、および基本的なサーバーサイドについて習熟している必要があります。一方で、開発者には、開発を支援するためにさまざまなツールを巧みかつ繊細に使用できるなど、特有の要件があります。

同時に、関連する基本的な知識理論を習得する必要があります。代表的なものには、コードの保守性、階層型セマンティック テンプレート、コンポーネントの使いやすさなどが含まれます。フロントエンド開発技術は、JavaScript、従来型をカバーします。 CSS、Adobe RIA、Google Gearsなどのテクノロジー、比較的概念的なインタラクティブデザイン、アート色の強いビジュアルデザインなど。

インターネットを例えとして使用すると、ブラウザからクライアント コンピュータに渡されるすべてのものを総称してフロントエンド テクノロジと呼びます。サーバー側に保存されるものは、総称してバックエンド テクノロジと呼ばれます。フロントエンド テクノロジには、JavaScript、ActionScript、CSS、xHTML などの「従来の」テクノロジ、Adobe AIR、Google Gears、さらに概念的なインタラクティブ デザインや芸術的なビジュアルが含まれます。 Webフロントエンド開発には数多くの職種がありますが、まずは「フロントエンド開発エンジニア」「シニアフロントエンド開発エンジニア」「フロントエンドアーキテクト」の3つの職種を例に挙げて分析していきます。それぞれの責任。

フロントエンド開発エンジニア (または「ウェブページ制作」、「ウェブページ制作エンジニア」、「フロントエンド制作エンジニア」、「ウェブサイト再構築エンジニア」)、このようなポジションの主な責任は、対話することです。 with デザイナーとビジュアル デザイナーが協力して HTML と CSS を革新し、使用して、デザイン図面に基づいて Web サイト ページの制作を完了します。これに基づいて、完成したページの基本的なメンテナンスを実行し、それに応じて Web サイトのフロントエンドのパフォーマンスを最適化する必要があります。

さらに、資格のあるフロントエンド開発エンジニアは、美学に関する独自の認識と、アート オペレーションにおける独自のアイデアを持っている必要があります。この方法によってのみ、視覚的なコラボレーションを適切に実現できます。技術者にとって、確かな審美眼と基礎的なアート操作能力を持つことは必須の能力です。フロントエンド開発技術はソフトウェアエンジニアリングなど幅広い分野に及びます。実際にフロントエンド開発技術を分析する際には、インターネットを利用してフロントエンド開発技術を理解・分析することができ、ブラウザからユーザーエンドの設計までコンピュータを追い続ける技術であれば、フロントエンド開発技術を理解・分析することができます。フロントエンド技術と総称されますが、バックエンド技術の主な内容は、サーバー側に格納する必要のある技術です。

2015 年 12 月 5 日、「広州インターネット業界人材不足指数 (TSI) レポート」に掲載された情報によると、フロントエンド開発エンジニアが広州インターネット業界で最も需要の高い職種となっています。

フロントエンド開発技術はソフトウェアエンジニアリングやその他の分野など多岐にわたります。実際にフロントエンド開発技術を分析する際には、インターネットを利用してフロントエンド開発技術を理解・分析することができ、ブラウザからユーザーエンドの設計までコンピュータを追い続ける技術であれば、フロントエンド開発技術を理解・分析することができます。フロントエンド技術と総称されますが、バックエンド技術の主な内容は、サーバー側に格納する必要のある技術です。 2015 年 12 月 5 日、「広州インターネット業界人材不足指数 (TSI) レポート」で提供された情報によると、フロントエンド開発エンジニアが広州インターネット業界で最も需要の高い職種となっています。

Web フロントエンド開発のタスクは、ソフトウェア開発、Web サイトの使いやすさの分析、ユーザーからフィードバックされた情報に基づいた Web サイトのフロントエンド設計の問題領域の最適化にさらに焦点を当てます。このプロセスでは、JavaScript、flashactionscript3.0、および HTML CSS テクノロジの三位一体によって、ページは最適化後のユーザー エクスペリエンスを向上させることができます。例えば、QQスペースの画像閲覧機能は、従来は撮影後に画像を閲覧するだけでなく、Webページ上でカテゴリーごとに閲覧する機能でしたが、現在はWebページ上で直接画像を閲覧できる機能がフロントで開発されています。 -エンド開発エンジニア。このほか、スライド効果やajax技術などを表示できる情報サイトもいろいろあります。

Webフロントエンドを始める際には、フロントエンドのアーキテクチャ設計やその基盤となるデータ送信を行うため、Webフロントエンド開発には前者よりも高い基礎的なプログラミングスキルが必要であり、またWebフロントエンドの理解も必要となります。ウェブサイトの背景言語を理解する。現段階ではフロントエンド開発技術の発展が著しく、実務者への要求もより厳しくなっており、今後のフロントエンドの世界の方向性を明確にしながら、新しいフロントエンド開発技術を習得する必要があります。実現が難しいテクノロジーの利点と機能を最大限に発揮します。

フロントエンド テクノロジーの Xunfajia は、インターネットそのものに伴う発展と変化を凝縮したものです。 HTML技術は初期段階では単にページを表示するだけであり、メンテナンスや更新機能を実装しようとすると大きな問題に直面することになります。この記事は、Web 1.0、Web 2.0、Web 3.0、Web 4.0 に至るインターネットの将来の発展経路を段階的に分析し、把握します。 Web1.0の特徴は基本的な編集であり、Webサイト編集者が編集・加工を行った後、Webサイトは対応するコンテンツをユーザーに提供し、ユーザーは閲覧権を行使することができます。 Web サイトからユーザーへの移行プロセスは一方通行であり、Web 1.0 の時代には、新浪、捜狐、網易の 3 つの主要ポータルが 3 つの巨人の役割を果たしました。

Web 2.0、前段階よりもさらに上のレベル。 Web サイトとそのユーザーの間のインタラクションが強化され、Web サイト内のコンテンツはユーザーが Web サイトに提供したものから得られるため、ユーザーは Web サイトの複数の機能の構築によりよく参加できるようになります。ウェブサイトとユーザーの関係が変化し、双方向のコミュニケーションによりユーザー同士の参加関係が実現します。 Web 1.0 とは異なり、Web 2.0 のインタラクティブ性がその可能性の鍵です。 Web 2.0 時代では、Blog China、Yiyou Dating、および Liaison が傑出した代表格になりました。このタイプの Web サイトのユーザーは独自のデータ リポジトリを持ち、完全に Web に基づいており、ブラウザはすべての機能を実装できます。

Web3.0 は、変化の概念であり、マイクロソフトによって提案され、多数の特許の申請に成功しました。さまざまな Web 3.0 Web サイトでは、情報を直接交換および対話できると同時に、サードパーティの情報プラットフォームによって、さまざまな Web サイトから提供される豊富な情報を統合および分類することもできます。 Web 3.0 システムを使用すると、ユーザーはインターネット上に自分のデータを持つこともできますが、Web 2.0 よりも進化しているのは、ユーザーがこれらのデータをさまざまな Web サイトで使用できることです。機能の実現は完全にWebベースで行われており、複雑なシステムプログラムでしか実行できないさまざまな操作がブラウザだけで完結します。

Web 4.0 は、複数人でのディナー パーティーと同様に、全員を結び付け、全員が所有するリソースを統合します。誰もが自分のニーズに応じてリソース所有者を選択できます。プラットフォームは接続の役割を果たします。このプラットフォームは Web サイトではなく契約です。すべてのユーザーはこの契約に従う必要があります。Web サイトは契約を囲むユーザーです。各ユーザーが独自の Web サイトを持ち、プロトコルの次を中心に展開する場合は、 、人類は真にインターネット時代に突入し、それは多くのウェブサイトで構成される時代になるはずです。

Web 標準が最初に策定されたとき、すでにフロントエンド開発の研究は開始されていましたが、その進歩は非常に遅く、Javascript が徐々に Web フロントエンド開発用の成熟した言語になってから、フロントエンド開発が行われるようになりました。開発がさらに進みます。 Web 4.0 の適用と、Weibo、ブログ、Web ゲーム、SNS、ビデオ Web サイトなどの製品の登場により、人々は Web ページに対するより高い要求を提示するようになり、デザイナーは開発プロセス中にさらに多くの問題を考慮する必要があります。現在、JavaScript 言語は Web 開発において非常に重要であり、JavaScript を中心とした現在の Web フロントエンド開発は急速に発展しています。

現在、Web フロントエンド開発が注目の研究テーマになっており、さまざまなサイトのユーザビリティ要件を満たし、製品のユーザー エクスペリエンスを向上させるために、さまざまな「ユーザー エクスペリエンス」チームが急速に開発されています。開発チーム内のポジションは分割されており、インタラクション デザイナー、ユーザー エクスペリエンス アナリスト、フロントエンド開発エンジニア、Web デザイナーなどが主に強力なフロントエンド アプリケーションを設計および開発していることもより明確になりました。

Web フロントエンド開発者は、W3C 標準への精通、Web セマンティクスの深い理解、パフォーマンスとデータの分離など、バックエンド開発の理解などのスキルとテクノロジを習得する必要があります。 (C/C/PHP/Javaなど)、アルゴリズム、データ構造など、ページの構造やレイアウトに精通し、CSS、HTML/XHTMLなどのWebページ制作技術、AjaxやXHTMLなどのWeb開発技術に精通しているジャバスクリプト。

技術の発展に伴い、フロントエンド開発技術は今後も向上し、HTML5、CSS 4.0などがフロントエンド開発の主流技術となるでしょう。フロントエンド開発の詳細 テクノロジーが出現するにつれて、フロントエンド開発における最新テクノロジーに常に注意を払う必要があります。

現在、フロントエンド開発技術は成熟したばかりですが、今後数年でその人材の需要はさらに高まると考えられます。しかし、需要が飽和している場合、人材需要の飽和は、フロントエンド開発が真に成熟していることの表れでもあります。将来的には、フロントエンド開発者はより広い開発スペース、より大きな挑戦、より高いステージで人々が力を発揮できるようになります。同時に、科学研究者は自らの能力を向上させ、ユーザーのニーズを満たすより多くの製品を開発し続ける必要があります。

(学習ビデオ共有: Web フロントエンド )

以上がWeb フロントエンドにはどの 3 つの部分が含まれますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。