HTML5 CSS3 Mobile Responsive Website Design Lesson 1 – setting viewport width

In this series of videos we will teach you how to optimize a website for mobile devices.
In this lesson we talk about why you would put in the tag (meta name=”viewport” content=”width=device-width”) into your HTML document, and we show you the difference between having it and not having it.

Lesson 2 is here: https://youtu.be/F6qdItXFYgA

Source file: http://magicmonktutorials.com/samplesite/lesson1.html

Visit Website @ http://www.vishacademy.com

Connect with us on …
facebook » http://www.facebook.com/vishacademy
twitter » http://www.twitter.com/vishAcademy
youtube » http://www.youtube.com/vishacademy
Video Rating: / 5

About the Author: Mac Benli

7 Comments

Arvind Juneja

on March 30, 2018 at 6:51 am - Log in to Reply

good
dafont

on March 30, 2018 at 7:44 am - Log in to Reply

very good!
Benjamin Brechtel

on March 30, 2018 at 8:34 am - Log in to Reply

I have been using media queries for a while to design mobile sites...but, I never set my viewport. My sites all test as "Mobile Friendly" through the Google tool. Are you saying that by setting the viewport you don't use media queries?
Ashutosh Kumar

on March 30, 2018 at 9:32 am - Log in to Reply

very nice video sir nd thanks for share this knowladge sir ..nd sir i hv a question ? sir apne is website pr kafi high quality ki imges use ki h nd jo slide baar lgaya h sir kya uski wjh se speed tym me koi effect nhi pdta kya nd google speed test me image costimization ke liye nhi suggest krta kya..
Dharmesh patel

on March 30, 2018 at 10:09 am - Log in to Reply

great work
harvansh sainy

on March 30, 2018 at 10:30 am - Log in to Reply

very nice sir...
AiM

on March 30, 2018 at 11:12 am - Log in to Reply

Masha Allah great job sir, go ahead sir