Adobe Dreamweaver CS6

Adobe ACA Approved Courseware - prep for the Adobe Certified Associate Exam in Web Communication with Adobe Dreamweaver
3.8 (2 ratings)
Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
53 students enrolled
Instructed by Peachpit Press Design / Design Tools
$50
Take This Course
  • Lectures 122
  • Length 13 hours
  • Skill Level All Levels
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 4/2013 English

Course Description

This critically acclaimed product from Adobe Press and video2brain combines exceptional quality HD video and a printed reference to teach the fundamentals of Dreamweaver CS6 as well as the basic principles of web design. Structured around the objectives of the Adobe Certified Associate exam 'Web Communication Using Adobe Dreamweaver CS6', the product includes 13 hours of video, complete with lesson files. Experienced instructor David Powers shows you how to build modern, standards-compliant websites using Dreamweaver CS6. David starts with a quick overview of what Dreamweaver is used for, then goes into the nuts and bolts of HTML: the language that governs the appearance of web pages, and how web pages are assembled and connected to create an entire web site. He shows you how to add text to a page, then to add images and hyperlinks. To add visual sophistication to the design, David introduces Cascading Style Sheets (CSS) and shows how to add special effects to objects, like rounded corners and drop shadows. Further topics include multimedia (video, audio, and Flash), tables, forms, and managing large sites with many pages. Finally, David shows how to use Media Queries to make your site look good on any screen, from a desktop to a tiny mobile device.

Steps for Certification:

1. Register with Certiport to take the Web Communication with Adobe Dreamweaver Adobe Certified Associate  exam. This exam is typically offered multiple times a year. To sign up to take the exam go to the Certiport test-locator website: http://www.certiport.com/Locator 

2. At the Certiport test-locator website, enter your location, select the type of Program (Adobe Certified Associate), select the version (CS6) and select the exam (Web Communication with Adobe Dreamweaver). Click Search. A list of nearby test centers will appear, and you will have to either call the center or show up in person to register to take the exam.



3.  Study the required material to pass the Web Communication with Adobe Dreamweaver Adobe Certified Associate exam. This Adobe Dreamweaver CS6 course teaches you the concepts and skills covered in the Web Communication with Adobe Dreamweaver Certified Associate exam, and will help put you in a great position to succeed in the exam. (Note: While this course is comprehensive in regards to covering material on the exam, we do recommend using other aids to guide your study.)

4.  Pass your exam!

5.  Wait for your certificate to arrive, and use your new credentials to spruce up your resume and improve your future prospects.

What are the requirements?

  • Adobe Dreamweaver CS6

What am I going to get from this course?

  • To introduce users to the features and tools in Adobe Dreamweaver CS6
  • To teach viewers how to create beautiful, functional websites in Dreamweaver

What is the target audience?

  • People who want to make websites using Dreamweaver CS6

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Introducing Dreamweaver CS6
06:24
Dreamweaver is a one-stop shop for creating websites with support for a wide range of Web-related technologies. This video gives a brief overview of the program's capabilities.
03:24
This video explains how this course is organized, what you can expect to achieve, and how to find the course assets.
06:28
In this lesson you'll get a quick overview of the new features in Dreamweaver CS6, including the Web Fonts Manager, the CSS Transitions panel, fluid grid layouts, and more.
Section 2: Web Basics
06:15
Web pages are built using HTML to control the structure and content, and CSS to style the HTML elements. This lesson looks at a typical web page and gives a broad overview of the factors you need to take into account when building a page, such as overall file size.
04:16
Choosing good names for files, folders, and attributes such as IDs and classes makes sites easier to navigate and maintain. This video will demonstrate why this is necessary and how to do it.
08:49
The doctype tells the browser which version of HTML you're using. It's also used by Dreamweaver to insert the correct markup in your web pages. In this video, you'll learn how to change the default doctype and convert pages from one doctype to another.
05:12
Planning a website involves considering who it's for and why it's being built. The design needs to be appropriate to the site's purpose and flexible enough to be displayed on a variety of devices, as will be discussed in this video.
07:51
This lesson explores issues related to copyright. Web designers should have a clear understanding of copyright and the need to obtain permission before using copyrighted material. Copyright also protects your own assets, such as text, images, and videos.
08:52
In most countries, making your websites accessible to people with disabilities is a legal obligation. It also makes a lot of business sense. This lesson outlines accessibility-related factors you should bear in mind when designing a site.
Section 3: Dreamweaver Basics
05:57
In this video we'll explore the Dreamweaver Welcome screen, which provides a set of quick shortcuts to create new documents, open recent ones, and access resources on the Adobe website.
05:41
Dreamweaver is a site-based application where you create and maintain a copy of your live website on your local computer. In this lesson you'll learn how to define a site in Dreamweaver.
07:44
The Document window is where you will do most of your work in Dreamweaver. In this lesson, you'll learn how to view web pages in Design, Code, and Split views. You'll also see how to work with related documents using the Related Files toolbar.
07:12
An embedded version of the WebKit browser engine in the Document window powers Live view, CSS Inspect, and Live Code view. These give you insight into how your web page will look and work in a browser, as you'll see in this video.
07:37
The Property Inspector is one of the most important panels in Dreamweaver. It provides context-sensitive access to the most commonly used HTML attributes. However, you need to exercise care when using it with text, as you'll see in this lesson.
09:39
Dreamweaver's workspace is highly configurable. In this video we will explore the many options and create a workspace that will be used in the rest of the course.
07:06
Not all toolbars and panels are displayed by default. This lesson shows you how to enable other toolbars and panels that you may want to use and describes some useful options in the Coding toolbar.
05:14
Dreamweaver's defaults are fine for most people, but there are some preferences you may want to change to suit your way of working. This video highlights some of the most useful ones, including changing the font size in Code view.
04:03
The Windows and Mac versions of Dreamweaver are virtually identical, but there are a few key differences in the Mac version, as you'll see in this video.
Section 4: Getting a Quick Start with a Predefined Layout
07:00
This lesson looks at Dreamweaver's predefined layouts – there are 18 layouts that can give you a quick start in creating a web page with one, two, or three columns. You can also choose between a fixed page width or a fluid layout that expands and contracts depending on the size of the browser window.
09:57
In this lesson, you'll learn how to replace the default content of a predefined layout, add a logo image, create new links, and add a copyright notice.
07:24
By default, images sit on the same line as text. To flow text around an image, you need to "float" it left or right. The predefined layouts provide the necessary style rules to improve the layout of images, as you'll see in this video.
09:41
To give a predefined layout some individual character, you need to change the CSS color scheme using the Page Properties dialog box and CSS Styles panel. This lesson will show you how.
04:43
It's important to move the style rules from the head of the web page to an external style sheet before creating more pages. This makes your site more efficient and easier to maintain, as this lesson demonstrates.
04:43
In this lesson you'll learn a useful shortcut for creating a website from a single page. After making changes to one of the predefined layouts, you can quickly create a site by making copies of the first page and replacing the content.
Section 5: Working with Text
08:32
When you type text directly in Design view, Dreamweaver automatically creates paragraph tags to add structure to your document. Even if you don't want to work directly with the HTML markup, you may want to watch this video so you understand the code that's generated.
07:16
Lists of bullet points are known as unordered lists in HTML, and lists of numbered items are called ordered lists. Dreamweaver makes it easy to create both types and even convert between the two, as you'll see in this video. You'll also learn how to nest lists and how to control the style and start number of an ordered list.
04:43
This lesson looks at definition lists, which are ideal for adding a glossary or list of terms with brief definitions to your website.
07:22
When you copy and paste from Microsoft Word documents, Dreamweaver's Paste Special option preserves as much or as little of the formatting as you want. In the Windows version of Dreamweaver, you can also import directly from a Word document without having to open it.
07:34
Browsers use HTML and numeric entities to display characters and symbols that can't be inserted from a normal keyboard. This lesson explains how to insert them in Dreamweaver and discusses the best approach for inserting accented characters, such as those used in many European languages.
04:10
Blockquote is one of the most misused elements in HTML. This lesson explains what it's really intended to be used for.
Section 6: Adding Style and Structure with CSS
08:24
This lesson offers a high-level overview of CSS, its advantages, and how style rules are structured.
05:58
CSS supports six different color formats in addition to color keywords. This video explains each format and its uses.
02:13
In this video you'll see how to set up for the case study that runs through many of the remaining lessons in this course.
07:41
The Page Properties dialog box offers a simple approach to setting some very basic styles for fonts and text colors, as you'll see in this video.
08:33
This lesson looks at div tags, which group together HTML elements to give a web page its structure. Assigning an ID to a div tag allows you to create style rules that affect all elements inside the div.
08:37
Each HTML element can have an individual background color or image, or both. Adding background colors to different parts of the page can greatly improve readability, as this video demonstrates.
08:19
The CSS box model controls vertical and horizontal space around elements, and it also affects how width and height are calculated. This lesson explains how it works.
09:05
Adding vertical and horizontal space around elements improves readability. This lesson shows you how to create a responsive web design using percentages that will adjust the layout depending on the size of the browser window.
06:51
Floating elements is one of the most important layout techniques in current web design. However, it sometimes has unexpected consequences, as you'll see in this video.
09:17
This lesson shows you how to apply existing styles to a new web page by wrapping elements in div tags and selecting the appropriate ID from the list in the New CSS Rule dialog box. You'll also learn how to temporarily disable a style.
Section 7: Diving Deeper into CSS
07:46
Knowing which selectors to use is an important skill in CSS. This lesson provides an overview of the most widely used and useful selectors.
03:53
Specificity determines which style rule takes precedence in case of a conflict. It's a concept that can be difficult to understand, but is essential when troubleshooting problems with CSS. This video explains what you need to know.
07:24
The CSS Styles panel is one of the most powerful features in Dreamweaver. This video describes the many functions of the panel in All mode.
05:28
This video looks at the CSS Styles panel's Current mode. In this mode, the CSS Styles panel offers a powerful insight into the properties that affect the current selection through the CSS cascade.
05:11
In this lesson you'll learn about the Code Navigator, which is a useful tool for inspecting styles in context. It displays the cascade of rules that apply to the current selection and provides a direct link to the style definition in your style sheet.
07:45
CSS supports the concepts of absolute, fixed, and relative positioning. This video explains the differences and demonstrates how they work.
08:41
The idea of using absolute positioning for page layout sounds attractive, but is full of pitfalls, as this lesson will explain.
05:51
Using relative positioning to create a containing block avoids a common problem with absolutely positioned elements. In this lesson, you'll learn how to add a splash banner across the corner of another image.
Section 8: Working with Images
06:49
Images can be stored in many formats, but not all are suitable for use on web pages. This video offers advice on choosing the right format and other considerations that need to be taken into account when preparing images for the Web.
06:02
This lesson offers some tips for organizing your images, such as specifying a default image folder and using the Assets panel to copy images from one site to another.
07:05
In this video you'll see how to add images to your site and create CSS classes to make them look good. You'll also learn how to add alternate text, which is important for accessibility purposes.
08:26
Occasionally, it's necessary to use the HTML width and height attributes to make images smaller, such as when you plan to use CSS to scale them to full size on hover. This lesson explains how the Property Inspector maintains the image's aspect ratio and other options.
08:30
The California case study uses percentage widths to respond to different screen resolutions. In this video, you'll learn how to make the images resize in proportion to the amount of available space.
06:28
In this video you'll see how easy it is to add a caption to an image if the image is wrapped in a container element, such as a div. You'll also learn how to style the caption using the Targeted Rule option in the Property Inspector in CSS mode.
07:37
Dreamweaver has a range of image editing options that can be accessed directly from the Document window. However, they make permanent changes to your files, so they should be used with caution. This lesson will tell you what you need to know.
05:54
In this lesson you'll learn how to create an image directly from a PSD file as a Photoshop Smart Object, which maintains a dynamic link to the original. Whenever changes are made to the original PSD, Dreamweaver gives you the option to update the image in your web page and keep it in sync with the PSD.
04:25
Associating an image with a Fireworks PNG file enables round-trip editing between Dreamweaver and Fireworks. The setup process is simple, albeit slightly counterintuitive, as this lesson explains.
Section 9: Using Text and Images as Links
05:31
Links can be absolute, document-relative, or relative to the site root. This video explains the differences and offers advice on which type to use.
06:22
Internal links are important not only so visitors can find the information they're looking for on your website, but also because they're used by search engines to index sites. Good internal links can help increase your site's ranking.
06:45
When creating external links, it's important to remember to use an absolute URL; otherwise, the browser treats the link as internal. This lesson also discusses the controversial target attribute for links.
06:47
You can link to a specific point in a page by creating a named anchor or assigning an ID to the element you want to link to. The name or ID is appended to the end of the URL as a URL fragment, as you'll see in this lesson.
05:51
In this lesson you'll learn how to link to a non-web file. This is the same as linking to a web page, but you should warn visitors what to expect when they click the link, and it's a good idea to open large files in a separate tab or window.
03:16
An email link is designed to launch the default email program and insert an email address in the To field. But it's a far from optimal solution for gathering user feedback, as you'll see in this video.
06:52
In this video, you'll learn how to use an image as a link. You'll also learn how to center an image and remove the border that some browsers wrap around image links.
10:40
Dreamweaver's hotspot tools let you turn individual sections of an image into links. We'll use a real map in this lesson, but you can use any image to create an image map.
06:55
In this lesson you'll learn how to use the link and user action pseudo-classes to apply styles to links in various interactive states. The style definitions must be in the correct order to work as expected.
03:28
Using a CSS attribute selector, you can automatically add a background image to external links indicating that following the link will take the user to another website. This video explains how and why
09:31
This video takes you step by step through the process of converting an unordered list into a navigation bar.
Section 10: Adding Special Effects with CSS3
07:11
This lesson looks at the CSS3 border-radius property, which lets you quickly and easily add rounded borders to HTML elements.
08:23
The CSS3 box-shadow property adds drop and inset shadows to HTML elements, as you'll see in this video.
06:16
For cross-browser compatibility, web fonts need to be stored in several different formats. Fortunately, as you'll see in this lesson, Dreamweaver's new Web Fonts Manager makes installing and using web fonts a breeze.
05:22
In this lesson, you'll learn how to create a custom font stack using a web font installed with the Web Fonts Manager. When you use the font stack, Dreamweaver automatically imports the font files into your site and creates an @font-face rule.
04:51
In this video you'll see how the CSS3 text-shadow property can be used to add a subtle shadow to text. When multiple shadows are applied, you can create interesting text effects without having to use images.
07:49
CSS3 transformations add variety to page layout by scaling, rotating, and skewing elements. In this lesson, you'll learn how to rotate images so they look more like photos scattered on the page.
03:34
This lesson looks at CSS transitions, which are simple animations that create smooth transitions from one state to another, such as when you hover over an element, without requiring the use of JavaScript.
05:43
The new CSS Transitions panel in Dreamweaver CS6 simplifies the process of applying a transition from one state to another. In this video, you'll learn how to rotate and scale images smoothly on hover.
09:06
This lesson looks at the transform-origin property, which controls the point from which a transform is executed, giving you greater control over how images are rotated and scaled. You'll also learn how to use relative positioning to prevent images from dropping behind other elements when scaled.
04:48
It's important to check your designs in older browsers to make sure that the content remains accessible, even if the design isn't as elegant as in the latest versions. In this lesson, you'll learn how to fix two specific problems that you may encounter with Internet Explorer 6.
Section 11: Multimedia
09:11
The focus of Flash has changed in recent years, but you may still want to add a Flash movie to your site, and is this video you'll see how.
01:38
By default, Windows hides most filename extensions, which makes it difficult to see which format a video is stored in. In this video you'll see how to turn on filename extensions.
08:32
The new HTML5 video tag plays video in a browser without the need for a plug-in. Inserting the necessary code is quite simple, but you need to provide the video in multiple formats for cross-browser compatibility, as this lesson explains.
06:10
In this video you'll see how to add HTML5 audio to a web page, which is very similar to adding HTML5 video. For cross-browser compatibility, you should provide the audio file in at least two formats.
03:02
Even if your HTML5 video and audio work locally, your remote web server needs to be properly configured to serve the files correctly. This lesson explains how to troubleshoot problems.
Section 12: Using Tables for Structured Data
09:38
In this video you'll see how to insert a table into a web page using Dreamweaver CS6.
04:59
After inserting a table in a web page, you can insert or delete rows and columns using options in the Property Inspector or by right-clicking and choosing options from the context menu. This lesson demonstrates both methods.
04:20
In this lesson, you'll learn how to split and merge table cells. The underlying HTML markup can be quite complex, but Dreamweaver handles everything seamlessly through the Property Inspector.
05:57
In this video you'll see how Dreamweaver can import data from an external file and generate an HTML table automatically.
07:42
With a handful of CSS styles, you can turn a bland table into something far more attractive and readable. This video will show you just how easy it is.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Peachpit Press, Books, eBooks and Videos for Creative People

 Peachpit.com produces top-notch videos, books and ebooks on the latest in graphic design, Web design and development, digital photography, multimedia, video, and general computing. Our award-winning products are authored by the creative industry's top professionals and feature step-by-step explanations, timesaving techniques, savvy insider tips, and expert advice. Peachpit is the home of Peachpit Press, Adobe Press, Apple Certified and New Riders and is the publishing partner for The National Association of Photoshop Professionals (NAPP), and others.

Ready to start learning?
Take This Course