Organize Content with Layers

 

Adobe® Muse Fundamentals

 

Lesson Info

Organize Content with Layers

Layers? This isn't gonna take a long time, because with layers, if you know layers in InDesign, Illustrator, Photoshop, you have an idea of what they work like in here. Now as we work in Muse, as we start to add content, things are gonna be stacked one on top of another. As a matter of fact, if I take this box right here, now don't do this, just watch me for a second, and I go up here and put it over that, look what it's doing. It's on top of those objects, okay? Now I'm gonna just drag it back down here, that's fine. If we want to, we can work with layers. Layers allow us to separate objects, content, whatever you wanna call it, into sort-of like transparent folders. So you can actually have these folders that you can see through if you look through 'em, and you can have different objects in each folder. And each folder is called a layer, okay? If you look on the right, you're gonna see the layers panel. By default, we have one layer. And what I wanna do is, I wanna name this. We're g...

onna call this the master layer, 'cause this is gonna be our master content. I tend to make layers depending on what kind of content it is. Maybe it's master page content, maybe it's the page content, etc. So to name a layer, double-click on the name, and you can just name it Master or something like that. You can change colors, and that's gonna change, if you look at the boxes and different things out there, they're blue right now, the edges of them. That's the layer that it's associated with. You can actually change that color if you want to. Just click okay. All right, now what we're gonna do later is we're actually gonna add a lotta different page content. We're also gonna add some other types of content. So we're gonna make some layers for those. That way we can kinda keep things separated. And if we want the master content, like let's say we have this header stuff, later on we decide to have it stick in place. And as we scroll the page, the page content's gonna scroll like this. Well I don't want the scrolling page content to go over the top of the logo, right? So what we might do is we might actually have the page content be beneath all of the master content. In this case, we're gonna need to make layers to do that. So we put all the page content on another layer for instance. So let's make the layer and get it ready. Now, you guys, you're gonna have to remind me that we're using these. Because if you set up layers, it doesn't mean you're gonna use 'em. You have to remember that you're using them. You'll just stick on one layer and it'll put everything on the same layer and you'll forget later on. And there it goes. All right, so to make a new layer, click on new layer, double-click to name it, call it, you know, page content or something like that. There we go. You can change color, that's fine. Click okay. Now this layer doesn't have any content, and the great thing about layers too is you can turn off, by clicking on this little eye, you can turn off the stuff for a layer so you can see what your focus, or looking at, or focus on certain things. You can lock content if you want in this little area here. I want the page content to maybe go behind the master content. Maybe, we'll see. But I'm gonna drag the page content layer down, and you can re-order these layers. And right now it's not gonna make a bit of difference, because there's nothing on the page content layer. But all of the master content out here will be above the page content, which is great. That's something we really want, okay? All right, now, if you want to you can delete layers and it will delete all the content. If you have content already out here, look at the master layer, for instance. Click on the arrow to the left of master and it will show you all the objects. What I love about this is you could come out here, and see the little box to the far right here? You could click on that little box and it will actually select the object out there and show you what it's talking about. It's like oh, well that's that, okay, that's great. You can even drag these objects in a different ordering if you want, just by dragging them within the layer. If I click on an object, maybe, that type of thing. No it's not gonna let me do that right now, 'cause this stuff is selected. That's fine. Yeah, for some reason it's not allowing me-- there we go. Now I can drag it and you can see, you can actually re-order content within if you had objects stacked on top of each other, for instance. All right, there's a lot of ways to work with layers. Wanted to give you a heads up, just a starting point. We're gonna keep it simple, we've got two. And next thing we're gonna do, we've got a little bit of page content out here now, or at least some master content. We're gonna start to work with responsive web design.

Class Description

Take a deep dive into creating a responsive website—without writing code—with this complete step-by-step walkthrough of Adobe® Muse. You'll walk away with a solid foundation for building a responsive website and see how easy it is to create a truly unique, expressive responsive website.

Join author, speaker, and web developer Brian Wood as you create a unique responsive website from start to finish, in Adobe® Muse.

In this Fundamentals class Brian will show you:

  • A typical web workflow, from start to finish
  • Best practices for setting up your fully responsive website and add pages
  • How to setup and work with master pages (and understand why you want to)
  • Adding master content like page navigation, logo, and more
  • How to ensure that your design content works across all screen sizes using responsive features
  • Best practices for adding image and graphics to your pages
  • How to add and style text using styles and fonts like Typekit and self-hosted
  • A deep dive into the powerful widgets available to you, including slideshows, adding a map, and much more
  • How to work smarter with your site content using CC Libraries
  • Add a form for collecting basic user information
  • Incorporate social content like a twitter follow and more
  • Best methods for Search Engine Optimization (SEO)
  • The different methods for sharing a trial site, and publishing your project for the world to see.

This course is for you if you need a deep dive into Adobe® Muse CC version 18.0.

Reviews

MikeD
 

This is part 2 of a 3 part course covering basics, fundamentals and some advanced properties. The three programs combined make a complete course in Adobe Muse. I am very pleased someone finally made a decent and complete course in how to use use Muse. As a photographer who has fairly simple needs for for building and maintaining a website, I needed something much less complicated than Dreamweaver. Brian Wood does an excellent job as he usually does. He is very detail oriented and he speaks technically to most operations within a program. He does work a little too hard at dumbing it down, but he is much better than those that skip over the details or those ewho don't even know the details. If you want to learn Muse, I highly recommend this course, in fact, all three parts.

wendy fite
 

Very efficient introduction to the basics in Muse. I did the Muse CC Quick Start course and then followed up with this Muse course on the fundamentals. This course is a little more technical that the quick start. Both courses give you what you need to do a website. The fundamentals talks briefly about HTML,JavaScript, etc.; while the quick start course does not. Recommend this class for using Muse for web design.