IBM Course Code: VW410G
This course explains how to design and create web user interfaces for mobile devices. It covers various approaches to designing Mobile Web applications, including a mobile first approach, a prescriptive approach, and a responsive web design approach.
Through lectures and demonstrations, the course shows you how Cascading Style Sheets (CSS) define the formatting structure for a web page, and how to author CSS styles for HTML5 web pages. You learn how to build a fluid web page that responds to a range of computing devices, so that the page layout adapts to mobile phones, tablets, notebook, and desktop computers.
This course is designed for developers who create web pages for desktop and mobile devices.
What You'll Learn
- Describe the benefits of using style sheets
- Describe the various options for specifying style elements in HTML
- Explain how cascading style sheets (CSS) define the formatting of a web page
- Explain the syntax that is used in CSS
- Describe the use of selectors in CSS
- Describe the elements of a CSS box design: margin, borders, and padding
- Describe the inline, block, and inline-block layout models
- Explain the CSS visual formatting model
- Describe the three approaches to Mobile Web design
- List the advantages and disadvantages of each of the Mobile Web design approaches
- Describe the navigation patterns for multiple form factors
- Create a fluid web page layout with CSS positioning and display properties
- Use em-based measurements for page layout
- Target different devices and screen sizes with CSS media queries
- Explain the criteria for setting media breakpoints
- Create customized graphics with the CSS gradient feature
- Import custom fonts for web pages
- Describe how flexible grids help in the design and development of a responsive web design
- Describe the use of flexible images and media
Who Needs to Attend
This intermediate course is designed for web application developers who design and build Mobile Web applications.
You should have a basic knowledge of the design and layout of web pages with Hypertext Markup Language (HTML).
There are no follow-ons for this course.
- Course introduction
- Applying styles to web pages
- Demonstration: Reviewing the HTML and CSS files for a sample desktop web application
- Using style sheets to create a web page layout
- Demonstration: Applying layout and positioning to web pages with CSS
- Approaches to Mobile Web design
- Demonstration: Reviewing a dedicated mobile version of the application
- Designing web pages for different form factors
- Demonstration: Showing a responsive web design example
- CSS media queries and columns
- Demonstration: Examining media queries that support a responsive web design
- Building responsive Mobile Web pages
- Demonstration: Custom fonts and gradients
- Course summary