Tech moves fast! Stay ahead of the curve with Techopedia!
Join nearly 200,000 subscribers who receive actionable tech insights from Techopedia.
A viewport is a term for the visible area of a webpage on a display device. It is used in both code and analog design as a way to refer to the display screen and how layout fits into that screen.
Since new devices have radically different screen sizes, the viewport has become a major consideration in responsive design. Engineers have to figure out how to fit webpages into a small viewport for a traditional smartphone or mobile device. Even tablets tend to be smaller than traditional computer screens.
Designers can use a viewport meta tag in HTML and a tool in Cascading Style Sheets to set viewport parameters such as height and width as well as viewport scale and resolution.
Using the viewport meta tag is an important part of matching page compatibility to a device screen. Typically, designers look at all of the text, images and functionality in a page and lay it out according to what the viewport can handle – and when they put in viewport limitations, this provides a technical set of parameters to work from.