REALISING DESIGN PRINCIPLES IN CODE - Bootstrap, Navbars, Responsive Grid - [COURSE 2/6 - WEEK 2]

Subscribe to Help me Upload More Courses From the Best Universities in the World, if you are interested in any topic, Request it in the Comments.

Facebook -
Twitter -
Tik Tok -
Kwai - YouCourse - @yourcourse

Subscribe! Free Music - Creative Commons

Thank's For Support!


The University of London is a federal University which includes 18 world leading Colleges. Our distance learning programmes were founded in 1858 and have enriched the lives of thousands of students, delivering high quality University of London degrees wherever our students are across the globe. Our alumni include 7 Nobel Prize winners. Today, we are a global leader in distance and flexible study, offering degree programmes to over 50,000 students in over 180 countries. To find out more about studying for one of our degrees where you are, visit


In this course you will learn how to apply concepts from interaction design and human computer interaction in order to design and build an interactive, professional looking website. You will learn how to make your web page designs adapt to different screen sizes using responsive grid layouts. You will learn how to add navigation and other design elements, and you will learn how to separate data and display using JavaScript objects and templates.

At the end of the course, you will be able to:
1. Explain why users need to know where they are, where they can go and what is on a web page
2. Create wireframe mockups of web pages
3. Identify the key functional elements of web pages
4. Use Bootstrap components to realise page designs
5. Use JavaScript data structures such as arrays and objects to define the data used in a web page
6. Use the Handlebars template library to convert data to HTML
7. Add interactivity to templates using JavaScript event listeners


Welcome to the second module of 'Responsive Web Design'. By the end of this module you will be able to set up a basic Bootstrap site and build Bootstrap collapsible, responsive navbars using titles and breadcrumb trails and you'll also be able to build multiple layouts in one with a responsive grid. We'll also be looking at installing Bootstrap themes. Enjoy!

00:00 - 00:36 - Overview 42s
00:36 - 07:39 - Basic Bootstrap set up 7m
07:39 - 14:14 - Where can you go? 6m
14:14 - 22:49 - Collapsible navbars 8m
22:49 - 35:28 - Building out the site 12m
35:28 - 46:11 - Where am I? 10m
46:11 - 1:01:17 - Responsive grid 15m
1:01:17 - 1:05:13 - Bootstrap themes 4m
1:05:13 - 1:05:44 - Summary 35s

---------------- SEE YOU IN THE WEEK 3 - Adding content to websites ---------------------

Don't forget to subscribe and like that helps me keep uploading videos

Thank's For Support!
Web design
Be the first to comment