We had to rearchitect a huge and complicated chunk of JS-rich DOM at Sky yesterday; we moved a few elements around and completely altered how one of the trickiest parts of the Sky Bet font-end works, and had minimal effort in needing to change any CSS or JS as a result.
A job that would have normally taken upward of half a day took us under half an hour, because everything was granular and isolated enough to allow it to drop almost anywhere in the DOM and still work.
I’m hoping to write up an article about verbosity in HTML at some point—which should hopefully cover this kind of thing in more detail—but until then: embrace the more-classes-in-your-markup approach!
I really like how the css-community is recently adapting some practical techniques from higher-level programming languages to be more efficient.
Hope we'll see that verbosity article soon.
This is an interesting one, or at least one I find interesting… how would/do you brand yourself?
Take me, for example.
I usually describe myself as a ‘web designer/developer’ but I don’t think this is very representative any more; I’m not a great designer and I’m only getting worse at it—my development is my strong point and I am only getting better at it.
However, I only really write HTML and CSS, so is it fair to call myself a developer? Most developers deal with a lot more complex stuff than HTML and CSS.
But, I do so much more than write HTML and CSS; anyone can float a few divs or make some text red, I’d like to consider myself a front-end architect. I build elegant, scalable solutions for massive front-ends; it’s what I’m employed to do at BSkyB…
At Sky I am employed as a Senior User Interface Developer, but that’s my job title, not me. I can only really call myself a Senior UI Developer whilst I’m at Sky, so what am I?
I have no idea, but I’d really really love to hear what your official job titles are and what you’d consider yourself to be!
Plus, since we use the terms "Frontsite" and "Backsite" to talk about the public part and the admin panel, respectively, it confuses them even more, and as I result, they sometimes ask me to do php/mysql stuff, and ask backend devs to do html/css, which is pretty bad.
I think User Interface Developer is quite okay, it says a lot for non-tech people. I have no idea how to call a backend developer to make the average Joe understand, though. The best I could come up with was "Data Management Developer" but that sounds just silly.
A few minutes ago—largely as a proof of concept—I wrote this HTML:
`<a href=/login/ class="btn btn-rev btn-lrg giga go brand-face">Log in</a>`
Although a very exaggerated example, it felt good.
Using lots of tiny classes like that is akin to eating at Subway; instead of ordering a sandwich as a whole you can make an almost infinite amount of combinations of sandwich by combining the smaller parts—the ingredients.
By breaking a sandwich down into smaller bits you can quickly and efficiently create a multitude of varieties of sub. This is what class based builds are like. Instead of:
we now have
and that is awesome!
Don’t like tomato? It’s easy to leave it out…
Class based builds are like eating at Subway (only nicer).
“There is the desire of a consumer society to have no learning curves. This tends to result in very dumbed-down products that are easy to get started on, but are generally worthless [or] debilitating.”—Alan Kay, http://goo.gl/V1d2k.
That’s a challenge for us also with websites and, occasionally, low information density. Some things can’t be reduced to a catchy phrase and a junkchart.
— Good Guy Buffet http://en.wikipedia.org/wiki/Warren_buffet#Wealth
Harry is an award-winning Consultant Front-end Architect, designer, developer, writer, and speaker from the UK. Previously aSenior Developer at BSkyB, he now helps teams all over the world build better products.
He specialises in authoring and scaling large front-ends; he writes on the subjects of maintainability, architecture, performance, and more at csswizardry.com; he is the lead and sole developer of inuitcss, a powerful, scalable, Sass-based, BEM, OOCSS framework; he Tweets at @csswizardry.