You are previewing Learning Adobe Muse.
O'Reilly logo
Learning Adobe Muse

Book Description

Create beautiful websites without writing any code.

  • A step by step guide to using Adobe's latest design tool to build websites

  • A thorough coverage of all the features introduced in Adobe Muse

  • Design tips and advice for new designers

In Detail

Adobe Muse is an exciting new tool from the world’s foremost design software company which allows users to create beautiful and fully functioning websites without writing any code. It provides graphic designers the power to use their print design skills over the Web.

This book will help web designers as well as graphic designers to master Adobe Muse quickly. It will provide step-by-step instructions that guide you through building a website with Adobe Muse.

"Learning Adobe Muse" will teach you how to plan, design and publish websites using Adobe Muse. It starts by covering the tools and interface of the program and moves on to the concepts you’ll need to understand for laying out your web pages. You’ll learn how to format text using reusable styles, add images, create a clean navigation system, and add interactive elements such as panels and slideshows to your pages and all this without writing a single line of code!

By the end of the book you will have created a smartlydesigned, fully-functioning website.

Table of Contents

  1. Learning Adobe Muse
    1. Table of Contents
    2. Learning Adobe Muse
    3. Credits
    4. About the Author
    5. About the Reviewers
    6. www.PacktPub.com
      1. Support files, eBooks, discount offers and more
        1. Why Subscribe?
        2. Free Access for Packt account holders
    7. Preface
      1. What this book covers
      2. What you need for this book
      3. Who this book is for
      4. Conventions
      5. Reader feedback
      6. Customer support
        1. Downloading the example text and image
        2. Errata
        3. Piracy
        4. Questions
    8. 1. Welcome to Muse
      1. What is this Muse you speak of?
        1. Where to find Muse
        2. The Muse workspace
          1. The Welcome screen
          2. To open a recent site
          3. To create a new site
        3. Views
          1. Saving your site
          2. Opening a page in Design view
          3. The toolbar
          4. Using the tools
          5. The Control Panel
          6. Panels
            1. Expanding and collapsing panels
            2. Hide all panels
            3. Open a panel
            4. Rearranging panels
          7. The document window
            1. Rulers, guides, and grids
            2. Header and footer guides
            3. Grid overlay
            4. Zooming
            5. Changing magnification
          8. Undoing actions
          9. Getting help and more resources
          10. Muse updates
      2. Summary
    9. 2. The Muse Workflow
      1. Print workflow versus web workflow
        1. Pre-Muse planning
          1. Browser battles
          2. Resolution
          3. Download speed
            1. Where to find more information?
      2. The Muse workflow
        1. Create a site
          1. Why 960 instead of 1024?
        2. Plan your site
        3. Design your site
          1. Preview your site
        4. Publish your site
          1. Reviewing and testing a website
          2. Adobe Business Catalyst
          3. A brief overview of publishing
          4. Domain names
          5. Acquire server space
          6. Uploading your site
      3. Summary
    10. 3. Planning Your Site
      1. Page layouts
        1. Bread and butter layouts
      2. What appears on a typical web page?
        1. Logo
        2. Navigation bar
        3. Content
        4. Footer
      3. Wireframes
        1. What to include in a wireframe?
      4. Wireframes with Muse
      5. Site structure with Plan view
        1. Working with thumbnails in the Plan view
      6. Working with wireframes
        1. Saving the graphic style
        2. Using placeholder images
        3. Updating placeholder images with final site graphics
        4. Adding dummy text and paragraph styles
      7. Where are the files generated by Muse?
      8. Exercise
      9. Summary
    11. 4. Powerful Pages
      1. Pages
      2. Master pages
      3. Working with pages within your site
        1. Adding a sibling page
        2. Adding a child page
          1. Creating a duplicate page
        3. Deleting a page
        4. Renaming a page
        5. Rearranging pages
      4. Editing page properties
        1. Page sizes
        2. Opening, saving, and closing a page
        3. Working with Master pages
        4. Creating a new Master page
          1. Applying a Master page to a web page
        5. Header and footer guides
        6. Adding text to a page
      5. Creating links
        1. Creating a link to a page in our site
        2. Creating a link to an external web page
        3. Creating a link anchor
          1. Creating an e-mail link
            1. Understanding two different types of links
          2. Changing the color of links
          3. Editing and deleting links
            1. To edit a link
            2. To delete a link
          4. Creating a navigation bar
          5. Tips for navigation links
        4. Zooming in, out, and about
          1. Zooming in
          2. Zooming out
          3. Fit page to window
          4. Making page to its actual size
      6. Summary
    12. 5. The Joy of Rectangles
      1. Working with rectangles
        1. Setting up a master background rectangle
        2. Creating a rectangle on individual pages
        3. Deleting a rectangle
        4. Adjusting a rectangle
        5. Rotating a rectangle
        6. Cutting, copying, and pasting rectangles
        7. Duplicating a rectangle
      2. Adding color – fills and strokes
          1. Adding a stroke
            1. Stroke alignment
            2. Stroke widths
        1. Changing rectangle fill
          1. Setting a gradient fill
        2. Adding an image to a rectangle
      3. Adding effects to rectangles
        1. Adding a drop shadow
        2. Adding a bevel effect
        3. Adding a glow
      4. Change stacking order of rectangles
      5. Creating a mixture of round and square corners
      6. Creating full width rectangles
      7. Summary
    13. 6. Typography, Muse, and the Web
      1. The power of text
        1. Anatomy of type
      2. Creating text frames
        1. Clear, compelling, and correct content
      3. Editing text
      4. Creating and applying paragraph styles
      5. Creating and applying character styles
        1. Using the Context menu in the Character and Paragraph Styles panels
      6. Headings
        1. Content organization and hierarchy
        2. Headings and accessibility
        3. Headings and SEO
      7. Creating headings
        1. Change text case
        2. Text wrapping
        3. Web-safe fonts
      8. Metadata – the hidden text on your page
      9. Summary
    14. 7. Working with Images
      1. Hello web-friendly images
      2. Choosing the best file format
        1. JPEG
        2. GIF
        3. PNG
      3. Web-safe colors – a thing of the past?
      4. Getting images onto your page
        1. Placing an image
        2. Adding alternative text
        3. The image context menu
        4. Manipulating images
          1. Resizing an image
          2. Rotating an image
          3. Positioning an image
          4. Duplicating an image
          5. Cropping an image
        5. Adding effects to an image
        6. Pasting an image from another program
        7. Working with background images
      5. Adding a logo
        1. Adding a link to a logo
      6. Using a tiled image as a background
      7. Using a photographic image as a background image
      8. Pinning an image
      9. Taking care of site files with the Assets panel
      10. Group objects together to work with them as a single object
        1. Grouping objects
      11. Summary
    15. 8. Customizing with Widgets—Menus and Panels
      1. Working with widgets
        1. Adding a widget to the page
      2. How menu widgets work
        1. Adding a menu bar
        2. Selecting the widget and its subelements
        3. Setting widget options
        4. Formatting each menu item
        5. Adding states
        6. Transferring a style
        7. Horizontal menus
        8. Vertical menus
        9. Accordion panels
        10. Adding a panel
        11. Editing Accordion widget elements
        12. Editing Accordion widget options
      3. Tabbed Panels
      4. Deleting a panel
      5. Summary
    16. 9. More Widgets—Compositions and Slideshows
      1. Composition widgets
        1. Creating a simple photo gallery using a blank composition
        2. Add content to a target area
        3. Changing Composition widget options
          1. Another way to create triggers and targets with multiple images
      2. Slideshow widgets
        1. Creating a slideshow presentation
        2. Insert arbitrary HTML
      3. Adding a Google Map to your page
      4. Adding a Twitter (or any other type of) feed to your site
      5. Summary
    17. 10. Muse, Meet the Adobe Creative Suite
        1. Adding a Photoshop rollover button
          1. States
          2. Creating a rollover button with multiple states in Photoshop
          3. Placing the Photoshop button
          4. Adding a Photoshop image that's not a button
            1. Editing our Photoshop file
        2. Paste an image from another program
        3. Embedding rich media content
      1. Summary
    18. 11. Previewing and Testing Your Site
      1. Previewing pages
        1. Completing the site
          1. Preview a page in Muse
          2. Preview a page in a browser
          3. Preview the entire site in a browser
      2. Export HTML for browser testing
          1. Viewing your home page on an installed browser
      3. What to test for?
        1. Test your website on multiple browsers and platforms
          1. Which browsers and platforms to test?
        2. Test page optimization
        3. View pages on a variety of displays
        4. View pages on different screen resolutions
        5. Check for adequate color contrast
        6. Test the functionality of all your widgets
        7. Test all links, including navigation
        8. Test all downloads
        9. Test the site's accessibility conformance
        10. Proofread all content
        11. Usability testing
        12. Creating a device-friendly website
      4. Summary
    19. 12. Publishing Your Site
      1. Adobe ID
      2. Publishing a temporary site
        1. Remind me what the .muse file is again
      3. Editing and updating a site
      4. Upgrading and launching
        1. Register a domain name
        2. Upgrade to a published site
        3. Associating the domain name with your Muse site
        4. Re-delegating your domain name
      5. Alternative hosting
        1. File Transfer Protocol (FTP)
        2. FTP clients
      6. Summary
    20. Index