{"id":14862,"date":"2017-11-16T15:30:49","date_gmt":"2017-11-16T15:30:49","guid":{"rendered":"https:\/\/www.techopedia.com\/definition\/viewport\/"},"modified":"2017-11-16T15:30:49","modified_gmt":"2017-11-16T15:30:49","slug":"viewport","status":"publish","type":"definition","link":"https:\/\/www.techopedia.com\/definition\/32644\/viewport","title":{"rendered":"Viewport"},"content":{"rendered":"

What Does Viewport Mean?<\/span><\/h2>\n

A viewport is a term for the visible area of a webpage on a
\ndisplay 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.\n<\/p>\n

Techopedia Explains Viewport<\/span><\/h2>\n

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.\n<\/p>\n

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.\n<\/p>\n

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 \u2013 and when they put in viewport limitations, this provides a technical set of parameters to work from.<\/p>\n","protected":false},"excerpt":{"rendered":"

What Does Viewport Mean? 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. Techopedia Explains Viewport Since new devices have radically different screen […]<\/p>\n","protected":false},"author":7813,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_lmt_disableupdate":"","_lmt_disable":"","om_disable_all_campaigns":false,"footnotes":""},"definitioncat":[217,226,236,257,216],"class_list":["post-14862","definition","type-definition","status-publish","format-standard","hentry","definitioncat-hardware","definitioncat-home-networks","definitioncat-network-management","definitioncat-personal-tech","definitioncat-software-development"],"acf":[],"yoast_head":"\nWhat is a Viewport? - Definition from Techopedia<\/title>\n<meta name=\"description\" content=\"This definition explains the meaning of Viewport and why it matters.\" \/>\n<meta name=\"robots\" content=\"noindex, follow\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Viewport\" \/>\n<meta property=\"og:description\" content=\"This definition explains the meaning of Viewport and why it matters.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\" \/>\n<meta property=\"og:site_name\" content=\"Techopedia\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/techopedia\/\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@techopedia\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\"},\"author\":{\"name\":\"Margaret Rouse\",\"@id\":\"https:\/\/www.techopedia.com\/#\/schema\/person\/f5dd538e31ee352d105b8af36c4268a5\"},\"headline\":\"Viewport\",\"datePublished\":\"2017-11-16T15:30:49+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\"},\"wordCount\":188,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.techopedia.com\/#organization\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.techopedia.com\/definition\/32644\/viewport#respond\"]}],\"articleSection\":\"\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\",\"url\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\",\"name\":\"What is a Viewport? - Definition from Techopedia\",\"isPartOf\":{\"@id\":\"https:\/\/www.techopedia.com\/#website\"},\"datePublished\":\"2017-11-16T15:30:49+00:00\",\"description\":\"This definition explains the meaning of Viewport and why it matters.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.techopedia.com\/definition\/32644\/viewport\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.techopedia.com\/definition\/32644\/viewport#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.techopedia.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Software Development\",\"item\":\"https:\/\/www.techopedia.com\/topic\/2\/software-development\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Term\",\"item\":\"https:\/\/www.techopedia.com\/definition\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Viewport\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.techopedia.com\/#website\",\"url\":\"https:\/\/www.techopedia.com\/\",\"name\":\"Techopedia\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.techopedia.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.techopedia.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.techopedia.com\/#organization\",\"name\":\"Techopedia\",\"url\":\"https:\/\/www.techopedia.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.techopedia.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.techopedia.com\/wp-content\/uploads\/2025\/02\/techopedia-light-logo.svg\",\"contentUrl\":\"https:\/\/www.techopedia.com\/wp-content\/uploads\/2025\/02\/techopedia-light-logo.svg\",\"caption\":\"Techopedia\"},\"image\":{\"@id\":\"https:\/\/www.techopedia.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/techopedia\/\",\"https:\/\/x.com\/techopedia\",\"https:\/\/www.linkedin.com\/company\/techopedia\/\",\"https:\/\/www.youtube.com\/c\/Techopedia\"],\"publishingPrinciples\":\"https:\/\/www.techopedia.com\/about\/editorial-policy\",\"ownershipFundingInfo\":\"https:\/\/www.techopedia.com\/about\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.techopedia.com\/#\/schema\/person\/f5dd538e31ee352d105b8af36c4268a5\",\"name\":\"Margaret Rouse\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.techopedia.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.techopedia.com\/wp-content\/uploads\/2023\/02\/margaret-rouse-headshot.jpeg\",\"contentUrl\":\"https:\/\/www.techopedia.com\/wp-content\/uploads\/2023\/02\/margaret-rouse-headshot.jpeg\",\"caption\":\"Margaret Rouse\"},\"description\":\"Margaret is an award-winning technical writer and teacher known for her ability to explain complex technical subjects to a non-technical business audience. Over the past twenty years, her IT definitions have been published by Que in an encyclopedia of technology terms and cited in articles by the New York Times, Time Magazine, USA Today, ZDNet, PC Magazine, and Discovery Magazine. She joined Techopedia in 2011. Margaret's idea of a fun day is helping IT and business professionals learn to speak each other\u2019s highly specialized languages.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/margaretrouse\/\",\"https:\/\/x.com\/https:\/\/twitter.com\/@techdefinitions\"],\"knowsAbout\":[\"Technology Expert\"],\"url\":\"https:\/\/www.techopedia.com\/contributors\/margaret-rouse\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"What is a Viewport? - Definition from Techopedia","description":"This definition explains the meaning of Viewport and why it matters.","robots":{"index":"noindex","follow":"follow"},"og_locale":"en_US","og_type":"article","og_title":"Viewport","og_description":"This definition explains the meaning of Viewport and why it matters.","og_url":"https:\/\/www.techopedia.com\/definition\/32644\/viewport","og_site_name":"Techopedia","article_publisher":"https:\/\/www.facebook.com\/techopedia\/","twitter_card":"summary_large_image","twitter_site":"@techopedia","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport#article","isPartOf":{"@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport"},"author":{"name":"Margaret Rouse","@id":"https:\/\/www.techopedia.com\/#\/schema\/person\/f5dd538e31ee352d105b8af36c4268a5"},"headline":"Viewport","datePublished":"2017-11-16T15:30:49+00:00","mainEntityOfPage":{"@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport"},"wordCount":188,"commentCount":0,"publisher":{"@id":"https:\/\/www.techopedia.com\/#organization"},"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.techopedia.com\/definition\/32644\/viewport#respond"]}],"articleSection":""},{"@type":"WebPage","@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport","url":"https:\/\/www.techopedia.com\/definition\/32644\/viewport","name":"What is a Viewport? - Definition from Techopedia","isPartOf":{"@id":"https:\/\/www.techopedia.com\/#website"},"datePublished":"2017-11-16T15:30:49+00:00","description":"This definition explains the meaning of Viewport and why it matters.","breadcrumb":{"@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.techopedia.com\/definition\/32644\/viewport"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.techopedia.com\/definition\/32644\/viewport#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.techopedia.com\/"},{"@type":"ListItem","position":2,"name":"Software Development","item":"https:\/\/www.techopedia.com\/topic\/2\/software-development"},{"@type":"ListItem","position":3,"name":"Term","item":"https:\/\/www.techopedia.com\/definition"},{"@type":"ListItem","position":4,"name":"Viewport"}]},{"@type":"WebSite","@id":"https:\/\/www.techopedia.com\/#website","url":"https:\/\/www.techopedia.com\/","name":"Techopedia","description":"","publisher":{"@id":"https:\/\/www.techopedia.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.techopedia.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.techopedia.com\/#organization","name":"Techopedia","url":"https:\/\/www.techopedia.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.techopedia.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.techopedia.com\/wp-content\/uploads\/2025\/02\/techopedia-light-logo.svg","contentUrl":"https:\/\/www.techopedia.com\/wp-content\/uploads\/2025\/02\/techopedia-light-logo.svg","caption":"Techopedia"},"image":{"@id":"https:\/\/www.techopedia.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/techopedia\/","https:\/\/x.com\/techopedia","https:\/\/www.linkedin.com\/company\/techopedia\/","https:\/\/www.youtube.com\/c\/Techopedia"],"publishingPrinciples":"https:\/\/www.techopedia.com\/about\/editorial-policy","ownershipFundingInfo":"https:\/\/www.techopedia.com\/about"},{"@type":"Person","@id":"https:\/\/www.techopedia.com\/#\/schema\/person\/f5dd538e31ee352d105b8af36c4268a5","name":"Margaret Rouse","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.techopedia.com\/#\/schema\/person\/image\/","url":"https:\/\/www.techopedia.com\/wp-content\/uploads\/2023\/02\/margaret-rouse-headshot.jpeg","contentUrl":"https:\/\/www.techopedia.com\/wp-content\/uploads\/2023\/02\/margaret-rouse-headshot.jpeg","caption":"Margaret Rouse"},"description":"Margaret is an award-winning technical writer and teacher known for her ability to explain complex technical subjects to a non-technical business audience. Over the past twenty years, her IT definitions have been published by Que in an encyclopedia of technology terms and cited in articles by the New York Times, Time Magazine, USA Today, ZDNet, PC Magazine, and Discovery Magazine. She joined Techopedia in 2011. Margaret's idea of a fun day is helping IT and business professionals learn to speak each other\u2019s highly specialized languages.","sameAs":["https:\/\/www.linkedin.com\/in\/margaretrouse\/","https:\/\/x.com\/https:\/\/twitter.com\/@techdefinitions"],"knowsAbout":["Technology Expert"],"url":"https:\/\/www.techopedia.com\/contributors\/margaret-rouse"}]}},"_links":{"self":[{"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/definition\/14862","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/definition"}],"about":[{"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/types\/definition"}],"author":[{"embeddable":true,"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/users\/7813"}],"replies":[{"embeddable":true,"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/comments?post=14862"}],"version-history":[{"count":0,"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/definition\/14862\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/media?parent=14862"}],"wp:term":[{"taxonomy":"definitioncat","embeddable":true,"href":"https:\/\/www.techopedia.com\/wp-json\/wp\/v2\/definitioncat?post=14862"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}