Adobe Dreamweaver CC Responsive Design

What is Responsive Web Design

This section of the site, Adobe Dreamweaver CC Responsive Design, is one of the hottest group of videos of all.  The whole concept just came out in 2013.  RWD (Responsive Web Design) was said to be the biggest web development that happened that year.

What is a Media Query? Some People call them Breakpoints.

When I first started exploring Adobe Dreamweaver CC Responsive Design, I saw some CSS and some of the selectors were inside of another selector.  That selector was really strange because it started with an @ sign.  I had no idea what that was.  This is the wonderful thing about the age we live in.  All understanding is just a Google search away.

Basic Responsive Web Design Code

Here is an Adobe Dreamweaver CC Responsive Design starter kit project for you.  It comes complete with media queries and breakpoint suggestions.  Please keep in mind that anal retentive people went crazy with break points back in 2013.  The more research I did, I found that more is not better, but it’s your call.

Creating Fluid Pages by using Percentages instead of pixel values

After you get the basics down, I think you might have fun using percentages instead of pixel values for much of your Adobe Dreamweaver Responsive Design.  Most of my students fight it tooth and nail until they master it, then they can’t go back to pixels unless they really have to.

Scaling Your Images

Time to get out your snippets panel again, because I think that this image resize code is just strange enough not to understand immediately.

Why Develop for the Phone First and Work backwards to the Main Full Page Size?

I heard about this a thousand times before I tried it.  I fought it and fought it and fought the whole concept.  It just didn’t make sense to me.  But tell you what, once you do it one time with your Adobe Dreamweaver CC Responsive Design, you will do it forever.  Once you do it, it works so much better that you’ll love it.

Showing and Hiding Elements Given the Device that is Viewing Your Page, Display Block.

This is a very powerful part of Responsive Web Design.  Once you play with the code and see it work, you’ll really enjoy it.  It’s useful and magical.

Scaling Videos

Time to get out the snippets panel again.  You´ll want to use this code, but you might not remember it this month.

Flash Lives with Responsive Web Design.

I love Flash and I always will.  Using Display Block and Display none, you can use Flash, and Flash will only show up on Desktops and Laptops.  Then, you can show the Apple people still images and just let them suffer in the boredom they deserve.