29 June 2013

116 Dynamic Transparency on Pages

My display is the typical aspect ratio of most external screens today. Sort of the "Hollywood-movie" aspect ratio. Some screens for some reason are longer in the x-axis. It's a good demonstration of how responsive design looks different on different size screens. There is nothing wrong with your screen, it's just one of the exceptions. This is good because it forces us to consider more viewers needs.

The image cropping should be viewed or tested with worst-case scenarios. There are solutions.
I'm not too worried about vertical "scrolling." It only appears when needed. There's the scroll bar indicator next to the window if the frame is small. But some sites are mainly a picture story. The pictures will make them seek out the captioning. And people are very indoctrinated in scrolling. So it's not a usability problem.

Some cropping of images will occur under extreme conditions but for the majority of screens we can minimize or eliminate that problem. But that causes other problems not related to the photo. Big images are important. We can guarantee no cropping if we make the images small. But then we lose that wonderful center-spread catalog effect. So the goal isn't to "eliminate" cropping but to "minimize" cropping for the majority of viewers.

There are two camps in web design. I'm in the minority camp --the one that requires  imagination. One camp believes that websites should be like paper-under-glass and be pixel-perfect, fixed-width on every browser made. This is almost impossible at this point in technological development because there is no consistency in how browsers "act and react" to code and even images. The worst offender being Internet Explorer. These differences mean special customization is required for viewing on different browsers and devices. This multiplies the amount of coding needed.

Each browser has it's proprietary quirkiness. So in an attempt to achieve "graphic design" perfection, dictated by the history of print media, designer work much harder or use cookie-cutters (like WordPress.) It's a frustrating method because they're attempting to make the web do something it was never designed for in the first place. The web was originally designed just for text and data --not images. Text is what it does best. You have to work within the severe limitations of the "natural" web.

Instead, many designers want to make the web do the "unnatural" --look like 300 dpi print medium.

User's are not aware dynamic pages adapt to their screen. This is called "transparency." For example, "page speed" is transparent when it's fast. It's not noticed. It's invisible to the user. But a slow page will generate many complaints --no longer transparent.

The same with "fluid or liquid" pages. The user never notices. The page automatically "snaps" to their browser window size. They did not have to interact with the browser window to make things work.

In other words, ironically, the less attention for the "website", the better it is. :) It doesn't get in the way.

Designing for the web is like trying to design a newsletter with a typewriter for the 1960. It can be done but it requires planning and thought.

The more designers try to control the page, the bigger the pages get in weight (slowness or bloat.) If you let the pages move (liquid design, like we're doing,) the lighter and faster the pages get. It's simpler because you're working in harmony with the "natural and unpretentious."

So my job is balancing between beauty and speed. This is not easy and few designers know how to do it. Nor do they care, (apathy) they usually just want to get paid and move on to the next project. Many are plumbers and not artists.

Many designers will adapt as they become more aware of these "transparency" and "responsive" design principles.

No comments:

Post a Comment