Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
In this course, author James Fritz shows how to create HTML-based websites with Muse—a toolset familiar to anyone who has used Adobe Photoshop, InDesign, or Illustrator. The course covers the design process from start to finish, from setting up web pages and populating them with graphics and text, to creating dynamic menus and adding special features such as widgets, slideshows, animations, embedded video, social media integration, and more. James also explains how to create an alternate layout for display on mobile devices, publish and update your site, and view analytics on web traffic.
When you are creating a new website in Muse, you can choose what the initial layout will be. Desktop is a default choice, but let's take a look at how to create a tablet- or phone- optimized site too. We are going to choose Create a New site, an in this New Site dialog box, you can see it says Initial Layout, and it's Desktop, which is your default set. But in this case I am going to choose Tablet, because I am going to design a website dedicated for a tablet, like the iPad. When I choose Tablet, I will put in the dimensions 768x1024, because that is the common size for a tablet. But you will notice over on the right-hand side where it says Padding, we have Top, Left, Bottom, and Right.
But if I switch this back to Desktop, we can see we have just Top and Bottom, and Left is grayed out, with this option called Center Horizontally. That is because you can center websites within the web browser on a desktop, but on a tablet or a mobile device, you really can not do that at all, so that happens to be disabled. But I will leave this at Tablet for now. When I choose this and click OK, we will be back to the Plan view and we could see we have our Homepage. Looking at this, we will see it is a vertical view of a tablet. We don't have to worry about designing horizontal view, because it will reflow or scale if you rotate the tablet.
I am going to go through and add a couple more pages, such as Home, About Us, and maybe a Contact. And this works just like the regular Desktop view if you need to. If I wanted to I could even add Phone Pages or a Desktop version too, but we will talk more about that in the later movies. Some things you want to think about when you are designing for a mobile device is you want to make sure you do not use any Flash animations. That's because the Flash web browser plug-in does not work on mobile devices. Instead, I recommend you use Adobe Edge Animate.
I have a movie earlier in the course all about Adobe Edge Animate. You should also be careful with pinning items to the web browser. While that works great on the desktop, it isn't consistent across all mobile browsers. And finally, small assets for smaller devices like the phone is probably a good idea. You want to make sure you do not put really large images on a phone because it will take longer to download if someone is trying to get this via a small weak wireless signal. You do not have to do anything extra in order for your mobile website to be viewed on a mobile device.
When you publish or upload your site, Muse will automatically write the necessary code for the mobile device to autodetect which site they'll see.
Find answers to the most frequently asked questions about Muse Essential Training.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.