Step-by-Step
Web Design Course
Your Ticket to Web Design Guru
Using Dreamweaver and Fireworks
You will learn everything you need to know to build the incredible website below using Fireworks and Dreamweaver.
You wil receive:
- 16 Flash Video Tutorials (Over 7 Hours of Training)
- Complete source files of EXACTLY what I build in the movie
- Working website with Dreamweaver Template and Images
- Technical Support
- Time and money saving tips
- Secret web design tips throughout the process
- Site Correcion and Updates
This is the website that you will build
using Dreamweaver and Fireworks
during the Step-by-Step Web Design Course.
There will be a total of 7 pages
including a customized homepage layout.
Table of Contents of Web Design Course
View The Slide Show Outline as a PDF
- Introduction
- About this Course
- The goals is to build a complete website from start to finish using Dreamweaver and Fireworks
- The style is live training
- You will be taught concepts, techniques and tips while working toward a final project
- What You Need
- Computer
- Web Hosting Environment for LIVE website (Ask about our special offer) - If you don't have web hosting you can build the website on your local computer
- Dreamweaver & Fireworks software (If you don't own the software you can download the 30 day free trial)
- Patience, Perseverance, Purpose and Practice
- Considerations
- What are you building? Why are you building it? Who is the audience?
- Site expansion? Search engine friendly/optimized? Shopping cart? Technologies? What is the project outcome?
- Colors, layout 2 column, 3 column, photos, specials needs
- Layout Sketches
- Sketch on paper
- Cut and paste site elements together
- View sites you like for inspiration
- Website Project Concept
- Project Outcome
- Completed fully functionally published website
- 2 column layout
- Colorscheme will be based on reds/grays
- Customized homepage layout
- Left navigation with nice background image
- Contemporary rounded corners look and feel
- Photos
- Gather photos for use in header and initial homepage layout
- Photos for interior pages
- Inspiration
- We’ll use our existing template to get inspired
- View how we might use other source
- Getting Started in Fireworks
- Overview of Fireworks Tools (General overview of Fireworks, common tools, and shortcuts)
- Setup Workspace in Fireworks (Setting up the new document, using guides, setting layout dimensions)
- Create Basic Website Layout in Fireworks(Creating the overall layout, insert base shapes, saving your work)
- Detailing the Design in Fireworks
- Adding Texture in Fireworks
- Creating Curves
- Using Vector Shapes
- Adding Gradients
- Using Drop Shadows
- Building the Layout
- Completing the General Layout in Fireworks
- Building layout graphics
- Using colors
- Managing your layers
- Publishing a Site in Dreamweaver
- Local Site in Dreamweaver
- Site Name
- ocal root folder
- Options
- Remote Site Access in Dreamweaver
- FTP
- FTP Host
- Host Directory
- Login
- Password
- Testing
- Other Settings in Dreamweaver
- Exporting the Design from Fireworks
- Completing the Layout in Fireworks
- Grouping our elements
- Managing and naming our layers
- Adding a background
- Finalizing the website border
- Slicing the Layout
- Using the slice tool
- Creating the slices for export
- Setting the optimization
- Export the HTML and images for Dreamweaver
- Setting Up the Page in Dreamweaver
- HTML Setup
- Creating a new page
- Inserting the table based on the Fireworks layout
- Saving the page
- CSS Setup
- Creating the CSS file
- Attaching the CSS to our HTML page
- Insert CSS styles
- Applying the CSS to our page elements
- Building the Navigation in Fireworks
- Left Navigation
- Create left sidebar base gradient
- Determine buttons
- Prepare the background image
- Create a button
- Test button effects
- Duplicate buttons
- Export Images for Dreamweaver
- Copy left nav to new file
- Export the images
- Insert Fireworks HTML into Dreamweaver
- Build the Dreamweaver Template
- Left Navigation Review / Completion
- Separate Fireworks file for easy update
- Inserted Fireworks HTML (table/buttons/JS code)
- Set the main body widths (leftnav and body)
- Create Dreamweaver Template
- Save as .dwt file
- Explain Editable vs. Non-Editable Regions
- Determine template regions
- Insert editable regions
- Create HTML page based on template to see working example
- Create Header Graphic in Fireworks
- Prepare our Images
- Insert photos for use
- Access header area of design
- Clip the background from image
- Add blending, gradient and background imagery
- Update Header Graphic for Dreamweaver
- Reconfigure header image with website border
- Export header graphic
- View changes in Template
- Verify changes in HTML Pages
- Using CSS in Dreamweaver
- Main Text Styles
- Using Styles applied to Tags
- Insert CSS for main text, H1, H2 tags
- Test styles
- SideBar Styles
- Using Styles applied to Classes
- Insert CSS for left sidebar table
- Test styles
- Footer Styles
- Using Styles applied to Ids
- Insert CSS for footer
- Test styles
- Create HTML Pages
- Create HTML Page based
- Create page using template
- Create page from existing pages
- Naming conventions
- Update Navigation Links
- Create navigation links in Dreamweaver Template
- Update HTML pages
- Test links
- Creating Page Specific Sidebar Content
- Considerations
- Using the SideBar editable region
- Adding links
- Building a Custom Homepage
- Preparing Images in Fireworks
- Building a unique homepage layout
- Guiding our website visitor
- Using techniques we’ve learned
- Slicing the images
- Exporting for Dreamweaver
- Inserting Images with Dreamweaver
- Insert photos
- Adding text
- Controlling our text with CSS
- Adding Links
- Left Navigation Corrections
- Fixing our layout dimension issues
- Learning how to bounce back from miscalculations
- Creating Images for HTML Pages
- Preparing Images in Fireworks
- Considering size
- Deciding on a style
- Optimizing images for the web
- Exporting images to Dreamweaver
- Inserting Images into Webpages
- Insert photos
- Setting your padding
- Using alignment
- Creating a Simple Logo in Fireworks
- Creating a Simple Logo
- Create a appealing shape
- Using colors, gradients and drop shadows
- Adding Gradients
- Using Drop Shadows
- Stylizing Text
- Adding Text
- Adding colors, gradients and drop shadows
- Exporting into Dreamweaver
- Export header/logo for Dreamweaver
- Creating a stand alone logo for use on websites
- Create SEF Pages
- Create Search Engine Friendly Pages
- Organizing your content
- Updating the Title tag
- Adding H1, H2 tags
- Modifying Meta Content (keywords, description)
- Writing keyword rich copy
- Create keyword links
- Using Alt tags with your images
- Submit Your Website
- Check out our “MUST DO” links to get your site found in the web on the SiteBuilder Members page
- Publish and Modify Live Website
- Publish Website Using Dreamweaver
- Publishing (Putting) our content in Dreamweaver
- Consider SFTP
- Don’t publish your source files
- Modifying Your Live Website
- How to make updates to html pages
- How to publish our changes to the web
- Verify our changes
If there is anything you want to see that I haven't covered in the list please send me a note!
During this video I will be pointing out ways to save time, save money and build high quality, fast loading sites that will make your momma (and clients) proud!
You're gonna love this!!! I promise.
The 16 videos are Available for Download NOW!
Your order will be processed within 24 hours, then you will receive an email for download.
These videos are VERY LARGE and are available on DVD.
|
|
|
Testimonials
|
"In the Web Design Course, you certainly come over convincingly as one who knows a whole load about Dreamweaver and Fireworks, far more than I. You are also clearly able to use these 2 tools to produce some impressive and very desirable web design results." -Robert D.
"The product is BRILLIANT!! The
course is so thorough but easy to follow, it is suitable even for
people with limited knowledge of Dreamweaver, like me. I have learned
so much and I cannot recommend the tutorial highly enough. I have tried
many courses, but this one is by
far the best." - Yvonne C
"Dear Scott,
I was about to enrol on a course in the UK for Dreamweaver 8. The
course, 3 days non-residential, thus accommodation needed to be
organised, cost £695 + VAT. In addition the course was to be held in
London where things generally cost more.
The following day I saw your course for Web Design advertised in the
'net and so with some trepidation I decided to give it a go! I've just
done in a couple of hours my first design. I have my own site, it was
made on a programme from my webhost, pretty soon however, my web site
will be one done following your instructions and web design course." - Barry Dawson, United Kingdom
"Just wanted to let you know that your Web Design Course is exactly what I needed! I've only watched 5 of the courses so far, but they have been EXTREMELY helpful. I'm fairly tech savvy, but I don't have the time to learn all the ins and outs of dreamweaver and fireworks. This walkthrough helps me understand the basics of website design and gives me the confidence to use my software to create sites of my own. Thanks!!" - Brett, www.ccceugene.com
These are just some of the comments that we have recieved on the Step-by-Step Web Design Course for Dreamweaver and Fireworks that has just been released. When you take the course, we want to hear from you! We will be releasing new videos and updating previous video tutorials based on the feedback we hear from our students.
Please send us your Web Design Course feedback
|
|
|
|
|
|
|
