Screen resolutions have risen to the size that individual pixels are indistinguishable by the human eye. Valid values: resizes-visual, resizes-content, or overlays-content. Specifies the effect that interactive UI widgets, such as a virtual keyboard, have on the page's viewports. Setting the value to 0, which is the same as no, is against Web Content Accessibility Guidelines (WCAG). user-scalableĬontrols whether zoom in and zoom out actions are allowed on the page. Any value less than 3 fails accessibility. maximum-scaleĬontrols how much zoom in is allowed on the page. minimum-scaleĬontrols how much zoom out is allowed on the page. initial-scaleĬontrols the zoom level when the page is first loaded. It can be set to a specific number of pixels like height=400 or to the special value device-height, which is 100vh, or 100% of the viewport height. It can be set to a specific number of pixels like width=600 or to the special value device-width, which is 100vw, or 100% of the viewport width. The basic properties of the "viewport" tag include: widthĬontrols the size of the viewport. Not all devices are the same width you should make sure that your pages work well in a large variation of screen sizes and orientations. The viewport meta tag mitigates this problem of virtual viewport on narrow screen devices. However, this mechanism is not so good for pages that are optimized for narrow screens using media queries - if the virtual viewport is 980px for example, media queries that kick in at 640px or 480px or less will never be used, limiting the effectiveness of such responsive design techniques.
This virtual viewport is a way to make non-mobile-optimized sites in general look better on narrow screen devices. This is done because not all pages are optimized for mobile and break (or at least look bad) when rendered at a small viewport width. For example, if a mobile screen has a width of 640px, pages might be rendered with a virtual viewport of 980px, and then it will be shrunk down to fit into the 640px space. Users can then pan and zoom to see different areas of the page. Some mobile devices and other narrow screens render pages in a virtual window or viewport, which is usually wider than the screen, and then shrink the rendered result down so it can all be seen at once. This is often not the same size as the rendered page, in which case the browser provides scrollbars for the user to scroll around and access all the content. The browser's viewport is the area of the window in which web content can be seen. Allowing cross-origin use of images and canvas.HTML table advanced features and accessibility.From object to iframe - other embedding technologies.Assessment: Structuring a page of content.
0 kommentar(er)
