| • Download Nvu • Open Nvu • Examine the toolbars • Examine the views • | |
Nvu (pronounced N-view, standing for New View) is a free open-source web authoring system that includes a WYSIWYG (pronounced wizzy-wig and standing for What You See Is What You Get) editing interface as well as tools for file management and for directly working on HTML code. Nvu uses and expands on the Mozilla Composer code base. Nvu is an easy-to-use WYSIWYG web page editor that allows you to create web pages directly without using HTML. |
|
| Nvu is is available for free download at http://net2.com/nvu/download.html | |
| Open Nvu | |
| When you install Nvu, you can opt to also install a shortcut icon on your desktop. Simply click on the icon to open Nvu. |  |
Once you've launched Nvu, examine the screen. On the left you will see the Nvu Site Manager column. Here is where you can see all of the files associated with a particular web site. To the right of the Site Manager is the main work area. You can give yourself more workspace by closing the Site Manager; simply click on the X in the upper right hand corner of the colored tab at the top of the column. To reopen the column, choose View, Show/Hide, Site Manager from the main menu. |
 |
| Examine the toolbars | |
Now examine the top of the screen. Across the very top is the Main Menu. Click on any one of these commands to get a dropdown box with specific tasks you can perform. Underneath the Main Menu are toolbars; you will mostly use the top two toolbars, the Composition toolbar and the Format toolbar. |
|
You can choose to show or hide the Composition toolbar and the Format toolbar by choosing View, Show/Hide on the Main Menu. |
|
| Examine the views | |
Nvu allows you to switch back and forth among several views of your page; you can toggle among these views with the tabs at the bottom of the Nvu workspace. |
|
 |
|
| The Normal view is the view you will most commonly be working with; it shows your web page as you develop it. Below is one of my completed web pages in the Normal view. | |
 |
|
| The To HTML tags view provides a graphic display of the text along with all of the tags you applied to the text when you formatted it in the Normal view. Below is the same page illustrated above, shown in the To HTML Tags view. You can edit your text and images in this view as well. | |
|
|
You can add to or edit the HTML code in Source view. This is essentially the same view you would see if you clicked on the View Source option in your browser's main menu. Below is part of the same page in Source view. |
|
 |
|
| Finally you can quickly preview your page by clicking on the Preview tab. Below is the same page as shown in the Preview view. | |
 |
|
| Although you will want to preview your pages in both Microsoft Internet Explorer and Firefox--the two most commonly used browsers--you can get a pretty good idea of what the page will eventually look like on the Web from the Preview view. | |
| • Overview • Tour Nvu • | |
   |
Web Design Center |