Creating A Web Page Using Adobe Dreamweaver Solutions!

Call (800)770-0492, email david (at) naaip.org, request via chat or at daily conference call. Click eContracting Registration or eContracting Login (after registration).

Creating new pages requires you to perform a process. As we have discussed previously, Web design processes can vary. So you should find one you like, use it to get work done, and constantly explore and learn new processes to grow your skills and portfolio. We have identified and defined the process for creating, slicing, and exporting a Web page using Macromedia Fireworks.

The process for creating Web pages using Dreamweaver starts with you creating a new .htm page. File>New>HTML page This will create a new Web page. It will be a blank white page. HTML pages are rather simple when created in Dreamweaver. Think of a Web page in Dreamweaver like a word processing document. You can type and place graphics inline. You can change type color, page title, and page color by going to Modify>Page Properties. Don’t worry so much about setting any other parameters than page title and background color.

Once you have created a new page and set the page properties, you are ready begin to add content. To add content, you must insert a layer. To control the content more effectively, insert a table inside of the layer.

Properties Inspector

The properties inspector is an important tool palette in Dreamweaver. The inspector will change depending on the page element that is selected or highlighted. For example, when a table is on the page and you click inside of a cell, the properties of the table cell are active. You can experiment with created tables to see how you can edit the data they contain and manipulate their form and attributes.

There are two places to edit tables, inside the table and outside the table. The outside cell table properties that can be edited are:

  • Rows and columns
  • Width and height
  • Cell pad (space outside) and cell space (space around content)
  • Alignment
  • Color attributes (border, background)
  • Background image
The inside cell table properties that can be edited are:
  • Font
  • Style
  • Link
  • Color attributes (border, background)
  • Vertical and Horizontal alignment within the cell

Remember, text, images, and other content elements can reside in either a layer or a table. For the best positioning and control, use tables inside of layers. We have discussed using traditional HTML hand coding and working from scratch in Dreamweaver for creating your portfolio Web pages.

I have shown you several production shortcuts using Fireworks and Photoshop that allow you freedom of design in the familiar environment of digital imaging and efficient optimization. Although we may or may not utilize the slicing and exporting techniques for every page, we will be using Fireworks to optimize individual Web graphics as we need during production. As well, we might find the need to slice up a navigation bar or desired page to fit into our site at the last minute.

The point here is that we have overviewed and discussed several tools and techniques so far and you should keep them in mind as we move forward. Now we are going to continue into the Web development and multimedia stages of the Web portfolio site. To begin, we will focus on DHTML with layers and timelines.

Utilizing the Content Holders

Tables and layers both hold content. However, there are specific differences between the two. Ideally, you want to use tables nested inside of layers. This method provides several benefits.

Layers can be moved freely on the page, tables cannot. When a table is nested into a layer, it has the ability to be positioned outside of the paragraph format that tables must follow when placed loose on a Web page. Not to worry, Dreamweaver can do all the work and convert the table to layers. Now, each table cell has become a layer. Extraneous pieces will also be in layers. You may want to delete them to clear up the page a bit. After conversion, the layers are placed in a stacking order onto the layers palette.

Add a quote engine to your website for Free! We'll even create the website for you for Free!
There are No Catches! It's free and always will be.

"Best system in industry for insurance agents - anything less in not acceptable.

Step number #1 - NAAIP's technology helps producers project themselves as top level professional with minimal time and effort.

Step number #2 - Being among the largest brokerages in the insurance industry, allows agents access to top commissions and resources on every case.

Commitment to growing this relationship is nurtured by providing best in class service. Our attorneys, underwriters, case managers and sales experts will help you grow your business - one client at a time. Welcome to our team, a system that is uniquely suited for insurance professionals in this new millennium."

Aaron Levy - Website Owner, NAAIP.org

Moses Newman - Chief Technical Officer, NAAIP.org