Friday, 20 December 2013

How to use 'view port meta tags in responsive web design' with answer.

Technology innovations are developing very fast. Today's latest trend become tomorrow's old trend. Day-by-day we have to update with the technology. Website design is a category which has to learn and implement new things every time. Web designers must and should keep
learn and keep update with the new changes which will make them the best in website design industry with their competitors and rivals.
Coming to our present topic Usage of 'view-port', it must in responsive web designing process. Without View port it is not called as responsive website or mobile friendly website.
The syntax will be like this:
meta name equal to view port within html code style.
How to use view port meta tag?
We have to use view port attribute in meta tags only. It should be within head tag only. After the title or before the title, doesn't matter. It is a non closing tag. You have no need use one more tag to close it. Simply one tag is enough.
What is device within meta tag?
Device with is a property we use to define the web page to fix in with the device. When you will fix the fix to 320 pixels it should be
fixed to that width only. If you take 500 pixels it will adhere to that only. But we should not fix the width while designing a
responsive website. If you are designing a mobile app then, you can fix the width. But here we are designing a responsive website which
will changes it's width automatically according to the device width. The devices are means desktop screen, smart phone, tablet etc.,
comes under this.
What is initial scale in meta tags? Initial Scale is a property to limit the user from zooming our website. If we don't want to allow
the user to zoom the website, we can give zero as initial value, then you cannot be able to zoom our website. Why we have not to allow user to zoom our website, means we are designing a responsive website, automatically it will adjust according to screen, then why to
zoom? And as per responsive designing process, we have to design user friendly website. For that we are putting initial value as zero.
You can give initials values one or two or whatever you want. If you will give 1, then user can zoom 10% of the website. But it is not
user-friendly. While we are designing only, we have to design our webpage width as 100%, then there is no need of zoom.
Here one more important point we should remember is 'to use media queries'. You should fix the widths such as 320, 360, 560, 800, 1000
plus, these are the mostly used values in responsive website design. I will explain details in next article.
Thank you.

No comments:

Post a Comment