Dreamweaver Training in San Francisco Bay Area

Introduction to Dreamweaver

We start by introducing you to Dreamweaver user interface, the various tools and panesl and how you can customize the interface to meet your specific needs. We then proceed to show you how you can define a local site within Dreamweaver and create a simple website. After completing this section, you should be able to:

Open and use the Dreamweaver interface
Customize the interface for your personal use
Create a local site
Create a simple HTML page, add the page title and save the file in the site folder
Use a preview browser to view page results

How a Website Works

Web pages are deceptive when presented in a browser. What appears to be a single document can actually be a large collaboative effort that involves HTML, CSS, JavaScript, image and other kinds of files. These files all come together based upon the instructions in the HTML. Dreamweaver recognizes that even the simplest web page is actually a site full of files that need to be managed. Once you've completed this portion, you will:

Know how to define, delete and edit a site definition in Dreamweaver
Understand how Dreamweaver manages relationships between files
Be able to use Dreamweaver to update links to files if you rename and move the site files
Know how to create a sitemap of the files in your website

Creating Basic Pages - Text, Graphics & Links

Every web page from the most sophisticated to the simplest has certain common elements. We will take a peak under the hood at the code that Dreamweaver crafts when you create a new document. We'll discuss the importance of specifying the type of document you are creating, how to name the file and how the title affects the way that search engines and other tools index the content on a page. We will also experiment with including content on the page and get you up to speed on the most important types of content including including paragraphs, graphics and basic hyperlinks. Graphics enhance the aesthetics of the site, provide buttons and icons for usability and navigation, represent information in charts and graphs and generally illustrate concepts in a way text cannot. After completing this section, you should be able to:

Create a new document, save it and title it
Add paragraphs of text with line breaks to your web page
Understand graphic types that are used on web pages
Put a graphic on a web page
Align text and graphics on the page
Create links from images and text
Add <meta> tags that will assist in the classification of your webpage

Hyperlink & Image Tools

In the previous exercise we introduced you to some basics, but Dreamweaver offers a multitude of ways to work with auxillary files such as image and hyperlinked files. Since linking and the relationships between files are largely what makes the web the web, Dreamweaver provides a rich tool set for creating inter-file relationships. After this exercise, you will be able to:

Use the Dreamweaver pointer tool to create links between files
Work with placeholder images
Create email links
Creating named anchors on a page
Linking to a named anchor
Linking to different file types

Using Cascading Style Sheets (CSS) to Format

Images can only go so far towards spiffying up the appearance of a website. Much of what makes a site attractive is attention to design aspects such as fonts, colors, spacing, sizes and layout. On the web, these aesthetics are not handled with HTML, but rather with a different language specifically suited for design and style called CSS. Because formatting can be a tremendous task, CSS is meant to be used to create stylesheets - or a conglomeration of design choices meant to be applied to one or more web pages. This allows a designer to create one stylesheet and use it on all of the pages of the website. After completing this section, you should be able to:

Understand basic CSS syntax
Understand the benefits and limitations of CSS
Control the basic properties of a page using CSS
Export styles into an external style sheet
Create and attach style sheets to your web pages
Using the CSS Styles Panel in Dreamweaver

Typography

Two of the most important aspects of any web site are the content and how it is formatted. We explain the importance of different types of text content and how to add various formattings, such as headings, paragraphs, alignments and lists to emphasize important content and make the page more aesthetically pleasing. After completing this section, you should be able to:

Specify appropriate content types for text
Control document structure using headings and paragraphs
Understand font sizing issues
Alter spacting between text sections
Select preferred fonts as well as fall back options
Use and customize lists
Create an image of text using Flash for certain formatting

Working with Tables

From almost the very beginning, HTML offered a mechanism for laying out rows and columns of data for display with tables. Shortly after their introduction, designers everywhere co-opted them and started using them for web page layout. To this day, tables are used on many pages as a way to structure the display of some or all of the content on the page. While we encourage use of CSS for page layout, understanding tables and their various components is important. After completing this section, you should be able to:

Create a table and place content within its cells
Use Dreamweaver and HTML to specifiy display properties of the table including borders and backgrounds
Use CSS to modify the display properties of a table
Align the table's content
Sort the content of a table
Create rounded corners for the table

Publishing Your Website

Once you finish building your web site locally you need to test the web site to ensure it behaves the way you intended it. We will show you how to quickly test for for broken links, ensure all images shows up correctly and spell check every page. We will also show you how to upload your site and maintain it. After completing this section, you should be able to:

Test your web pages for accessibility and broken links
Define and connect to a remote server
Upload your pages to a remote site
Synchronize your sites to upload changed pages

Prerequisites:

Basic PC and Windows skills: copying/pasting, right-clicking, finding files, switching between programs, exploring windows

Related classes in San Francisco: