Responsive Web Design Basics
A 13-part course with Bitesize Business School
Start Free Preview Start CourseCourse Overview
Teacher
I'm a software engineer and entrepreneur. I've also started several businesses. Bitesizebschool.com is the latest, where I write about applying business principles to the real world and solving technology issues that every online business faces. I'm... View ProfileDetails
- Total Time 2 hr, 26 min
- Lessons 13
- Attachments 22
- Exercises 44
-
80 CQ
13 Lessons in This Course
-
21 minFREEUI/UX Design lesson 1Free11 CQ
Learn the principles of responsive web design, by understanding the different types of websites, grid layouts, media queries, and much more.
Learn the principles of responsive web design, by understanding the different types of websites, grid layouts, media queries, and much more.
-
8 minUI/UX Design lesson 25 CQ
Review the projects folder that you'll use throughout this course, and learn the difference between browser testing on an emulator versus a real device.
Review the projects folder that you'll use throughout this course, and learn the difference between browser testing on an emulator versus a real device.
-
4 minUI/UX Design lesson 33 CQ
In this lesson, learn how to enable developer tools in the most popular web browsers: Chrome, Safari, and Firefox, as well as on the iPhone.
In this lesson, learn how to enable developer tools in the most popular web browsers: Chrome, Safari, and Firefox, as well as on the iPhone.
-
9 minUI/UX Design lesson 45 CQ
In this responsive web design lesson, discover how to use the web developer tools in Safari and Chrome to inspect elements within a page and debug.
In this responsive web design lesson, discover how to use the web developer tools in Safari and Chrome to inspect elements within a page and debug.
-
18 minUI/UX Design lesson 510 CQ
The ability to create a responsive website is a necessity for any web designer or developer. In this lesson, discover the ins and outs of responsive design.
The ability to create a responsive website is a necessity for any web designer or developer. In this lesson, discover the ins and outs of responsive design.
-
7 minAdobe Suite lesson 64 CQ
In this responsive web design lesson from Bitesize Business School, learn how to slice an image in Photoshop to create varying sizes of it for media queries.
In this responsive web design lesson from Bitesize Business School, learn how to slice an image in Photoshop to create varying sizes of it for media queries.
-
10 minUI/UX Design lesson 76 CQ
Now that you've learned how to slice images in Photoshop, discover how to take those sliced images and implement their varying sizes into a responsive website.
Now that you've learned how to slice images in Photoshop, discover how to take those sliced images and implement their varying sizes into a responsive website.
-
8 minUI/UX Design lesson 85 CQ
In this web design lesson from Bitesize Business School, learn how to customize a WordPress theme's CSS stylesheets to create a more responsive website.
In this web design lesson from Bitesize Business School, learn how to customize a WordPress theme's CSS stylesheets to create a more responsive website.
-
13 minUI/UX Design lesson 97 CQ
In this lesson in responsive retrofitting, follow along to help debug an existing website and make it responsive using web design problem-solving techniques.
In this lesson in responsive retrofitting, follow along to help debug an existing website and make it responsive using web design problem-solving techniques.
-
4 minUI/UX Design lesson 103 CQ
In this web design lesson from Bitesize Business School, discover how to add a responsive YouTube video to your web page using a media query.
In this web design lesson from Bitesize Business School, discover how to add a responsive YouTube video to your web page using a media query.
-
7 minUI/UX Design lesson 114 CQ
In this lesson, learn how to access, use, and download tables for responsive web design, then make them work within your site's existing framework.
In this lesson, learn how to access, use, and download tables for responsive web design, then make them work within your site's existing framework.
-
17 minUI/UX Design lesson 129 CQ
In this lesson from Bitesize Business School, learn how to implement a responsive grid system for your website using stock grids and grid generators.
In this lesson from Bitesize Business School, learn how to implement a responsive grid system for your website using stock grids and grid generators.
-
15 minUI/UX Design lesson 138 CQ
Do you want to add a carousel to your homepage or an image slideshow to your portfolio website? Learn how in this responsive web design lesson.
Do you want to add a carousel to your homepage or an image slideshow to your portfolio website? Learn how in this responsive web design lesson.
-
10121 min10-part UI/UX Design course66 CQ
CSS animations and transitions allow web developers to create dynamic graphical user interface without JavaScript. Learn how to improve user experience with relatively simple CSS coding and syntax.
CSS animations and transitions allow web developers to create dynamic graphical user interface without JavaScript. Learn how to improve user experience with relatively simple CSS coding and syntax.
-
880 min8-part Entrepreneurship course44 CQ
Join in with this course from Bitesize Business School to review the basics of branding. Covered are tips for creating a cohesive brand using the perfect company name, logo, website, and more.
Join in with this course from Bitesize Business School to review the basics of branding. Covered are tips for creating a cohesive brand using the perfect company name, logo, website, and more.
-
26150 min26-part Microsoft Office course89 CQ
Discover some of Microsoft Excel's most handy formulas, shortcuts, and add-ins in this course. From sorting through data, to using a solver to optimize values, increase your Excel productivity today.
Discover some of Microsoft Excel's most handy formulas, shortcuts, and add-ins in this course. From sorting through data, to using a solver to optimize values, increase your Excel productivity today.
-
10126 min10-part Web Development course67 CQ
Ready to level up your web development skills? If you want to add a more powerful user experience to the web pages you create, this jQuery overview course can help you get there faster.
Ready to level up your web development skills? If you want to add a more powerful user experience to the web pages you create, this jQuery overview course can help you get there faster.
-
548 min5-part Audio Editing course26 CQ
This course from Bitesize Business School walks through each element for setting up your own mini home recording studio, from equipment to techniques, for recording online classes, podcasts, and more!
This course from Bitesize Business School walks through each element for setting up your own mini home recording studio, from equipment to techniques, for recording online classes, podcasts, and more!
-
60671 min60-part UI/UX Design course363 CQ
Understanding the technical aspects of application development is tough enough, and if coders made apps for themselves, that would be the only important thing. Yet out in the world, programmers face demanding clients and users. In this course, learn the principles of User Experience Design. Review how to plan and scope a project, identify user needs, manage the project team, and finally test and prototype a functional, navigable, and visually appealing app that pleases the client and the user.
with LearnToProgramUnderstanding the technical aspects of application development is tough enough, and if coders made apps for themselves, that would be the only important thing. Yet out in the world, programmers face demanding clients and users. In this course, learn the principles of User Experience Design. Review how to plan and scope a project, identify user needs, manage the project team, and finally test and prototype a functional, navigable, and visually appealing app that pleases the client and the user.
-
14245 min14-part UI/UX Design course130 CQ
Different devices have different browsing viewports. In this course, learn how to create a responsive design webpage so your website’s text, images, and videos scale appropriately with browser size!
with Brian Wood TrainingDifferent devices have different browsing viewports. In this course, learn how to create a responsive design webpage so your website’s text, images, and videos scale appropriately with browser size!
-
10121 min10-part UI/UX Design course66 CQ
CSS animations and transitions allow web developers to create dynamic graphical user interface without JavaScript. Learn how to improve user experience with relatively simple CSS coding and syntax.
CSS animations and transitions allow web developers to create dynamic graphical user interface without JavaScript. Learn how to improve user experience with relatively simple CSS coding and syntax.
-
33171 min33-part UI/UX Design course101 CQ
If you're familiar with writing HTML, Java, or CSS -- then you know that there's more to creating a website or app than just writing reliable code. The project also needs the right look and feel to engage the user and provide a high-quality user experience. In this course, learn about the fundamental principles of design. Learn about using color, space, typography, layout hierarchy, and more. Finally, review user expectations and learn how to create a design that meets them!
with LearnToProgramIf you're familiar with writing HTML, Java, or CSS -- then you know that there's more to creating a website or app than just writing reliable code. The project also needs the right look and feel to engage the user and provide a high-quality user experience. In this course, learn about the fundamental principles of design. Learn about using color, space, typography, layout hierarchy, and more. Finally, review user expectations and learn how to create a design that meets them!
-
25110 min25-part UI/UX Design course68 CQ
If you're considering redesigning your website, this essential course from Digital Media professor Kristen Palana covers how to take an old website and give it a makeover to boost your web presence!
with Kristen PalanaIf you're considering redesigning your website, this essential course from Digital Media professor Kristen Palana covers how to take an old website and give it a makeover to boost your web presence!
-
759 min7-part Web Development course34 CQ
This beginner-level course is designed to help you learn the basics of web page design using HyperText Markup Language. Gain more control over your pages by learning to use stylesheets!
This beginner-level course is designed to help you learn the basics of web page design using HyperText Markup Language. Gain more control over your pages by learning to use stylesheets!
-
19140 min19-part Software Development course80 CQ
Want to add a layer of interactivity to your HTML website without wasting time on a programming language that isn’t built to last? Whether you’re new to coding or looking to brush up on old skills, you’ll find everything you need to know about JavaScript basics in these 19 lessons. Learn how to use operators, variables, conditional statements, loops, and more. By the end of this course, you should have the necessary tools to start building your own dynamic website or browser-based game.
with LearnToProgramWant to add a layer of interactivity to your HTML website without wasting time on a programming language that isn’t built to last? Whether you’re new to coding or looking to brush up on old skills, you’ll find everything you need to know about JavaScript basics in these 19 lessons. Learn how to use operators, variables, conditional statements, loops, and more. By the end of this course, you should have the necessary tools to start building your own dynamic website or browser-based game.
-
39360 min39-part Web Development course202 CQ
Build a fully featured mobile app using HTML5, CSS, JavaScript, jQuery, and AJAX. Structure and format the app using HTML5 and CSS, then use a variety of coding languages to enable more features.
with LearnToProgramBuild a fully featured mobile app using HTML5, CSS, JavaScript, jQuery, and AJAX. Structure and format the app using HTML5 and CSS, then use a variety of coding languages to enable more features.
-
25110 min25-part UI/UX Design course68 CQ
If you're considering redesigning your website, this essential course from Digital Media professor Kristen Palana covers how to take an old website and give it a makeover to boost your web presence!
with Kristen PalanaIf you're considering redesigning your website, this essential course from Digital Media professor Kristen Palana covers how to take an old website and give it a makeover to boost your web presence!
-
762 min7-part Web Development course37 CQ
Are you an ASP.NET Model View Controller (MVC) developer looking to learn an HTML-based structural framework for dynamic web apps? Get introduced to AngularJS in this coding course.
Are you an ASP.NET Model View Controller (MVC) developer looking to learn an HTML-based structural framework for dynamic web apps? Get introduced to AngularJS in this coding course.