Developing Mobile Websites with Responsive Web Design and jQuery Mobile
Duration: 35 hours
Prerequisites: Knowledge of HTML, CSS, JavaScript and jQuery
Students Will Learn:
- Overview of HTML5
- Design Strategies and Layout
- Using the Viewport and Media Queries
- Responsive Typography and Media
- Responsive Design Approaches to Navigation and Layout
- Responsive Design Approaches to Tables and Forms
- Mobile-Related APIs
- Additional HTML5 APIs
- Introduction to jQuery Mobile
- Styling jQuery Mobile Pages with Themes
- Working with jQuery Mobile Pages
- Working with Toolbars
- Adding Content to a jQuery Mobile Page
- Listviews
- jQuery Mobile JavaScript API
- Working with Events in jQuery Mobile
- Formatting Page Content
- Adding Dialogs and Popups
- Integrating Panels
- Displaying Tabbed Content
- Creating Responsive Tables in jQuery Mobile
- Adding Collapsible Content
- Using the Filterable Widget
- Creating Forms in jQuery Mobile
Course Description:
This hands-on course conveys the fundamental skills necessary to design and build responsive web sites for mobile devices such as phones and tablets. Attendees will use responsive web design (RWD) techniques such as CSS3 media queries and flexible layouts to build mobile-compatible web sites. Students will learn how to test mobile websites using emulators and simulators.
The course also provides an extensive introduction into using the jQuery Mobile Framework for building mobile-specific web sites. Students will learn how to use jQuery Mobile widgets to create forms, lists, toolbars and collapsible blocks. Students will also learn how to integrate SOA with a mobile web site including working with RSS feeds, Google Maps integration and implementing server-side data access.
Attendees will use ThemeRoller for jQuery Mobile to download existing or custom theme swatches to format the appearance of a web site. Additional topics include responding to user events, configuring jQuery Mobile defaults and using page transitions. Comprehensive hands on exercises are integrated throughout to reinforce learning and develop real competency.
Course Overview:
Overview of Responsive Web Design
|
Viewport and Media Queries
|
Creating Responsive Layouts
|
Overview of jQuery Mobile
|
Overview of the jQuery Mobile CSS Framework
|
Creating jQuery Mobile Pages
|
Adding Content to a Page
|
Using jQuery Mobile Widgets
|
Adding Toolbars to a Page
|
Working with List Views
|
Working with Forms
|
Working with Buttons
|
Responding to Events
|
Integrating JavaScript and jQuery Mobile
|
Creating Popups
|
Adding Panels
|
Displaying Pages as Dialogs
|
Creating a Tabbed Interface
|
Creating Responsive Tables
|
Adding Collapsible Content
|
Making Content Filterable
|
Web Services Integration
|
Related Bootcamp:
Track | Duration | Price |
---|---|---|
Web Developer | 4-course track 5-course track 6-course track 7-course track 8-course track |
$4,800 $6,000 $7,200 $8,400 $9,600 |