- 3 hours on-demand video
- 3 downloadable resources
- Full lifetime access
- Access on mobile and TV
- Certificate of Completion
Get your team access to 4,000+ top Udemy courses anytime, anywhere.Try Udemy for Business
- The minimal information to know how to start designing responsive webpage
- Confidence to start seeking knowledge on your own
- Understand how most people achieve responsive webpage
- Know more alternatives to responsive design
- As minimum requirement, the only software tool that you need to write a responsive webpage code is any text editor. For Windows environment, Notepad++ is recommended.
Of course we shall see how people are doing this in the contemporary mainstream web design, and also the educated suggestions of a better diversion from the mainstream.
- Busy professionals or students who need straightforward and fast teaching material to learn
- Professionals or students who need cost effective budget to learn mainly responsive design
You will be given some introductory definitions and and pre-requisites to excel in this course. In this video, the per-requisite is about the tools that you will be using.
This lecture / tutorial talks about the first and foremost requirement to follow this course, i.e. some surface knowledge on HTML.
This is the first video on editing the first chosen template. You are taught how to choose Google keywords, download it then unpack. You are also given some advice on the best practices with regards to template editing.
The template used is the one obtained from HTML5UP. If you cannot find it from the portal shown in the video, or if it is not available anymore, you can download it from the downloadable materials section.
This is the seventh and second last video of this section. In this video, the tutorial is on editing the second template downloaded from Zypop. The package was explored and editing was done on the carousel that it provides.
If you cannot find the package used in this video, or if it is not available anymore, you can download it from downloadable materials section.
First video on tutorial on Bootstrap 3, we start by adding the compulsory viewport meta tag and we explore the effect with and without this tag on a real small smartphone device.
Third video is about the first thing that you need to know about Bootstrap, i.e. the concept of 12-columns grid system. Then we learn how to wrap the web content in a container and row div-s so that the grid system works as expected with the various display sizes supported.
This lecture is the first of five part of this course on coding responsive webpage by your own code. It teaches how to program your own Bootstrap-like grid system. You can decide your own boundary to switch from a device size to a different one. You can modify layout blocks of <div> according to this boundary you defined.
The key knowledge you need to have and obtained in this lecture is the CSS statement of media query.
This is the second of five videos on coding responsive webpage from scratch. It is an extensive explanation about collapsible table and the starting point to start to code it by being able to read the rows of the source table using jQuery.
You can download the HTML snippet that is used in this tutorial from the resources uploaded here.
In this fourth of five videos on coding responsive website from scratch, the tutorial shows,
how to read the first row of the source table, then list the items in it in every first level item of target list, then
attach the data from each corresponding column and row.
At the end, the tutorial also shows how to test that we are populating the list with correct data from the table.
In this last of five videos on coding responsive webpage from scratch, the tutorial shows how to manipulate the display property in CSS according to device size (using media query) so that only either the table or the list is rendered, not both.
And since this the last lecture, it also concludes the first release of this course.
There will be more updates of new topics and materials.