From the [New] wizard, select [Web] > [HTML], and the wizard creates the HTML file. Refer to the following for the wizard settings:
Enter or select the parent folder
Select the folder in which the HTML file is to be created.
File name
Specify the name of the HTML file being created. If the extension is omitted, ".html" is used as the extension.
Use HTML Template
Select this item if a template is to be used to create the HTML file. New templates can also be added.
Point
The extension that is used if the extension is omitted, and the embedded encoding used during file creation, can be customized using [Web] > [HTML Files] on the Preferences page.
Use the HTML editor to edit the HTML file. The HTML editor is a text editor that has the following features:
Highlighted display of syntax
Element names, attribute names, attribute values, comments, and so on, are each highlighted in different colors. The highlighting method can be customized using preferences.
Problem identification
If there are errors in the entered tags, attribute names, attribute values, or similar, errors and warnings are indicated by line markers or wavy lines under the text.
Contents Assist
In accordance with the cursor location, suggestions concerning selectable element names, attribute names, attribute values and so on are displayed in Contents Assist. Press the [Ctrl+Space] keys to display the contents assist list, and enter characters to narrow down the possible choices.
Tool tips display
When the cursor is moved over an element name or attribute name and the [F2] key is pressed, a description of that element or attribute is displayed.
User-definable templates and snippets
The templates that can be used with Contents Assist can be registered.
In addition, fragments of code or similar that are used frequently can be registered in snippets, thus enabling drag-and-drop to be used to insert code easily.
Tag selection
Depending on the cursor position, an indicator showing the range covered by a tag is displayed in the vertical ruler on the left-hand side of the page.
Use the appropriate view from the following when editing using the HTML editor:
Outline view
Shows the HTML syntax outline. Elements and attributes can also be added using this view.
Properties view
Shows the attributes of an element selected using the editor. The value can also be changed. Attribute values can also be selected from a list.
Snippets view
Fragments of code that are used frequently can be registered, thus enabling drag-and-drop to be used to easily insert code in the source.
Entering Tags
Use one of the following methods to enter tags:
Contents Assist
When the [Ctrl+Space] keys are pressed together, tag suggestions that suit the current cursor position are displayed in the Contents Assist list. The Contents Assist list displays the tags that can be inserted in that syntax, and also displays templates registered in the HTML template.
Using the Outline view
Tags can be inserted from the context menu of the Outline view. A tag can be inserted before, after or as a child of the tag currently selected in the Outline view.
Inserting Tables
Use Contents Assist to insert a table. Tables are registered in advance in the templates as a "table".
Inserting Lists
Use Contents Assist to insert a list. In the templates, "ol" is used for a sequential list, and "ul" for a non-sequential list.
Point
It is convenient to register frequently-used tags in the templates or the Snippets view. Use templates if Contents Assist is used from the keyboard. Use the Snippets view if mouse operations are used to insert tags. User-defined variables can also be used from the Snippets view, and the variable value can be specified during insertion. For details on registering templates, refer to "Templates", under Tips. For details on registering snippets, refer to "Snippets", under Tips.
Entering Attributes/Attribute Values
Use either of the following methods to add attributes and to change attribute values:
Using Contents Assist
When the [Ctrl+Space] keys are pressed in the middle of a tag, a list of the attributes that can be used with that tag is displayed in the Contents Assist list. Select from the list the attribute that you want to add. For attribute values that have fixed options, move the caret symbol to the start of the attribute values and launch Content Assist. This displays suggested attribute values in the Contents Assist list.
Using the Properties view
The attribute list for the tag at which the caret is positioned in the editor is displayed in the Properties view. When a value is entered in the Value column of the Properties view, that value is reflected in the attribute value of the tag.
Previewing the Page
To preview a created HTML file, open that file using a Web browser.
Point
For convenience, arrange the HTML editor used for editing and the Web browser used for previewing the page to be side by side. To display the editor beside the browser, drag the editor tab.
The HTML syntax validator is used to verify HTML tags. For details on validation, refer to "6.2.5.2 Validation".
