ホームページ > 記事 > ウェブフロントエンド > Web開発の基本的な概念と技術の紹介_HTML/Xhtml_Webページ制作
今回は、Web 開発で使用される基本的な概念とテクノロジを初心者向けに紹介します。A から Z までの合計 26 の項目があり、それぞれがコンセプトまたはテクノロジに対応しています。
A — AJAX
AJAX は「Asynchronous JavaScript and XML」(Asynchronous JavaScript and XML) の略で、インタラクティブな Web アプリケーションを作成するための Web 開発テクノロジです。 Ajax の作成者 Jesse James Garrett 氏によると、AJAX:
XHTML CSS を使用して情報を表現します。
JavaScript を使用して DOM (ドキュメント オブジェクト モデル) を操作して、データ交換と関連操作を行います。
XMLHttpRequest オブジェクトを使用して、 Web との対話 サーバーは非同期データ交換を行います。
は JavaScript を使用してすべてを結び付けます。
DHTML や LAMP と同様に、AJAX は単一のテクノロジーを参照するのではなく、一連の関連テクノロジーを有機的に利用します。実際、AFLAX など、AJAX に基づくいくつかの「派生/複合」テクノロジーが登場しています。
ブラウザ
Web ブラウザは、Web サーバーまたはファイル システム内のファイルを表示し、ユーザーがこれらのファイルを操作できるようにするソフトウェアです。 World Wide WebやLANなどで文字や画像などの情報を表示するために使用されます。これらのテキストや画像は他の Web サイトへのハイパーリンクにすることができ、ユーザーはさまざまな情報を迅速かつ簡単に閲覧できます。ほとんどの Web ページは HTML 形式であり、一部の Web ページでは正しく表示するために特定のブラウザが必要です。 パーソナル コンピュータ上の一般的な Web ブラウザは、2010 年 1 月の市場シェアの順に、Microsoft の Internet Explorer、Mozilla の Firefox、Google の Google Chrome、Apple の Safari、および Opera Software の Opera です。ブラウザは、最も一般的に使用されるクライアント プログラムです。 Web 開発者は、プログラムがすべての主要なブラウザで適切に動作することを確認する必要があります。C —
CSS
カスケード スタイル シート、別名: カスケード スタイル シート、英語: Cascading Style Sheets、CSS と略され、W3C によって定義および維持されている標準であり、構造化ドキュメント (HTML ドキュメントや XML アプリケーションなど) にスタイルを追加するために使用される方法) (フォント、間隔、色など) コンピューター言語。最新バージョンはCSS 2.1で、W3Cの推奨標準候補となっている。次のバージョンである CSS 3 はまだ開発中です。D —
DOM
ドキュメント オブジェクト モデル (DOM) は、拡張可能なマークアップ言語を処理するために W3C 組織によって推奨されている標準プログラミング インターフェイスです。ドキュメント オブジェクト モデルの歴史は、1990 年代後半の Microsoft と Netscape の間の「ブラウザ戦争」に遡ります。JavaScript と JScript の間で生死をかけて競争するために、両当事者はブラウザに大規模な強力な機能を提供しました。 Microsoft は、VBScript、ActiveX、Microsoft 独自の D HTML 形式など、多くの独自機能を Web テクノロジに追加しているため、多くの Web ページが Microsoft 以外のプラットフォームやブラウザを使用して適切に表示できなくなります。 DOMはその時に醸造された最高傑作です。E —
イベント
イベントとは、OK ボタンを押す、ラジオ ボタンやチェック ボックスを選択するなど、コントロールによって認識できる操作です。各コントロールには、フォームの読み込み、クリック、ダブルクリックなどのイベント、編集ボックス (テキスト ボックス) 内のテキストの変更など、独自の識別可能なイベントがあります。最新の Web アプリケーションは、イベント駆動型に大きく依存しています。イベントには、システム イベントとユーザー イベントが含まれます。システム イベントは、24 時間ごとに、銀行預金者の入金日が 1 日ずつ増加するなど、システムによってトリガーされます。ユーザー イベントは、ユーザーがボタンをクリックしてテキスト ボックスに特定のテキストを表示するなど、ユーザーによってトリガーされます。 イベント駆動型コントロールは特定の機能を実行します。イベントをトリガーするオブジェクトはイベント送信者と呼ばれ、イベントを受信するオブジェクトはイベント受信者と呼ばれます。
イベント メカニズムを使用すると、これを実現できます。クラス オブジェクトの特定の状態が変化すると、システムはクラス内のメソッドを呼び出して何らかの方法でこのイベントを処理するか、制御イベントをトリガーするオブジェクトが呼び出します。登録されているコントロールのすべてのメソッド。
F —
ファイアバグ
Firebug は、Web ブラウザ Mozilla Firefox の拡張機能であり、デバッグ ツールです。ユーザーはこれを使用して、Web サイトの CSS、HTML、DOM、JavaScript コードをデバッグ、編集、さらには削除することができます。 Firebug は、Yahoo! の Web ページ速度最適化提案ツール YSlow など、他の Web 開発ツールも提供します。 Firebug はジョー・ヒューイットによって書かれました。彼は Firefox の最初の創設者の 1 人です。G —
グリッド
グリッド。グリッドとも呼ばれますが、定義上、グリッドの方が正確です。インターネット上で Web ページ グリッド システムのより適切な定義を見つけてください。通常のグリッド アレイは、Web ページのレイアウトと情報配布をガイドおよび標準化するために使用されます。ウェブグリッドシステムはフラットグリッドシステムを発展させたものです。 Web デザインでは、グリッド システムを使用すると、Web ページ上の情報プレゼンテーションがより美しく、読みやすくなるだけでなく、より使いやすくなります。さらに、フロントエンド開発の場合、Web ページはより柔軟で標準化されます。グリッド機能をサポートする CSS フレームワークが多数ある場合は、「27 のクラシック CSS フレームワークの紹介」の記事を参照してください。
H — HTML
ハイパーテキスト マークアップ言語(英語: HyperText Markup Language、HTML)とは、「Web ページの作成や、Web ブラウザーで表示できるその他の情報」のために設計されたマークアップ言語です。 HTML は、見出し、段落、リストなどの情報を構造化するために使用され、文書の外観や意味をある程度記述するためにも使用できます。 HTML は、もともと Tim Berners-Lee によって定義され、簡略化された SGML (Standard General Markup Language) 構文を使用して IETF によってさらに開発され、後に World Wide Web Consortium (W3C) によって維持される国際標準になりました。
最新バージョンは HTML5 で、HTML の次のメジャー リビジョンであり、まだ開発段階にあります。目標は、インターネット アプリケーションが急速に発展している現代のネットワーク ニーズにネットワーク標準を適合させるために、1999 年に確立された HTML 4.01 および XHTML 1.0 標準を置き換えることです。広い意味で HTML5 について話す場合、実際には HTML、CSS、JavaScript を含む一連のテクノロジーの組み合わせを指します。
私 — IE
Windows Internet Explorer (旧称 Microsoft Internet Explorer、略称 Internet Explorer、略称 IE) は、Microsoft によって発売された Web ブラウザです。 2010 年 9 月の時点で、Internet Explorer の市場シェアは 59.65% にも上るという統計データがあります。これは依然として最も広く使用されている Web ブラウザですが、その市場シェアは 2003 年のピーク時と 30% 以上異なります。
Internet Explorer はいくつかの標準化されたテクノロジをある程度サポートしていますが、運用上のギャップや互換性の問題も多数あり、テクノロジ開発者からの批判が高まっています。批判の増加は主に、Internet Explorer の競合他社が比較的完全な技術サポートを提供していることと、標準に準拠したアプリケーションがより広く使用されるようになっているという事実によるものです。 Internet Explorer は世界中で広く使用されているため、クロスプラットフォーム コードを求める Web 開発者は、Internet Explorer の脆弱性、独自の機能セット、および標準の不完全なサポートに気づくことがよくあります。
2011 年 3 月 14 日にリリースされた Internet Explorer 9 ブラウザは、CSS3 や HTML5 などの W3C 仕様のサポートが大幅に向上しました。このバージョンは、GPU アクセラレーションを採用した最初のバージョンでもあります。 Acid3 では 95/100 ポイントを獲得しました。これは、以前のバージョンと比較して大幅な改善です。 Internet Explorer 9 以降、Internet Explorer ブラウザによる W3C 仕様のサポートは問題なくなると考えられます。
J — JavaScript
JavaScript は、クライアント側の Web 開発で広く使用されているスクリプト言語で、さまざまなユーザー操作に応答するなど、HTML Web ページに動的機能を追加するためによく使用されます。もともと Netscape の Brendan Eich によって設計されたこの言語は、サポート クラスが組み込まれた、動的で弱い型付けのプロトタイプ ベースの言語です。 JavaScript は Sun Microsystems の登録商標です。 Ecma International は、JavaScript に基づいて ECMAScript 標準を開発しました。 JavaScript は、サーバーサイド プログラミングなどの他の状況でも使用できます。完全な JavaScript 実装には、ECMAScript、ドキュメント オブジェクト モデル、およびバイト オーダー表記の 3 つの部分が含まれています。
Netscape は当初、スクリプト言語を LiveScript と名付けていましたが、Sun と協力した後、その名前を JavaScript に変更しました。 JavaScript はもともと Java に触発されて設計されたものであり、目的の 1 つは「Java に似せる」ことであるため、構文に類似点があり、一部の名前や命名規則も Java から借用しています。しかし、JavaScript の主な設計原則は Self と Scheme に由来しています。JavaScript と Java の名前の類似性は、当時のマーケティング上の考慮事項による Netscape と Sun 間の合意の結果でした。技術的な優位性を得るために、Microsoft は JavaScript のスクリプト言語と競合する JScript を立ち上げました。相互運用性を目的として、Ecma International (旧欧州コンピュータ製造者協会) は ECMA-262 標準 (ECMAScript) を作成しました。どちらも ECMAScript の実装になりました。 JavaScript はプログラマー向けのプログラミング言語ではなく、非プログラマー向けのスクリプト言語として宣伝および宣伝されていますが、JavaScript には非常に豊富な機能があります。
K — キーワードの最適化
キーワードの最適化は、検索エンジン最適化 (SEO) とも呼ばれ、検索エンジンの検索ルールを使用して、関連する検索エンジンにおけるターゲット Web サイトのランキングを向上させる方法です。多くの研究で、検索エンジン ユーザーは検索結果の最初のいくつかのエントリにしか注意を払わない傾向があることがわかっているため、多くの Web サイトはさまざまな方法で検索エンジンのランキングに影響を与えることを望んでいます。これは、広告に依存して生計を立てている Web サイトに特に当てはまります。
いわゆる「検索エンジン最適化」とは、Web サイトを検索エンジンに受け入れやすくすることを指します。検索エンジンは Web サイトのコンテンツ間のいくつかの相関データを比較し、ブラウザーは最速かつ最も完全な方法で検索者にコンテンツを表示します。
検索エンジンの最適化 どの Web サイトでも、Web サイトのプロモーションを成功させたい場合、検索エンジンの最適化は重要なタスクです。同時に、検索エンジンはランキング アルゴリズム ルールを変更し続けているため、アルゴリズムが変更されるたびに、ランクの高い Web サイトの評判が一夜にして失われ、ランキングの低下の直接的な結果として、Web サイト固有の大量のトラフィックが失われます。したがって、検索エンジンのアルゴリズムが変更されるたびに、Web サイト間で大きな混乱と不安が生じることになります。検索エンジンの最適化はますます複雑なタスクになっていると言えます。
L — 少ない
Less は元々、変数、演算子、ネストされたルールなどの CSS 動的言語機能を提供する Ruby gem でした。実際、Less の本当の機能は、高度な機能を使用する CSS を標準 CSS に変換することです。これらは、Web クライアントがリクエストを開始するときに、HTTP ハンドラーを通じて完了します。編集中に行うこともできます。さらに、生成された CSS ファイルを自動的に最小化するように Less を構成できます。これにより、帯域幅が節約されるだけでなく、エンドユーザー エクスペリエンスも向上します。 Less の .Net バージョンもあります。
M —MVC
MVC パターン (モデル-ビュー-コントローラー) は、ソフトウェア エンジニアリングにおけるソフトウェア アーキテクチャ パターンであり、ソフトウェア システムをモデル、ビュー、コントローラーの 3 つの基本部分に分割します。 MVC パターンは、1974 年に Trygve Reenskaug によって初めて提案されました。これは、1980 年代に Xerox PARC によってプログラミング言語 Smalltalk 用に発明されたソフトウェア設計パターンです。 MVC パターンの目的は、動的プログラミング設計を実装し、その後のプログラムの変更と拡張を簡素化し、プログラムの特定の部分を再利用できるようにすることです。さらに、このモードは複雑さを単純化することでプログラム構造をより直感的にします。ソフトウェアシステムは基本的な部分を分離し、またそれぞれの基本的な部分に適切な機能を与えます。
N — Node.JS
ノードは Javascript ランタイム環境 (ランタイム) であり、実際には、Google V8 エンジン (Google Chrome ブラウザに適用される) をカプセル化します。 V8 エンジンは Javascript を非常に高速に実行し、非常に優れたパフォーマンスを発揮します。 Node は、いくつかの特別な使用例を最適化し、非ブラウザ環境で V8 をより適切に実行できるようにする代替 API を提供しました。たとえば、サーバー環境では通常、バイナリ データの処理が不可欠ですが、JavaScript ではこれが十分にサポートされていないため、V8.Node はバイナリ データを便利かつ効率的に処理するために Buffer クラスを追加します。したがって、Node は単に V8 を使用するだけでなく、さまざまな環境でより強力になるように最適化します。 Node.js はすべてを実行しますが、最も重要なのは、Web ブラウザーの外部で Javascript を実行する方法を提供することです。 JavaScript は、Web サイトのフロントエンド開発で広く使用されています。 Node を使用すると、この人気のあるプログラミング言語を、Web サイトのサーバー側を含め、より多くの環境で実行できるようになります。
O — オブジェクト
オブジェクトはオブジェクト指向の用語であり、客観的な世界の問題空間 (名前空間) における特定のものを表すだけでなく、ソフトウェア システムの解決空間における基本要素も表します。ソフトウェア システムでは、オブジェクトにはプロパティとメソッドが含まれます。プロパティは記憶する必要のある情報であり、メソッドはオブジェクトが提供できるサービスです。オブジェクト指向ソフトウェアでは、オブジェクトはクラスのインスタンスです。
P — PHP
PHP (Hypertext P reprocessor) は、コンピューター上で実行されるスクリプト言語です。その主な目的は、動的な Web ページを処理すること、またはコマンド ライン インターフェイス (コマンド ライン インターフェイス) を含む、またはグラフィカル ユーザー インターフェイス (GUI) を生成することです。 .プログラム。 PHP は 1995 年に Rasmus Lerdorf によって初めて発明され、現在 PHP の標準は PHP グループとオープンソース コミュニティによって維持されています。 PHP はライセンス契約として PHP License を使用しますが、この契約は PHP 名の使用を制限するため、オープンソース ライセンス契約 GPL と互換性がありません。
PHP は、特に Web プログラムの開発において幅広い用途に使用できます。一般に、PHP は主に Web サーバー上で実行され、ユーザーが閲覧する Web ページは PHP コードを実行することによって生成されます。 PHP はほとんどのサーバーおよびオペレーティング システムで実行でき、PHP の使用は完全に無料です。 2007 年 4 月の統計によると、PHP は 2,000 万以上の Web サイトと 100 万台のサーバーにインストールされています。
Q — クエリ
クエリには多くの意味があります。たとえば、クエリ言語は、データを保存する拡張システムと対話するために使用され、リレーショナル データベースを操作するために使用される SQL がその好例です。もう 1 つの意味は、クエリ文字列が Web アプリケーションでデータを転送するための URL の一部として使用されることです。クエリ文字列の形式は通常、キーと値のペアの形式になります。
R — 正規表現
正規表現 (英語: Regular Expression、regex または regexp、RE と略記) は、コンピュータ サイエンスにおいて、正規表現、正規表現とも訳され、特定の単一の内容を説明または一致させるために使用される一連の表現を指します。構文ルールを備えた文字列の文字列。多くのテキスト エディターやその他のツールでは、特定のパターンに一致するテキスト コンテンツを取得および/または置換するために正規表現がよく使用されます。多くのプログラミング言語は、正規表現を使用した文字列操作をサポートしています。たとえば、Perl には強力な正規表現エンジンが組み込まれています。正規表現の概念は、もともと Unix のツール ソフトウェア (sed や grep など) によって普及しました。
S — ソース管理
バージョン管理とも呼ばれるソース コード管理は、ソフトウェア開発プロセス中に、さまざまな人が編集した同じプログラム ファイルが確実に同期されるようにするソフトウェア エンジニアリング技術です。 ソフトウェア設計者は多くの場合、バージョン管理を使用してソース コード、ファイル、構成ファイルなどの変更を追跡および維持し、これらの変更を制御する手順を提供します。最も単純なケースでは、ソフトウェア設計者は、プログラムのさまざまなバージョンを自分で保持し、それらに適切な番号を付けることができます。このシンプルなアプローチは、多くの大規模なソフトウェア プロジェクトで使用されています。これは目的を達成できる方法ですが、効率が十分ではありません。ほぼ同一のプログラム コードのバックアップを多数同時に維持する必要があることに加えて、ソフトウェア設計者の自己研鑽と開発規律にも大きく依存しますが、これがエラーの原因となることがよくあります。
場合によっては、プログラムの 2 つ以上のバージョンを同時に使用する必要があります。たとえば、展開用のバージョンではプログラムのエラーが修正されているが、別の開発バージョンでは新しい機能が追加されていません。新しい機能が開発されており、新しいバグを解決する必要があるため、同時に異なるバージョンと変更が必要になります。さらに、特定のバージョンにのみ存在する「プログラム エラー」を見つけたり、「プログラム エラー」が発生したバージョンを見つけたりするために、ソフトウェア デバッガはプログラム コードの異なるバージョンを比較して、プログラム コードの場所を見つける必要もあります。問題。
T — TDD
テスト駆動開発は、最新のコンピューター ソフトウェア開発方法です。テストを使用して、ソフトウェア プログラムの設計と実装を推進します。試乗は 1990 年代に人気になりました。テスト駆動開発とは、エクストリームプログラミングで提唱されているプログラム開発手法で、主に最初にテストプログラムを作成し、それをコーディングしてテストに合格するという手法です。テスト駆動開発の目的は、迅速なフィードバックを得て、「主要な線を示す」アプローチを使用してプログラムを構築することです。
テスト駆動開発の比喩。開発は、機能と実装の品質という 2 つの側面から見ることができます。テスト駆動開発は、最初にテストの助けを借りて機能の帽子をかぶって、次に冗長性を削除してテストの保護の下でリファクタリングの帽子をかぶるという開発方法に似ています。重複したコードを削除し、コードの再利用性を向上させ、品質の向上を実現します。テストはテスト駆動開発の中核的な位置に属し、開発全体を通して実行されることがわかります。
U — 単体テスト
単体テスト (モジュール テストとも呼ばれる) は、プログラム モジュール (ソフトウェア設計の最小単位) の正当性をテストするテストです。プログラム ユニットは、アプリケーションのテスト可能な最小のコンポーネントです。手続き型プログラミングでは、単位は単一のプログラム、関数、プロセスなどです。オブジェクト指向プログラミングでは、最小単位はメソッドであり、基本クラス (スーパークラス)、抽象クラス、または派生クラス (サブクラス) のメソッドが含まれます。
一般に、プログラマーはプログラムを変更するたびに少なくとも 1 回の単体テストを実行し、プログラムがソフトウェア仕様の要件を満たしていることを確認するために複数の単体テストを実行する可能性があります。 en:仕様) 作業の目標はバグがないことです。単体テストは必要ありませんが、悪いことではありません。これにはプロジェクト管理ポリシーの決定が含まれます。
V — VIM
Vim は vi から開発されたテキスト エディターです。特にコード補完、コンパイル、エラージャンプなどプログラミングを容易にする機能が豊富で、プログラマーの間で広く使われています。 Emacs と連携して、Unix 系システムのユーザーに最も人気のあるエディタになりました。 Vim の最初のバージョンは 1991 年に Bram Moolenaar によってリリースされました。当初の略称は V i IM iteration でしたが、機能が増加し続けるにつれて、正式名称は Vi IM に変更されました。現在、オープンソースコードの下でフリーソフトウェアとしてリリースされています。
W — WordPress
WordPress は、PHP 言語を使用して開発されたブログ プラットフォームで、ユーザーは PHP および MySQL データベースをサポートするサーバー上に独自のブログをセットアップできます。 WordPress をコンテンツ管理システム (CMS) として使用することもできます。 WordPress は、GNU General Public License に基づいてライセンス供与された無料のオープンソース プロジェクトです。最新バージョンは、2011年2月24日にリリースされた公式簡体字中国語バージョン3.0.5で、英語を含む多言語で利用可能です。
X — XSS
クロスサイト スクリプティング (XSS とも呼ばれます) は、悪意のあるユーザーが Web ページにコードを挿入できるようにする Web サイト アプリケーションに対するセキュリティ脆弱性攻撃であり、他のユーザーが影響を受けます。このタイプの攻撃には通常、HTML とユーザー側のスクリプト言語が関係します。
Y — ゆい
Yahoo! UI ライブラリ (YUI) は、高度にインタラクティブな Web ページを作成するために、AJAX、DHTML、DOM などのコーディング テクノロジを使用するオープンソースの JavaScript 関数ライブラリです。多くの CSS リソースも含まれています。
Z — Z インデックス
Z-Index
は、要素の重なり順を設定する CSS プロパティです。積み重ね順序が高い要素は常に、積み重ね順序が低い要素の前に表示されます。このプロパティは、z 軸に沿って配置された要素の位置を設定します。z 軸は、表示領域に垂直に伸びる軸として定義されます。正の数の場合はユーザーに近くなり、負の数の場合はユーザーから遠ざかります。