Dreamweaver CS6 Mobile and Web Development with HTML5, CSS3, and jQuery Mobile

دوره آموزش html

Chapter 1: Creating Sites and Pages with Dreamweaver CS6 7
Defining a Dreamweaver site 8
Defining a local site 8
Defining a remote site 10
Transferring files between a local and remote site 13
Creating an HTML5 page 15
Creating the text content 18
Applying headings 19
Adding paragraphs, lists, and links 19
Inserting images 21
Linking to a stylesheet 23
Creating and linking to an external stylesheet 24
Linking a stylesheet to an HTML file 25
Define the Body tag's style 25
Define a wrapper ID style 27
Summary 29
Chapter 2: Using HTML5 for Page Structure 31
HTML5 structural elements 33
Breaking down HTML5 page code 35
Defining an address 43
Figures and captions 44
Indicating date and time 44
Creating a CSS file for HTML5 page structure 45
Assigning a block property 48
Defining styles 50Chapter 3: Collecting Data with Forms 53
Creating a jump menu 54
Editing Jump Menu JavaScript 57
Creating a validated text field 61
Creating a validated e-mail field 64
Adding other fields 64
Adding Submit and Reset buttons 65
Creating a stylesheet for form elements 67
Creating styles for form elements 70
Creating ID Styles for a Form 71
Thoughts on form styles 72
Chapter 4: Applying CSS3 Effects and Transforms 77
Compatibility challenges 79
CSS3 styles in Dreamweaver CS6 81
Defining opacity 85
Border radius 88
Shadows 89
Box shadow 90
Text shadow 91
Creating a text outline 92
When to use transforms 94
How to generate transition coding in Dreamweaver CS6 94
Resizing with scale 96
Moving with translate 97
Applying rotation 98
Creating a skew transition 99
Other CSS3 transform effects 100
Compound transforms 101
Limitations of using effects with JavaScript 102
Interactivity with the :hover pseudo-class 102
Animating CSS3 transforms in Dreamweaver 103
Putting the pieces in place 104
Using a hover class style to animate effects 108
Chapter 5: Embedding HTML5 Native Audio and Video 111
Native media and compatibility 111
Laying the groundwork 112
Preparing native audio 112
Audio compression 113
Browser support for audio files 113
Embedding an HTML5 audio element in a Dreamweaver web page 114
Alternative audio options 115Embedding HTML5 audio 118
Embedding native video 119
HTML5 video and Dreamweaver 120
Early video formats 120
Flash video (FLV) 121
Apple devices and web video 123
Preparing native video files 124
Native video formats 124
Browsers that do NOT support HTML5 125
Preparing HTML5 video for every scenario 125
Compressing video for the Web 125
Video compression – open source and proprietary 126
Converting video to web formats with open source tools 127
Dreamweaver site management for HTML5 video 128
Defining the HTML5 <video> element 129
Prerequisites 129
Defining the <video> element 130
Defining video attributes 130
Defining video source(s) 131
Alternate video for non-HTML5 environments 131
Putting it all together 132
Testing HTML5 video pages 132
Previewing a video in Live View 132
Embedding an HTML5 video 133
Summary 136
Chapter 6: Responsive Design with Media Queries 137
How Media Queries work 138
A short history of Media Queries 139
HTML5, CSS3, and Media Queries 141
Styling for mobile devices and tablets 141
Media Queries versus jQuery Mobile and apps 142
Building alternative stylesheets 145
Preparing to generate a Media Query 145
Assigning styles to different media 146
Chapter 7: Creating Mobile Sites with jQuery Mobile 159What is jQuery Mobile? 162
Mobile pages in Split view 165
Previewing jQuery Mobile pages in Live view 166
The HTML5 data-role property 167
Data-role pages 167
Customizing page content 169
Customizing content for different data roles 170Applying themes 172
Editing CSS in jQuery Mobile pages 173
Chapter 8: Enhancing Mobile Sites 181
Tables, div tags, and grids 184
Generating grids in Dreamweaver 185
Defining styles for layout grids 185
Building a collapsible block 188
Changing the initial block state 189
Changing block data-themes and styles 190
Editing collapsible block HTML 191
Forms in Dreamweaver 194
Creating a jQuery Mobile form 195
Special mobile form fields 197
Inserting a text input field 198
Inserting a slider 198
Inserting a toggle switch 199
Chapter 9: Customizing Themes with ThemeRoller 207
Applying jQuery Mobile theme swatches 208
Examining the five data-themes 208
Applying themes to specific elements 210
Customizing themes with ThemeRoller 211
The aesthetics of mobile color schemes 211
Launching ThemeRoller 212
Defining global theme attributes 214
Defining custom swatches 216
Creating additional swatches 218
Rolling a theme 218
Applying a custom theme in Dreamweaver 219
Summary 221
Chapter 10: Building Apps with PhoneGap 223
Apps and mobile websites 224
Android and iOS 224
Understanding PhoneGap 225
Before building apps 226
Creating a PhoneGap Build service account 227
Downloading the Android SDK 227
PhoneGap and Dreamweaver 229
Configuring PhoneGap settings 229
Generating apps with Dreamweaver 231
Testing and distributing apps 235
Testing apps with an emulator 235Revising your app 237
Scanning apps into your Android device 238
Downloading apps 240
Distributing Apps 241
Summary 242
Index 245