Re: Resizing examples

Hi Jonathan,

I’m just changing the subject line as we’re heading off on a tangent that is more to do with Resize content.

I went through the examples below, but first I think the basic point stands, if you have a site that is *not* good for zooming, like this pixel-width test case:
https://alastairc.ac/tests/layouts/pixels.html


That passes 1.4.4 with zooming, but it is rubbish from a low-vision point of view compared to the vast majority of RWD sites.

Anyway, on the examples you sent I resized my browser to 1024px wide, and zoomed in 200%:

http://www.slidesnack.com/templates-examples/online-presentation-examples#1

The presentations are Flash content, so I assume it is using its own heuristic for re-sizing, rather than the browsers. The content around the flash looks fine! If we are covering flash, then I guess we would have to take a ‘mechanism is available’ approach, but then we run into the “OMG Widgets!” problem.

http://guidobouman.github.io/jquery-panelsnap/

Interesting, they use boxes with height: 100% (of the viewport) and overflow-hidden, so expansion gets hidden. The content within each box is then absolutely positioned, so expands out of the box.

Ok, that’s a good one, that would fail 1.4.4. That’s a page demoing a plugin, have you seen it used on real sites?

https://css-tricks.com/examples/ScrollingSidebar/

That’s a simple test case, not intended to be like a real site, it has a very basic body {overflow-x:hidden;},
I’m quite sure Chris Coyer would not do that on a “real” site.


> Another example is floating fixed potion content.
http://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_toolbars_fixed


Apart from the Google drive icon disappearing, I don’t see a problem with that one? The content in the right box is visible at 200%.

> Header text overlaps content
https://css-tricks.com/persistent-headers/


I don’t see a problem here (Chrome, 1024px wide at 200%). I also looked at the demo, which looked fine:
https://css-tricks.com/examples/PersistantHeaders/ although again it is a demo, and has body{overflow-x:hidden}

Perhaps you mean something like this from the FT? At 400-500% the header is getting very large (proportionally), but still not problematic at 200%
https://www.ft.com/


Cheers,

-Alastair