Create responsive websites in Adobe Muse

Learn how to create responsive sites in Adobe Muse. Use blank layouts or predefined starter templates to create responsive sites.

Piezīme.

Adobe Muse is no longer adding new features and will discontinue support on March 26, 2020. For detailed information and assistance, see Adobe Muse end-of-service page.

You can begin to create responsive websites in Adobe Muse in one of the following ways:

Using starter files: Adobe Muse offers customizable, responsive starter templates to help you get started quickly. Customize the starter templates and publish your responsive site with a few clicks. For detailed information, see Using responsive starter templates.

Using a blank layout: Adobe Muse provides a blank canvas without restrictive templates or grids to design a responsive site. Use a single Adobe Muse file to create different layouts for different browser widths. To create a new responsive Adobe Muse website, see Create a new responsive site.

When you open a page in responsive layout, Adobe Muse displays Responsive Tour - a short slideshow on breakpoints, resizing objects, and formatting text for responsive layout. You can either continue with the Responsive Tour, or view the slideshow later by clicking Help > Responsive Tour.

Using responsive starter templates

Adobe Muse offers templates for different types of websites, such as, a personal site, or a site that showcases photography exhibits.

To access the starter templates, see the section on Starter Designs on the Adobe Muse page. Choose a template from the section, and click Download to download the starter files.

When you open the starter files, a master page and a set of individual pages with predefined templates open in the Adobe Muse Plan view. You can choose either Desktop (1160 pixels width), Tablet (768 pixels width), or Phone (380 pixels width) from the top panel. You can also modify the starter templates based on your requirement, and preview the pages using the scrubber.

If you do not want to download the template, you can click Preview from the Starter Design section. The sample site opens in your browser.

Create a new responsive site

To create a site with responsive layout, select the Fluid Width option from the New Site dialog box. The objects in the page automatically respond and scale according to the size of the browser. The Fluid Width option also allows you to design a responsive site on a blank layout, without any restrictive templates or a predefined layout.

Click File > New Site.

Choose Fluid Width for responsive layout

Click Fluid Width. When you select the Fluid Width option, the objects on your page are fluid across breakpoints. That is, the objects respond to the browser width based on their responsive behavior.

Click Advanced Settings and set the width, height, and margins for your site. You can choose to start from a browser width that is convenient for designing your site. After you lay out objects, you can add more breakpoints for additional browser widths.