If you ask a similar question on some of the forums, with a high probability, you will strike two diametrically opposite recommendations - "compile" everything in a purely visual (that WYSIWYG) editor type Dreamweaver or run from any editors like from fire and do everything exclusively in notepad / VI / Emacs. As it is characteristic of any extremes, it is in them that these or other deficiencies of the method are most clearly manifested - the weakness of control over the received code in the first case, and an extremely large proportion of "bad" work in another. So it is not wonderful that the niche between the two poles is by no means empty, and the developers of its HTML editors make all the power to make friends with the keyboard in the most optimal way. And it is the convenience of the "manual" set of an HTML code without losing control over the result and will be key when comparing three web editors most popular in Linux - Screem, Quanta Plus and Bluefish. Although their functional filling will also not be ignored. For the completeness of the picture, a lot of Typical WYSIWYG editors - the "reference" editor of Amaya is widely known in the narrow NVU circles.
For testing, a Ubuntu 6.06 LTS distribution was used with GNOME 2.14.1, so that GTK based applications received some odds. All editors were installed from repositaries in "as is" mode, no efforts to Russify, expand functionality due to plugins and so on. not attached.
Considers:
- BlueFish 1.0.5.
- Quanta Plus 3.5.2
- SCREEM 0.16.1
Outside the contest:
- Amaya 8.5.
- NVU 1.0 (20060508)
Amaya.
Equality on W3C.
Let's start our consideration from the visual editor - Amaya. Not because it is so wonderful, but because it is being developed by the W3C organization. To be more accurate, it is primarily a browser with very developed editing features.
It is quite possible to use as the editor (it is possible to edit and directly the source code, however, without special delights), but only one small detail spoils everything - well, it does not want to introduce domestic symbols, and that's it. Display from the finished file - please remove - with joy. And enter - no. That is, absolutely no reaction to the keys when the Russian layout included. That is a morally outdated interface of everything wine, or excessive affection of developers to ASCII. But one way or another, and the domestic web encoders in it will not be too cozy.
So leave him the role of a "reference browser" and proceed to consider the main applicants for the victory.
In it, you can see the result, but it is clearly weak for editing ...
He has every chance of becoming ideal to version 1.0
The first impression of SCREEM is "just editor\u003e. The working window is broken into three fields - on the right field of input, the errors and warnings are displayed at the bottom, and the left of several tabs that make it easier to navigate in the document, work with files, etc. it seemed to me especially useful Tree tab Displays the tree structure - double-click, say, the HEAD line will be highlighted in the edit field of the entire code related to the title.
From the usual text editor, it is obviously needed to distinguish advanced work with HTML tags. In this case, the "Advance" is to highlight the syntax, the ability to enter a particular tag by selecting it in the menu (it is very convenient to insert META tags and a doctype string literally a couple of clicks) and in the autodopping / tip of the tags entered (including arguments).
Another feature is a semi-automatic closure of "pair" tags. "Semi-" because you have to make some kind of action before the closing tag appears - namely, to type the sequence. "
But "hotkeys" to quickly enter tags, unfortunately, are not provided. But as compensation - the ability to select the left on the "Resources" tab and insert any tag double click. A tab "Attributes" will allow you to look at all attributes available from the dedicated tag, and change any of them.
Pretty useful feature - check HTML syntax ("Tools\u003e TIDY\u003e TIDY (HTML)" menu). Below, on the "Error" tab, you will receive information about all the errors found (for example, non-existent tags) and warnings. Under the last category, unfortunately, all Cyrillic symbols are diagnosed with "Invalid Character Code", which is somewhat litto the output.
To enter "complex" tags - such as drawings, references, tables, forms - there are dialogs of input parameters (called "wizards"). By the way, they, it turns out, is quite convenient to use for SSI inserts, especially when sclerosis erases once familiar to the pain of the combination of beams ...
The "wizard" is convenient to insert images: select the desired file in the standard dialog, set an alternative signature (Alt attribute) - and the IMG tag appears with automatically affixed HEIGHT and WIDTH values. Other attributes, alignment type, easily change using the above tab of the same name. Also pay attention to the "Color Wizard" - a very convenient tool of color selection.
From service functions - spell check, grouping multiple pages to projects (here they are called "sites"), support for CVS, project publishing using FTP. Found on the Links page can be viewed on the diagram (by or selecting "View\u003e Link View" in the menu) and immediately see which of them are internal, what external, and which generally lead to nowhere. Similarly, software is turned on preview mode. If you wish, you can use and view in an external browser.
Well, quite a detailed and well illustrated help will allow you to master the editor not only by the method of "scientific tyka".
So we can say that this "just editor" is actually a fairly convenient and functional tool. Although the lack of hot keys to insert tags and the strange implementation of the final tag in the final tag are forced either almost everything manually, or resort to the mouse assistance more often than I would like when "fast" input.
Russified half, and otherwise - very good!
The display of links looks just a nightmare ... But sometimes it can not do without it.
Quanta Plus.
"Star" KDE, honestly trying to work in Gnome ...
Perhaps the best HTML editor based on Qt, and in general, one of the best. The main mode of operation is manual code editing, although there is also a visual mode, as well as a unique "combined" when the working field is broken into two: at the top - how the page will look like; Below is the source code. And you can edit the page and there, and there - all changes are automatically synchronized. That is, inserting the code, you immediately see the result, or vice versa - putting the transfer of the line, you can immediately see how this tag is done.
The default hotkeys are assigned not to all tags, but, as you should expect from a typical KDE application, fully customizable. Autodocharged (as in SCREEM, reacting only to the symbols in the upper case) and the parameter prompts are operated on "Hurray". Unlike SCREEM, the automatic closing of the tags is very successfully implemented - the closing tag is inserted immediately after the opening, and the cursor is set between the tags. Similarly, the editor behaves when inserting a tag along a hot key, which makes it possible to practically not be distracted by the positioning of the cursor during the set. The only controversial moment - if there is a mandatory attribute tag, the hot key opens a dialog box for entering. With a quick set, it distracts it, and has to completely refuse to use hot keys for such tags.
Although in some cases the dialogs are helpful - especially "Quick Start Dialog", creating a new document and inserting a standard HTML page template. For tables there are two options for creating (rubbing purely hand input and fully visual compilation) - "Table Editor", which allows you to fill the table directly in the dialog box, and enter the tags.
It is very convenient to work with styles of individual elements (CSS button on the Style tab). But the functions for creating a CSS table, similar to that in SCREEM or Bluefish, I did not find it in the "default" delivery, unfortunately.
In the editing window, I liked the "Cut" function of the code when all the rows corresponding to, say, the table, PHP insert or the DIV element can be cooled into one line - this allows you to hide unnecessary and focus on whether on what need to.
On the right and left of the editing field you can find auxiliary toolbars. The right is responsible for calling help and behind the HTML tag attribute field that performs functions similar to the Attributes tab in SCREEM - i.e. Allowing to see the list of attributes of any tag to which the cursor is installed, and change the value of any of them.
On the left are the directory tree call buttons (as opposed to SCREEM, dragging the file to the edit field works more intelligently, inserting a non-simply name of the file, but, depending on the situation, completely tag, etc.), work with the project, templates, The structure of the document (double-click also allows you to select the entire code fragment attached to this element), auxiliary scripts.
In the "Plugins" menu, you will find a number of useful programs related to the editing of HTML code: Checking the performance of links, tool for working with image cards, CVS tools. True, given Quanta Plus focus on the KDE environment, there is little in GNOME from it.
The editor's customizability is simply awesome - just look at the "Settings" menu. You can adjust almost everything: toolbars, external programs, hotkeys, the appearance of the editor itself, the preview modes ... In general, in Quanta Plus it is quite difficult to find something that it would be uncomfortable by default, and even To make it impossible to change according to its habits and preferences.
So, Quanta Plus (even given the fact that testing was carried out in the GNOME environment and some functions were inoperable) made a very good impression. Its power, flexibility and customizability are able to meet the requirements of the most arring web coders, regardless of their level of preparation.
Almost nothing to complain about. And even the pronounced design "in style to" he can forgive ...
Attributes on the right, cutter of the code on the left ... Is it possible to desire more?
The main contender for leadership in the category "for GNOME"
One of the most mature editors based on GTK. The layout of the window is quite standard - at the top of the toolbar, separated into several tabs; Left three tabs (directory tree for working with files, help, bookmarks); Right editing field. In addition to the main menu with the traditional set of items, there is a custom menu (under the toolbar), with which you can perform a quick insertion of the "template" fragments, such as the DOCTYPE string, Meta tags, comments, any paired and single tags (the name can be set any) etc. In addition to HTML, you can insert some PHP, SQL commands, DocBook tags, a pair of standard fragments to configure Apache (responsible for Basic authentication and a ban on the opening of INC files) and even something on C. That is, in addition to HTML files, Bluefish It is also trying to facilitate your suffering when writing a typical configuration .htaccess yes when developing the simplest PHP inserts. By selecting "User Menu" Edit Menu ", it is very easy to set any templates you need.
In addition to the fairly extensive menu "Tags", allowing to insert almost any tag, a lot of interesting things can be found in the neighboring "dialogues", where the operations requiring the input of additional parameters and allow one inhabit the integer groups of elements. For example, "General" document header "(or) will immediately insert the framework of the future HTML page - with headlines, meta tags and workpiece under the body of the page. Similarly, you can insert a blank for a table, frames (hereinafter referred to as" inserts "), etc. .
The CSS tab deserves a separate mention - at least you will find only three buttons. The second and third - for the rapid insertion of Span and DIV tags. But the first allows you to create stylized tables completely. Even if you do not remember the tenth of the possible parameters and their values, will not work any work to select the desired from the drop-down list and simply paste into the table being created. The "Color" button in the dialog box allows you to set the color (where it is required), just a clumous mouse to the desired one.
There is no input auto-completion for tags, nor for their parameters - only the syntax backlight (and then, you first need to specify the type of "HTML" document in the menu item - by default, the editor opens in Plain-text mode). The only thing that automatically performs is the closure of pair tags (you can turn off, like the backlight).
For a quick set, most tags have nicely memorable key combinations (although not always convenient to use). Find where you can change them, I failed, despite the occupational item in the "Editing" menu - "Save the shortcut keys".
An interesting feature of working with thumbnails of images - select a file, and, focusing on the preview, the usual "runner" set the desired size. The color selection tool will also be useful ("Dialogs" common "color") - poke the mouse on the shade that you like it, and a hexadecimal representation will be inserted into the code to close the dialog.
There are support for projects, checking spelling, interaction with external programs (make, javac compiler, checking HTML syntax, recoding the configuration symbols of the DOS2Unix string; in the settings it is quite easy to connect your own handler). Viewing the result is possible only in an external browser.
In general, the impression of some unfinishedness was the impression, although the potential of the editor is huge. Especially liked the opportunities for building the functionality by external programs. A good impression left the user menu, with which it is easy to reduce most of the routine operations to several clocks. But the beginners will be very lack of autodopping and tiping parameters. The verdict is a good editor for professionals who are not accustomed to excessive luxury, but thirsting to automate typical actions.
Neat backlight and custom panels allow you to work with almost any code that may be needed when developing a website.
A dialog for creating a stylist table - the result will be added to the edit field.
NVU.
If you choose this WYSIWYG editor, forget about manual editing
This is the brainchild of Linspire as a normal uses the visual regime, as expected from the "user-oriented" program. However, tabs at the bottom of the workspace are very easy to switch it to the editing mode of the source code. Here is the preview and mode, called "HTML Tags", when on the page (as it will look in the browser), the "label" is imposed on each element, showing what tag for this item is replied. It is quite convenient for the rapid analysis of someone else's code - I did not find another application to this regime.
Work in visual mode is not much different from that in the usual text processor such as Writer or Abiword. Yes, and we agreed to navigate mainly on "manual" editing.
Oddly enough, but when switching to manual mode, the toolbar buttons and menu items responsible for certain tags are blocked. No autodo-compliance, the minimum syntax highlighting that does not extend to the newly entered text ... In general, "took up for a man - do not say that it's not a duke," and once does not like the visual mode, so get the usual notepad. As the source code editor NVU does not shine (and it is not intended for this), so on his review and completed ...
RESULTS
Choose the best HTML editor turned out to be a difficult matter. Bluefish in the GNOME environment feels like a fish in the water (only do not need jokes about color, okay?), However, for unconditional victory, it is still lacking functionality. However, for those who are used to working in a notebook, it will be a choice close to the ideal - he is completely unobtrusive (even almost impaired), but at the same time, always ready to come to your aid.
SCREEM, despite the small version number, almost nothing lags behind Bluefish, and in some places even ahead of. A bit of strangely implemented auto equipment of paired tags sometimes interferes with work, and the lack of hot keys for tags will at all turn into a deep despondency of those who expected to discard the mouse away, but at the same time not to enter all their hands.
Well, Quanta Plus, even by being in a non-rigid environment, demonstrated the most harmonious combination of "helping" functions and convenience of fast work. The ability to configure almost everything will be indispensable for "walking around" lovers, although the default hotkeys and the composition of the toolbar are selected enough. In general, the unconditional leader at the moment was the "Alien from the planet KDE" as the most mature and thoughtful HTML editor, for which the winner's laurels receive.
You can not decide how you better edit the site - manually or visually? With Quanta Plus, you do not need to break between two modes of work!
In order to find out how well they cope with their responsibilities.
These applications are largely similar. All three primarily editors code with syntax isolation, with smart formatting and other functions that simplify the set and editing code. Screem is closely connected with GNOME, while Bluefish feels great on both KDE and GNOME. Quanta Plus - KDE application that applies with KDE. All of them support visual editing, called WYSIWYG (What You See Is What You GET - What you see, then you get), in a compartment with advanced code editing capabilities. These editors can work with HTML, JavaScript, Cascading Style Sheets (CSS) and other markup languages \u200b\u200band scripts. It is also possible to manage websites and web projects, including CVS support.
We see that these programs are very similar, so we have to allocate bright features of each. In this article, I focused on how the web editor helps in writing HTML code, CSS and Div Tags. Each program has additional features that can approach your needs.
I tested each program with Adobe "S Spry Framework (released under the BSD license), which allows you to add Ajax (ASynchronous JavaScript and XML) to the website. Spry Framework includes a set of JavaScript scripts and style sheets. Using and modifying SPRY widgets requires Easy editing HTML and CSS. This made a SPRY suitable companion for my tests. In this troika editors, I paid special attention to the functions that I apply in commercial applications for web design, for example, automatic closing tags, choosing tag parameters (you dial Tag, and the editor offers you a list of possible parameters and values), support for attached CSS and JavaScript files.
Screem copes with most of the work related to creating and editing a web page. When you create a new page, SCREEM will ask you to enter basic information, and then help customize the main elements in HEAD and Body tags.
I was pleased how Screem simplifies editing. For example, when I replaced the ordering of the ordered list of an ordered list on an unordered, closing TEG automatically changed. When the code set, pops up a list of possible parameters. After selecting what you need, TEG will automatically close. You also have a convenient CSS creator assistant, thanks to which the selected properties can be inserted between the style tags or take it on a separate style sheet.
The SCREEM interface contains 2 toolbars: the main panel for the main operations (opening, printing and editing files) and the assistant panel on which 9 buttons are located for nine helpers. With them you can easily add and configure different items: colors, shapes, links, images and tables.
The left also has a sidebar that can display 5 windows:
SCREEM supports 4 types of webpage display:
A powerful HTML editor is hidden under the SCREEM simple interface. Only I would like it easier to be installed under KDE. I tested SCREEM on Ubuntu LiveCD to avoid compiling and downloading GNOME libraries required to work this editor to KDE. All the same, SCREEM is a vivid example of an application, which perfectly copes with the selected task using the minimum of additional functions. If you are using GNOME, then SCREEM can come to you. If you use KDE or other environment, you will have to upload additional libraries to work with this editor.
Bluefish
The Bluefish editor is largely more difficult than SCREEM, but it is more versatile. In addition to HTML and CSS, it allows you to edit C, Java, Perl, Python, XML and several other languages. To work with HTML and CSS, this editor is similar to SCREEM capabilities. However, unlike the latter, BlueFish does not offer a list of tag parameters to choose from, and also does not change the closing tag when the opening opening changes.
Nevertheless, Bluefish is well organized and easy to use. Through the tag menu, you can select a tag and apply it to the selected text or simply insert tags if the text is not highlighted. Tags in the menu are divided into 9 categories: headlines, special, formatting, context formatting, general formatting, table, list, shape and different. The "Dialogues" menu provides several dialogs (analogue of helpers in SCREEM) to perform various tasks: add reference, tables, shapes, or CSS style. In the dialogues, you enter or select the parameter values \u200b\u200bfrom the list for different tags that Bluefish will insert into the document. Through the dialogs also make an initial setup of the document by adding meta tags, links to style sheets, etc. The menu does not depend on the context, that is, if you edit a python file, they will still provide functions to work with HTML.
Bluefish has a convenient wizard for creating thumbnails. With it, you can easily create a preview of any image, convenient if you want to organize an online photo album on your site. This wizard scales the size of the image to the specified or as in the percentage ratio and automatically adds an image and tags for reference.
Bluefish is a very capable HTML editor, especially if you have to write a lot on PHP, JavaScript, Java and other supported languages. All editing in Bluefish is essentially happening through the menu, which makes it not so interactive as SCREEM, which does the same thing, but dynamically, while I type. However, Bluefish capabilities go far beyond simple HTML and CSS editing. Plus, it is installed without any problems and starts both under KDE and under GNOME.
Quanta Plus.
In essence, Quanta Plus is the code editor. He has some WYSIWYG capabilities, but they are not as useful, as it may seem at first glance. It was worth the table on a small web page, as a preview stopped working. It surprised me somewhat, so at the same time a more complex page was loaded, and its preview was displayed normally. But even when preview works fine, then there is enough strange support for WYSIWYG-editing. For example, when you press the "ENTER" key, a tag burst breaks is inserted, instead of the tag of the new paragraph. The same thing happens when the list is edited when pressing the "ENTER" key, the idea should create a new list item. In general, the preview is better to use to view the result, and not for direct editing.
If not to take into account everything above, Quanta Plus is a truly mighty code editor. Its interface is much more complicated than Bluefish, but the main task of Quanta Plus is still web editing. This editor supports the selection of syntax, scripts and marking languages. As in Bluefish, if the menu is designed to work with one language, then work with this menu does not affect the code written in another language. Quanta Plus allows users to create their own toolbar to work with a specific language.
Again, as in Bluefish, the creation of a new page is better to start with the tag menu, where you can find a dialog for creating a basic structure (meta-tags, document header, etc.). Through the tag menu, you can simply insert a tag or open a dialog for tag configuration with multiple parameters. In my opinion, the most important thing is that Quanta Plus offers to select the tag parameters and the values \u200b\u200bof these parameters in the process of gaining the code. In BlueFish, this feature is missing as such, and ScreEm offers to select only the parameter, but not its value.
Another convenient feature when you inserts a tag that usually contains connected tags, then Quanta Plus automatically adds the latter. For example, when you inserted a tag ordered list, the editor automatically adds the opening and closing tags for one list item and closing the ordering of the ordered list.
CSS control in Quanta Plus is slightly confusing, as it is carried out by two dialog boxes. But if you figure it out, the editing CSS will become very simple. In order to create a CSS style, first you need to open the "CSS Selector" dialog to determine the item to which the style will be applied. Then double-click on the "CSS SELECTOR" go to the following "CSS Editor" dialog, in which you can already specify all style parameters. As a result, we get the perfectly formatted CSS code.
Quanta Plus is the most difficult editor of the three under consideration, but at the same time the most capable. It cannot but rejoice, the ability to configure the Quanta Plus interface to their needs. This editor offers everything you need and even more to meet the needs of users who are engaged in writing and editing an HTML and CSS code. For those who use GNOME, Quanta Plus will need to download additional libraries, but it is worth it. The KDE users will not have such difficulties, because this editor is built into KDE.
My simple advice - use Quanta Plus to edit HTML and CSS files. For those who do not seek light paths, I offer the following options:
It's nice that there are at least three worthy applications for web developments under Linux. Screem, Bluefish and Quanta Plus are not so comprehensive as the leader in this area Adobe Dreamweaver, but close to it close enough. Quanta Plus virtually analogue Dreamweaver. Taking into account the fact that the price of the latter is quite high, and it does not support Linux by default, the three described three is an excellent choice. In addition to the fact that they are free, these editors are also awarded their users an excellent result.
If you liked the article, share it with friends:
Editors of the source code under Linux. Editors with backlit syntax. C, C ++ editors. PHP, Perl, HTML editors.
-
Notepadqq is a simple code editor for programmers created by NotePad ++.
-
Visual Studio Code is a functional code editor from Microsoft.
Atom
ATOM is a modern, convenient, functional code editor. It has a built-in package manager (plugins) to expand opportunities.
-
Brackets is a free editor for Web designers and developers. It is mostly designed to write and edit HTML, CSS and JavaScript code.
-
TextADEPT - Text editor for programmers. Made in minimalist style, allows you to divide the working window into several parts and view one or more files at the same time. The syntax backlight is supported for most programming languages.
-
JUFFED - Code Editor for Linux. It is able to highlight the code (syntax), supports the folding of the block blocks, the highlightening of paired brackets and much more. The editor is similar to functionality on NOTEPAD ++.
-
NetBeans - a powerful free integrated application development environment (IDE). Supports Java, PHP, JavaScript, Ajax, Ruby programming languages, Ruby on Rails, C / C ++ and others.
Medit.
MEDIT - text editor for Linux with syntax backlight. Supports basic programming languages \u200b\u200band markup languages.
-
SCREEM - Site Creating and Editing Environment - Text editor for web designers. SCREEM is designed primarily for writing HTML or XML code.
Update (20170929): For last year I used an amazing IDE Pinegrow (https://pinegrow.com), and I sincerely recommend it. Bluegriffon, which I mentioned below in my answer a few years ago, outdated And far behind Pinegrow in development.
I recommend Bluegriffon. It is free, multifunctional, works on all major platforms and has many good additions, some of which are commercial. I have a (commercial) CSS plugin, and I am very pleased with them. I used Kompozer before I found Bluegriffon. I remember that Amaya could not compete with these two.
A good alternative is Eclipse with some WYSIWYG plugin, such as "JavaServer Faces (JSF)" Tool Project, which is part of Eclipse WebTools.
Xian
Unfortunately, Bluegriffon is not stable: as soon as I click the mouse in some parts of the control panel, it occurs with a segmentation error.
user1908895
Unfortunately, Blue Griffon is not open source and is not free. Oh, you can download the executable file and the source is available. But it was associated with any useful functionality. You need to buy plugins with a closed source code to make a program workable. In addition, it seems that he abandoned 32-bit Ubuntu users. I have business reasons to keep your company on 12.04lts as long as we are in fools. Finally, Mozilla's refusal from the XUL API means that this program, together with all others using the XUL API, will die. Not a product to spend your time. John
Fakhim Mitha
I needed to make fast and dirty editing an HTML page, and a binary file that I downloaded from the Bluegriffon site worked for me (Debian Jessie). Nevertheless, it is not available to Debian / Ubuntu, although in
