Home / Articles / Adobe Dreamweaver / Web Design Basics for Adobe Dreamweaver CC

Web Design Basics for Adobe Dreamweaver CC

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. In this chapter from Adobe Dreamweaver CC Classroom in a Book (2014 release), James J. Maivald covers the basics of webpage design, how to create page thumbnails and wireframes, and how to use Photoshop to generate site image assets automatically.


For the purposes of this book, you’ll be working to develop a website for Meridien GreenStart, a fictitious community-based organization dedicated to green investment and action. This website will offer a variety of products and services and require a broad range of webpage types, including dynamic pages using technologies like jQuery, which is a form of JavaScript.

Your customers come from a wide demographic that includes all ages and education levels. They are people who are concerned about environmental conditions and who are dedicated to conservation, recycling, and the reuse of natural and human resources.

Your marketing research indicates that most of your customers use desktop computers or laptops, connecting via high-speed Internet services. You can expect to get 20 to 30 percent of your visitors exclusively via cell phone and other mobile devices, and much of the rest will be using mobile from time to time.

To simplify the process of learning Dreamweaver, we’ll focus on creating a fixed-width site design first. In Lesson 6, “Designing for Mobile Devices,” you’ll learn how to adapt your fixed-width design to work with smartphones and tablets.

3. Working with thumbnails and wireframes | Next Section Previous Section