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.
You might have noticed that some web sites have actual Google Maps, YouTube videos, or Twitter status updates on their site instead of just linking to these other web sites or services. If you've never worked on a web design project before, you might think that this would be really difficult, and maybe you had to partner with Google or another company to make this happen. In reality, a designer just adds this information to a web site by using Arbitrary HTML or HTML Embedding. To add this type of content, it's easy as a simple copy and paste.
Before we get into Muse, let's take a look at what exactly Arbitrary HTML is. A simply way to think about it is that it's code created by third-party web sites, like YouTube, Facebook or Twitter. It has many names like Arbitrary HTML, Embedded HTML, Widgets, or even Gadgets. The reason it's so popular is that it's really easy to work with. All you have to do is copy specific code from a web site, and then paste it directly into Muse; that's it. To give you an idea of just how easy it is to work with Arbitrary HTML, I'm going to show you an example that's available on The Weather Channel.com.
So I've searched for forecast from Milwaukee, Wisconsin, my hometown, and I'm going to go to Share, and click. Immediately, there is an option right here that says Embed Code. When I click on that, I'm just going to copy that to the clipboard and then I can hit Cancel, go back to Muse, and I'm going to go into this page and just paste. It will take a moment, but immediately, I'll have a little widget that appears on the screen. This was built using the Arbitrary HTML. To preview this, I'll just click on the Preview button.
You can see that there's an animation happening saying that it's Cloudy in Milwaukee right now, as well as the forecast for Tonight, Tomorrow, and Tomorrow Night. In Preview mode, you can see that this isn't just a photo because theres an animation of the clouds, and I can go in and select this text, or even click underneath the hyperlinks. Let's go back into Design mode. In Design mode, if I try to move this around, there really isn't that much I can do because it's going to stay the same size, since it's rendered via HTML. But, if I want to edit this, I can just right-click my mouse and choose HTML.
Now, I can see the code that was written in order to make this happen. Now don't worry if you don't understand code; you don't have to make any changes. I just wanted to show you where the code was living inside Muse. We'll click OK, and leave this here. If you want to enter your own HTML code, rather than copying something from a web site, you can always go to the Object menu, and choose Insert HTML. Here, you can enter your own code. I'm just going to leave this alone and I'll click OK. Now I'll click and drag and move Insert your HTML here over to the side.
As you can see, I can't select this text right now because it's just a picture that says Insert your HTML. But, when I go into the Preview mode, I could actually select it because it's real selectable HTML text. If you're familiar with HTML or CSS, you could actually edit this code, and add your own CSS styling. In fact, it's a very powerful way to extend the capability of Muse. If manually entering code isn't your cup of tea, don't worry about it. There are a large number of web sites that use Arbitrary HTML that you can use to copy and paste into Muse or other applications.
However, if you are interested in writing or modifying code, you can accomplish almost anything with Arbitrary HTML.
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.