Home / Articles / Adobe Dreamweaver / Web Design Basics in Adobe Dreamweaver CC (2015 release)

Web Design Basics in Adobe Dreamweaver CC (2015 release)

Chapter Description

Whether you use thumbnails and wireframes, Photoshop, or just a vivid imagination, Dreamweaver can quickly turn your design concepts into complete, standards-based CSS layouts. Jim Maivald hits some web design basics in this chapter from Adobe Dreamweaver CC Classroom in a Book (2015 release).

This excerpt references lesson files, which are available with the purchased book.

Developing a new website

Before you begin any web design project for yourself or for a client, you need to answer three important questions:

  • What is the purpose of the website?
  • Who is the audience?
  • How do they get here?

What is the purpose of the website?

Will the website sell or support a product or service? Is your site for entertainment or games? Will you provide information or news? Will you need a shopping cart or database? Do you need to accept credit card payments or electronic transfers? Knowing the purpose of the website tells you what type of content you’ll be developing and working with and what types of technologies you’ll need to incorporate.

Who is the audience?

Is the audience adults, children, seniors, professionals, hobbyists, men, women, everyone? Knowing who your audience will be is vital to the overall design and functionality of your site. A site intended for children probably needs more animation, interactivity, and bright, engaging colors. Adults will want serious content and in-depth analysis. Seniors may need larger type and other accessibility enhancements.

A good first step is to check out the competition. Is there an existing website performing the same service or selling the same product? Are they successful? You don’t have to mimic others just because they’re doing the same thing. Look at Google and Yahoo—they perform the same basic service, but their site designs couldn’t be more different from one another.

How do they get here?

This sounds like an odd question when speaking of the Internet. But just as with a brick-and-mortar business, your online customers can come to you in a variety of ways. For example, are they accessing your site on a desktop computer, laptop, tablet, or cellphone? Are they using high-speed Internet, wireless, or dial-up service? What browser are they most likely to use, and what is the size and resolution of the display? These answers will tell you a lot about what kind of experience your customers will expect. Dial-up and cellphone users may not want to see a lot of graphics or video, whereas users with large flat-panel displays and high-speed connections may demand as much bang and sizzle as you can send at them.

So where do you get this information? Some you’ll have to get through painstaking research and demographic analysis. Some you’ll get from educated guesses based on your own tastes and understanding of your market. But a lot of it is actually available on the Internet itself. W3Schools, for one, keeps track of tons of statistics regarding access and usage, all updated regularly:

If you are redesigning an existing site, your web-hosting service itself may provide valuable statistics on historical traffic patterns and even the visitors themselves. If you host your own site, you can incorporate third-party tools, such as Google Analytics and Adobe Omniture, into your code to do the tracking for you for free or for a small fee.

04fig01a.jpg

Click to view larger image

Analytics provides comprehensive statistics on the visitors to your site. Google Analytics, pictured here, is a popular choice.

As of the fall of 2015, Windows still dominates the Internet (80 to 85 percent), with most users favoring Google Chrome (60 percent), followed by Firefox (21 percent), with various versions of Internet Explorer (7 percent) a distant third. The vast majority of browsers (99 percent) are set to a resolution higher than 1024 pixels by 768 pixels. If it weren’t for the rapid growth in usage of tablets and smartphones for accessing the Internet, these statistics would be great news for most web designers and developers. But designing a website that can look good and work effectively for both flat-panel displays and cellphones is a tall order.

2. Scenario | Next Section