Again, on desktop, we've done something different again, where we've got the logo on the left and the navigation on the right. And you can see on tablet here, we've got a horizontal. If we zoom in over here, you can see the big difference between, say, the mobile and the tablet screen is that the mobile screen uses a navigation that's vertical. While all the designs communicate the same content, we're trying to adapt each design to best use the available screen size. And the goal of the design process here in Photoshop has been to best communicate their content through our mobile screen, our tablet, and then again on the desktop screen.
![dreamweaver cc responsive design tutorial dreamweaver cc responsive design tutorial](https://tutortv.files.wordpress.com/2017/04/responsivedesign-dw.jpg)
The one on the right is for our mobile screen, the one in the middle is for our tablet, and the one on the left is for our desktop view. Now the three designs here all use the same content. Dreamweaver is the place where we get to add the interactivity and the features that allow our website to adjust to the different screen sizes. Now these they just looks and feels, they don't actually have any interactivity and that's where we go in Dreamweaver. And when you are finish, you end up with these comps. You can move things around and adjust colors and everything is very quick and easy. Why in Photoshop first? Photoshop is nice and quick to work. Now what happens is you mock it up here in Photoshop. So here in Photoshop we've got our mockups done for our designs. So now let's go check out the design mockups that we've made in Photoshop. Now to be responsive, we need to make sure that our design also works on tablet and mobile screens.
![dreamweaver cc responsive design tutorial dreamweaver cc responsive design tutorial](https://slideplayer.com/10502275/35/images/slide_1.jpg)
#DREAMWEAVER CC RESPONSIVE DESIGN TUTORIAL PRO#
I'm doing it here on my MacBook Pro and the design makes best use of my desktop. Now we're looking at the site we're building in the series. Now a responsive website is a website where the design changes to best suit the screen you're viewing it on. And in this video, we're going to learn what it means to create a responsive website.