The concept of "card based" web design has been around for at least three years now. So why is it that the following quote from Khoi Vinh, written back in 2014, still appears to be a fundamental truth:
it hasn’t gotten much easier to explain to the uninitiated what, exactly, a card is.
Because here's the thing: as much as I love reading about web design, I am still very much a member of the "uninitiated". I can tell because I still have absolutely no idea what a "card" is.
I realised this (yet again) thanks to a recent article that cropped up in my RSS feed. I've been singing their praises recently, so hopefully Zurb won't mind too much if I point to 5 Common Mistakes Designers Make When Using Cards in Design as a prime example of 1 Common Mistake Web Designers Make When Talking about Cards, chiefly, that what a card is fails to be defined anywhere.
Perhaps this whole situation is just down to me. Maybe I've fallen so far behind web trends that my outdated ways of attempting to understand "cards" are just not up-to-scratch. But, frankly, there doesn't seem to be much help out there.
Early articles on using "cards" in design tend to paint a picture of API driven, cross-platform data sharing. A sort of standardised method of pushing/pulling content from/to various web apps; an ecosystem of information, if you will. That all sounds interesting and pretty great, yet presents a concept that is simultaneously vague and highly technical, creating a perfect mixture for people to be excited about yet confused over.
Yet "cards" are also used to describe certain design styles. In that linked Awwwards article a number of examples of "good card-based web design" are cited. Some, such as Dribbble and Pinterest, appear to be examples of the information ecosystem mentioned above. But then you have websites like White Frontier, which whilst being a great example of web design do not appear to have any form of content interaction or applicable data extraction methods. Yet these designs are, apparently, just as "card based" in their makeup.
As far as I can tell from Googling around the subject, "cards" are just rectangular content areas situated on a website. They might pull in information from a third party, they might just be a stock photo and a strapline. The article I initially quoted comes to a similar conclusion, that cards either fit into the "design" or "third-party" camps, which doesn't seem particularly useful to me. If they're just a design style then, really, they're just a particular way of presenting content; a way which, ultimately, seems pretty much identical to how most people have always done it. If they're only to be used when pulling third-party data then we need a tighter definition, because I don't feel anyone would be happy suggesting iframes are all cards.
Currently, their only unifying factors appear to include being responsive, rectangular and online. So perhaps that's all there actually is to them, which would be rather neat. If that is the case, then I can happily claim to have been making card-based websites since 2007, putting my well ahead of the trend!
