Get Started withWeb Design Training
Mobile Web Design for the iPhone, iPad, and other DevicesIntroducing: The Art of Mobile Design
Mobile Trends: One Screen to Rule them All: How the iPad turns three screens into one.
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 Design Books
& Training Videos
Design Books
Dreamweaver Tips & Tutorials
Get Started with the New Site SetUp Process in Dreamweaver CS5
10 Quick Reasons to upgrade to Adobe Dreamweaver CS5
Use 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
Why 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
Create a Navigation Bar with an Unordered List and CSS
Where to learn advanced CSS tricks
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
Use Swap Image Behavior to Create Multiple Rollovers
Add a Shopping Cart and Traffic Counter 
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
Templates 101: Using templates in blogs and web sites
WordPress, 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
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?
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
Use Social Media & SEO for PromotionGoogle+ 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
Review: Compare the feature of popular image editing programs
Creating and Optimizing images with Adobe Photoshop Save for Web
- Choose the best format for your image: JPEG, PNG, or GIF
- Change image resolution and resize graphics before optimize
- Optimize JPEGs with Photoshop's Save for Web feature
- Optimize GIF and PNG files with Photoshop's Save for Web feature
How to create and edit images with Adobe Photoshop Elements
MicrosoftExpression Web
Learn how to use Microsoft Expression WebI 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:
- Templates: If you have a book and you're looking for templates or images, click here to enter the Readers Corner
- Dreamweaver Tutorials: You'll find free, step-by-step tutorials in the Dreamweaver Center.
- Email: Still can't find the answer? Email Janine@DigitalFamily.com.
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...
_______
Upgrade with these special deals
_______
Test your XHTML MP (Mobile Profile) skills
XHTML MP is mostly what you already know about XHTML, plus a few special tags for mobile, like 'tel' for phone numbers. Most people surfing the web on a mobile device do have access to a phone so that's a nice addition.
But XHTML is strict, and mistakes in a mobile Web site are especially bad because mobile browser can't handle mistakes as well as the ones we use on desktop computers.
Here's an example of some badly written code in a seemingly simple XHTML MP page. Can you find the mistakes?
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN"
"http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml">
<meta name="HandheldFriendly" content="True" />
<head><title>Fun and Games</title>
</head>
<body>
<h1>Play this Way<H1>
<p>I love playing games<br>
Sometimes it's <em>really<strong>fun</em></strong>
<caption>My Favorite Games
<UL>
<li>The chocolate game at <a href=" http://chocolategamerules.com/>ChocolateGameRules.com</a>
<li> <a href=" http://www.digitalfamily.com">Visit Digital Family.com</a>
</ul>
</body>
</html>
Did you find all the mistakes in this XHTML MP document? Check your answers with the following:
- The close heading tag </h1> should not be uppercase.
- There is no close </p> tag to complete the open <p> tag.
- The break tag should include a close tag within the break tag, like this: <br />.
- The <em> and <strong> tags are not nested properly.
- There is no close </caption> tag.
- The <ul> tag, like all tags, should not be capitalized.
- The <li> tags must include close </li> tags in XHTML.
- In the link to the Chocolate Game Rules site, the end of the URL is missing its quotation mark. See the link just after that link, with the text: Play the puzzle games at Digital Family for the correct use of quotes.
Note: The doctype and other info at the top of the document is correct.
More Fun with Mobile Web Design
Seven Mobile Web Design Tips To Get You Started
How HTML5 will impact web design
Advanced CSS 3: How to use any font to format text on the mobile Web
What do you cover in Mobile Web Design For Dummies?
Mobile Web Design For Dummies is about designing for the broad mobile audience and making sure your site works well even on limited mobile devices such as the Motorolla Razr. I’m now writing a book called iPhone/iPad Web Design For Dummies and with this book, I'm taking a giant leap forward into the future with lots of coverage of how to develop designs with HTML5 and CSS 3.
Order any of our books in the bookstore