htmlを編集中。 HTMLエディタの選択

12.03.2024 プリンターとスキャナー

私たちはあなたの注意を引くために非常に必要なツールを紹介します -! このツールを使用すると、テキストを操作するだけでなく、ビジュアル ボタン、フォームの追加、表の操作、ビデオの挿入など、さまざまな操作ができます。このツールが気に入ってすでに使用している場合は、「いいね」をクリックして共有してください。ソーシャルネットワーク上の友達と一緒に

テキスト入力フィールド…。

オンラインビジュアルHTMLエディターの主な利点

このエディター全体について言えば、多くの利点と高度な機能があります。 このツール テキスト、コード、ビジュアルオブジェクトを操作できるようになります。 もちろん、ほとんどの CMS にはすでに独自のビジュアル エディターが備わっていますが、未完成であるか、機能が不十分であるか、不便であることがよくあります。 したがって、代替手段が必要となる。 したがって、エディターがまったくないサイト、またはすでにエディターがあるが気に入らないサイトにコンテンツを追加したい場合は、このオンライン HTML エディターを使用すると、テキストを美しく整形したり、グラフィック要素を整形したりできます。 、画像を配置し、これらすべてをコードの形式で Web サイトまたはプロジェクトに追加します。

機能の簡単な説明

  • ソース。このオプションを使用すると、ビジュアル ビューとソース コードを切り替えることができます。
  • コード内検索 (CTRL + F)。 ソースコードモードのみ。 コードで検索できるようになります。
  • フォーマットの選択。 ソースコードモードのみ。 コード内に階層を作成できます。
  • コードをコメントアウトします。 このオプションは、強調表示されたコードを一時的に無効にし、ページへの出力を禁止するために使用されます。
  • 自動終了タグのオン/オフ。 有効にすると、入力した開いているタグが自動的に閉じられます
  • 新しいページ。 作業領域をクリアします。 未保存のデータを失わないよう、このボタンの操作には注意してください。
  • プレビュー。 すべてのワークスペースのコンテンツを全画面で個別に表示できます。
  • シール。 文書を印刷します。
  • テンプレート。 テキストの標準セットのテンプレートと、画像やグラフィック オブジェクトを配置するためのオプションが含まれています。
  • 切り取り/コピー/貼り付け。 コピーまたは切り取ったテキストを作業領域に貼り付けたり、以前に選択したテキストを作業領域からコピーしたりできます。
  • 元に戻す/やり直す。 アクションをキャンセルまたはやり直します。
  • 検索/置換。 このツールを使用すると、特定の単語または語句を使用してテキスト検索を実行したり、ある単語を別の単語に自動的に置換したりできます。
  • すべて選択。 エディターですべてのコンテンツを選択します。
  • スペルチェック。 テキストのスペルミスをチェックします。

次のツール ブロックは、HTML ボタンやフォームなどを作成するために設計されています。

  • 形状。入力フォームを作成します。 タイプとプロパティを設定する機能。
  • チェックボタン。 複数選択が可能なチェックマークの形式のチェックボックス。
  • 選択ボタン。 オプションを 1 つ選択するチェックボックス。

この HTML エディターを使用しながら、その他の機能や使用可能性 (書式設定、フォント、スタイル、画像の挿入、テキストへのビデオの挿入など) を学ぶことができます。
このオンライン ツールが気に入ったら、下のボタンのいずれかで「いいね」をクリックすることを忘れないでください。

今日の記事は、初心者プログラマーや Web デザイナーの間で非常に最近のトピック、つまり HTML エディターの選択に関するトピックに触れます。 特殊なソフトウェアのリスト全体を提示したとしても、その場で最適な選択をするのは困難です。各プログラムは独自のものであり、独自の機能、長所、短所が多数あります。 幸いなことに、上記の職業に従事する多数の人々の間で、長年にわたる実りある仕事の結果、HTML ドキュメント、特にインターネット サイトの作成と編集に最適なプログラムの「作業リスト」が形成されました。 この資料では、6 つの HTML エディターについて考察します。 かなりの量の記事が作成されることを考慮して、導入を遅らせることなく、すぐに業務に取り掛かります。

そこで、私たちが最初に注目した HTML エディターは Macromedia HomeSite でした。

Macromedia HomeSite は、ページを手動でコーディングすることを好むユーザーの間で、おそらく最も一般的な HTML ドキュメント編集ツールの 1 つです。 同時に、HomeSite を使用すると、作成プロセスが大幅にスピードアップされ、開発者の作業が容易になります。

画像を拡大する

プログラムのワークスペースは、おおまかに 3 つの部分に分けることができます。最初の最大の部分は、ドキュメントの内容が表示される実際のウィンドウです。左側にある 2 番目の部分には、デフォルトでディスク上で利用可能なドキュメントのリストが含まれています。 そして最後に、上部には従来のメニューに加えて、最も頻繁に使用される機能を備えたいくつかのパネルがありますが、その外観は好みに合わせてカスタマイズできます。

Macromedia HomeSite は、HTML ページだけでなく、PHP、Perl、ASP、MySQL、その他の一般的な開発ツールに対しても便利な構文ハイライトを提供します。 この事実は、ハイパーテキスト マークアップ言語ツールに限定されず、より複雑な Web プログラミング言語を使用する経験豊富なユーザーにとって魅力的です。 構文強調表示の現在のカラー スキームに満足できない場合でも、これは問題ありません。既存のカラー スキームを編集したり、独自のドキュメント レイアウト スキームを作成したりすることもできます。 HomeSite には強力なヘルプ システムがあり、HTML 言語仕様プログラムの機能の説明に加えて、タグ リファレンス ブックや現在の記述子に関する便利なツールチップが含まれています。これらを呼び出すには、F2 キーを押すだけで、ユーザーにすべての情報が表示されます。特定のタグに使用できる属性。

頻繁に使用されるタグ グループへのアクセスを高速化するために、右上隅にいくつかのパネルがあり、その外観と位置も変更できます。

パネルは複数のタブに分かれており、各タブには 1 つのグループに関連するタグが含まれています。 たとえば、「フォント」タブには、フォント サイズの迅速な拡大、スタイルの変更、行に対する相対的な位置の変更、および 3 レベルの見出しの挿入を行うためのボタンが含まれています。

すべてのタグ属性を手動で入力する別の方法は、いわゆるタグ エディターです。これを使用すると、さまざまな属性に値を割り当てるプロセスを大幅に簡素化できます。

これとは別に、テーブルとフレームを作成および構成するためのツールであるテーブル ウィザードとフレーム ウィザードにも注目する価値があります。これらを使用すると、開発者は複雑な構造のテーブルやフレームを作成する作業がはるかに簡単になります。

このようなテーブルを手動で作成するにはどれくらいの時間がかかるかを想像してみてください。

Homesite には、使用される記述子の正確性だけでなく、テキスト自体もチェックする組み込みのスペル チェッカー、および CSS ファイル エディタ (TopStyle と呼ばれるカスケード スタイル シート) が含まれていることに注意してください。

ドキュメントの作成速度を上げるには、キーボード ショートカットを使用できます。HomeSite はキーボード愛好家向けに幅広いアクティビティを提供します。 たとえば、タグ
Ctrl+Break キーの組み合わせに対応します。 ただし、ユーザーは、ほぼすべてのコマンドに便利なキーボード ショートカットを自由に割り当てることができます。

長所。 このプログラムの利点には、機能性、多用途性、さまざまなプログラミング言語のサポート、明確なインターフェイス、広範な機能、強力なヘルプ システムが含まれます。 マイナス。 ロシア語のサポートが不足している、価格が高い、ページを作成するには少なくとも HTML の表面的な知識が必要である、プログラムの価格が高い。

Macromedia HomeSite の最新バージョンは、このアドレスからダウンロードできます。

SiteEdit プログラムはロシアの企業 EdgeStile によって作成され、開発者によってサイト管理システムとして位置付けられています。 HomeSite とは異なり、SiteEdit はいわゆるビジュアル開発ツール、WYSIWYG エディター (What You See Is What You Get という表現の大文字から - 「見たものが得られるもの」) に属します。

プログラムを初めて起動すると、既製の Web サイト テンプレートが表示されます。

サイト全体の構造は、いくつかのセクションを含むさまざまなページの形式で表示されます。 セクションには、複数のレコードまたはオブジェクトを含めることができます。 編集モード (デフォルトでは F9) に切り替えると、既存のセクションを編集して新しいセクションを追加したり、既存のエントリのテキストを変更したり、新しいエントリを追加したりすることができます。

「パーティションの変更」ボタンをクリックすると、新しいウィンドウが表示され、次の簡単な操作を実行できます。

ユーザーは、テキストを直接編集するだけでなく、フォント スタイルの変更、画像、現在の日付の挿入、表の追加、ハイパーリンクの挿入、箇条書きまたは番号付きリストの作成などのボタンにアクセスでき、これらすべてを簡単なクリックで行うことができます。マウスの。 HTML 言語に精通している場合は、上記の機能に限定されることなく、必要なコードを手動で記述するだけで済みます。 編集ウィンドウには構文の強調表示などの余計なものがないため、HTML ボタンをクリックして外部エディタを呼び出し、そこで必要な変更をすべて行うことができます。

このプログラムは、book、galeon、kafe、palm_skin、stroitel などのいくつかのデザイン テンプレートを提供しており、これを使用すると、サイト全体の外観を大幅に変更できます。

すべてのページ要素は編集可能です。 デザインをより根本的に変更するには、ページ上に存在するすべての要素を変更するための十分な機会を提供するデザイン エディターがあります。



画像を拡大する

左側には要素のリストがあり、右側にはページ上の要素の外観が表示され、下部には特定の記述子の属性の値を変更するためのウィンドウがあります。 たとえば、Font タグでは、色、サイズ、太さ、スタイル、傾斜、下線、間隔などの属性を使用できます。 初心者は、ウィンドウに入力する方法が気に入ると思います。手動で何も入力する必要はなく、ドロップダウン リストから目的の要素を選択するだけです。 色の選択も難しくありません。ユーザーはパレットを自由に使用でき、好みの色合いを決定するだけで済みます。なんと、その 16 進コードが適切なフィールドにすでに表示されています。

このプログラムには、建設会社の Web サイトをシミュレートする既製のテンプレートが含まれており、ニーズに合わせてカスタマイズできます。

興味深いのは、プログラムからページ コードを直接保存することができないことです。これを行うには、「ブラウザでページを表示」オプションを選択する必要があり、ブラウザからのみページを HTML ファイルとして保存できます。 このアプローチは、SiteEdit プログラムの Standard および Business バージョンではプロジェクト全体をホスティングに直接アップロードできるが、残念ながら Start の無料バージョンではこの機会が利用できないという事実によるものと思われます。 したがって、このような矛盾が生じます。

長所。 シンプルなインターフェイス - HTML の知識はほとんど必要ありません。機能性、ディストリビューションの軽量性、ロシア語のインターフェイス言語、無料で開始できるバージョン。

マイナス。 プログラムからファイルを直接保存できない、スペルミスがある。

SiteEdit は、初心者ユーザーや HTML 言語にまったく慣れていないユーザーでも、個人ページや単純な Web プロジェクトを作成するのに最適です。

SiteEdit には、Start、Standard、Business の 3 つの主要バージョンと、Partner という 2 つの追加バージョンがあります。 ここから SiteEdit のスタート バージョンをダウンロードできます。

私たちのレビューに来たもう 1 つのフリーウェア プログラムは HTML Source です。 最初に目を引いたのは、プログラム配布キットのサイズがわずか 1.5 MB であることです。 このため、プログラムの機能とその機能についていくぶん懐疑的な考えが生まれました。 しかし、私たちは嬉しい驚きを感じました。



画像を拡大する

プログラムのインターフェイスは HomeSite のインターフェイスに似ていますが、当然のことながら、ツールや機能ははるかに少なくなっています。 左側にはエクスプローラー ウィンドウがあり、開く必要があるファイルを選択できます。 中央には Web ドキュメント編集ウィンドウ自体があります。 その右側にはパレットがあり、非常に便利なモードで動作します。 パレットの特定の領域の上にマウス カーソルを置くと、RGB パレットの各色のコンポーネントがすぐに表示され、そのすぐ下に色自体が表示されます。 さらに、目的の領域をクリックすると、16 進数のカラーコードが文書に即座に挿入されます。 とても便利。

プログラムの作業領域の上部には通常のツールバーがあり、新しい文書の作成、既存のファイルを開く、ファイルの印刷、スペルチェック、およびその他の一般的なアクションを実行するためのボタンが含まれています。 すべてのアイコンは良いスタイルで作られていますが、唯一残念なのは、アクション アイコンにカーソルを合わせたときにツールヒントが表示されないことです。 プログラム自体がシステムにインストールされているブラウザを決定し、ツールバーにはユーザーのブラウザでドキュメントを表示するためのアイコンが含まれていることは注目に値します。 私の場合、標準の Internet Explorer に加えて、Opera と Mozilla FireFox もインストールされており、それがプログラムで実証されました。

次に、プログラムの機能の説明に移りましょう。 HTML ソースは、その名前が示すように、コーダーの作業を容易にすることだけを目的としており、完全に置き換えるものではありません。 このプログラムには、ページを視覚的に開発する機能がありません。 ハイパーテキスト マークアップ言語の基本に精通していない人には、この製品は適していません。 ただし、Web ドキュメントを手動で開発したい人のために、HTML ソースにはコーディング プロセスを高速化するための優れたツール セットが用意されています。

HTML Source は HTML ファイルの構文強調表示を提供しますが、私の意見では、プログラムでのこの機能の実装は HomeSite の実装よりやや劣っています。 まず、スタイルの定義に関連するコードの部分がまったく強調されていませんでした。 次に、同じ HomeSite 内に存在していた配色を個別にカスタマイズする機能がありません。

「挿入」メニューでは、日付、特殊な HTML 文字、画像、およびさまざまな絵文字を挿入することができます。 このような珍しい機能をプログラムに組み込んだ開発者による非常に独創的なソリューションです。 バーチャルコミュニケーションのファンはこれを気に入るはずです。

「タグ」メニューには、HTML 記述子の主要なグループが含まれています。

最も興味深いのは、このソフトウェアのすべてのツールが含まれる「ツール」メニューの内容です。 その内容を詳しく見てみましょう。

「大文字と小文字を変換」項目を使用すると、文字の大文字と小文字を変更できます。 それを反転するか、特定の 1 つに縮小します。 次の項目「Convert CodePage」を使用すると、ページ全体のエンコードをすばやく変更できます。 残りの項目の中で、組み込みのスペル チェッカーと、ハイパーテキスト マークアップ言語標準を開発する W3C 組織の要件に従って文書の外観を実現する Tidy と呼ばれる HTML コードを最適化するツールに注目する必要があります。

HTML ソース プログラムの高度なヘルプ システムには注目に値します。このヘルプ システムには、プログラムの機能の完全な説明や、CSS を含む HTML 言語の仕様が含まれています。

長所: コンパクトなディストリビューション、独自の機能、高度なヘルプ システム。

短所: ドキュメントを視覚的に開発する機会の欠如、プログラムをカスタマイズする機能が控えめ、ロシア語化の欠如。

したがって、HTML ソースは、開発ツールとしてだけでなく、参照ツールとしても、経験豊富な開発者にとって魅力的です。 ここからHTMLソースをダウンロードできます

次にレビューしたプログラムは、AG FreeSoft によって開発された Magic HTML Studio です。 プログラムを起動した後、珍しい絵が私たちの目に現れました - Magic HTML Studio のデザインは非常に珍しいものでした。

このようなインターフェイスを好む人もいるかもしれませんが、私の意見では、このタイプのプログラムにとってはあまり良い解決策ではありません。 また、ドキュメントの構文の強調表示がないことにもがっかりしました。 さて、デザインに関する不満はすべて脇に置いて、Magic HTML Studio が機能コンポーネントでどのように動作しているかを見てみましょう。

しかし、ここではすべてが最高レベルです! Java Constructor や CQI QuickBuilder などのツールを検討してください。 しかし、まず最初に。

左側には、テキストの書式をすばやく設定したり、ページ上のテキストの書き方や位置を変更したりするためのボタンがあります。 さまざまなレベルの見出しを文書に挿入するためのアイコンも提供されています。 右側では、ユーザーは特定の色のテキストを挿入するためのボタンにアクセスできますが、スペースが非常に不合理に使用されています。たとえば、通常のパレットを使用する方が便利ですが、色ごとに個別のボタンが割り当てられています。 、HTML ソース プログラムと同様です。

次に、Magic HTML Studio に固有のツールとツールに直接移りましょう。 Java Constructor は、JavaScript 言語でスクリプトを作成するための強力であると同時にシンプルなツールです。このためにユーザーはこのプログラミング言語の知識を必要としません。 デザイナーを使用すると、カレンダーや時計をページに挿入したり、動的メニューやドロップダウン メニューを作成したり、複数の画像やその他の便利な動的要素で構成されるシンプルなバナーを作成したりできます。



画像を拡大する

デザイナーは必要なスクリプトを自動的に作成します。必要なのは、それをドキュメント内の適切な場所に貼り付けることだけです。

このプログラムには CGI スクリプト ジェネレーターも含まれており、スクリプト パラメーターを設定した後、ワンクリックで会議、ゲストブック、またはチャットを作成できます。

残念ながら、このツールを実際にテストする機会はありませんでした。そのためには、CGI スクリプトをサポートするサーバーにファイルをアップロードする必要がありました。 プログラムの他の機能に移りましょう。 したがって、[オプション] メニューを使用すると、Flash 読み込みスクリプトを追加したり、要素エディタを呼び出したり、フォントを変更したり、フォームを追加したりできます。

プログラムのすべての主な機能の説明を含む、ロシア語の優れたヘルプシステムにも注目する必要があります。

長所: JavaScript および CGI スクリプトの高度なデザイナー、動的要素を追加する十分な機会、ロシア語のヘルプ システム。

短所: 完全に成功した設計ではない、構文の強調表示の欠如、ビジュアル開発ツールの欠如。

Microsoft Office スイートに含まれる Microsoft FrontPage は古典的な WYSIWYG エディタですが、コードを手動で編集する機能があります。

このプログラムのインターフェイスは多くの点で Microsoft Word を彷彿とさせますが、これはまったく驚くべきことではありません。外観が統一されているため、初心者は FrontPage の基本機能をすぐに習得できます。

このプログラムには、ドキュメントを操作するための 3 つのモード (通常、HTML、プレビュー) があります。 通常モードでは、Web ページはテキストから画像まですべての要素を編集できる通常のテキスト ファイルです。



画像を拡大する

HTML モードでは、ページ コードを表示し、それに応じて編集できます。 このモードでは、FrontPage は構文の強調表示を提供しますが、非常に平凡です。記述子は青で強調表示され、その他はすべて黒で表示されます。

最後に、プレビュー モードでは、ブラウザ ウィンドウでページがどのように表示されるかを確認できます。

FrontPage は、他の Microsoft 製品と緊密に統合されているため、画像や図から Microsoft Excel シートまで、さまざまな種類のオブジェクトを Web ドキュメントに挿入できます。

もちろん、FrontPage にはテーブル デザイナーがあり、テーブルの作成がはるかに簡単になります。

このプログラムの主な利点の 1 つは、利用可能なテンプレートが多数あることであり、ユーザーはプロジェクトの設計に頭を悩ませる必要がなくなります。

必要なテンプレートを選択したら、ページへのコンテンツの入力に直接進むことができます。 ここで、FrontPage の利点が発揮されます。HTML ページを作成するプロセスは、Microsoft Word で通常のテキスト ドキュメントを作成するプロセスと何ら変わりません。 ユーザーは、テキストの編集、書式設定の変更、表の作成と編集、さまざまなオブジェクトや画像の挿入を行うための同じツールにアクセスできます。 このプログラムを使用すると、HTML の知識がなくても、箇条書きリスト、番号付きリスト、および複数レベルのリストを簡単に作成できます。

FrontPage は、作業領域を、画像、テキスト、見出しなどの特定のページ要素を含むいくつかのブロックに分割します。 ブロックごとに、独自の書式設定パラメーターとページに対する相対的な位置を割り当てることができます。

コインの裏には、結果として得られるコードの複雑さと煩雑さもあり、これは当然、ドキュメントの最終的なサイズに影響します。 また、将来的にそのような文書に変更を加えるのは非常に困難になります。 しかし、これは特定の製品の欠点ではなく、ほぼすべての WYSIWYG エディターの欠点です。

長所: MS Office 製品の使い慣れたインターフェイス、優れたテンプレートのセット、MS Office スイートの他のプログラムとの統合。

短所: 開発ツールのセットが少ない、プログラムを個別に購入できない。 Microsoft FrontPage は、初めての HTML エディターとしては良い選択ですが、ユーザーのニーズが高まるにつれて、その機能では十分ではなくなる可能性があります。

そして最後に、私たちのレビューの最後のプログラムは Macromedia Dreamweaver MX 2004 です。配布キットのサイズがかなり大きい (62 MB) ため、この HTML エディタには多くのことが期待できます。 確かに、Macromedia Dreamweaver MX 2004 の機能は印象的です。 インストール後、ユーザーはプログラムの外観を選択するように求められます。これは、Web ドキュメントの作成方法によって異なります。 「コード」を選択すると、プログラム インターフェイスはエンコーダのニーズに合わせて調整され、「デザイン」を選択すると、それに応じてデザイナーのニーズに合わせて調整されます。 ただし、これら 2 つのモードは常に切り替えることができ、プログラムの作業領域が 2 つの部分に分割される 3 番目の複合モードも利用できます。



画像を拡大する

右側には別のマルチレベル メニューがあり、特に、現在の記述子のヘルプ、使用されているイメージのリスト、エクスプローラー、およびその他の項目を表示するための項目があります。

開発者に対する追加の支援は、メイン メニューから呼び出される主な機能を複製するコンテキスト メニューによって提供されます。 たとえば、任意の要素を右クリックしてビジュアル モードで作業すると、使用するフォント、そのスタイル、色、その他の属性を変更したり、使用するタグの属性を変更したりすることもできます。

このプログラムの主な機能は、まさにビジュアル モードの使用にあります。 ツールバー上のアイコンは、ハイパーリンクの追加、画像の挿入、テーブルの作成、現在の日付の追加などの最も一般的なアクションを実行します。

HTML 言語の機能に精通しているユーザーには、タグ セレクターと呼ばれるツールの使用をお勧めします。このツールを使用すると、HTML タグだけでなく、JavaScript、ASP.Net などのプログラミング言語の基本的な式や演算子も挿入できます。 、PHP、WML、ColdFusion。 これらすべてにより、サーバー プログラミング言語を使用してさまざまな複雑なプロジェクトを開発する際に、ソフトウェアを使用するための新しい視野が開かれます。

結合モードの便利な点は、行われたすべての変更が両方のウィンドウに一度に表示されることです。 つまり、ドキュメント コードを変更すると、すぐに結果が隣のウィンドウに表示され、逆に要素を選択すると、対応するコードが表示されます。

「コード」モードで作業する場合、プログラムのワークスペースは HomeSite のワークスペースに似ています。製品の作成者が同じであるように感じられますが、Dreamweaver の方が機能は優れています。 開発者がテーブルを作成する際に前例のない柔軟性を提供するテーブル デザイナーを 1 つだけ考えてみましょう。 さらに、テーブルを作成するとき、プログラムは数十あるデザイン テンプレートの 1 つを使用することを提案し、特定のテンプレートを選択すると、その属性のいくつかを調整することですぐにニーズに合わせて調整することができます。 。 テーブルを作成し、コンテンツを入力すると、任意の列でテーブルを並べ替えることができるようになります。 これらはすべてビジュアル モードで行われますが、コード自体はもちろん自動的に変更されます。

Macromedia Dreamweaver MX 2004 は、Macromedia Fireworks、Flash などの他社製品と組み合わせて使用​​できます。

ビジュアル モードでドキュメントを作成することを好むユーザーの選択がほぼ明白である場合、「エンコーダ」は 2 つの Macromedia 製品、HomeSite と Dreamweaver MX 2004 のどちらを選択するかという難しい課題に直面することになります。 Dreamweaver MX 2004 の機能はプログラマーにとっては不必要であることに注意してください。ただし、大量のルーチン作業では、ビジュアル モードを完全に使用できます。プログラムがそれを提供しているのであれば、試してみてはいかがでしょうか。 HomeSite ユーザーにはこの機会がありませんが、このプログラムは、さまざまな複雑さの Web ドキュメントを快適に開発するために必要なツールのセットをすべて提供します。

したがって、誰もが自分の目標と既存の知識を考慮して、必要な製品を独立して自由に選択できます。 もちろん、価格の問題もあります。どちらの Macromedia 製品もシェアウェアとして配布されていますが、30 日間の試用期間中は無料で使用できます。 選択するにはこの時間で十分です。

長所: ビジュアル ドキュメント開発のための膨大なツール セット、明確なインターフェイス、エンコーダ モードでの作業機能、既製のテンプレート セット。

短所:流通量が多く、製品の価格が高い。

HTML ページの変更や編集を快適に行うために、HTML エディターが使用されます。 現在、このようなエディターは多種多様にあり、それぞれに独自の長所と短所があり、さまざまなタスクにも使用できます。

Adobe Dreamweaver は最も古い HTML エディターの 1 つで、最初のバージョンは 1997 年 12 月にリリースされました。 それ以来、このパッケージは多くの変更を加えられ、最終的には複雑な Web プロジェクトを操作するために使用される、本格的なプロフェッショナルな HTML エディターになりました。 ここには、Web 開発者向けの最新ツールがすべて揃っています。

新しいバージョンでは HTML 5 標準がサポートされ、コード エディターと開発者ウィンドウも改善されました。 CSS プリプロセッサのサポートを実装し、ブラウザ ウィンドウにすべての変更をリアルタイムで表示します。 Flash Player との緊密な統合が提供されます。 エクステリアデザインを一新。

Adobe Dreamweaver の欠点は、その「重さ」とハードウェア要件です。 パッケージをインストールするには、ハード ドライブに数ギガバイトの空き容量が必要です。 プログラムには多数の異なるタブと設定があるため、慣れるまでにさらに時間がかかります。 さらに、Adobe Dreamweaver は独自のソフトウェアであり、使用するにはお金を支払う必要があります。

それにもかかわらず、このプログラムには無料試用期間があり、この期間中にこのパッケージのすべての利点と利点を評価できます。 通常、この期間はプログラムのインストール日から 1 か月間続きます。

マルチプラットフォームエディターである Sublime Text は、専門家の間で徐々に人気を集めています。 これは、その最大限のシンプルさ、余分な要素の欠如、そして同時に開発者が必要とするすべてのツールの存在によるものです。 ただし、Sublime Text の標準機能にないものが突然必要になった場合は、いつでもプラグインとして見つけることができます。または、Python で自分で作成することもできます。 すべての作業はホット キーを使用して行われるため、プログラム ウィンドウ自体には最小限のインターフェイス要素が含まれています。 作業領域は、水平、垂直、またはグリッドに配置された複数の独立したウィンドウに分割できます。

あらゆる利点があるにもかかわらず、Sublime Text エディターは初心者にとってはかなり難しいツールであることに変わりはありません。 ここでのエディターの標準構成でも、メニューではなく config.json ファイルを使用して行われます。このファイルを使用するには、ユーザーによる基本的なトレーニングが必要です。 ただし、プロのプログラマーにとって、このツールには完全なドキュメントが付属しているため、カスタマイズは難しくありません。

Sublime Text editor は独自のソフトウェアですが、使用するために料金を支払う必要はありません。 起動するたびに、このプログラムを正式に購入できることを通知するウィンドウが表示されますが、これは強制的な購入ではなく寄付に基づいて行われます。

プログラムは公式 Web サイト https://www.sublimetext.com からダウンロードできます。

Notepad++ は厳密には HTML エディタではありませんが、これらの目的に使用できます。 HTML および XML マークアップ言語、最も一般的なプログラミング言語 (PHP、Ruby、Perl、Python など、Web 開発で使用される言語の一部) の構文強調表示が組み込まれています。

マーカー、コード ブロックの折りたたみ、オートコンプリート、プロジェクト マネージャー、複数行の編集と強調表示、さまざまなエンコーディングのサポートなど、コードの編集に役立つツールが多数あります。 また、さまざまな開発者から Notepad++ 用のプラグインが多数提供されており、これによりプログラムの機能が大幅に拡張され、プロの HTML エディタにとって強力な競争相手となっています。

Notepad++ テキスト エディタの利点には、その速度と少量のディスク容量が含まれます。 さらに、このプログラムは非常にシンプルなインターフェイスを備えており、作業に追加のトレーニング時間を必要としません。 さらに、Notepad++ の更新プログラムは常にリリースされており、プログラム自体がユーザーに通知してインストールを提案します。 このエディタの最も重要な利点は、フリー ソフトウェアを意味する GNU GPL 2 ライセンスに基づいて配布されていることです。

このエディターは、公式 Web サイト https://notepad-plus-plus.org から今すぐ制限なくダウンロードできます。

これは、視覚的に漠然と Sublime Text を彷彿とさせる優れたインターフェイスを備えたシンプルなエディターです。 CoffeeScript で書かれています。 Atom はかなり新しいテキスト エディタで、最初のリリースは 2014 年 2 月 26 日に行われました。 Node.js で書かれたプラグインをサポートします。 初心者が HTML だけでなく、他の多くのタスクを扱うのにも適しています。

Atom は無料で、ほとんどの一般的なオペレーティング システムにインストールできます。 さらに、インストールと使用が非常に簡単で、素早く動作し、ハードドライブに少量の空き容量が必要です。

このエディタの使用を開始するには、デフォルトで開くようこそウィンドウから「プロジェクトを開く」をクリックするだけです。 次に、作業用のディレクトリを選択し、その中にファイルを作成し、その拡張子を指定します。 ファイルの構文は、指定された拡張子に基づいて自動的に決定されます。

Vim は、最も古い Unix エディターの系統を起源とするプロフェッショナルなフリー テキスト エディターです。 Vim は 91 年 11 月 2 日に初めてリリースされました。 これはプロのプログラマー向けのツールとして知られており、作業を自動化する大きな機会を提供します。 Vim の標準のビジュアル インターフェイスはコンソール インターフェイスですが、ウィンドウ化されたグラフィカル インターフェイスを通じて動作する Gvim の修正版があります。

Vim を使用する場合、いくつかのモードがあり、モードを切り替えることでホットキーとその機能が変わります。 最初、Vim はいわゆる「通常」または「コマンド」モードで起動します。 「コピー」、「削除」、「貼り付け」などの通常のホットキーがすべてあります。 他のモードでは、テキストを入力したり、コンソールを操作したり、ビジュアル モードを呼び出したりします。 なぜそのような困難があるのでしょうか? 実際のところ、Vim はあらゆるアクションを古典的な「利便性」の観点からではなく、最大限の最適化が必要なものとして考慮するツールとして開発されました。

Vim は非常に高速で、システム リソースをほとんど使用しません。 学習の難しさに関して言えば、これは初心者向けのツールではありません。 移動操作だけでも 100 を超えるコマンドが開発されています。 もちろん、すべてを暗記する必要はありません。 誰もが自分のプログラミング スタイルを選択し、それに基づいて必要なことを学びます。 このエディタを適切なレベルでマスターするには、多くの忍耐と時間が必要です。 ただし、熱心なユーザーにはご褒美として、現在入手可能な最も強力なコード エディターが提供されます。 Vim は、Linux、Mac、Windows、およびその他のいくつかのオペレーティング システムで実行できる無料のマルチプラットフォーム ツールです。

他のプログラムとは異なり、IntelliJ IDEA はプロフェッショナルな統合開発環境 (IDE) です。 HTML/XHTML/HAML マークアップ言語および CSS/SASS/LESS ページ外観記述言語とシームレスに連携できることに加え、Java、JavaScript、Python、Coffee Script と緊密に連携することが可能です。 IntelliJ IDEA は JetBrains によって開発されました。

なぜこの特定のプログラムを使い始める必要があるのでしょうか? まず、非常に考え抜かれたインターフェイスを備えています。 これまでに使用したことがない場合でも、インストール後すぐに作業を開始できます。 さらに、CVS、Apache Ant、Maven、JUnit、Subversion などの一般的なツールと連携することもできますが、これらは完全に無料です。

残念ながら、IntelliJ IDEA 自体は完全に無料のプログラムではありません。 フルバージョンは 30 日間の試用期間のみ利用可能で、その機能を簡略化したバージョンには多くの便利な機能がありませんが、Android でアプリケーションを開発する場合や Java マシンを操作する場合に非常に役立ちます。

コードエディタは、日々の Web サイト開発プロセスに不可欠です。 仕事の効率を高めることが目的なので、これなしではいられないリソースとみなされています。 優れたエディターを使用すると、コードをより速く記述したり、構文エラーを見つけたり、サイトの成長に役立つさまざまなことができます。 優れたエディターを使用すれば、コードを簡単に変更できます。 コード エディターは何年にもわたって生まれては消えていきましたが、ユーザーにより良いサービスを提供するために、強力な機能を維持し、時間の経過とともに改良されてきたものもあります。

ここでは、現在使用できるエディターをいくつか紹介します。これらはすべて完全に無料です。

これは無料のコード エディタであり、プログラマ向けに設計されたソース コード エディタでもあります。 Windowsでは無料で使用できます。 プレーンテキストを処理して Web ページを作成することもできます。 コンパイラに優れた IDE を使用したい場合は、これが最良の選択です。

このエディタは Windows、Linux、Mac OS X で完全に無料です。これは、HTML、JavaScript、CSS 用の非常に強力な開発ツールを組み合わせて使用​​する完全な Web 開発環境です。 開発者コミュニティによって作成された追加のプラグインも多数あります。 Web アプリケーションを編集するための統合ツールです。

これは、ソース コードを扱うユーザー向けに設計されたオープン ソース エディターです。 コードの折りたたみまたはアウトライン、ツールのドッキング ウィンドウ、番号付きブックマークとシンプルなブックマーク、ファイル関連付けマネージャーなどの優れた機能を備えています。

Windows 用の無料コード エディター。 複数の言語のサポートを提供します。 その強力な機能には、オートコンプリート、ユーザー定義の構文の強調表示、動的なビュー位置、マルチドキュメントのサポートなどが含まれます。

これは、Microsoft Windows 用の優れたテキスト エディタです。 これはフル機能を備えており、HTML、XHTML、および XML 言語で Web ページを編集、書式設定、レビュー、プレビュー、公開できるように設計されています。 エディターではコードの折りたたみが可能で、いくつかの読み込みオプションがあり、タグやスクリプト間を移動できます。

Windows、Linux、Mac OS X 用のもう 1 つの無料コード エディタです。これは非常に優れたマルチプラットフォームおよび多言語エディタであり、ユーザーはコードを非常に迅速かつ正確に作成、変更、ナビゲート、ビルド、デバッグすることができます。 最大 2GB のサイズのファイルを編集できます。

これは、Windows 用の非常にプロフェッショナルなソース コード エディターです。 サイズが小さく、起動時間も非常に高速です。 これを使用すると、複数のドキュメントを一度に編集でき、他の優れた機能の中でも特に構文の強調表示が提供されます。

Linux 開発者にとって非常に便利な Web 開発環境です。 その主な有用性は、Web サイト作成時の開発者の生産性を向上させることです。 このツールを使用すると、必要な機能にすばやくアクセスできます。

これは非常に優れたテキストエディター、HTML エディター、Java エディター、さらには PHP エディターでもあります。 Windows 用に設計されており、Web プログラマーや Web 作成者向けの優れた強力な機能も備えています。

これは、開発者の生産性を重視したコード中心の IDE です。 このツールはコードを非常によく理解しており、プロジェクトのワークフローや構造を妨げることなく非常に強力なツール セットが付属しています。

非常に軽量でありながら拡張可能なテキスト エディターであり、Windows の無料試用版としてのみ利用できます。 元々は Windows XP 用に開発されましたが、Windows Vista での使用も認定されています。

TextMate は、プロジェクト内で検索と置換を行う機能に加え、括弧とその他の記号を自動的にペアにする機能を提供します。 とりわけ、現在の文書内の単語を完成させるのに役立つ優れた機能が備わっています。

これは、Web デザイナーやプログラマー向けに設計された、Mac OS X 用の非常に便利なコード エディターです。 その優れた機能には、タブ付きインターフェイス、コードの折りたたみ、コードのヒントと補完、プロジェクトベースのサイト管理などが含まれます。

このコード エディターは、Windows、Linux、Mac OS X で無料で利用できます。非常によく設計されたコード エディターであり、開発プロセスで使用できる多数のプラグインが付属しています。 マクロ言語が組み込まれており、Unicode や UTF8 を含む多数の文字エンコーディングをサポートできます。

すべてのタスクを迅速かつ簡単に完了したい Web 開発者にとって、これは理想的な選択肢です。 このエディタには、ワードプロセッサ、プログラミング、Web 開発、ファイル処理、デモなどを提供する優れた機能が備わっています。

これは素晴らしい無料のオープンソースのテキストエディタです。 Microsoft Windows、Linux、MacO などのさまざまなオペレーティング システムでうまく動作します。

これは、Mac OS X 用の非常に便利なコード エディタです。無料版と商用版があります。 Web 開発者向けの優れたプラグインが付属しており、非常に速く開き、スペルもスマートで、ファイルの検索も簡単です。

このエディタは Mac 専用です。 非常に強力な汎用テキスト エディタですが、サポートされる言語は 1 つだけです。 このエディタには、Web 開発者が開発を簡単かつ迅速に行うための優れた機能が備わっています。

これは、非常に速く読み込まれる、非常に美しく革新的な Web サイトを作成するのに役立つコード エディターです。 アプリケーション自体は美しく、革新的で、高速であることに注意してください。 エディターは直感的なアプローチを提供するため、テーブルを最新化することができます。また、優れた標準的な Web サイトをすぐに作成できる強力なプレビュー機能が付属しています。

非常に優れた使いやすいテキストエディタです。 きっと使いたくなる最高のコラボレーション エディターです。 コラボレーションを可能にして楽しいものにするためには不可欠です。

コード エディターの選択は、常にニーズと取り組んでいるプロジェクトに応じて行う必要があります。 Web 開発者は、より高速かつ効率的に作業するためにこれらのエディタを必要としています。これらは、選択できる最適なエディタです。

私たち開発者にとって、ソース コード エディターの選択は重要なことではありません。 これは私たちがほとんどの時間を過ごす環境です。 私たちの生産性はコードエディターに依存します。

同じ開発者は 2 人としていないため、コード エディターが豊富にあり、その中から自分にとって最適なものを選択できます。 どれが最適かを理解するために、さまざまな基準を 5 段階のスケールで評価します。 以下の点に注意を払います。

  • 使いやすさ- エディターが初心者にとってどれほどシンプルで、初めて開いたときにどれほど直感的であるか。
  • - すべての革新性、コード編集機能、オートコンプリート、編集モードなどの基準。
  • 拡張性- エディターはプラグインや追加のライブラリをサポートしていますか?
  • 美学- 私たちは自分たちの仕事の美しさ、見た目の快適な環境、コードがきれいに見えることが大好きです。
  • スピード- エディターの起動速度、大きなファイルを開く速度。
  • クロスプラットフォーム- エディタは複数のオペレーティング システムで利用できますか?
  • 価格- 最も安い価格が最高点を獲得します。

コード エディターは、特定のタイプの開発者に対応するグループとして提供されます。

グルのために

グルとは誰ですか? 基本的に、これらはあなたが生まれる前からコード エディタを使用している人々です。 このグループの楽器は重くて幅が広いです。 これらはターミナル ウィンドウから起動でき、UNIX の伝統に従って、すべての設定は構成ファイルで定義されます。

ヴィム

1991年に発売。 多機能かつ強力なエディターは世界中で多くのファンを獲得しています。 他の製品と比べて特別なのは、そのコマンド ライン テクノロジです。 単にコードを記述するのではなく、テキストの入力モードを選択し、検索を実行し、さらに詳細なガイダンスを使用します。 このエディタは、既知のすべてのオペレーティング システムにインポートされます。 Vim はスクリプトやプラグインを使用して拡張することもできます。 これは、多くの Linux システムにすでにインストールされているフリー ソフトウェアです。

Emacs

Emacs の開発は遠い 1970 年代に始まり、今日まで続いています。 このエディタは拡張性が高いことで知られています。 これは、コードの強調表示、自動コード配置、および多くのプログラミング言語のサポートをサポートした最初のエディターの 1 つです。 Vim と同様に、クロスプラットフォームでもあり、ターミナル ウィンドウまたは GUI を通じて使用できます。 Emacs は無料でオープンなリソースです。

プロフェッショナル向け

このカテゴリのコード エディタには、開発ツールが完全に装備されています。 使いやすく、強力なツールを備えています。 開発者は、1 つのアプリケーションで記述、コンパイル、テスト、実行できます。

日食

Eclipse は Java アプリケーションの開発に最もよく使用されます。 このソフトウェアは、追加のプログラミング言語のサポートを可能にするプラグインをサポートしています。 C/C++、Ruby、PHP などのプラグインがあります。 Eclips は、ドキュメントとリアルタイムの構文チェックに基づいて構築された強力なコード ヒントを提供します。 Google などの大企業は、このプラットフォーム用の開発ツールを提供しています。 Android および App Engine 用のアプリケーションを簡単に作成できます。 Eclipse は無料でオープンソースです。

アプタナ スタジオ

Aptana は、重い AJAX アプリケーション用に設計された開発環境です。 この環境は、プラグインを使用する PHP、JavaScript、HTML、CSS、Ruby、Python などの最も一般的な Web 言語をサポートします。 また、Git の統合、ローカル サーバー上でアプリケーションをテストする機能、各プログラミング言語の多くの便利なコード スニペットもあります。 Eclipse と同様、Aptana は無料でオープンソースです。

ネットビーンズ

Java 用の別の環境ですが、Eclipse と同様に、PHP、Python、C/C++ などの追加言語用に拡張できます。 アプリケーションは Linux、Windows、OSX 上で実行されます。 Netbeans は、ドラッグ アンド ドロップ ビルダーを使用してデスクトップ アプリケーション開発プロセスを高速化できます。 欠点はパフォーマンスです。NetBeans は大規模なプロジェクトでは遅くなる可能性があります。 このコード エディターは無料でオープンソースです。

ドリームウィーバー

Dreamweaver は、Web デザイナー向けに設計されたアプリケーションの Adob​​e Suite の一部です。 最も一般的な Web プログラミング言語 (PHP、ASP.NET、JavaScript、HTML、CSS) のみをサポートします。 非常に初心者向けで、WISIWYG 編集、ライブ表示、リモート サーバーでのテスト、jQuery mobile と Phonegap を使用したアプリケーション開発がサポートされています。 Dreamweaver は OSX と Windows で利用できます。 アプリケーションのパッケージ全体を 399 ドルで購入した場合、それを使用する意味はありません。 しかし、個別に購入すれば、何かあるかもしれません。 さらに簡単になります。

ビジュアルスタジオ

Visual Studio は、Windows 用のオールインワン開発環境です。 このエディターは、環境に組み込まれている C/C++、C#、VB.NET、および F# などの多数の言語をサポートしています。 コード補完、行ごとのドキュメント化、エラー チェック、デバッグ、フォーム設計、データベース スキーマの作成などのための強力なツールが備わっています。 価格は 500 ドルからですが、プログラムのエクスプレス バージョンは無料で利用できます。

Xcode

Xcode は、OSX および iOS アプリケーションを開発するための Apple のソリューションです。 C、C++、Objective-C、Objective-C++、Java、AppleScript、Python、Ruby をサポートします。 Xcode を使用すると、アプリケーションを作成、デバッグ、テストできます。 iOS アプリケーションをテストするためのインターフェイス デザイナーとモバイル デバイス エミュレーターが含まれています。 Xcodeは有料エディタとして使用されていましたが、現在は無料で提供されています。

コーダ2

Coda は、Web 開発者向けのオールインワン エディターです。 FTP によるファイル転送、コードとファイル構造のナビゲーション、サイトとサイト グループ、MySQL 管理などをサポートします。 新しい Coda 2 では、iPad を使用してブラウズできます。 安定価格は 99 ドルですが、割引価格の 75 ドルで購入できます。

美意識の高い人向け

これらのコード エディターは美しく、軽量で、使いやすく、拡張可能です。 これらについては多くの話題があり、多くはプラグインを提供し、記事を書き、特定のエディターをより良くする方法に関するソリューションを提供しています。

テキストメイト

TextMate は基本的に OSX 用のグラフィカル テキスト エディタです。 マクロ、コード ストレージ、スニペット、シェル統合、プロジェクト管理をサポートします。 Text Mate 2 には、おそらく入手できるすべてのものが付属します。 エディターの価格は約 50 ドルです。

崇高なテキスト 2

Sublime は美しいクロスプラットフォーム エディターです。 ほぼすべてのプログラミング言語に対して高速で機能が豊富です。 複数の選択、コードの折りたたみ、マクロ、プロジェクトなどをサポートします。 全画面編集も可能で、大きなモニターでも見栄えがよくなります。 Linux、Windows、OSX 上で動作します。 このエディタには無制限の試用期間が付いていますが、すべてのコンピュータで使用できる 59 ドルのライセンスを購入する必要があります。

現実主義者向け

メモ帳++

この強力で軽量なエディターは、すべての Windows 開発者にとって必需品です。 名前は高度なメモ帳を連想させますが、強力なツールです。 初心者にとっては簡単ですが、専門家にも適しています。 Notepad++ は、一般的なプログラミング言語をすべてサポートしています。 ワークスペースを 2 つの編集ウィンドウに分割し、FTP ブラウザ、マクロ、強力なテキスト編集機能をサポートします。 Notepad++ は完全に無料です。 それが可能だ。

TextWrangler

TextWrangler は、OSX 用の無料の軽量エディターです。 すべてのプログラミング言語をサポートします。 強力な検索と置換機能、テキスト操作、ファイル比較、FTP サポートなどを提供します。

コードロブスター

CodeLobster には、Web プログラマー向けのシンプルかつ強力な機能があります。 Windows OS のすべてのバージョンに適しています: 8、7、Vista、XP、2003、2000、ME、サーバー。 作業環境、機能のツールチップ、デバッグ、ToDo リストの柔軟な構成。 このエディタは特に Web 開発者に推奨されており、CakePHP、CI、Drupal、JQuery、Yii、Smarty、Symfony、WP、Facebook などのさまざまなフレームワークで動作するように簡単に拡張できます。 エディターの軽量バージョンは無料で利用できます。 ツール一式は 40 ドル、プラグインと拡張機能のフルセットは 100 ドル以上です。


最高のコードエディターは...

このリストであなたの編集者が見つかりませんでしたか? 以下のコメント欄であなたのお気に入りのエディタを教えてください。