There has never been a better time to learn responsive web design and take a mobile first approach.
Smartphone and tablet users no longer accept that they should have a poor web browsing experience because of the device they are using. Catering for mobile users is now essential.
This course teaches you how to put your HTML & CSS skills to great use by creating mobile first and responsive websites, which look great on any device.
This course covers:
- We will go over what responsive design is and why a mobile first approach can be beneficial
- Tools you can use to help your project
- Fluid grids and relative sizes
- The Viewport Meta Tag
- Media queries and breakpoints
- Building a responsive website project from scratch, using a responsive grid
- We will then add jQuery plugins to the project to create a responsive sliding carousel and social sharing buttons
- Dealing with responsive images and the picture element
- How to optimise our images and files
- CSS Flexbox including building our own basic grid
- Using responsive frameworks such as Bootstrap
This course is beginner friendly but at least a basic HTML & CSS knowledge is required.
The web is going mobile, make sure your websites are ready!
Hello, My name is Chris and I am a web developer and online teacher. I am passionate about what I do and about teaching others. I have started various online and offline businesses.
Whatever your reason for learning to build websites you have made an excellent career choice.
My personal motivation was to become my own boss and have more freedom and flexibility in my life. I also enjoy the technical challenge it provides and the way it constantly evolves. I built my first website back in 1999 and i have watched the web evolve into what it is today.
I try to make my courses enjoyable and try to remember what it was like when I was learning. I also believe the best way to learn is by doing and try to include as many practical examples as possible in my courses.
Thanks for taking an interest and I look forward to you joining me.
StartDownload Project images
StartWireframe with Gliffy (4:20)
StartSetting up the project (15:43)
StartHeader & Navigation (14:34)
StartAdding the main content (10:01)
StartCreating the sign up area & footer (10:41)
StartMobile first styling (10:43)
StartMobile styles continued & adding media queries (11:06)
StartFinishing our project (9:01)