Unit 15. HTML and Dreamweaver (I)

We will now learn some of the advantages that Dreamweaver offers us at the time of working with HTML code, and not just in the graphic editor of the design view.

It’s not about learning HTML language, it’s just knowing how to readjust the code directly in Dreamweaver.

We already know HTML language is based on tags which mark each web site element from start to end.

Tags are based on writing the same command betwwen “<” and “>” symbols. The first tag means start, and the second one in which we include the “/” symbol, indicates the end and it is called the end tag.

Tags have attributes that allow the defining of the element’s characteristics on which they act, including certain codes inside the tag.

For example, a paragraph is inserted between <P> and </P> tags, but you can change its predefined charateristics as they can be aligned to the right. To do this, instead of introducing the text in the paragraph between the previous labels, it must be inserted between <P align=”right”> and </P> tags.

Also there are some elements that don’t need an end tag. For example, a Shift+ENTER inside HTML code, is equivalent to a <BR> tag.

Dreamweaver automatically inserts the necessary tags to build the site, with its appearance and content defined in the graphic editor, but also offers other ways to work directly with the code.

You already know that Dreamwever offers you the possibility of working with three views: Design view, Code view and Split view (Code and Design).

All these views are directly applied to the file window.

But there is a panel that allows the viewing of the code independently from the applied view in the file. This panel is called the Code inspector and can be opened through the Window menu. If the Code inspector option isn’t in the menu, it may be found in the Others option. You can also open the Code inspector by pressing F10.

The Code inspector shows the HTML code the same way as Code view and Split view (Code and Design) do, but it can be better working with this panel as it can be placed in any part of the screen.