LiveLessons
2 total works
Learning Responsive Web Design LiveLessons (Video Training)
by Jennifer Kyrnin
Published 15 March 2017
Learning Responsive Web Design LiveLessons
A quick, easy-to-understand video course for beginners on the fundamentals of responsive web design
Description
Learning Responsive Web Design LiveLessons provides web designers and developers with a practical introduction to responsive web design, which is used to create websites that work across many different types of devices-from small screen cell phones to large- and multi-screen monitors.
Jennifer Kyrnin is a working web designer and has been teaching and writing about web design, HTML, and web development since 1995. She is a freelance web designer and author, writing regularly for several websites on the Internet. She also teaches and writes about web design, HTML, CSS, JavaScript, PHP, Bootstrap, and XML and is the author of five books related to the Internet and web design.
Skill Level
Beginner
Intermediate
You Will Learn How To:
Create effective and reliable responsive designs with CSS3, HTML5, and JavaScript
Use progressive enhancement to consistently provide the right content while making the most of each device and browser
Establish breakpoints and write CSS media queries to respond appropriately to each user agent
Choose the right layout and wireframing approach for your site
Use web fonts to control typography and choose sizes that look good on any device
Master three ways to make tables responsive
Build responsive forms using the latest HTML5 tags and attributes
Implement responsive navigation patterns that users understand intuitively
Test for responsiveness and performance
Use Responsive Design + Server Side Components (RESS) to optimize performance
Who Should Take This Course
Web designers and developers who want to quickly get up to speed with the fundamentals of responsive web design
Course Requirements
Basic understanding of HTML and CSS
New Player Enables Streaming and Download Access
Now you can stream and download videos for unlimited 24/7 online/offline access and ownership.
Streaming - Watch instantly as the video streams online in real time; after purchase, simply click Watch Now to get started.
Download - Download video files for offline viewing anytime, anywhere; after purchase, simply click the Download icon within the player and follow the prompts.
Table of Contents
Lesson 1: Introducing Responsive Web Design (RWD) 1.1Learn What Responsive Web Design Is 1.2Learn the History of Responsive Web Design or RWD 1.3Understand the Alternatives to RWD 1.4Why RWD is the Best Choice for Modern Web Development 1.5Understand How RWD Helps Design for Different Situations
Lesson 2: HTML, CSS, and JavaScript for RWD 2.1Understand the Basics of HTML 2.2Review JavaScript Basics 2.3Get Started with Cascading Style Sheets
Lesson 3: CSS Media Queries 3.1Get Started With Media Queries 3.2How to Write Media Query Expressions
Lesson 4: Breakpoints 4.1Understand BreakPoints 4.2How to Define Breakpoints 4.3Optimal Breakpoints 4.4My Favorite Breakpoints
Lesson 5: Creating Responsive Layouts 5.1Understand Responsive Web Layouts 5.2Types of Layouts 5.3Using Columns in Responsive Layouts 5.4Using Tables for Web Layouts-Pros and Cons
Lesson 6: Responsive Navigation 6.1The Importance of Responsive Navigation 6.2How to Make Mobile-Friendly Navigation 6.3Pros and Cons of Standard RWD Navigation Patterns
Lesson 7: Responsive Images 7.1How to Make Images Responsive 7.2Keep the Download Speeds Fast 7.3Use Retina-Ready Images
Lesson 8: Responsive Video 8.1How to Make Video Responsive 8.2Make YouTube Videos Responsive 8.3Make a Video Background
Lesson 9: Responsive Web Tables 9.1Problems With Tables on Small Devices 9.2How to Make Tables Responsive 9.3Layout Tables Are Valid
Lesson 10: Responsive Web Forms 10.1Use Modern HTML 10.2Make Web Forms Usable 10.3Build a Responsive Form
Lesson 11: Testing RWD Sites 11.1Test in Your Favorite Browser, but Don't Stop There 11.2How to Use Google Developer Tools for Testing 11.3Use Devices, if You Can 11.4How to Test When You Don't Have the Devices
Lesson 12: Best Practices for RWD 12.1Make the Best Site You Can for the Most People 12.2Avoid the Common RWD Problems and Pitfalls
About LiveLessons
LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include: IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at http://www.informit.com/imprint/series_detail.aspx?ser=2185116
A quick, easy-to-understand video course for beginners on the fundamentals of responsive web design
Description
Learning Responsive Web Design LiveLessons provides web designers and developers with a practical introduction to responsive web design, which is used to create websites that work across many different types of devices-from small screen cell phones to large- and multi-screen monitors.
Jennifer Kyrnin is a working web designer and has been teaching and writing about web design, HTML, and web development since 1995. She is a freelance web designer and author, writing regularly for several websites on the Internet. She also teaches and writes about web design, HTML, CSS, JavaScript, PHP, Bootstrap, and XML and is the author of five books related to the Internet and web design.
Skill Level
Beginner
Intermediate
You Will Learn How To:
Create effective and reliable responsive designs with CSS3, HTML5, and JavaScript
Use progressive enhancement to consistently provide the right content while making the most of each device and browser
Establish breakpoints and write CSS media queries to respond appropriately to each user agent
Choose the right layout and wireframing approach for your site
Use web fonts to control typography and choose sizes that look good on any device
Master three ways to make tables responsive
Build responsive forms using the latest HTML5 tags and attributes
Implement responsive navigation patterns that users understand intuitively
Test for responsiveness and performance
Use Responsive Design + Server Side Components (RESS) to optimize performance
Who Should Take This Course
Web designers and developers who want to quickly get up to speed with the fundamentals of responsive web design
Course Requirements
Basic understanding of HTML and CSS
New Player Enables Streaming and Download Access
Now you can stream and download videos for unlimited 24/7 online/offline access and ownership.
Streaming - Watch instantly as the video streams online in real time; after purchase, simply click Watch Now to get started.
Download - Download video files for offline viewing anytime, anywhere; after purchase, simply click the Download icon within the player and follow the prompts.
Table of Contents
Lesson 1: Introducing Responsive Web Design (RWD) 1.1Learn What Responsive Web Design Is 1.2Learn the History of Responsive Web Design or RWD 1.3Understand the Alternatives to RWD 1.4Why RWD is the Best Choice for Modern Web Development 1.5Understand How RWD Helps Design for Different Situations
Lesson 2: HTML, CSS, and JavaScript for RWD 2.1Understand the Basics of HTML 2.2Review JavaScript Basics 2.3Get Started with Cascading Style Sheets
Lesson 3: CSS Media Queries 3.1Get Started With Media Queries 3.2How to Write Media Query Expressions
Lesson 4: Breakpoints 4.1Understand BreakPoints 4.2How to Define Breakpoints 4.3Optimal Breakpoints 4.4My Favorite Breakpoints
Lesson 5: Creating Responsive Layouts 5.1Understand Responsive Web Layouts 5.2Types of Layouts 5.3Using Columns in Responsive Layouts 5.4Using Tables for Web Layouts-Pros and Cons
Lesson 6: Responsive Navigation 6.1The Importance of Responsive Navigation 6.2How to Make Mobile-Friendly Navigation 6.3Pros and Cons of Standard RWD Navigation Patterns
Lesson 7: Responsive Images 7.1How to Make Images Responsive 7.2Keep the Download Speeds Fast 7.3Use Retina-Ready Images
Lesson 8: Responsive Video 8.1How to Make Video Responsive 8.2Make YouTube Videos Responsive 8.3Make a Video Background
Lesson 9: Responsive Web Tables 9.1Problems With Tables on Small Devices 9.2How to Make Tables Responsive 9.3Layout Tables Are Valid
Lesson 10: Responsive Web Forms 10.1Use Modern HTML 10.2Make Web Forms Usable 10.3Build a Responsive Form
Lesson 11: Testing RWD Sites 11.1Test in Your Favorite Browser, but Don't Stop There 11.2How to Use Google Developer Tools for Testing 11.3Use Devices, if You Can 11.4How to Test When You Don't Have the Devices
Lesson 12: Best Practices for RWD 12.1Make the Best Site You Can for the Most People 12.2Avoid the Common RWD Problems and Pitfalls
About LiveLessons
LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include: IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at http://www.informit.com/imprint/series_detail.aspx?ser=2185116
5 Hours of Video Instruction
Your complete HTML & CSS video course: Learn the fundamentals of HTML and CSS, and master hands-on, real-world skills for creating your own web pages.
Description
In Learning HTML & CSS LiveLessons, Jennifer Kyrnin helps you master the core real-world skills you need to create your own web pages using HTML and CSS.
Drawing on her experience helping thousands of people learn HTML, XML, and web design, Jennifer Kyrnin guides you from the absolute basics all the way to creating responsive web layouts and beyond. One step at a time, you learn how to create and post HTML to a hosting service; build a basic HTML document; write a CSS style sheet; use internal and external style sheets; build and style HTML text; create HTML5 outlines; adjust fonts and typography; choose and change colors; create CSS3 rounded corners; and even add HTML5 web video and audio. Everything's organized into bite-sized, self-contained lessons, so you can learn key HTML and CSS skills quickly and easily.
Skill Level
* Beginner
* Intermediate
What You Will Learn
* Design and create eye-catching web pages
* Customize your pages with Cascading Style Sheets (CSS)
* Position images, columns, and headings on a page
* Format text, data tables, links, and media
* Publish your pages to a web server
* Create online forms
* Enhance your site with dynamic content
Who Should Take This Course
* All beginning web page authors and others who need to know how to quickly and easily get a web page up and running for home, school, or work
* Professional and casual web page authors at all levels
Course Requirements
* Basic experience text editors and managing files; no HTML or CSS experience necessary
Table of Contents
Introduction
Lesson 1: Introducing HTML
1.1 Understand the basics of HTML
1.2 Choose a tool for writing HTML
1.3 Post HTML to a hosting service
1.4 Define HTML5
Lesson 2: Building a Basic HTML Document
2.1 Build a simple web page
2.2 Recognize the standard HTML tags for every web page
2.3 Add paragraphs and line breaks
2.4 Create HTML headlines
2.5 Use semantic tags
2.6 Write links to other web pages
Lesson 3: Introducing CSS
3.1 Define CSS
3.2 Use inline styles
3.3 Write a basic CSS style sheet
3.4 Use internal and external style sheets
3.5 Add CSS classes and IDs
3.6 Understand the basics of CSS3
Lesson 4: Building and Styling HTML Text
4.1 Align text
4.2 Write ordered and unordered lists
4.3 Create definition lists
4.4 Add two types of quotations
Lesson 5: Understanding HTML5 Semantic Elements
5.1 Recognize sectioning elements
5.2 Add figures
5.3 Include document headers and footers
5.4 Create HTML5 outlines
Lesson 6: Adjusting Fonts and Typography
6.1 Change text to bold and italics
6.2 Change the font size
6.3 Understand line-height, leading, and fancy typography
6.4 Use web fonts
6.5 Add special characters to pages
Lesson 7: Decorating Pages with Color
7.1 Choose colors for web designs
7.2 Understand color systems
7.3 Change the foreground color
7.4 Change the background color
Lesson 8: Adjusting the Borders of Elements
8.1 Understand the CSS box model
8.2 Adjust the margins and padding
8.3 Change the border with the border property
8.4 Create CSS3 rounded corners
Lesson 9: Adding Images and Multimedia
9.1 Add images to web pages
9.2 Position images
9.3 Use background images
9.4 Link to documents and PDFs
9.5 Add HTML5 video and audio
9.6 Make multimedia responsive
Lesson 10: Writing Tables
10.1 Build a simple HTML table
10.2 Add table headlines
10.3 Dress up tables with CSS
10.4 Adjust table cell alignment and spanning
10.5 Make tables responsive
Lesson 11: Building and Using HTML Forms
11.1 Create a basic form
11.2 Use HTML5 input fields
11.3 Add in other form input fields
11.4 Validate forms
11.5 Submit form data
Lesson 12: Creating Responsive Web Layouts
12.1 Understand how to pick a good layout
12.2 Define the difference between fixed-width and liquid layouts
12.3 Define mobile-first and understand why to use it
12.4 Use CSS media queries to create a responsive layout
12.5 Choose breakpoints
12.6 Know responsive design best practices
About LiveLessons Video Training
The LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at http://www.informit.com/livelessons.
Your complete HTML & CSS video course: Learn the fundamentals of HTML and CSS, and master hands-on, real-world skills for creating your own web pages.
Description
In Learning HTML & CSS LiveLessons, Jennifer Kyrnin helps you master the core real-world skills you need to create your own web pages using HTML and CSS.
Drawing on her experience helping thousands of people learn HTML, XML, and web design, Jennifer Kyrnin guides you from the absolute basics all the way to creating responsive web layouts and beyond. One step at a time, you learn how to create and post HTML to a hosting service; build a basic HTML document; write a CSS style sheet; use internal and external style sheets; build and style HTML text; create HTML5 outlines; adjust fonts and typography; choose and change colors; create CSS3 rounded corners; and even add HTML5 web video and audio. Everything's organized into bite-sized, self-contained lessons, so you can learn key HTML and CSS skills quickly and easily.
Skill Level
* Beginner
* Intermediate
What You Will Learn
* Design and create eye-catching web pages
* Customize your pages with Cascading Style Sheets (CSS)
* Position images, columns, and headings on a page
* Format text, data tables, links, and media
* Publish your pages to a web server
* Create online forms
* Enhance your site with dynamic content
Who Should Take This Course
* All beginning web page authors and others who need to know how to quickly and easily get a web page up and running for home, school, or work
* Professional and casual web page authors at all levels
Course Requirements
* Basic experience text editors and managing files; no HTML or CSS experience necessary
Table of Contents
Introduction
Lesson 1: Introducing HTML
1.1 Understand the basics of HTML
1.2 Choose a tool for writing HTML
1.3 Post HTML to a hosting service
1.4 Define HTML5
Lesson 2: Building a Basic HTML Document
2.1 Build a simple web page
2.2 Recognize the standard HTML tags for every web page
2.3 Add paragraphs and line breaks
2.4 Create HTML headlines
2.5 Use semantic tags
2.6 Write links to other web pages
Lesson 3: Introducing CSS
3.1 Define CSS
3.2 Use inline styles
3.3 Write a basic CSS style sheet
3.4 Use internal and external style sheets
3.5 Add CSS classes and IDs
3.6 Understand the basics of CSS3
Lesson 4: Building and Styling HTML Text
4.1 Align text
4.2 Write ordered and unordered lists
4.3 Create definition lists
4.4 Add two types of quotations
Lesson 5: Understanding HTML5 Semantic Elements
5.1 Recognize sectioning elements
5.2 Add figures
5.3 Include document headers and footers
5.4 Create HTML5 outlines
Lesson 6: Adjusting Fonts and Typography
6.1 Change text to bold and italics
6.2 Change the font size
6.3 Understand line-height, leading, and fancy typography
6.4 Use web fonts
6.5 Add special characters to pages
Lesson 7: Decorating Pages with Color
7.1 Choose colors for web designs
7.2 Understand color systems
7.3 Change the foreground color
7.4 Change the background color
Lesson 8: Adjusting the Borders of Elements
8.1 Understand the CSS box model
8.2 Adjust the margins and padding
8.3 Change the border with the border property
8.4 Create CSS3 rounded corners
Lesson 9: Adding Images and Multimedia
9.1 Add images to web pages
9.2 Position images
9.3 Use background images
9.4 Link to documents and PDFs
9.5 Add HTML5 video and audio
9.6 Make multimedia responsive
Lesson 10: Writing Tables
10.1 Build a simple HTML table
10.2 Add table headlines
10.3 Dress up tables with CSS
10.4 Adjust table cell alignment and spanning
10.5 Make tables responsive
Lesson 11: Building and Using HTML Forms
11.1 Create a basic form
11.2 Use HTML5 input fields
11.3 Add in other form input fields
11.4 Validate forms
11.5 Submit form data
Lesson 12: Creating Responsive Web Layouts
12.1 Understand how to pick a good layout
12.2 Define the difference between fixed-width and liquid layouts
12.3 Define mobile-first and understand why to use it
12.4 Use CSS media queries to create a responsive layout
12.5 Choose breakpoints
12.6 Know responsive design best practices
About LiveLessons Video Training
The LiveLessons Video Training series publishes hundreds of hands-on, expert-led video tutorials covering a wide selection of technology topics designed to teach you the skills you need to succeed. This professional and personal technology video series features world-leading author instructors published by your trusted technology brands: Addison-Wesley, Cisco Press, IBM Press, Pearson IT Certification, Prentice Hall, Sams, and Que. Topics include IT Certification, Programming, Web Development, Mobile Development, Home and Office Technologies, Business and Management, and more. View all LiveLessons on InformIT at http://www.informit.com/livelessons.