Download Mapped App #016: Dreamweaver CC 2014

Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
T
his is the 110th “Adobe Classroom in a Book” volume
which we have carefully studied, including all 7 of them
for Dreamweaver (Dw). The first one for CS3: Dw 9.0 was
simple and incomplete. The second one (CS4: Dw 10.0) was
challenging where it didn’t need to be. When Jim Maivald took
over the Dw CIB series for CS5: Dw 11.0, the learning doors
flew wide open. We had some technical issues with the previous edition (Dw CC: 13.0). We’re not saying that something
was wrong with that edition. The challenge was with something
otherwise fabulous: Adobe keeps updating the app, with new
features. That’s what Creative Cloud (CC) apps are supposed to
do. Adobe has promised to make them better and better, every
few months. However, following lessons to the letter, in CIB, or
any other structured education, was made a little more difficult
by the frequent updates.
Why an Adobe Professional Needs This Book
We’ve been designing websites for twenty years. Our first client
was NBC News. That makes us web/mobile gurus, right?
Nothing could be further from the truth. The internet and
mobile devices are a huge technology, which we’ll never be able
to claim that we have mastered.
We are a couple Adobe Community Professionals (ACPs).
We run an Adobe/Apple Authorized Training Center which is
in partnership with the Virginia higher education system. We
do our best to study all 16 of the core desktop apps which come
with the full Adobe Creative Cloud subscription. That’s no
small effort, in itself.
We know many people who work in Dreamweaver who
know more about the app than us. Many have been using it
longer than we have. Adobe Dreamweaver goes back to the
days of Macromedia. While Macromedia’s Dw was focusing on
the needs of web developers, Adobe had beat Macromedia to
the market with a more designer oriented PageMill and when
Macromedia continued to gain marketshare, Adobe acquired
GoLive. The designers in us signed onto those two now defunct
Adobe products.
To set the stage, Adobe launched Muse CC, as a very
designer-oriented web design app, which we once were greatly
disappointed in, and now admire. Some of the Muse team
used to work on InDesign. Muse is a very different deal than
Dreamweaver. To do great in-depth web/mobile work, you have
m2media.com Home Page
to get under the hood with code. Muse isn’t in that business. It’s
all visual implementation.
However, to make it more interesting, if you want to do
world-class web development, you do not have to have Adobe
Dreamweaver to do it. This
is unlike how Adobe Photoshop is at the foundation of
pixel-based graphics, or Adobe
InDesign owns publishing, or
Adobe Illustrator has a grip on
vector graphics.
We’ve seen internet coders
operate huge corporate websites with no more software
than the free text editors that
Apple and Microsoft include
in their operating systems.
Those people have no need
for Dreamweaver. Yes, Dw has
huge tools for them, but, for
some (not all) of them, it’s not
their software of choice, even
though Dreamweaver has no
monster app competitors.
Why’s that important in
relationship to this book?
We want you to understand something. There’s a
certain kind of Dw user. That
means there’s a certain kind of
reader that this CIB reaches
out to. Since you can subscribe
to the monthly Adobe CC
deals and get all those 16 core
desktop apps, and a whole
bunch more, there are longrange users of other CC apps
who now want to get on board
with Dw. They might also be
coming to Dreamweaver CC
after working with Muse CC.
m2media.com Online Learning
© 1993-2015 M2 Media Studios, Inc.
A little over a year ago, Adobe changed-up Adobe Flash
Professional, once again, and jumped into HTML Canvas.
That too opened the door, in a small way, to Dw. Adobe also
introduced a rag-tag group of little “Edge” apps, not all of which
Next Page
1
Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
(well… hardly any of which) have really garnered much love
from the CC subscribers. In fact, Adobe discontinued work on
one of them, so far. Nevertheless, it’s the job of this book’s publisher, Adobe Press, part of the Peachpit Press family, to touch
on what some users may need to know.
Does this mean that Adobe Press is in the business of
promoting Adobe apps, through these books? We have heard
those allegations before. What CIBs do well is prepare readers
for getting their certification in Adobe apps. Doing that requires
you to know a few things about other Adobe apps. Hence, we
have spotted traces of Adobe Edge Animate in this book. But,
that doesn’t mean it’s in here to promote it.
Our Disclaimers
The author of this book is no stranger to us. Many well-known
authors, instructors, and presenters for creative professionals are
buddies of ours. We cross paths with this book’s author. Like
many of our fellow ACPs, we interact with plenty of people at
Adobe, chat it up on our websites and social media venues, etc.,
etc. That said, when it comes to speaking our minds on educational materials, some of these “buddies” of ours need to run for
cover when we speak our minds on their work.
Another disclaimer is that there are 3 big publishers of
books for creative professionals. With three books of our own
and making annual contributions to the books of others, we
work with all those publishers. Pearson Educational, which
owns Peachpit Press, asked us to do some technical editing on
this book, and, we were too busy to accept the offer.
Though we hear about restaurants or hotels paying people
to write reviews about their businesses, without ever having
been there, none of those three publishers have ever paid us, or
anyone we know, a penny to write a review, especially since some
of our reviews can be very direct.
Chapter 1 - Customizing Your Workspace
Let’s get started. For a web design newbie, this might be the
most important chapter in the book. If you’re used to any of the
CC apps like Illustrator (Ai), InDesign (Id), Muse (Mu), and/or
Photoshop (Ps), you have gotten comfortable with the UI (user
m2media.com Home Page
interface). When you first open Dreamweaver, it’s okay to think,
“Huh?” Dw not only fails to resemble those other CC apps, it
doesn’t even look like it’s something from this century. We and
many of our technology friends have battered the Dreamweaver
team about that, over and over again.
This chapter breezes right passed that and gets down to
work with the usual Design View/Code View and the sometimes popular Split View, plus the now pumped-up Live View
(slow down to study the latter). The book smoothly guides you
through this before getting into how the usual CC panels work.
If you have been around Dw, before, put on the brakes at
page 26. This is where it goes into the new Extract panel. This is
where you bring in content from Photoshop, a cool panel which
Adobe teams will surely expand upon to create a cohesive experience over a few CC apps.
If your brain starts to feel a little boggled, you might want
to take a break before going on to the Property Inspector panel
on page 30. From this point forward, some more of HTML and
CSS starts to crawl in. You need to know this, but clear your
mind so you are clear on this.
Workspace Tour . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16-17
Switch + Split Views . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17-20
Design View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Code View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
Split View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18-19
Live View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
Live Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Inspect Mode . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Panels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21-24
Minimizing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21-22
Closing Panels + Panel Groups . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22-23
Floating . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Dragging . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Grouping, Stacking, Docking . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Select a Workspace Layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24-25
Extract . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Adjust Toolbars . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
m2media.com Online Learning
Previous Page
© 1993-2015 M2 Media Studios, Inc.
Personalize Preferences . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Create Custom Keyboard Shortcuts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28-29
Property Inspector . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
HTML Tab . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
CSS Tab . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Image Properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Table Properties . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Related Files Interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
Tag Selectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
CSS Designer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33-34
Element Quick View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Element View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
Explore, Experiment, Learn . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
Old hands at web projects and all things Adobe CC can finish this chapter in 20 or 30 minutes. Newbies should not rush
through this. You must understand every paragraph.
Chapter 2 - HTML Basics
There was a time when you could shelter the web designers
from HTML coding. As previously mentioned, Adobe created
Muse (Mu) from scratch. Doing the heavy-lifting of today’s
web/mobile design cannot happen without getting your hands
HTML dirty.
How complex can learning HTML be?
It one of those “acquired tastes.” There’s a difference between
understanding the coding basics and expecting someone to hand
code a website. Fear not, this book doesn’t expect you to build a
car, just know how to inflate the tires, check the oil, and be sure
there’s some gas in the tank.
This chapter does its best to be as gentle as possible with the
reader. It’s a mile-marker chapter. If you’re not HTML-tested,
you might want to set aside a couple hours for this. Nothing
about it is demanding. Take it slow. If you are someone who
feels a need to know every word on every page, you look at the
tags on page 56, and don’t understand half of it, it’s okay.
Should the chapter leave you feeling set back, take a break,
come back the next day. If it still seems daunting, rethink if Dw
is right for you. Ask yourself if Mu is a better possibility. But, we
Front Page
Next Page
2
Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
suggest you at least work through chapter 5 before you considering baling out.
If the first chapter made you think, “I can do all of this in
Design View,” please know that you might be able to get by that
way for a while. That’s primarily how we work. However, we
now touch up code a little everyday. 3 or 4 years ago we could go
a month without looking at Code View.
What’s HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
HTML Beginnings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40-41
Basic Code Structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41
Write Your Own Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42-50
HTML Syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42-43
Insert HTML Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43-44
Format Text w/HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44
Apply Inline Formatting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
Add Structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45-46
Write HTML in Dreamweaver . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47-51
Something Missing? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
Recommended Books on HTML4 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
Frequently Used HTML4 Codes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51-52
HTML Tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51-52
Character Entities . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53
HTML5 Overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53-47
What Happened to XHTML? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 54
What’s New in HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
HTML5 Tags . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55-56
Semantic Web Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57-58
New Techniques + Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
This chapter is also important in helping you to understand
what the Design View is doing when it’s generates the source
code for you.
Chapter 3 - CSS Basics
By the end of 1997, Macromedia launched Dreamweaver 1.0. It
was originally talked down by many as being too tied to coding.
Some claimed that boring websites came from Dreamweaver
since the program was so tied cascading style sheets (CSS). As
the underlying code of the internet developed, CSS was firmly
rooted in the best practices of most significant web presences.
m2media.com Home Page
We mention all of this because to some people who are not
well versed on web technology it would seem CSS3 is something
you might be able to skip. Some new InDesign (Id) users skip
paragraph styles and character styles, all the time.
Websites need to play nicely with web browsers. Using CSS is
both the best way to do that, while opening yourself up to a fabulously exciting array of powerful opportunities to make sweeping
changes to entire websites, the way Id does to huge documents.
Dw CIB uses all the best conventions for teaching CSS.
Then it goes a few steps further employing visuals and concepts which are better than most we’ve seen. It takes the reader
through an excellent explanation of what CSS is all about:
What’s CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62
HTML vs CSS Formatting . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63-64
HTML Defaults . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64-65
HTML 5 Defaults . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65-66
Browser-Website Relationships + Statistics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67
CSS Box Model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68-69
Previewing the Completed File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69-70
Formatting Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71-89
CSS Rule Syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
Cascade Theory . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73-76
Inheritance Theory . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76-79
Descendant Theory . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79-83
Classes and Ids . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81-82
Descendent Selectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82-83
Specificity Theory . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83
Calculating Specificity . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84
Code Navigator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84-87
CSS Designer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87-89
Multiples, Classes, IDs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89-92
Apply Formatting to Multiple Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90
CSS Shorthand . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 90-91
Create Class Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91
Create ID Attributes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91-92
Format Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92-110
Width . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92-97
Fixed Width . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93-94
m2media.com Online Learning
Previous Page
© 1993-2015 M2 Media Studios, Inc.
Relative Width . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94-95
Relative or Not . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95-97
Borders + Backgrounds . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97-101
Borders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97-98
Backgrounds . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98-101
Positioning . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102-104
Height . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105
Margins and Padding . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 105-107
Margins . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 106-107
Add Padding . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107-108
Normalization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 108-109
Final Touches . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 109-110
CSS3 Overview + Support . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 110-112
CSS3 Features and Effects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 111-112
Additional CSS Support . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112
Again, don’t allow this to discourage you if you are not
understanding every single item covered. By way of example, we
appreciate how the book starts taking you through the theories
of cascading, inheritance, descendance, and specificity. It’s well
explained with good examples, however, this slowed down some
newbies, in previous editions of this book. As you get more
and more used to Dreamweaver, when things don’t seem to be
working with your web pages, these pages will become much
appreciated reference sections.
The book claims you’ll need 2 hours for this. We know
people who wanted to learn all things Dw CIB. It took them
better than 3 hours, in a few separate short sessions.
Chapter 4 - Web Design Basics
We applauded this chapter when it first appeared in the CS5
edition as a much bigger chapter. The lack of this is the downfall
of many web-based educational resources.
Even if you are not a designer, you need this chapter. Think
of it as well thought-through organization. Don’t let it concern
you if you feel you are not inclined toward pencil and paper
layouts. Anyone can do doodles
The focus has been on smart planning for smooth execution.
By the time you complete this chapter, you will have created a
page in Dw.
Front Page
Next Page
3
Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
Added to this edition is work with Adobe Generator, an
important part of the design process. We have a feeling that
you’ll be hearing more and more about Generator, so please do
not skip that section, either.
Develop a New Website . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116-117
The Purpose of the Website? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
Who is the Audience? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116
How Do They Get There? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 117
Responsive Web Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118
Scenario . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119
Thumbnails and Wireframes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119-123
Create Thumbnails . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 119-120
Create Page Designs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120-121
Desktop or Mobile . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 121
Create Wireframes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 122-123
Create Web Assets w/Adobe Generator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 123-127
Adobe Generator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 124-125
Export Assets from Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 125-127
Create Multiple Assets w/Generator . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127-128
Chapter 5 - Creating a Page Layout
For those books which mimic a users manual, this is where they
get started. Of course, CIB has used 128 pages to introduce you
to how you get to this point where you begin to build a page. In
our minds, that’s the essential pathway.
Though you have learned a few things about CSS Designer,
already, here’s where you get down to business. Currently, the
CSS Designer panel is foundational to using Dw from the vantage point of taking visual control. Toss a bookmark into page
144 as a future reference page to the CSS Designer panel.
Welcome Screen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132-133
Previewing the Completed File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133-134
Predefined Layouts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134-139
CSS Designer . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139-143
Rules of Order . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 144
Type . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 145-154
Typeface vs Font . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 146
Edge Web Fonts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 149-151
Web-Hosted Fonts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 151
Font Stacks w/Web Fonts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152-153
m2media.com Home Page
Specify Font Size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153-154
Create a CSS Background . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155-163
Add a Background Image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 155-157
Define Values . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 158
Add Other Background Effects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 158-162
Create Custom CSS Styling . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162-163
Modify Existing Content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 163-172
Add New Items to a Navigation Menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . 164-166
Hyperlink Pseudo-Class . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167
Styling a Navigation Menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 167-172
Building Semantic Content . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172-175
Position Elements w/Element Quick View . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175-177
Insert Placeholder Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 177-178
Insert HTML Entities . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 178-179
Validating HTML Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 179-180
Some of this CIB talks about Edge web fonts. To us,
Adobe’s Typekit makes more sense for CC subscribers. Admittedly, Typekit is discussed, too.
We do greatly appreciate the amount of space which has
been devoted to type. Other books focus more on the technology of Dw than teaching how to create great visuals. That’s where
this CIB excels.
Chapter 6 - Designing for Mobile Devices
Don’t skip this chapter by thinking, “All I need to do is design
web pages. The mobile thing isn’t for me.” Understanding how
you adapt a website to a mobile device could easily drift into
your future. In developing for the internet, you always want to
have in the back of your mind how you’ll adapt to a mobile app.
Responsive Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184-186
Media Type Property . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184-185
Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185
Media Query Syntax . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185-186
Previewing the Completed File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186-189
Mobile-Ready vs Mobile-Optimized . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 189
Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190-195
Identify Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 190-191
Target Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 191-192
Target Selectors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 192-195
Troubleshoot Styles Across Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . 195-199
m2media.com Online Learning
Previous Page
© 1993-2015 M2 Media Studios, Inc.
Element Quick View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 198-200
Add Rules to a Media Query . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 201-203
Edge Inspect . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 203-204
More on Media Queries . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204
Not to sound like we have gone negative on all things Edge,
this chapter wraps up with how to use Edge Inspect to test on a
mobile device.
Chapter 7 - Working with Templates
Some well-known Dreamweaver educators tell us not to bother
teaching templates. They don’t see them as relative to advanced
web development. We would not consider pulling templates
from site development any more than we would from any other
app. Templates are a powerful feature.
This is proven on page 210 where the lesson looks at taking
embedded style sheets and moving them out to an external file.
Make some changes to your external CSS and it’ll not only
ripple across an entire website but it could change the look of
a series of sites which reflect a single branding, over thousands
and thousands of pages.
Previewing the Completed File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 208-210
Move Embedded CSS to an External File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 210-213
Create a Template from an Existing Layout . . . . . . . . . . . . . . . . . . . . . . . . . . . 213-215
Insert Editable Regions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 215-217
Insert Metadata . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 217-219
Produce Child Pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220-226
Create a New Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220-221
Add Content to Child Pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221-224
Update a Template . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 224-226
Such power sounds big and complex but this CIB shows
how simple changes make huge changes.
If reading this does not convince you, or the power has not
sunk in, when you get to page 220 and the lesson turns to child
pages, it should begin to make sense.
Chapter 8 - Working with Text, Lists, and Tables
Some people will try to tell you that internet tables are something leftover from twenty years ago.
Have you received a visually-based e-mail, today? Chances
are, it was created using tables. So, yes, the table on a web page
does go back to when the internet was rooted in research univer-
Front Page
Next Page
4
Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
sities. However, creative minds will discover how to use them to
do some very cool things.
Previewing the Completed File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 230-232
Creating + Styling Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 232-239
Import Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 232-234
Alternate HTML4 Workflow . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234
Create Semantic Structures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234-235
Create Headings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 235-237
Add Other HTML Structures . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237-239
Create Lists . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 239-248
Create Indented Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243-247
Make It Responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 247-248
Create + Style Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 248-268
Create Tables from Scratch . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249-251
Copy and Paste Tables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252
Style Tables w/CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 252-254
Style Table Cells . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 254-256
Control Table Display . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 254-258
Insert Tables from other Sources . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 258-260
Adjust Vertical Alignment . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 260-261
Add + Format Caption Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261-262
Make Tables Responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262-268
Spellcheck Web Pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 268-269
Find + Replace Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270-273
Completing the Lesson . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 273
It’s true that this chapter is rooted in technologies which
took hold in the previous century, yet they are made interestingly new again in this book. Unless we told you it was old school
made fresh, you may have never known it. But be aware of this
and that others may question your use of tables and lists.
Pay no attention to them and just do cool work.
Chapter 9 - Working with Images
This is one of those CIB chapters which could become a book
of its own. Squeezing this into just 27 pages means it only gives
you the basics, but it’s an admirable and inspiring job of it.
Some people have their way of using Dreamweaver for
doing things with images. This chapter tries to offer as many of
m2media.com Home Page
the available options as possible. Page 292 gets into the realities
of higher resolution devices. However, missing from the drag
and drop section is the use of Adobe Bridge, one of those cases
in point of how much cannot be squished into a single CIB
anymore. But, that doesn’t prevent you from exploring this on
your own.
Web Image Basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 278-283
Vector Graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 278
Raster Graphics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 278-280
Resolution . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 279
Size . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280
Color . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280-281
Raster Image File Formats . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281-283
GIF . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281
JPEG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 282
PNG . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 282-283
Preview Projects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 283-284
Insert an Image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284-285
Adjust Image Positions w/CSS Classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 285-286
Insert Panel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 286-287
Insert Menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 287-289
Insert Non-Web File Types . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 289-291
Image Size w/High Resolution Devices . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292
Photoshop Smart Objects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292-294
Copy + Paste Images from Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 295-298
Adapt Images to Smaller Screens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 297-298
Insert Images by Drag and Drop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 298-301
Make Images Responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 300-301
Optimize Images w/the Property Inspector . . . . . . . . . . . . . . . . . . . . . . . . . . . 302-303
Dreamweaver Graphic Tools . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304
Please bookmark page 304 or make a copy of it. That chart
of Dreamweaver’s graphic tools is a keeper.
Chapter 10 - Working with Navigation
Haven’t you already done all this hyperlink stuff? Well, you
did get a taste of it but now it’s time to apply that into how the
website visitors find their way around, smoothly getting from
one place to another.
m2media.com Online Learning
Previous Page
© 1993-2015 M2 Media Studios, Inc.
All of that could get tedious, on a big website. Knowing
navigation, as second nature, is essential. You need to keep your
head in the game, so study this carefully.
Hyperlink Basics . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308-309
Internal + External Hyperlinks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308
Relative vs. Absolute Hyperlinks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 308-309
Preview Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 309-311
Create Internal Hyperlinks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312-317
Create Relative Links in Design View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312-315
Create a Home Link . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315-316
Update Links in Child Pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 316-317
Create an External Link . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 318-320
Create an Absolute Link in Live View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 318-320
Set Up email Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 320-322
Create an Image-Based Link . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 322-324
Create an Image-Based Links Using Element View . . . . . . . . . . . . . . . . . . 322-323
Create Text Links w/Element View . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 323
Avoiding email Robots . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 324
Target Page Elements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 324-329
Create Internal Targeted Links . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 324-326
Create a Link Destination w/id . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 327-328
Create a Destination Link in Element View . . . . . . . . . . . . . . . . . . . . . . . . . 328-329
Target id-Based Link Destinations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 329
Check the Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 329-330
Add Destination Links to the Same Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 330
Chapter 11 - Adding Interactivity
You have now reached a point in the book where you have
invested about a half of a work week’s typical hours. Don’t have
you eyes on a clock as if it’s 4:38p.
Yes, interactivity has evolved and yes there are sexier ways
of handling this. However, this chapter provides you with the
basics which must be learned. Study this one carefully, especially
the jQuery and widgets.
Dreamweaver Behaviors Overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 334-335
Preview Projects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 336
Dreamweaver Behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 337-346
Apply a Behavior . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 339-340
Front Page
Next Page
5
Mapped App #016: Dreamweaver CC 2014 • Classroom in a Book Journal
Apply a Swap Image Restore Behavior . . . . . . . . . . . . . . . . . . . . . . . . . . . . 340-341
Remove Applied Behaviors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 341-342
Add Behaviors to Hyperlinks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 342-344
Make It Responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 344-346
jQuery Accordion Widgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 346-360
Insert a jQuery Accordion Widget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 347-348
Customize a jQuery Accordion . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 349-355
Edit Dynamic jQuery Styling . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 355-360
Chapter 12 - Working with Web Animation and Video
From the first sentence on page 364, the author imparts great
knowledge on the topic of animation and video on the internet.
This is something akin to knowing what happens in the photographic darkroom days before comprehending what printing in
Photoshop is all about.
You’ll hear plenty of stories about how this ought to be
done. Unless you have the complete picture, you will not be
able to make wise decisions of your own. This chapter is a rapid
fire day in an intense college master class. Fortunately, you can
devour it at your own speed.
Web Animation + Video Overview . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 364
Preview Projects . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 365-366
Edge Animate . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 366
Add Web Animation to a Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 367-371
Down-Level Stage/Static Poster in Edge Animate . . . . . . . . . . . . . . . . . . . . . . . 371
Add Web Video to a Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 372-374
Buggy Video . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 375
HTML5 Video Options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 376-378
m2media.com Home Page
Chapter 13 - Publishing to the Web
We are not the first people to say that managing a website in
Dreamweaver is an archaic, painful process. There’s no way
this CIB can make what is clunky and in sore need of Adobe’s
redesign a fun chapter.
The fact that this is a book and not a working website
makes this all the more difficult. The reader cannot go through
the mundane tasks of pushing projects out to a remote web
hosting server from his/her desktop.
We’ve been doing this for around 20 years, when it seemed
simple and elegant in GoLive. Getting used to it in Dreamweaver did not entail throwing any Macs out the window. Yet, today
we can do this in our sleep.
Dreamweaver’s Microsoft Windows 2.0-like Files panel
doesn’t make any of this easier. Yet, as the saying goes, “It is what
it is.” And, somehow this CIB’s author makes it all seem doable
with the teaching expertise of someone who has been in the
classroom trenches
Define a Remote Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 382-389
FTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
SFTP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
FTP over SSL/TL5 (implicit) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
FTP over SSL/TL5 (explicit) . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
Local/Network . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
WebDav . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
RDS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389
Set Up a Remote FTP Site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 383-387
m2media.com Online Learning
Previous Page
© 1993-2015 M2 Media Studios, Inc.
Troubleshoot FTP Connections . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 386
Install a Testing Server . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 387
A Remote Site on a Local or Network Web Server . . . . . . . . . . . . . . . . . . . 388-389
Cloaking Folders + Files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 389-391
Wrapping Up a Publishing Project . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 391-394
Prelaunch Checklist . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 394
Put the Site Online . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 394-397
Synchronize Local + Remote Sites . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 397-399
Synchronization Options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 398
Your project is to not give up. Keep your cool. Learn everything this chapter has to offer.
Here’s the saving grace: once you’re building a real website
and managing one for the first time, this chapter will be your
new best friend. It’s your website management user’s manual.
Conclusion
We probably use Dreamweaver more than any other of the 16
core Adobe desktop apps which come with the full CC subscription (around 365 days a year). It’s also very low on our list
of favorites. It’s not fun. It’s not creative.
Yet, somehow, the Adobe Dreamweaver CC 2014 CIB team
not only turned this into a learning experience, which makes
Dreamweaver lessons inspiring enough to want to do more.
They have clearly made this both the best CIB on Dw, and easily the best book on Dreamweaver, ever.
It’s 5 stars all the way.
Front Page
6