Dreamweaver CS5.5 Mobile and Web Development with HTML5, CSS3, and jQuery

Dreamweaver CS5.5 Mobile and Web Development with HTML5, CSS3, and jQuery
eBook: $23.99
Formats: PDF, PacktLib, ePub and Mobi formats
save 15%!
Print + free eBook + free PacktLib access to the book: $63.98    Print cover: $39.99
save 37%!
Free Shipping!
UK, US, Europe and selected countries in Asia.
Also available on:
Table of Contents
Sample Chapters
  • Create web pages in Dreamweaver using the latest technology and approach
  • Add multimedia and interactivity to your websites
  • Optimize your websites for a wide range of platforms and build mobile apps with Dreamweaver
  • A practical guide filled with many examples for making the best use of Dreamweaver's latest features


Book Details

Language : English
Paperback : 284 pages [ 235mm x 191mm ]
Release Date : September 2011
ISBN : 1849691584
ISBN 13 : 9781849691581
Author(s) : David Karlins
Topics and Technologies : All Books, Web Development, Mobile, jQuery, Web Development, Web Graphics & Video

Table of Contents

Chapter 1: Creating HTML5 Pages in Dreamweaver
Chapter 2: Customizing HTML5 Layout–Content and Look
Chapter 3: Customizing HTML5 Layout Elements
Chapter 4: Building HTML5 Pages from Scratch
Chapter 5: Defining and Implementing Multiscreen Previews and Media Queries
Chapter 6: Applying CSS3 Effects and Transforms
Chapter 7: Embedding HTML5 Audio in Dreamweaver
Chapter 8: Embedding HTML5 Video in Dreamweaver
Chapter 9: Creating Mobile Pages with jQuery
Chapter 10: Adding jQuery Mobile Elements
Chapter 11: Generating Apps
  • Chapter 1: Creating HTML5 Pages in Dreamweaver
    • HTML5 and Dreamweaver CS5 in the world of web design
      • HTML5—the cutting edge of web design
        • HTML4.1, XHTML, and HTML5
        • Compatibility issues with HTML5
    • HTML5 and Dreamweaver CS5.5
      • Dreamweaver generates code
      • Dreamweaver—catching up to HTML5
    • An introduction to HTML5 layout elements
      • The evolution of HTML layout elements
        • Phase 1: Tables
        • Phase 2: CSS DIV tags
        • Phase 3: HTML5 layout elements
      • Meet the HTML5 layout elements
    • Dreamweaver's HTML5 Pack and design elements
    • Detecting or installing the HTML5 Pack in Dreamweaver
    • Creating a Dreamweaver site
    • Generating new pages from layouts using the HTML5 templates
    • Examining the generated HTML5 layout
      • Toggling between related files
      • Code, Split, and Design views
      • Dissecting design elements with the Inspect Mode
    • Saving a layout as a web page
    • Recipe: Creating and saving a 3-column HTML5 page
    • Summary
    • Chapter 2: Customizing HTML5 Layout–Content and Look
      • Customizing layouts – An overview
        • Embedding content where it belongs
        • Dissecting format
      • Editing content in HTML5 page layout elements
        • HTML text tags versus HTML5 layout elements
        • Organizing content in containers
        • Utilizing Split view for editing content
        • Adding articles and sections
          • Identifying and selecting HTML5 layout elements
          • Copying, pasting, and deleting HTML5 Elements
      • Identifying style rules
        • HTML5 layout elements require styles
        • Examining CSS associated with HTML5 layouts
      • Customizing HTML tag rules
        • Making quick changes to styles in the CSS styles panel
        • The CSS rules definition dialog
          • Editing type styles
          • Editing backgrounds
          • Preview with apply
      • Saving customized HTML5 layouts
      • Recipe: Customize content and look of an HTML5 page
      • Summary
      • Chapter 3: Customizing HTML5 Layout Elements
        • HTML5 layout and browser compatibility challenges
          • Which browsers support HTML5 layout elements?
          • Using CSS to solve browser issues
            • The magic of display:block
            • Disabling a CSS rule
        • Global HTML5 layout element attributes
          • Working with backgrounds
          • Defining size, margins, and padding
            • Assigning a page size
            • Margins versus padding
            • Element padding versus content margins
          • Positioning with float
        • Customizing HTML5 elements
        • Back to the future: ID and class styles
          • Layout with class styles
          • The role of ID styles
        • Recipe: Customizing the HTML5 page layout
          • Recipe: Customizing the size and position for header, footer, nav, and aside
          • Customizing links in the nav element
        • Summary
        • Chapter 4: Building HTML5 Pages from Scratch
          • Dreamweaver CS5 and HTML5
          • Building an HTML5 page from the top
            • HTML5 structural elements
            • Creating a CSS file
          • Using HTML5 to make content accessible
          • HTML5 layout strategy
          • Using code hints
          • Adding header, header nav, and hgroup
            • Navigation within a header
            • Organizing header content with hgroups
          • Creating articles and sections
          • Adding aside content
          • Creating a footer
          • Adding metadata
            • Defining an address
            • Figures and captions
            • Indicating date and time
          • Recipe Part 1: Build a style sheet for an HTML5 page layout
          • Recipe Part 2: Build an HTML5 layout from scratch
          • Summary
          • Chapter 5: Defining and Implementing Multiscreen Previews and Media Queries
            • Web design for a multimedia web world
              • CSS3 and Media Queries
              • Styling for mobile devices and tablets
            • Previewing with the Multiscreen Preview
            • Generating a Media Query in Dreamweaver
              • Building alternative style sheets
              • A 3-step protocol for preparing to generate a Media Query
              • Assigning styles to different media
            • Formatting CSS files for Media Queries
              • Caution: Don't delete style rules
              • Styling for mobile devices
            • Troubleshooting for Apple i-Gadgets
            • Exercise: Defining a Media Query for a cell phone
            • Summary
            • Chapter 6: Applying CSS3 Effects and Transforms
              • New in CSS3: Effects and transforms
                • Compatibility challenges
                • CSS3 styles in Dreamweaver's HTML5 Pack
              • CSS3 effects
                • Opacity
                • Border radius
                • Shadows
                  • Box shadow
                  • Text shadow
                  • Text outline
              • CSS3 transforms
                • When to use transforms
                • How to generate transition coding in Dreamweaver
                • Resizing with scale
                • Moving with translate
                • Applying rotation
                • Creating a skew transition
                • Other CS3 transform effects
                • Compound transforms
              • Interactive effects and transforms
                • Effects and JavaScript
                • Interactivity with the :hover pseudo-class
                • Animating CSS3 transforms in Dreamweaver
              • Recipe: Create an animated effect and transform
                • Putting the pieces in place
              • Summary
              • Chapter 7: Embedding HTML5 Audio in Dreamweaver
                • Audio and compatibility
                • Laying the groundwork: HTML5 and page-building
                • Making audio HTML5-ready
                  • Audio compression
                  • Browser support for audio files
                • Embedding an HTML5 audio element in a Dreamweaver CS5 web page
                • Alternative media options
                  • Providing alternative HTML5 audio formats
                  • Audio for non-HTML5 browsers
                  • Adding play parameters
                • Recipe: Embedding HTML5 audio
                • Summary
                • Chapter 8: Embedding HTML5 Video in Dreamweaver
                  • HTML5 video and Dreamweaver CS5.5
                    • Early formats
                    • Flash Video (FLV)
                    • Apple devices and the web video
                  • The wild world of native videos
                    • Native video formats
                    • Browsers that do NOT support HTML5
                  • Preparing an HTML5 video for every scenario
                  • Compressing videos for the Web
                    • Video compression—open source and proprietary
                    • Converting a video to web formats with open source tools
                  • Creating an HTML5 video in Adobe Media Encoder CS5. 5
                  • Dreamweaver site management for an HTML5 video
                  • Defining the HTML5 <video> element
                    • Prerequisites
                    • Creating the <video> element
                    • Defining video attributes
                    • Defining video source(s)
                    • Alternate video for non-HTML5 environments
                    • Putting it all together
                  • Testing HTML5 video pages
                    • Previewing a video in the Live View
                    • Previewing a video in BrowserLab
                  • Recipe: Embedding an HTML5 video
                  • Summary
                  • Chapter 9: Creating Mobile Pages with jQuery
                    • Mobile pages – An overview
                      • Mobile pages, apps, and jQuery Mobile
                      • The status of jQuery Mobile
                      • Using jQuery Mobile starter pages
                    • Creating mobile pages from Dreamweaver CS5.5 starters
                      • Mobile pages in Split view
                      • Previewing jQuery Mobile pages in Live view
                    • Customizing mobile page content
                      • The HTML5 data-role property
                        • Data-role pages
                        • Customizing page content
                        • Customizing content for different data roles
                    • Adding new jQuery Mobile pages and objects
                      • Creating new data-role pages by copying code
                      • Creating new data-role pages from the menu
                    • Customizing mobile page CSS styles
                      • Default jQuery Mobile CSS
                      • Editing jQuery Mobile CSS
                      • Applying and customizing themes
                    • Looking ahead: Generating mobile apps
                    • Recipe: Build a mobile web page with jQuery Mobile objects
                    • Summary
                    • Chapter 10: Adding jQuery Mobile Elements
                      • Creating jQuery Mobile pages from scratch
                        • Interface options
                        • Step 1 – Creating an HTML5 page
                        • Step 2 – Inserting a jQuery Mobile "page"
                      • Inserting a Layout Grid
                        • Defining styles for Layout Grids
                      • Designing mobile pages into a collapsible block
                        • Building a collapsible block
                          • Changing initial block state
                          • Changing block data-themes and styles
                          • Editing Collapsible Block HTML
                      • Adding jQuery form objects
                        • Forms in Dreamweaver
                        • Creating a jQuery Mobile form
                        • Special mobile form fields
                          • Inserting a text input field
                          • Inserting a slider
                          • Inserting a toggle switch
                          • Formatting jQuery Mobile Form Fields
                      • Recipe: Build a page with collapsible blocks and a form
                      • Summary
                      • Chapter 11: Generating Apps
                        • Generating apps from Dreamweaver—an overview
                          • Advantage: App vs web page
                          • PhoneGap and Dreamweaver CS5.5
                        • Configuring application framework(s)
                        • The App toolkits
                          • Installing the frameworks
                        • Defining mobile application settings
                        • Building and emulating apps
                        • Testing mobile apps on your computer
                        • Recipe: Building and emulating a mobile app
                        • Summary

                        David Karlins

                        David Karlins is a web design consultant, teacher, and author of dozens of books on web design, including Building Websites All-in-One For Dummies, John Wiley & Sons Inc. (co-author with Doug Sahlin), Adobe Creative Suite 5 Web Premium How-Tos: 100 Essential Techniques, Peachpit, and Dreamweaver CS5.5 Mobile and Web Development with HTML5, CSS3, and jQuery, Packt Publishing.
                        Sorry, we don't have any reviews for this title yet.

                        Submit Errata

                        Please let us know if you have found any errors not listed on this list by completing our errata submission form. Our editors will check them and add them to this list. Thank you.


                        - 1 submitted: last submission 08 Nov 2012

                        Errata Type : Typo                         Page number: 99

                        <br>Caption here

                        Should be

                             <br>Caption here

                        Sample chapters

                        You can view our sample chapters and prefaces of this title on PacktLib or download sample chapters in PDF format.

                        Frequently bought together

                        Dreamweaver CS5.5 Mobile and Web Development with HTML5, CSS3, and jQuery +    Selenium Testing Tools Cookbook =
                        50% Off
                        the second eBook
                        Price for both: £21.95

                        Buy both these recommended eBooks together and get 50% off the cheapest eBook.

                        What you will learn from this book

                        • Use and customize the content of Dreamweaver’s HTML5 layouts
                        • Dissect and customize the CSS styles that control HTML5 layouts
                        • Create sites that use the styling and content tools in Dreamweaver to their full potential
                        • Implement multiscreen previews and media queries to create sites for desktops, mobiles, and tablets
                        • Apply new CSS3 effects with Dreamweaver code hints and enhanced CSS Styles panel
                        • Add multimedia to web pages with HTML5 elements
                        • Create jQuery Mobile-based web pages from scratch
                        • Build and emulate mobile apps with Dreamweaver


                        In Detail

                        Dreamweaver is the most powerful and industry-leading web design software that utilizes cutting edge web technologies such as HTML5, CSS3, and jQuery for web and mobile development. These technologies have radically reconfigured the process of designing Web content and function in the widest possible range of browsing environments ranging from desktops to mobile devices.

                        For experienced Dreamweaver designers and for designers new to Dreamweaver, this book explains in detail how to take advantage of the new features available in the latest releases of Dreamweaver that add support for HTML5, CSS3, and jQuery. In addition to this, the book also contains detailed step-by-step directions for building mobile apps in Dreamweaver CS5.5.

                        This book starts off by teaching you to create web pages in Dreamweaver using the latest technology and approaches — HTML5, CSS3, and JavaScript. It demonstrates how to create or customize pages with HTML5 layouts and add multimedia to these pages with HTML5 elements. Then you will learn to add various CSS3 effects to web pages. The book also covers different techniques of adding interactivity to web pages. The later chapters show how to optimize web pages with Dreamweaver for display in various browsing environments. You will also learn to build jQuery-based mobile apps from scratch in the later chapters. By the time you're finished, you'll have learned several techniques to use the latest features of Dreamweaver for web and mobile development.


                        This book combines accessible, clear, engaging and candid reference material, advice and shortcuts with substantial step-by-step instructions for creating a wide range of HTML5 and CSS3 designs and page content in Dreamweaver.

                        Who this book is for

                        This book is geared towards experienced Dreamweaver web designers migrating to HTML5 and jQuery. It also targets web designers new to Dreamweaver who want to jump with two feet into the most current Web design tools and features. While focused primarily on Dreamweaver CS5.5, the book includes content of value to readers using older versions of Dreamweaver with directions on installing a version of Adobe’s HTML5 Pack that updates those packages.

                        Code Download and Errata
                        Packt Anytime, Anywhere
                        Register Books
                        Print Upgrades
                        eBook Downloads
                        Video Support
                        Contact Us
                        Awards Voting Nominations Previous Winners
                        Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
                        Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software