课程简介:
通过2天的课程,您将学习如何使用HTML5、CSS、Javascript和其他工具来建立响应式网站:无论用户使用的是智能手机,平板电脑或台式电脑/笔记本电脑,网站都能根据正在使用的客户端设备调整其布局。您将学习如何使用CSS媒体查询,移动友好的HTML5功能,JavaScript增强功能以及各种框架来建立一个在iPhone或Android上同台式机或笔记本电脑上看起来一样好的网站。
培训对象:
数字营销领域的决策者,销售人员,网络和IT管理者。
预备知识:
在HTML4的经验,基本的CSS和JavaScript概念。这将对掌握课程中所教授的HTML5,CSS3和JavaScript很有很大帮助。
课程内容:
1. Designing for Mobile
- Responsive Design: Good for all Devices
- Why It’s Worth It?
- Building Responsive Sites
2. Flexible Grids
- The Flexible Grid: A More Responsive Layout Strategy
- The Case for Flexible
- Case Study: The Jazz Calendar Site
- A First Complete Jazz Calendar Draft
- Making The Inflexible Flexible
- A Better Jazz Calendar
3. Flexible Images and Other Media
- Flexible Images and Other Media
- Improving the Jazz Calendar Site
- Flexible Background Images
4. Media Queries
- Media Queries
- Targeting Widths and Devices with CSS3 Media Queries
- Linearizing the Layout
- Using max-device-width
5. The Viewport
- The Viewport
6. HTML5: Mobile Specific
- New HTML5 Features
- Forms
- Chapter section
- Chapter section
7. GeoLocation API
- How it Works
- Browser and Device Support
- JavaScript Implementation
- A Simple Example
- Google Maps
- Jazz Calendar: Finding Nearby Gigs
8. Consolidating the Web with Native Extensions
- Consolidating the Web with Native Extensions
- Integrating with the Home Screen
- Other Devices
- A Homescreen Icon for the Jazz Calendar Site
- Hiding Browser UI
- Using the Accelerometer
9. Video
- Optimizing the Video Experience for Mobile
- Optimizing for Mobile
- Embedding from YouTube or Vimeo
- Hosting Your Own Videos
- Video Formats
- Controlling the Video through JavaScript
- Converting Video Formats
- Further Reading
10. jQuery Mobile
- jQuery Mobile
- Mobile Focus
- Supported Platforms
- The Basics
- A First Example
- Drag-and-Drop Code Builder
- Gestures
- Swiping to Change Pages
- Using data Attributes
- Handling Orientation Change
- What About Desktops?
11. Framework: Foundation
- Foundation: A Responsive Grid Framework
- At First Look at Foundation
- A Foundation Layout for Jazz Calendar
培训天数:
2天