DMA Central

THE OFFICIAL COMMUNITY FOR DIGITAL MEDIA ACADEMY

A Closer Look at Adobe Dreamweaver

Hello! I’m Ben Jaffe, one of the instructors for Digital Media Academy’s Adventures Program. I want to give you a closer look at Adobe Dreamweaver CS4. We use Dreamweaver for creating the web site layout in our Adventures Web Design class.

Dreamweaver is what we call a “WYSIWYG Editor” (stands for “What You See is What You Get”). This means we get to see our design as we create it. Before tools like Dreamweaver, we had to write HTML markup to create web sites, and didn’t get to manipulate it graphically. Here’s the Design view in Dreamweaver:

dreamweaver-design-view

The Properties bar (across the bottom) is where we set up links, text styles, bold, italics, and change the sizes of items like images and tables. The panes on the right are for managing files, uploading to our website, and managing the CSS. When we edit in Design View, Dreamweaver is actually writing the HTML code for us.

At the very beginning of the class, we teach the kids some basic HTML. We actually build a simple webpage, coding it by hand! This helps the students understand what is going on behind the scenes, and how to fix things manually if anything goes wrong. It’s good to be able to look at the code to see what’s really going on. This is Dreamweaver’s Code View:

dreamweaver-code-view

That HTML code is what our computers actually download when we are browsing the web. They read the code, and render out a graphical page for us to read.

After covering HTML, we talk about site design, then start on our own websites. As we create graphics in Photoshop, we integrate them into our sites. We also create a Flash animation, and add that to our site. Some students might even build a Flash animation to use as the header. (The header is the bar across the top of the page, with the website’s title).

After we build our site, integrate our graphics, and add our Flash animation, it’s time to test our sites and upload them to the internet. We test the links on our pages to be sure they all work, and upload their web pages to DMA’s web space, for friends and family to see.

dreamweaver-preview-in-safari

After this course, your child will know how to use Photoshop, how to make simple animations in Flash, and how to put it all together into a web site. At the end of the class, the students go home with a web address for their website, and a DVD with all of the original files they used to make their content. This means that if they get access to the software (perhaps through their school), they can continue work on their web site!

I hope to see you this summer!
-Ben Jaffe

[Bloglines] [del.icio.us] [Digg] [Facebook] [Furl] [Google] [LinkedIn] [Mixx] [MySpace] [Newsvine] [Propeller] [Reddit] [Squidoo] [StumbleUpon] [Twitter] [Email]
posted by Ben in News Blog and have Comment (1)

One Response to “A Closer Look at Adobe Dreamweaver”

  1. [...] Ben added an interesting post on A Closer Look at Adobe Dreamweaver » Computer Camps + Technology …Here’s a small excerptLara added an interesting post today on Technology at… Topics about Technology » Technology at the forefront of Life Long Learning » Computer Camps … [...] Ben created an interesting post today on Adventures: Game. … [...]

Place your comment

Please fill your data and comment below.
Name
Email
Website
Your comment