And Reflow has no requirement that the resulting text size needs to be at a certain size. A 8px size font in the 320px view would still meet the requirement of Resize Text. If your base font size is 16px, 200% is 32px (and note that these are real on-screen pixels, not CSS pixels dependent on your viewport here). Even if your media query uses a lower font size for mobile devices, it would need to be very small to fall under the 200% threshold. How do these two success criteria work together?įrom a desktop view, if you meet Reflow, you almost certainly also meet Resize Text. Zoom to 200%, your viewport width halves. Using browser zoom on a desktop browser is functionally equivalent with changing the width of the viewport. Secondly, if you use a desktop browser on a 1280px wide monitor and zoom in to 400% the width of the viewport is quartered internally in the browser… to 320px. Firstly, 320px is a very common viewport width for smartphones. The reason for picking 320px/256px have been of practical nature. There is an exception for content that requires two-dimensionality to be understood, example tables, maps, or some charts. It specifies that the content can be presented in a way that only requires scrolling in one direction at 320px for content that scrolls vertically (up and down) and 256px for content that scrolls horizontally (left and right). Reflow has nothing to do with resizing the size of the text at all. Reflow was introduced to support users with low vision to easier navigate zoomed-in experiences by giving them a viewport size that – guaranteed – would not scroll horizontally. It totally conforms if your website grows to twice the width and height when resizing the text to 200%, even if that means horizontal scrolling. And, more importantly, this success criterion gives no guidance on scrolling. As long as the text does not get completely lost (for example through overflow: hidden or text running into each other or behind other objects), your layout is allowed to break. That said, this SC is relatively permissive. Of course some ways are better than others and adjusting the viewport to resize text is frequently the most consistent way to do it, especially on websites that have been implemented in a responsive way.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |