Breakpoints And The Future Of Websites

Breakpoints And The Future Of Websites

• By Obinwanne Hill


• July 8th, 2014


• CSSJavaScriptLayouts


• 2 Comments

When a iPhone came out in 2007, a proof of a web browser by a late good Steve Jobs gave a not-so-subtle clarity that Apple wasn’t too disturbed about a users pinching to wizz and swiping to corkscrew as partial of a browsing experience. Responsive web pattern directed to solve this problem by smartly requesting stretchable grids, liquid layouts and, of course, media queries.

However, manageable web pattern has incited out to be rather of a box investigate in a law of unintended consequences, with one of a impolite extraordinary effects being breakpoint paranoia. But even yet a undue change that media queries exerts on your preference of these breakpoints, it dawns on we after many introspection that these competence not be a droids we’re looking for.

In this article, we’ll demeanour during breakpoints over shade distance and try opposite possibilities and unsentimental approaches to regulating them to emanate truly adaptive use on a web.

Threshold Dynamics

A threshold¹ is a indicate or spin during that something starts or changes. Thresholds can be found and felt substantially everywhere in a earthy world: interlude during a trade light, selecting skimmed divert over full cream, dual sugars instead of three, uncouthly opting out of a teacup float during Disney World, etc.

Thresholds conclude us since they conclude actions, and actions establish outcomes. Being means to brand a right thresholds sets we on a march for improved outcomes, generally when we know accurately what needs to be finished within any threshold. It’s same to doing a right thing during a right time.

Our foreknowledge to conceptualize — and capacitate — new thresholds where there were zero will open adult a new perspective of actions vis-à-vis outcomes. The convenience and coherence we acquire from this will customarily assistance to perform a inherited enterprise for incremental awesomization, that will expostulate us to emanate even improved websites that yield improved user experiences.

Today’s Breakpoints

In web pattern today, a thresholds we fixate on a many describe roughly exclusively to shade size. The vital plea over a final few years has been conceptualizing for mobile devices, and, with shade distance being a apparent focal point, a primary vigilant has been to adjust a blueprint of a web pages to total with a specific arrangement characteristics of a aim environment.

In manageable web design, a accepted routine of defining these breakpoints is by sourroundings media queries.

@media shade and (min-width: 240px) and (max-width: 320px)
 physique background: red; 

The markup above clearly identifies dual thresholds (240 pixels and 320 pixels) that consecrate a operation within that an movement will be triggered (in this case, changing a credentials tone to red). It’s utterly candid in concept.

Medusa Queries

“As we enlarge a abilities of people to accomplish their tasks, we should be clever not to needlessly diminish what they can do.”

– Jeremy Keith

Media queries, it turns out, are intensely rigid. Usually, we are forced to occupy breakpoints in ways that are not accurately discerning nor inline with your core pattern aspiration. In other words, we have to fit your pattern finish to a capabilities. So, we competence have a colourful imagination about your possess thresholds, yet some-more than expected media queries won’t let we request them a proceed we envisage.

Defenders of media queries should know that potency is what creates any effective bid laudable. Spending many mins or even hours tweaking those annoying directives and afterwards carrying to re-tweak them any and each time we wish to make an composition is zero brief of a recursive nightmare. What’s so wrong with sourroundings breakpoints formed on extended categorizations of mobile inclination (such as smartphone, tablet, etc.)?!

In a essay “Designing for Breakpoints²,” Stephen Hay suggests defining breakpoints formed on device classes. Spurred by a few assertions, we embarked on a mini-research plan that we after converted into a blog post³ to infer this right or wrong. And in a new check that we conducted on possibly media queries should aim device classes⁴, about 54% of respondents pronounced yes. But there’s no discerning proceed to do this with media queries even if we wanted to.

In my common opinion, from a web designer’s standpoint, a underline set of media queries is incomplete. And it is so since designers have an imagination and an ardour for many some-more breakpoints than media queries can now yield (and substantially ever will in future).

The New Breakpoints

As mentioned a small earlier, a ability to find and set new thresholds will establish a ability to conceptualize new actions that we can set a trigger to. By so doing, we can broach some-more tweaks into an inherently immobile and resistant environment.

Breakpoints in Contextual Web Design

The websites of tomorrow have to be some-more than manageable — they have to be contextual, too. These concepts of coherence and fluidity have to comparison shade size. The age of a one-size-fits-all website will have to come to an finish and be transposed by websites that also adjust to a needs and expectations of users.

To capacitate this feature, we have to conceptualize some-more thresholds, yet initial we need to find out what parameters to track. In Nick Finck’s judicious arrangement on “The Contextual Web⁵,” he highlights 4 aspects of context in web design: user, task, sourroundings and technology. Of course, all 4 are a value trove of extrapolations, yet what should we unequivocally concentration on?

We could ask literally hundreds, even thousands, of questions about users, their tasks, their sourroundings and what record they have entrance to. However, we have to bottom these questions on a stream and sincere abilities to obtain information on these 4 parameters. Some probable questions could be:

• What are a earthy abilities of a user?
  
  If a user is vision-impaired or hearing-impaired, we would need to supplement some-more accessibility facilities that would raise their experience.


• Where is a user’s ubiquitous location?
  
  Knowing where a user is gives us a good suspicion of their culture, mercantile status, demographic, etc.


• What time is it in a user’s location?
  
  People are customarily creatures of robe and are substantially some-more expected to perform certain actions during a certain time.


• What is a user’s device?
  
  A phone is not a tablet, and a inscription is not a PC. Different inclination have opposite capabilities and will be used for opposite tasks.


• What does a user have an affinity for?
  
  What a user likes (and dislikes) will play a clever partial in assisting us to prioritize and broach content.

There are ways to answer a questions above with a record permitted in browsers today. And if not, afterwards we unequivocally need to work harder to build them in, generally deliberation an emanate as critical as accessibility.

So, how would we pattern a website to be contextual? How would we daydream breakpoints in a contextual sense? Here’s one scenario.

Let’s suspect that it’s 6:00 in a morning, and your alarm goes off. You totter to your kitchen to get some breakfast, before removing prepared and streamer out to work. You imagination eggs, yet we open a fridge and there are no eggs. So, we settle on something else, yet we wish to sequence some groceries so that they’re prepared to be picked adult on your proceed behind from work. You glow adult a website of an intensely vast dialect store sequence from your Internet-connected fridge to get this done.

Are we tender simply since this website is responsive? Is removing a best bargain on wiring a priority for we during this point? Do we unequivocally wish to be reminded that some of a few equipment we “recently viewed” on pronounced website were Lincoln Logs and a Spider-Man toothbrush holder? we mean, it’s 6:18 am, and you’re browsing from a fridge. Does it take a rocket scientist to figure out that maybe grocery equipment should be a difficulty value prioritizing?!

I’m certain there are countless other scenarios like this, and it’s easy for someone who isn’t informed with web record to get undone with how websites still seem to tumble brief of their expectations. But for those of us who do, should we still be creation excuses, or should we be perplexing to pull a pouch further?

The New Methods

“Media queries concede authors to exam and query values or facilities of a user representative or arrangement device, eccentric of a request being rendered.”

– Editor’s Draft, W3C (3 Jun 2014)

I was recently perusing a “Media Queries Level 4⁶” breeze selection to get a clarity of where things are headed. we contingency contend that I’m not unequivocally vehement with a direction, and there customarily doesn’t seem to be many creation here.

From a epitome of a document, we get a pure clarification of what media queries are as a method. However, we customarily can’t know since there is no expansion of media facilities to simulate benefaction — and probable destiny — realities.

What’s wrong with carrying device-class media facilities like phone or tablet? They seem like apparent choices, and, according to a check referred to earlier, web designers wish that underline set. Some would disagree that those competence not be “things” in a future, yet that is magnitude believable, given that cars, TVs, computers, refrigerators, watches and eyeglasses are still “things” that people find useful today. And when are we unequivocally going to see a fortitude to a doubt of element queries⁷?

In my opinion, media queries (as a apparatus for web pattern in a multi-device world) simply can’t contend any arrange of balance with a artistic arena of contemporary web designers, and they are a implicitly indefensible customary for web pattern going forward. Maybe we should demeanour during choice approaches; I’d like to advise a few. They’re not that complicated, and all we’d need are a HAT, a COAT and a TIE.

HAT Trick

We’re substantially all informed with CSS category selectors during this point. They are one of a many ordinarily used selectors in web design⁸.

.muttley .do_something …

What we don’t know is since we don’t use these classes some-more than media queries to build mobile-friendly websites?

It seems to me that conceptualizing websites for many opposite situations would be so many easier and faster if browsers employed HTML charge tagging (HAT). Basically, this would engage a browser fixation specific parameters in a class charge of a html tab (in a routine of a page being loaded), that would capacitate a web engineer to precedence these classes in their CSS markup.

Some of these parameters could embody a following:

• device group
  
  fixed, mobile, home, wear, auto, etc.


• device class
  
  PC, phone, tablet, TV, fridge, car, watch, etc.


• input device
  
  coarse, fine


• bandwidth
  
  high, medium, low


• orientation
  
  portrait, landscape


• viewport breadth and height
  
  in device-independent pixels, to a nearest mixed of 40, with an alphabet prefix for compliance


• local date and time
  
  in ddmmyyyy format for date, and 24-hour illustration for time


• time zone
  UTC offset⁹


• general geo-location
  
  continent and nation codes

More parameters could be combined formed on expected need. In addition, all parameters would be preoccupied to a DOM window vigilant to make them simply permitted around JavaScript.

So, suspect someone was regulating a Nexus 5 phone over a 4G LTE mobile network. The browser would supplement a applicable tags to a page, withdrawal us with this:

html class="mobile phone counterfeit high mural v360w v640h d07052014 t0900 utc_a af_ng"

And if they altered a phone’s march to landscape, a browser would statefully refurbish a tag, giving us this:

html class="mobile phone counterfeit high landscape v640w v360h d07052014 t0900 utc_a af_ng"

If this happened, a web engineer would have a lot of options to fast adjust their web pages opposite countless judicious breakpoints during literally a speed of thought. Let’s cruise one user example.

I was recently contrariety a pricing table¹⁰ that is not distinct tables seen on a lot of SaaS websites these days. The list is 3 columns and is built regulating ul tags with floated li tags.

¹¹

A multi-column pricing table. (Image credit: Restive.JS¹⁵¹²) (View vast version¹³)

Below a pricing list is some FAQ content, also with a multi-column layout.

¹⁴

Multi-column FAQ content. (Image credit: Restive.JS¹⁵¹²) (View vast version¹⁶)

Obviously, these multi-column elements would not demeanour as good on all mobile inclination as they would on a desktop. So, in a suggestion of manageable web design, we would have to adjust them to a magnitude of a smaller screen. And a proceed we would do this is by arrangement these dual visible components in their full multi-column excellence customarily when a web page is being noticed on a inscription in landscape orientation.

The proof behind this is that we would pattern a inscription in that march to have adequate shade space for a whole list to seem as intended. If those conditions are not met, afterwards we’ll fall a columns to be linear and vertical.

The elementary CSS for a pricing list is this:

ul 
 margin: 0;
 padding: 0;
 list-style: none; 

ul li 
 float: left;
 width: 33%; 

So, leveraging HAT, we would exercise these facilities regulating a following markup:

.mobile ul li 
 float: none;
 width: 100%; 

.mobile.tablet.landscape ul li 
 float: left;
 width: 33%;

That’s it! Just invalidate a floated blueprint elements for all mobile devices, and afterwards re-enable them for tablets in landscape orientation. Simple aspiration, elementary solution. Do we wish to try doing a same thing with media queries? Say hello to Dr. StackOverflow for me!

Clearly, contracting this proceed has benefits. Efficiency is one vital benefit; you’d spend reduction time building websites since we wouldn’t be wasting absurd amounts of time crafting media queries, not to discuss all of a contrariety of mobile inclination that goes along with that. Secondly, progressing your markup would be easier since all would be inline and there would be no unnecessary duplication. Thirdly, we would have a eventuality to try many some-more use cases since there would be some-more parameters that offer as thresholds for some-more judicious breakpoints.

COAT of Many Colors

Everyone seems to be preoccupied by analytics. Website analytics programs, such as Google Analytics and MixPanel, all try to give a good pattern of who has visited your website, how prolonged they stayed, what websites they came from, what inclination they used, etc. What this information won’t tell we is what calm a visitors have an affinity for.

You could, of course, use cookies to lane visitors to your website, yet afterwards you’d customarily be means to establish what they like on your website that day or week or month. You wouldn’t be means to accurately establish a specific calm they caring about, nor competence we be means to do anything about it before they leave.

Tracking calm affinity and bettering calm to pronounced affinity could unequivocally assistance us build websites that truly adjust to people’s desires. To unequivocally obtain this data, though, a data-collection resource needs to comparison any one website. That is, all websites would need to build this affinity form in a collaborative and pure way.

COAT stands for “cumulative and open affinity tagging.” It’s simply a common routine of bargain a things visitors have an affinity for and afterwards building a form of that affinity. Here’s how it would work:

• Someone visits a garland of websites regularly. Some are news websites, some are sports websites and some are blogs. Each web page would have a COAT meta tag.


• The browser (via a COAT sub-engine) would review this meta tab and incrementally store a value in a reserved, stable and read-only localStorage non-static (which could be named anything) in a comma-delimited format. So, for a websites that a user visits, a value competence be news:info:1,sports:soccer:2,blog:tech:3.


• If a chairman visits another sports-related website, a website would review (and update) their affinity tab from localStorage. It sees that a chairman is fair to football, and so gives some-more priority to football calm on a home page.

Armed with this insight, we could tweak a website’s home page to improved support to a opposite needs of users in a rarely specialized way.

COAT information would contain a singular comma-delimited fibre in a following format:

category_1:sub_category_1:popularity_1,…,category_n:sub_category_n:popularity_n

Here, category is a extended sequence of a form of content; sub_category enables offer classification; and popularity is a magnitude of a magnitude of visits. So, if a user visited a tech blog 30 times a month and visited a football territory of a sports website 5 times a day, afterwards we would finish adult with this tag:

blog:tech:30,sports:soccer:150

This is merely an example; a sequence complement would be tangible and confirmed by a larger web community. A series of safeguards would be in place, too. For example, if a website didn’t conclude a COAT meta tag, afterwards it wouldn’t be means to review one either. Also, if a user was browsing in private mode, afterwards COAT would be disabled.

COAT wouldn’t lane any personal information. The vigilant is not to figure out who a chairman is and where they competence be, yet to get a extended pattern of a kind of calm they like (and how many they like it), so that websites are means to personalize their browsing experience.

TIE In

Let’s face a fact: JavaScript is awesome. It’s not unequivocally receptive to many web designers, yet a capabilities are simply immense, and it binds a pivotal to websites doing good things in a future, even as a grant to website functionality now is not in question.

HTML and CSS are a good twin for building websites, carrying been so for utterly a while now. However, customarily HTML seems to have been authorised to contend a attribute with JavaScript. Granted, CSS is “a character piece denunciation used for describing a demeanour and formatting of a document.” But as things mount now in a universe dominated by web-enabled devices, a lot of a factors that establish a demeanour and feel of a website have left over a area of CSS.

As a result, CSS needs to be authorised to “friend” JavaScript and ask for a assistance in behaving certain tasks. There unequivocally should be a proceed to couple Javascript functionality directly with inline CSS rules. One proceed would be around conceptual inline expressions (TIE). TIE would yield a resource of joining CSS manners with JavaScript expressions, opening adult even some-more extraordinary opportunities for website functionality.

Let’s demeanour during a elementary example. Suppose we had a testimonials member in a sidebar of a home page:

¹⁷

A testimonials member in a sidebar of a web page. (Image credit: Ian Storm Taylor¹⁸) (View vast version¹⁹)

We wish to dump this same member into a categorical calm area of another page, somewhere where we have some-more breadth to work with:

²⁰

Our testimonials member in a footer of a web page. (Image credit: Ian Storm Taylor²¹) (View vast version²²)

This is called modular design, and conceptually it’s a unequivocally elementary idea. However, we’d have a flattering tough time implementing this in CSS (as Ian Storm Taylor found²³), since there isn’t a candid proceed to request CSS styles to a testimonials member formed on a distance of a container.

This unfolding is what has sparked a commotion for component queries, a major need being a proceed to conclude reusable modules that adjust to a distance of their containers. If CSS natively implemented some arrange of TIE functionality, afterwards we competence be means to write a elementary countenance in CSS to make this happen:

.testimonial … 
.testimonial[expr="if @parent:width reduction than 200px"] … 
.testimonial[expr="if @parent:width between 200px and 500px"] … 

For a initial ruleset, we would character .testimonial as usual. For a second ruleset, a countenance could meant that, when a breadth of a primogenitor component of .testimonial is reduction than or equal to 200 pixels, afterwards request a analogous declarations to that DOM component (i.e. a primogenitor element). The same goes for a third ruleset, whereby a declarations are practical when a primogenitor component has a breadth of 201 pixels to 500 pixels.

Basically, CSS would merely yield superintendence on what to do, while JavaScript would do a complicated lifting that CSS isn’t good matched for. Instead of essay a CSS rulesets for styles and afterwards jumping over to JavaScript to activate them, we would simply do both around an countenance in CSS. Because we’re user on a same DOM element, it creates clarity for there to be some easy and discerning proceed to both character and activate it (i.e. a DOM element) directly from CSS.

Any such TIE doing should be strong adequate to capacitate web designers to exercise facilities during substantially a speed of their creativity. In other words, if they can suppose it, designers should be means to grasp it — or something tighten to it — roughly instantaneously.

Putting It All Together

Let’s cruise a unfolding that shows how all 3 would fit together when building a website.

By a time we review this, a World Cup will be on, and football fans from around a universe will have collected in Brazil to knowledge a thrills of a Copa Mundial. Let’s assume we are one of those fans and are in Sao Paolo, carrying brought your smartphone and Google Glass with you.

A renouned online sports end that happens to be covering a eventuality would customarily sweeping a website with World Cup facilities during a responsibility of other sports events going on elsewhere in a world. The website will occupy a 3 methodologies explained progressing in sequence to broach a unequivocally special user experience.

After building several calm components, a website’s developers should be means to do a few things yet many stress:

• Optimize a website exclusively for Google Glass, providing a simpler, slimmer interface for easier navigation. In addition, adjust a tone contrariety to a time of a day (i.e. switching to light calm on a dim credentials during night), regulating a device-class parameters of HAT.


• Provide some-more calm on internal attractions in opposite cities in Brazil (for instance sports bars, other observation centers, etc.) customarily if a entrance device is a smartphone or inscription and happens to be in Brazil (using a plcae parameters of HAT).


• Lead with pre-game analysis, group and actor profiles, and sell if a user visits a website within 6 hours of an arriving compare (using a time parameters of HAT in multiple with TIE).


• Lead with compare highlights and post-game research if a user visits a website within 12 hours after a compare ends. Provide opposite blueprint designs for compare highlights on smartphones and tablets regulating a same formula bottom (using a device-class parameters in HAT).


• Lead with golf facilities in a some-more distinguished plcae than football if we establish (via COAT) that a user likes a former some-more than a latter. But still arrangement compare highlights in a sidebar with a narrower pixel breadth (styled in a modular conform regulating a TIE facilities in CSS).


• Default to a unchanging format of calm if we can’t establish possibly a user prefers football or another sport.

As we can see, a permutations and opportunities of a rarely personalized and delicately weighted user knowledge are abounding and simply implementable if all 3 methodologies are considered. We wouldn’t indispensably have to use them all, yet it’s good meaningful that they’re there if we wanted to.

The Polyfill Way

“You can’t always get what we want. But if we try sometimes, we customarily competence find, we get what we need.”

– The Rolling Stones

Where would a web pattern village be yet polyfills? Even a best-intentioned record doesn’t always work as intended, and infrequently it has gaps in functionality. “Just chill and polyfill” would be a user mantra in these situations, and a final few years have indeed been a undoubted polyfill-palooza²⁴.

All of a facilities summarized so distant in this essay are merely ideas and are not earmarked in any arriving breeze specifications of CSS or media queries, so we couldn’t use them right now even if we wanted to. However, that doesn’t meant we can’t do something about it in a meantime.

Restive.JS

I mentioned progressing that we was regulating a plugin to build a website. Well, that would be Restive.JS²⁵, a jQuery plugin that we grown about a year ago that embraces and implements a HAT principle. Using built-in options of breakpoints, classes and a special underline named turbo_classes, Restive.JS populates your html or body tab category attributes with values that make it easy for we to adjust a web page’s blueprint around inline CSS to some-more healthy pattern cues.

Once we get a elementary idea, regulating it to build new manageable and adaptive websites is flattering easy, as is adding pronounced facilities to existent websites. we recently wrote a educational on “How to Make Any Website Responsive²⁶,” that we can peruse during your leisure.

You can also learn some-more around Restive.JS’ documentation²⁷ and from a GitHub readme²⁸.

A Note on Tolerance

As artistic and technical professionals, we need to be open to other people’s opinion. Often a throng will pierce towards a position simply since of punditocratic consensus, yet pausing to doubt a elemental logic behind it.

Take device detection. Some contend it’s a bad practice. My doubt is why? Is it since it is deemed unreliable? We can make it reliable. Is there a fear that it is not performant? Then we can cache data. Solving large problems should be an thorough effort, and regulating a routine of rejecting to order out methods could come behind to punch us if someone is means to urge on that method.

Creativity is an omnivorous hacker. As prolonged as imagination continues to coax a industrious, afterwards a best collection and methods will eventually give proceed to improved ones. Maintaining a pure and parsimonious concentration on a charge during palm — and a successful execution — shouldn’t forestall us from being strong with a toolset. As a good Abraham Maslow said, “If all we have is a hammer, all looks like a nail.”

In Closing (But Moving Forward)

More of all isn’t indispensably a good thing. But, when it comes to breakpoints, “the some-more a merrier” does ring true. As humans, we take actions formed on specific triggers between specific thresholds. Defining some-more of these thresholds would open adult opportunities to emanate websites that adjust in so many ways over shade size, and that scrutiny will spin out to be instructive.

However, as we open adult new frontiers with new breakpoints, we should do so in a proceed that is both user-friendly and fit for a web designer; a robustness of a methods shouldn’t make us reduction nimble. With a proceed web standards work, we’re substantially going to have to polyfill a proceed to a betrothed land. But that shouldn’t stop us from building overwhelming websites that work on each device and in countless user scenarios.

Front page picture credits: Restive Blog²⁹.

(al, ml)

Footnotes

1. 1 http://www.merriam-webster.com/dictionary/threshold


2. 2 http://alistapart.com/article/designing-for-breakpoints


3. 3 http://blog.restive.io/posts/8460953/device-classes-as-breakpoints


4. 4 http://polarb.com/176083


5. 5 http://www.slideshare.net/nickf/contextual-web


6. 6 http://dev.w3.org/csswg/mediaqueries4/


7. 7 http://www.smashingmagazine.com/2013/06/25/media-queries-are-not-the-answer-element-query-polyfill/


8. 8 http://ejohn.org/blog/selectors-that-people-actually-use/


9. 9 http://en.wikipedia.org/wiki/List_of_time_zones_by_UTC_offset


10. 10 http://restivejs.com/sandbox/pricing-table.html


11. 11 http://www.smashingmagazine.com/wp-content/uploads/2014/06/01-pricing-table-opt.jpg


12. 12 http://restivejs.com/sandbox/pricing-table.html


13. 13 http://www.smashingmagazine.com/wp-content/uploads/2014/06/01-pricing-table-opt.jpg


14. 14 http://www.smashingmagazine.com/wp-content/uploads/2014/06/02-faq-content-opt.jpg


15. 15 http://restivejs.com/sandbox/pricing-table.html


16. 16 http://www.smashingmagazine.com/wp-content/uploads/2014/06/02-faq-content-opt.jpg


17. 17 http://www.smashingmagazine.com/wp-content/uploads/2014/06/03-testimonial-content-opt.jpg


18. 18 http://ianstormtaylor.com/posts/media-queries-are-a-hack/signup.jpg


19. 19 http://www.smashingmagazine.com/wp-content/uploads/2014/06/03-testimonial-content-opt.jpg


20. 20 http://www.smashingmagazine.com/wp-content/uploads/2014/06/04-testimonial-footer-opt.jpg


21. 21 http://ianstormtaylor.com/posts/media-queries-are-a-hack/pricing.jpg


22. 22 http://www.smashingmagazine.com/wp-content/uploads/2014/06/04-testimonial-footer-opt.jpg


23. 23 http://ianstormtaylor.com/media-queries-are-a-hack/


24. 24 https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills


25. 25 http://restivejs.com


26. 26 http://speckyboy.com/2014/04/24/make-any-website-responsive/


27. 27 http://docs.restivejs.com


28. 28 https://github.com/obihill/restive.js


29. 29 http://blog.restive.io/posts/8460953/device-classes-as-breakpoints

↑ Back to topShare on Twitter

Breakpoints And The Future Of Websites