Here are a few notes on the new reality of the multicontext & multidevice web. The browser should take care, on how to display a website optimized for the current device it is operating on. Right?
The client-server interface needs to have better and faster communication. "Hey server, my current viewport width is about 320px. Would be great to get some suitable images. Stay tuned, your client".
The browser handles all of the rest! (2044)
The multi- context, device, viewport, density, input-type, bandwidth web
How to solve this? Is it possible to solve it with the current tools/technics? By using Media Queries, which are a Hack? What about testing? One million different devices multiplied by 5 to 10 different OS's multiplied by 10 to 20 different browsers is unequal to any possible QA strategy. The browser is the only Player of the Game that knows exactly all parameters of the device, the OS, the actual bandwidth, and so on... everything!
There needs to be a new kind of communication between client and server. It should take place long before any website assets could be downloaded (e.g Image Prefetching).
Several newer browsers have implemented an “image prefetching” feature that allows images to be fetched before parsing the document’s body — @wilto
UA's should become more intelligent!
No more Feature-Detection or Browser-Sniffing!
I wrote down these ideas, after a night of horror :-] Struggling with desktop-first CSS overwrites (OMG), finding a working polyfill for responsive-images which has the fewest disadvantages (No way!) AND get a bandwidth-detection polyfill running and respond to the previously collected information (hmmm, failed!) Okay! Seems as if we are not ready for this new web!? If I say we, I mean the browser vendors, which give us the ability to create the web.
I wrote down these ideas, after a night of horror :-] @me
So guys, please be lenient with me!
Resources and further Reading
- Future-Ready Content, Sara Wachter-Boettcher @sara_ann_marie
- HTTP Client Hints, Ilya grigorik @igrigorik
- A non-responsive approach to building cross-device webapps, Boris Smus @borismus
- Responsive Web Design: Missing the Point, Brad Frost @brad_frost
- Future Friendly, Luke Wroblewski @lukew, et al.