Responsive Html5 Theme Development
4.4 (4 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,518 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Responsive Html5 Theme Development to your Wishlist.

Add to Wishlist

Responsive Html5 Theme Development

Lets build a blog theme using html5 and css3 technologies like media queries, which could easily be ported to wordpress.
4.4 (4 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
1,518 students enrolled
Created by Lamin Sanneh
Last updated 6/2014
Current price: $10 Original price: $20 Discount: 50% off
5 hours left at this price!
30-Day Money-Back Guarantee
  • 1 hour on-demand video
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Learn How to get started with responsive design by doing
  • Learn about some of the decisions you have to make when building a responsive website
  • Get an idea of what responsive design is
View Curriculum
  • Any text editor will do
  • A modern browser, chrome recommended
  • A basic knowledge of html and css

Responsive web design has gained a lot of momentum within the past 5 years. In today's market of countless mobile devices, you are one step ahead in terms of web marketting when you have a responsive mobile website. In light of that, why not take the opportunity to learn how to get started with transitioning from building old, non-responsive website to the modern web world of fluid and engaging mobile-friendly web designs.

In this course, using direct approaches, I will teach how to build such websites. This is a very focussed course and I intentionally removed unnecessary material which I believe only distracts students from what they need to know. I know this from experience, and hence the reason the course is not that long. So lean back , relax and come along this exciting journey which is responsive web design.

Please donot forget to give feedback so I can improve future courses and also I'll know how I am doing with this course. I'll appreciate it and plus it'd take less than a minute, so go on click that feedback button.

Who is the target audience?
  • This course is by default targetted at beginners who have knowledge of html but want to get started building responsive websites.
  • More advanced users could benefit from it as well because there is emphasis on clean code, class names, css organisation and such.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
12 Lectures
3 Lectures 19:07

In this video, introducing the course and what we'll be covering.

Preview 03:27

In this video, well prepare the starting html for our theme.

Preview 11:29

No, we'll introduce a grid system. I'll show you how to download the custom grid I made and how to insert it into the theme.

Preview 04:11
The Main Content and Sidebar
3 Lectures 25:33

Now we'll start applying the grid system to the main content and sidebar. This will create two columns, one for main content and another for sidebar. They will also become responsive as a result of this.

Applying The Grid to The Main Content and Sidebar

Here we'll style the main content. We'll style each individual item then the whole container.

Styling The Blogpost List

Here, we'll be styling the sidebar. Also, we'll style the individual widgets in there and prepare them for possible wordpress usage in the future.

Styling The Sidebar
The Header
3 Lectures 15:20

We'll be making the header content aligned with the rest of the main content by applying the grid there as well.

Applying The Grid to The Header

We'll now style the logo and float it to the left, give it a height and vertically center it.

Styling The Logo

We'll be styling the navigation elements, float them to the right and vertically center them. We'll also make them responsive by using custom media queries outside of the grid system.

Styling The Nav Links
The Footer and Pagination Links
3 Lectures 11:56

Lets style the footer by centering it and add some margin.

Styling The Footer

Here, we'll create a page which looks similar to the homepage but it will be slightly customized for a single blog post instead of a list. then we'll conclude the course here.

Styling a Single Blog Page

Lets add pagination links and style them.

Adding Pagination Links and Stying Them
About the Instructor
Lamin Sanneh
4.4 Average rating
4 Reviews
1,518 Students
1 Course
Freelance frontend developer and writer at

A frontend developer, my name is Lamin Sanneh, a recently graduated Computer Science student. I love to dive into pretty much everything web related. I've been doing this programming stuff for almost 8 years. At a young age, I have always been interested in technology. When I finally finished high school, I jumped onto a java programming course. Here, I learned a great deal about the possibilities of programming. It was not until University that I actually realized that I just did not want to programming, but that I wanted to focus on web development. I did a web project in my first year of University. After the project, because I was so excited about web programming, I offered to make a website for free for a group of friends of mine.

After that, I started doing freelancing just so I could learn. I later realized that I learn better with videos, so I went on youtube, watched as much as I can. A couple of years down the road, I thought to myself, it is probably not just me who learns better with videos, so I decided to share my knowledge to give back to the community. I started a youtube channel at last year where I teach various topics on web development and you know what they say, the rest is history from there. Nowadays, I play football and make tutorials by day and at night I'm wrestling with client projects or blogging at my personal website lswebapps.

I hope you enjoy my courses and would welcome any feedback. Cheers.