Metatag Viewport: Conceptually, viewport is the screen space where the site is rendered. This space determines important items in the layout, such as size of elements and images. With the viewport meta tag you can set the initial size of resolution within the device screen size in use, for example mobile phones, tablets, smartphones and even computers.

The viewport meta tag will allow that a layout designed for larger monitors can be rendered on smaller screens, without incurring a loss of quality or even content for lack of space.

Indicating the size of the viewport, the content is adjusted according to the screen size setted. In this case, the values to be rendered end up being proportional to what was set on the viewport meta tag of the page.


Setting the Viewport Meta Tag

The syntax of the viewport metagtag is very simple to apply:

<meta name=”viewport” content=””>

In the “content” field, the values related to the tag should be included. Each must be configured according to the elements that are being worked on and also according to the different screen sizes in which the site will appear.

Find below the list of values that can be entered in the viewport metagtag:

Width This item sets the width of the viewport to be worked on. The value can be set in pixels or the “device-width” value can be used to be automatically set according to the device width.
Height This item sets the height of the viewport to be worked on. The value can be set in pixels or the value “device-height” can be used to be automatically set according to the device height.
Initial-scale This value defines the initial viewport scale.
User-scalabe Allows the user to use the zoom function. (NO/YES)


Using Scriptcase as a development tool, no need to worry about the screen size of the application user. That’s because all applications created in the tool are fully focused on the mobile version.

Take a test, please visit our form mobile!

Don’t you know what Scriptcase is yet but you want to reduce your cost and time while developing software in PHP and increase productivity? So test it right now, use our Scriptcase code generator. Click here and find out how it works. (Link to home

See more articles in our blog.

By ,

April 27, 2015


You might also like…

Business Process Automation with Scriptcase

In the modern business world, operational efficiency is not just a goal. It's a necessity. With inc...

“We developed RISK4ALL, a SaaS platform that allows implementing GRC in an organization with total security and privacy.” (RISK4ALL)

Come and discover the success case of the Risk4all, software, a multilingual and multi-company SaaS...

Security in web applications

In this article, you will learn about web application security and the options within Scriptcase th...

You might also like…

Get new posts, resources, offers and more each week.

We will use the information you provide to update you about our Newsletter and Special Offers. You can unsubscribe any time you want by clinck in a link in the footer of any email you receive from us, or by contacting us at Learn more about our Privacy Police.