Dreamweaver tutorialsGet Started with
Web Design Training

Discover how to create a Web site.

Janine WarnerLearn Adobe Dreamweaver

Learn Microsoft Expression Web

Plan your site

About Author Janine Warner

Dreamweaver FAQ Blog: Find answers fast

 

Web Sites For Dummies cover Mobile Web Design for the iPhone, iPad, and other Devices

Introducing: The Art of Mobile Design

Mobile Trends: One Screen to Rule them All: How the iPad turns three screens into one.

To App or Not to App? Comparison table shows when it's best to create a Native App, Web App, or mobile web site.

Design Tutorial: Mobile Web Design Tips.

Mobile Blogging: Mobile WordPress themes convert blogs for the iPhone and other mobile devices.

Code Hints: How HTML5 and CSS 3 are Changing Web Design

 

Web Sites For Dummies coverWeb Design Books
& Training Videos

Training Videos

Mobile Web Design For Dummies Design Books

Already have one of our books?


You'll find templates, code samples & updates in the Readers Corner

 

Dreamweaver Dreamweaver
Tips & Tutorials

Dreamweaver Tutorials

Get started in the Dreamweaver Training Center

FAQ: Find Answers in the Dreamweaver FAQ Blog


Ask the Author: Visit the Digital Family Help Center to email Janine Warner and get in the.

 

Dreamweaver CS5 Tutorials

Get Started with the New Site SetUp Process in Dreamweaver CS5

10 Quick Reasons to upgrade to Adobe Dreamweaver CS5

Dreamweaver widgetsUse the Widget Browser to add slideshows, drop-down menus, and other features to Dreamweaver CS5

Use Adobe Dreamweaver CS5 to edit a WordPress blog post or theme

Editing CSS Layouts in Dreamweaver CS5

New CSS Features in Dreamweaver CS5 make it easier to test and design with Cascading Style Sheets

Test Your Web Pages in Adobe BrowserLab and other Web Browser Testing Services

New Language Support in Adobe Dreamweaver CS5: Spanish, Dutch, Russian, Turkish, and more...

Most of the tutorials in the sections below also apply to version CS4

 

Dreamweaver CS4 Tutorials

Getting Started with the Site Set Up Process (in CS4 and CS3)

Dreamweaver CS4 Interface Tips

New features in Dreamweaver CS4

 

Cascading Style Sheets: Designing with CSS

CSS DesignWhy use Cascading Style Sheets (CSS)?

CSS selectors in Dreamweaver CS4 / CS5: When to use Class, ID, Tag, or Compound selectors

CSS Selectors in Dreamweaver CS3: Class, Tag, and Advanced selectors

Customize a CSS Layout in Dreamweaver

Add Background Images with CSS

Align Images with CSS floats

Create a Navigation Bar with an Unordered List and CSS

Troubleshooting CSS

Where to learn advanced CSS tricks

 

Inserting Video/Audio/Flash

How to insert a Flash video in Dreamweaver .flv Video File

How to insert a Flash file .swf File

Insert Videos in Quicktime or MP4 formats in Dreamweaver

 

Intermediate Dreamweaver: Widgets, Extensions & Spry

Add new features with Dreamweaver Extensions and Widgets

Add the jQuery PowerSlider to create rotators and sliders in Dreamweaver

Add a Spry Drop-Down Menu in Dreamweaver

Edit a Drop-Down Menu created with Spry in Dreamweaver

Swap Image BehaviorUse Swap Image Behavior to Create Multiple Rollovers

Use a Behavior to Launch a New Browser Window

Create Collapsible Panels with Spry in Adobe Dreamweaver

View cartAdd a Shopping Cart and Traffic Counter

Google Checkout

Compare eCommerce Shopping Carts
(that don't cost much)

Add a shopping cart with Google Checkout - it's so easy

Add a PayPal Buy Button to sell one item, membership, or service

What's the best eCommerce option? Google Checkout vs PayPal vs. Amazon Payments

Traffic counters, email spam protection, newsletter services, favicons, and more

How to add or embed code from Google AdSense, Flickr, YouTube, and more using Dreamweaver

 

Time-Saving Templates for Dreamweaver & WordPress

California Wildlife Photography sample web siteTemplates 101: Using templates in blogs and web sites

Designing .dwt templates for Adobe Dreamweaver

Using Dreamweaver to edit WordPress themes and templates

Working with Templates in Joomla and WordPress

Local Web Server: How to set up a server on your computer to make WordPress themes work in Dreamweaver

 

WordPress blogsWordPress, Blogs,
& CMS's

Compare: What's the difference between a Web site and a blog?

WordPress 101: How do you create a WordPress blog?

Dreamweaver CS5 enhanced support for editing WordPress blog themes

How to edit a WordPress blog with Dreamweaver

Testing Server: Set up a Web server to run WordPress, Joomla, or any CMS with Dreamweaver

CMS and Dynamic Web Sites Explained: The advantages (and challenges) of a blog, content managment system (CMS), or other dynamic database-driven site

Blogging Programs: Which is best: WordPress, TypePad, or Blogger?

CMS Review: What's the difference between WordPress, Joomla and Drupal and how do Content Management Systems Work?

Technical Assistance: How to set up a server on your computer to make WordPress themes work in Dreamweaver

What is a CMS? Discover how blogs and other CMSs are like buying a prefab instead of building a house.

 

Test Your Site & Yourself

Test your Web site in Internet Explorer, Firefox, Safari, and other web browers

Dreamweaver Quiz: Test your Dreamweaver Savvy (fun to play)

Code Review: Can you find the errors in this XHTML Page?

Planning Tools: Develop a task list for your Web site before you start building

Which Adobe Creative Suite is Right for You? Compare the programs in each creative suite

 

Facebook iconUse Social Media & SEO for Promotion

Google+ get's a lot of 'buzz,' and a little easier to join

3 Quick Tips to Attract More Visitors to Your Web Site

Ten Tips to make your Dreamweaver site more Search Engine Friendly

Earn status in Social Networks

Facebook: Should you show your face on a Fan Page, Group, or Profile?

How to send email newsletters (without looking like a spammer)

Email Newsletter Services: Reviews and Comparison Table

Sign up for Janine's Social Media Tips email newsletter

 

XHTML & Code View

Do I have to learn HTML to create a web site?

Editing HTML Code in Dreamweaver

Connect an HTML Form to a Script in Dreamweaver (Dreamweaver CS3, CS4)

Inserting code from Google AdSense, Flickr, YouTube, and other sites in Dreamweaver

Code Review: Can you find the errors in this XHTML Page?

 

Optimizing Web Graphics

Review: Compare the feature of popular image editing programs

Creating and Optimizing images with Adobe Photoshop Save for Web

  1. Choose the best format for your image: JPEG, PNG, or GIF
  2. Change image resolution and resize graphics before optimize
  3. Optimize JPEGs with Photoshop's Save for Web feature
  4. Optimize GIF and PNG files with Photoshop's Save for Web feature

How to create and edit images with Adobe Photoshop Elements

 

Domain Names & Web Hosts

How to Register a Domain Name

Why registering multiple domain names makes you easier to find

Choosing the best Web Hosting Service to publish your site

 

Expression WebMicrosoft
Expression Web

Expression WebLearn how to use Microsoft Expression Web
(Not FrontPage)

Learn fast with Janine's training videos for Microsoft Expression Web

Digital Family Help Center

I answer a lot of questions by email, but you may find an answer more quickly on this Web site.

Here are a few answers common questions:

I get a lot of email and I can't promise to answer them all, but I do try.

Sometimes I surprise people and answer a question right away, but sometimes messages get caught in my spam filter or I'm super busy...


Dreamweaver CS5 Training Video

_______

Upgrade with these special deals

_______

www.1and1.com

Keep Frequently Used Items Handy in Dreamweaver

Ever wished you could keep all of your favorite Dreamweaver features in one convenient place? You can with the Favorites tab.

When you launch Dreamweaver, the Common tab is visible at the top of the Workspace. Click the arrow to the right of it, and you find a pull-down menu with several options, including Layout, Forms, and HTML. At the bottom of that list is the Favorites bar.

Select the Favorites bar and you can customize it with all your favorite objects with right-click ease. Use this as a convenient way to keep all your most-commonly-used features handy. You can even change it for special projects that require a series of steps or elements.

Split the View to See the HTML Code

If you like to switch back and forth between the HTML source code and the design view in Dreamweaver, you'll appreciate the option to split the window so that you can view the HTML source and the WYSIWYG design area at the same time. To split the window, choose View -->Code and Design or select the Show Code and Design Views button, located just under the Insert panel at the top of the work space.

Dreamweaver Video Tutorials

Watch free sampleDreamweaver video tutorials right now. Each video features a lesson on a popular Dreamweaver technique, such as creating rollover images or saving time with the Assets panel.