HTML page editor in Russian. Visual HTML Editor

Visual HTML- an editor similar to Macromedia Dreamweaver, but free.

Last time I told you about how to check your site for performance using local Denver server. But the very question of creating this site remained unresolved. Let's try to fix this annoying oversight - today I'll tell you about one program with which you can make a simple website, even without knowledge of HTML programming and other tricks.

I bring to your attention free visual HTML editor NVU.

Why is he good? Yes, the fact that to create a web page you do not need to bother with the study of web programming languages. You just type text, insert pictures or animations, and all the "dirty" work of decorating all this in HTML takes over NVU.

Unfortunately, currently the development NVU suspended, but the project has grown to the first stable version, and this is already a lot.

NVU Capabilities

• support multiple display modes editable page;
• advanced options for text editing;
• insert pictures(including background);
• editing individual pages and entire sites;
• creating forms and tables;
• spellchecking;
• possibility site publications directly from the program;
• built-in CSS editor and Java Script console.

All this and much more allows us to make a small site from scratch with minimal (preferably) knowledge in the field of HTML (or their complete absence :)).

Downloading ... Installing ... Launching and watching :) (that's right - no unnecessary gestures with Russification, entering additional information, etc.). Agree to create a shortcut on the desktop and run it with it NVU:

NVU Interface

From a glance NVU reminds of some text editor. This is his main merit - visual GUI. But, looking below, you will see that in addition to the usual there are several more display modes information entered: HTML tags, code and preview.

HTML tag mode

"HTML tags" are a kind of mosaic of text and tags, designed as colored rectangles. This view mode is useful for novice users, as it displays all the main tags used and at the same time does not bother with a large number of them, while remaining the same visual editor. In this mode, it is good to learn the names of tags, so that later you can easily use them in code editing mode.

Mode Code

Mode "The code" is a window with the HTML code of the page being edited, familiar to all web developers. It is from here that all the resources of the Internet grow out of all these scribbles. Having mastered the code language, you can easily add to your site any controls, scripts and other "goodies" that you are used to admiring on other people's sites :).

Preview

And finally "Preview" allows you to evaluate the result of our efforts, displaying the page in the form that it will acquire on the Internet. In the screenshot, it does not differ from the text counterpart, but it is worth adding any navigation elements or scripts, as the difference will reveal itself:

Now that the viewing and editing options have been clarified a bit, let's take a deeper look into the possibilities. NVU. To interact with the program, you can use menu bar or using pictograms and symbols below it.

Hidden Features of NVU's Visual HTML Editor

All basic formatting options are available as icons, but some options are hidden in the menu bar and do not immediately reveal themselves.

For example, in the menu "File" You will find such functions,, how:

1. "Open an address on the Internet". Thanks to the engine from Mozilla allows you to open and edit pages directly from the Internet. This can be very useful if you want to see how this or that feature for the site is done. Just enter the address in the window that opens and admire the result:

2. "Export to text format". After admiring the site, you can save its source code in .txt format on your hard drive.

AT "Editing" there are tools for search the right words in the text and spell checker.

On the menu "Insert" attention can be paid to the possibility PHP code inserts and characters that are not on the keyboard.

"Format" provides the greatest opportunities for text view settings, images and other information. The most interesting, and most importantly, nowhere displayed opportunity here is "Page color and background". Using this option, you can easily add any background image or simply set the background color for the site.

Finally the menu "Tools" provides features such as access to JavaScript consoles, editor css and tool for HTML validation code. Also from here you can access settings programs and theme settings design NVU.

AT NVU easy to understand, since all controls in the program are equipped with tooltips and explanations, and thanks to a group of Russian developers from Mozilla Team there is also a very good help in Russian. The only negative NVU there is that the code generated by the program is very cumbersome and has a lot of extra tags. But let this be only an incentive for you to study HTML and optimize and bring your site to perfection.

Good luck with your developments and success in all your endeavors :)!!!

P.S. This article is intended for free distribution. It is welcome to copy it with the preservation of authorship Ruslan Tertyshny and all P.S. and P.P.S.

P.P.S. You may also like another rather sensible

I would also like to recommend a good HTML book which I used myself:

NVU is a small program for editing HTML code. The NVU HTML editor has a visual interface and exists for various operating systems. This code editor was created on the basis of the Mozilla Composer HTML editor, as a result of which NVU is quite simple and understandable, and in terms of its capabilities it is already far ahead of the original program and has come close to the functionality of such paid editors as Dreamweaver and FrontPage.

One of the advantages of this code editor is that you can download NVU in Russian. NVU Russian page is fully translated, which makes it easier for users who are not familiar with English language. If you download NVU for free in Russian, you will get convenient program to create your page or site of good quality, even if you are an absolute beginner. In the editor, you can create sites that meet all the necessary Internet standards.

More experienced users, if desired, can go directly to editing the code. In addition, NVU has other tools such as Site Manager and CSS Editor. With them, you can edit the pages that are on remote server, use syntax highlighting, check code for errors, etc. The editor's interface is easy to change through the use of various themes, and the possibilities are easily extended by installing extensions created for NVU.

You can use all the features of the editor if you download the NVU in a couple of minutes. This HTML editor has tabs, previews, and access to the most commonly used tags, making site development much faster. There are also many options for changing text: centering, font, style, etc.

Features of the NVU HTML editor

• can be installed on Windows, Linux, Mac OS X;
• open source code available for viewing and modification;
• the user can personally modify or modify the program for his own purposes;
• the ability to directly edit HTML and CSS code;
• a small amount of disk space occupied by the computer;
• elements have properties whose parameters are configurable;
• syntax highlighting.

When it comes to code editors, sometimes it's hard to get a clear overview of all the benefits and functionality that different editors have to offer. However, at least one is required in the end, so it's important to know which editor best suits your personal needs.

WYSIWYG editors are often criticized by handcrafters for the bloated, messy, and standards-incompatible source code they produce. However, WYSIWYG editors have gotten a lot better lately. Sometimes you need to provide your clients with the easiest tools to edit or update their websites. And this is where WYSIWYG editors are indispensable.

It would be wrong to recommend some "best" editors to you, because the choice always depends on your needs, main goals, skills and experience. Therefore, in this article we have tried to give you an overview of different, useful and not so WYSIWYG editors.
We hope you find new editors you've never heard of before. Or maybe you find some features you've missed in your favorite editor, or dare to experiment with a number of promising options to improve your workflow. In addition, you can find out which editors you can use and which tools you should not use.

What does it mean WYSIWYG?
In such editors, you can change not the source code of your documents, but its representation, which (if possible) will be published in the final document. So instead of writing blocks of code by hand, you manage the design with components using the editor window. This means that you see something very similar to the end result, although the document or image is still being created.
Note: This article reviews only desktop-based WYSIWYG editors that run on Windows, Linux, or Mac. It does not provide an overview of JavaScript WYSIWIG editors, but you can find an extensive overview of such editors on or .

Adobe Dreamweaver

Formerly a product of Macromedia, Dreamweaver is one of the most widely used editors that can help developers improve their workflow and save tons of time when coding. If previous versions of Dreamweaver sometimes generated bizarre source code, then latest version can generate (in most cases) perfectly clean markup.

Dreamweaver also provides various useful tools such as code snippet libraries, ftp management, debug server and integrated coding. For example, you can view CSS information in a single, unified CSS pane, making it easy to see styles applied to specific elements, determine where attributes are defined, and edit existing styles. See also our list of Dreamweaver tutorials. Price: $400 (CS3 version).

Some of Dreamweaver's many features:
* Advanced CSS editing
* Integrated coding environment
* Spry framework for Ajax
* Check browser compatibility.
* Integration with Photoshop CS3 and Fireworks.
* Code snippets (like CSS formats)
* FTP management
* XML support
* FLV support
* Learning resources (eg Adobe CSS Advisor)
* Numerous extensions for Dreamweaver.
Amaya
Amaya (Win/Mac/Linux)
What really sets Amaya apart from the rest is that it is a hybrid of a web browser and web page editor, so you can browse the web and edit your pages in the same application. Created by a WWW consortium, this tool allows you to manage websites, modify and update their content, add new images and links. Of course, if Amaya can display these pages.

The latest version of the editor, Amaya 10, was released in February 2008. It is able to work with multiple documents at the same time ((X)HTML, MathML(. Mml) and SVG (. Svg) documents can be displayed and edited at the same time). For example, you can insert mathematical formulas using pop-up: Amaya converts them via Math-ML on the fly.

Amaya also includes a unified annotation application (annotations, external comments, annotations, remarks that can be attached to any web document or a specific part of a document) and it supports SVG, RDF and XPointer. open source.

Rapidweaver
RapidWeaver (Mac)
RapidWeaver is a powerful template-based website creation tool that can generate all sorts of pages such as text pages, blogs, contact forms, image galleries and Flash slideshows, and has a built-in FTP manager and integration with iPhoto and .Mac.

The editor includes podcasting, inline comments, RSS feeds, permalink, and tagging support. RapidWeaver will also be SEO friendly. It also has many powerful features such as theme modification, php rendering, mix and match WYSIWYG and HTML, smart publishing, XHTML and CSS based site output, source code browsing, built-in error checking. All templates are based on XHTML and CSS. What is remarkable is that RapidWeaver generates a valid code. Price: $49.

Adobe Contribute
Adobe Contribute

The main purpose of Adobe Contribute is to enable editing of websites and blogs for users without any technical knowledge. Contribute CS3 allows authors to update existing sites and blogs while maintaining site integrity. Contribute offers Dreamweaver integration, hosting with Microsoft Office, and editing from IE 7 and Firefox.

With this WYSIWYG editor, authors can edit or update any website or blog without having to learn HTML. Price: $169 (CS3 version).

Adobe Live
Adobe Golive (Win/Mac)

In April, Adobe stopped developing and selling GoLive 9. Adobe GoLive encourages users to switch to Dreamweaver, after which you probably shouldn't recommend GoLive (actually a surprisingly powerful editing tool, (see below) for your clients.

Some Adobe GoLive 9 features:
* Designer styles
* Visual CSS layout
* Place command
*Adobe InDesign® integration
* Color management
*Platform support
* Site management tools
* Publish Server
* Smart Objects

Microsoft Expression Web
Microsoft Expression (Windows)

At one time heavily criticized for its really bad web editor (Frontpage), Microsoft recently created an editor, Expression, that seems to inherit a lot from its predecessors. Expression has tried to create a comfortable environment for Internet users, with features that are extremely similar to Adobe Dreamweaver. However, in a direct comparison, Dreamweaver offers more and produces cleaner code. However, Expression produces decent, standards-compliant code and knows how to work with CSS and CSS layouts.

Studio edition with other software applications (graphic design tool, video encoding tool, etc.) costs approx. $500. One Expression license costs $350. You can get Expression by upgrading Frontpage and save money. The trial version for 60 days is free to download, but registration is required.

Please note: Expression is not a successor to Frontpage, they are rather different development tools. Microsoft Expression is more similar to Microsoft SharePoint Designer, it is more of a designer oriented and aimed at providing general web development. Microsoft SharePoint Designer focuses on developing and adapting to SharePoint-based sites, it can be considered as the big brother of Frontpage.



Some Microsoft Expression features:
* ASP.NET 2.0 Integration
* Advanced CSS rendering
* XPath Expression Builder
* Build and format views of industry-standard XML data
* Tag Property Grid
* Accessibility Checking
* Real-time Standards Validation
*Full Schema Support

This editor should be a real alternative to the dominant products: a WYSYWIG editor for Linux, Microsoft Windows and Mac that could compete with FrontPage and Dreamweaver. And in some ways, Nvu does provide more than you'd expect from completely free software.

Nvu (pronounced N-view, for "new-view") offers an integrated FTP manager, powerful support for forms, spreadsheets and templates, and is really easy to use. CaScadeS, a well known CSS editor like additional module integrates with Nvu and makes it easy to create and manage styles and see how your styles are applied on the fly in the document you are modifying.

Nvu is open source and released under the Mozilla Public License (MPL). Unfortunately, the development of NVU does not continue in recent years. An improved version of NVU can be found here - KompoZer.

Some of the NVU features:
* Site Manager allows you to view the sites you create.
* XML support.
* Built-in validator.

Compozer
KompoZer (Win/Mac/Linux)

This tool is an offshoot of NVU, which was developed after further development of NVU slowed down. KompoZer is a web authoring system that combines a web file manager and a WYSIWYG editor.

KompoZer is extremely easy to use, making it a suitable solution for users who want to create websites without getting technical knowledge. Compared to NVU, Kompozer produces clean markup code.

The latest version was released in August 2007. Kompozer can be considered as an alternative for smaller projects and for users without technical knowledge. But it is definitely too weak for professional web developers.

Namo WebEditor 2006
Namo WebEditor 2006 (Win)
Namo WebEditor combines almost all the tools you need to create websites in a simple and intuitive interface. The interface elements are extremely clear, simple and easy to use. You can switch between design editor, HTML browser and photo viewer. You can also use a number of wizards to automate your workflow. Namo is powerful, but its WYSIWYG capabilities are limited. The editor hasn't been updated since 2006, which is why generating source code is sometimes extremely weird. Namo Pro Web Editor comes with a Flash editor as well as graphics programs. Test version is available. Price: $99.95.



Some of Namo Webeditor features:
* Code Helpers for auto closing tags
*Quick Tag Editor
* Tag Selector
*HTML/CSS Reference

Evrsoft First Page 2006
Evrsoft First Page 2006 (Win)
In fact, this editor is very underrated. It's not very popular and hasn't been updated since 2006, but it has a lot of very useful features that could be included in modern WYSIWYG editors. For example, the Auto History feature remembers all the attributes and values ​​that have been used and suggests the "correct" value automatically.

Dual Preview Engine allows you to preview web documents in multiple browsers with First Page 2006. You can preview your work in Internet Explorer, Mozilla or view pages in both browsers side by side (horizontal / vertical bars). And in real time view code and edit documents.

First Page is free. A similar free alternative (also not updated since 2005): Selida HTML Editor.

Some of the First Page features:
* CSS Class Support & Auto Detection
* Syntax Highlighting
* Tag Document Selection Tool
* Tag Auto Completion
* Tidy HTML Power Tools
* Preview in IE as you type
* Image Mapper
* CSS Style Sheet Designer
* Server Side Includes Support
* Highly customizable Toolbars and Interface
*FTP client
* Advanced Find & Replace In Files

Microsoft SharePoint Designer
Microsoft SharePoint Designer 2007 (Win)

It is the successor to Microsofts Frontpage. SharePoint Designer is a standard WYSIWYG editor. Other than supporting interactive ASP.NET pages, it doesn't offer anything revolutionary. Free trial version available. There is an online version that requires Internet Explorer and a lot of patience.

Some of Sharepoint's features:
* support for interactive ASP.NET pages
* create Data Views from RSS, XML, Office XML
* collaborate with the built-in Workflow Designer
* CSS tools
* track customized pages
* spelling checker
* SharePoint Server 2007 integration

NetObjects Fusion
NetObjects Fusion
This editor was once probably the worst but still very popular WYSIWYG editor. It generated terrible source code (only MS Word made it worse), but was often used by web hosting companies and providers. NetObjects Fusion allows you to create websites without any technical knowledge. Especially if you want to create a business card, you can do it in minutes. But if you want to create a professional website, NetObjects is not an option worth considering.

NetObjects Fusion version 10 is currently available. The quality of the generated source code may have changed, but it doesn't really matter. There is a trial version that requires you to register with the store. That's why we don't have a screenshot of this product. Price: ? 100.

Quanta Plus

The editor supports both handcoding and WYSIWYG interface. It has the following features: auto completion of tags as you enter and edit tags within the dialog interface, project management, the ability to debug PHP code. He also has visual editor CSS, CSS completion, offers high extensibility and preview.

The editor also has interesting features for project management, including support for both local and remote (over the network) projects. Projects can be downloaded from different servers using different protocols. CVS support included, Subversion support available through external plugins. Quanta is based on KDE. Released under the GPL license.

freeway
Freeway (Mac)

Freeway (originally Uniqorn) comes in two flavors, Freeway Pro and Freeway Express. Freeway 5 Pro can be used to create CSS layouts using absolute positioning. In an advanced version, for example, connecting to a MySQL database using a scripting language such as PHP is done using plugins called "Actions". Some Actions can be downloaded for free from several websites, but there are also commercial ones such as 3rd Party Actions.

There is a trial version that requires you to fill out a rather lengthy web form. Freeway was nominated for Creative Web Product of the Year at the Macworld 2008 Awards. If you're using a Mac, then Freeway along with RapidWeaver is the first option worth considering.

Some of the Freeway features:
* Multiple Master Pages
* Layout Tools
* Link Map
* Link styles
* Integrated .Mac upload
*Internet Explorer Compatibility
* Support for Sliced ​​Background Images
* Built-in preview within Freeway (Safari/Webkit)
* Full EPS (Panther & later), Illustrator, Photoshop layered file import
* Freeway Shop
* Work with Blogger Templates

Seamonkey Composer
SeaMonkey Composer (Win/Mac/Linux)
This editor is a simple yet very powerful alternative to large commercial applications. Being the successor to Netscape Composer, SeaMonkey Composer really has nothing to do with it.

The editor is powerful yet simple, offering dynamic images and table resizing, fast insertion and deletion from table cells, advanced CSS support, and support for positioned layers. WYSIWYG editor built into SeaMonkey.

Create
Create (Mac)
Create combines the core features of applications such as Illustrator, InDesign, Pages, GoLive, Canvas, Dreamweaver, QuarkExpress, and organizes them for easy use, it's inexpensive, designed for OS X. Among other things, you can add links to text and graphics with With drag-n-drop, there is a tool that automatically creates the navigation and index, and you can create PDFs and websites from the same document.

WYSIWYG Web Builder
WYSIWYG Web Builder
Web Builder is a highly customizable and extensible application with many features, scripts and templates. New design elements can be added via drag"n"drop, and there are many scripts available. It is possible to edit images within the software.

PayPal eCommerce Tools integrated; there is an RSS Feed object, a blog with built-in RSS and a Google compatible SiteMap generator. The editor also has many extensions such as password protection, RSS feed, RSS parser, photo album and lightboxes.

If you have any questions, please use our

NeonHTML- Free editor HTML and CSS with visual tools. Differs in functionality of tools. Supports XHTML. Allows you to edit quickly and comfortably: syntax highlighting, visual creation of tags in dialogs. Most tools have a preview, changing the parameters immediately affects the display in the preview. There is a built-in browser with imitation of different resolutions and scales. Search engine (SEO) optimization tool and website ranking checker. The text variation tool will help with promotion. Very good work with colors - specially created palette as in graphic editors, list of recent colors, list of page colors, quick one-click color editing, instant creation of style options with color picker, color docker. The tools interact with each other, this achieves a quick getting used to the interface, convenience and high speed. Does not replace the keyboard where it is not needed. Does not contain junk menus.

___________________________ ______________________________ _______________________

A visual HTML editor similar to Macromedia Dreamweaver but completely free. A great tool for beginners who are just starting to master the science of creating websites.

Why is he good? Yes, the fact that to create a web page you do not need to bother with the study of web programming languages. You just type text, insert pictures or animations, and NVU takes care of all the "dirty" work of formatting it all in HTML.

Unfortunately, at the moment the development of NVU has been suspended, but the project has grown to the first stable version, and this is already a lot. Let's look at it in more detail.

NVU Capabilities

• different display modes of the edited page;
• ample opportunities for text design;
• inserting images (including backgrounds);
• the ability to work on the whole site, and not just on individual pages;
• creating tables and forms;
• publication of the edited site directly from the editor;
• own cascading style sheet (CSS) editor and Java Script console.

All this and much more allows us to make a small site from scratch with minimal (preferably) knowledge in the field of HTML (or their complete absence :)).

Installing the visual editor

Downloading ... Installing ... Launching and watching :) (that's right - no unnecessary gestures with Russification, entering additional information, etc.).

We agree to create a shortcut on the desktop and launch NVU with it.

NVU Interface

At first glance, NVU looks like some kind of text editor. This is its main merit - a visual graphical interface.

But looking down, you will see that in addition to the usual, there are several more modes for displaying the entered information:

• HTML tags;
• and preview.

HTML tag mode

"HTML tags" are a kind of mosaic of text and tags, designed as colored rectangles.

This view mode is useful for novice users, as it displays all the main tags used and at the same time does not bother with a large number of them, while remaining the same visual editor.

Also, in this mode it is convenient to study the names of tags, so that later you can easily use them in the code editing mode.

Mode Code

The "Code" mode is a window familiar to all web developers with the HTML code of the page being edited. It is from here, from all these doodles, that all the resources of the Internet grow.

Having mastered the code language, you can easily add to your site any controls, scripts and other "goodies" that you are used to admiring on other people's sites :).

Preview

And, finally, "Preview" allows you to evaluate the result of our efforts, displaying the page in the form that it will acquire on the Internet.

In the screenshot, it does not differ from the text counterpart, but it is worth adding any navigation elements or scripts, as the difference will reveal itself:

If you were editing this page in Notepad like a hardcore programmer, you would need at least a browser and a local web server to view it.

And here, as they say, already "all inclusive".

Now that the viewing and editing options have been clarified a bit, let's take a deeper look into the capabilities of NVU.

Hidden Features of NVU's Visual HTML Editor

All basic formatting options are available as icons, but some options are hidden in the menu bar.

For example, in the "File" menu you will find functions such as:

1. "Open an address on the Internet." Thanks to the engine from Mozilla allows you to open and edit pages directly from the Internet.

This can be very useful if you want to see how this or that feature for the site is done. Just enter the address in the window that opens and admire the result:

2. "Export to text format". After admiring the site, you can save its source code in .txt format on your hard drive.

In "Edit" there are tools for searching for the right words in the text and checking spelling.

In the "Insert" menu, you can pay attention to the ability to insert PHP code and characters that are not on the keyboard.

"Format" provides a wide range of options for customizing the appearance of text, images and other information.

The most interesting, and most importantly, nowhere displayed feature here is "Page color and background". Using this option, you can easily add any background image or simply choose a good background color for the site.

Finally, the "Tools" menu provides options such as access to a JavaScript console, a CSS editor, and an HTML code inspection tool.

Also from here you can access the program settings and NVU theme settings.

conclusions

NVU is easy to understand, since all controls in the program are provided with tooltips and explanations, and thanks to a group of Russian developers from the Mozilla.ru Team, there is also very good help in Russian.

The only disadvantage of NVU is that the code generated by the program is very cumbersome and has a lot of unnecessary tags. But let this be only an incentive for you to study HTML and optimize and bring your site to perfection.

Good luck with your developments and success in all your endeavors!

P.S. It is allowed to freely copy and quote this article, provided that an open active link to the source is indicated and the authorship of Ruslan Tertyshny is preserved.