Crafting the Front-end

16 Comments

Comments are ordered by helpfulness, as indicated by you. Help us pick out the gems and discourage asshattery by voting on notable comments.

Got something to add? You can leave a comment below.

  1. Ben Bodien

    Thanks everyone for your comments and thoughts!

    @Lupalz I take your point, and certainly sometimes well crafted objects and products can be embellished beyond what is strictly necessary for their function. It would probably be quite a boring world if that were not the case.

    I’ve never been close enough to such a Cadillac unfortunately, but I would hesitate to classify it as crafted work purely from the form of the tail fins, as classic and beautiful as they are.

    I would suggest that good craftsmanship sits significantly closer to engineering than art. After all, craftspeople were typically producers of commissioned, tailored items that had a specific function, rather than creators of pure art. Any perceived artistic qualities of a crafted product would therefore generally be a surface level bi-product of the “engineering” within.

    @Stuart I was the same for a very long time, starting each project from scratch. Having a common baseline really helps you improve and develop a deeper understanding of the plugins and libraries you rely on.

  2. lupalz

    Great article. I am just puzzled by one of the key traits you list:

    A preference for simplicity: an almost Bauhausesque devotion to undecorated functionality, with no unjustifiable parts included

    I accept this as a trait of good engineering. I am just uneasy about accepting this as a defining trait of craftsmanship has this has historically been recognised even when the resulting product has qualities that go beyond functionality.

    If we were to stick to this definition then this 1959 Cadillac would be pointed at as an example of bad craftsmanship:

    Massive tailfins

    As much as I would love to be called a web craftsman, I am not sold to its use in web development and I am more comfortable with the words engineering as a more appropriate definition.

  3. Ben Bodien

    @Dave That is a fantastic point, thank you so much for raising it. The answer could probably fill out another entire article, and I might go ahead and write one. In the meantime here are my thoughts:

    I would say that clients largely fall into two groups. Firstly there are those who appreciate quality and craftsmanship, and care enough about their product that they want the best for it and are willing to pay the price in money and time.

    Then there are people that just want a website built, and see what we do as a commodity industry – they’ll write a brief and get estimates from several people, and will likely go with the cheaper end.

    If you consider yourself a craftsman, then obviously the second type of client is of no value to you whatsoever (I’d say they’d even do you more harm than good). Learn to judge based on early interactions, including their brief, their budget (always insist on being given a number), and their answers to your questions which category a prospective client falls into, and respond accordingly.

    As for how you get more of the right type of client, you will almost certainly need to look beyond local businesses for your client base. There is, in my experience, little actual benefit to having clients located close to you. There are far more important criteria to satisfy (budget, timeframe and appreciation of good work are probably my top three).

    Based on simple probability given the size of the two categories (in my experience very few of the right type, very many of the wrong type), the chances of you finding the right type of client who is also nearby are slim.

    Don’t worry about competing with the ‘blodgers’ – they are not operating in the same market segment as you, and you don’t want their sort of client anyway.

    On the subject of money, there’s something to be said for being “reassuringly expensive”. Nobody expects to go to a tailor and have a suit made for the same price as an off-the-peg suit. The right type of client will be reassured that they will be getting the quality of work they are looking for from someone who charges a rate that is at the higher end of the market. If they have an appropriate budget for good work, and they receive a quote from someone at £75/hr and someone at £20/hr, wouldn’t they feel safer with the £75/hr option?

    Also, avoid thinking about your (above market average rate) as being “expensive”. Your rate should always represent good value to your clients. As you raise it with experience, you aren’t getting more expensive, you’re simply providing good value to a higher calibre market.

  4. Nicolas Chevallier

    I find it increasingly hard to keep up at libraries and frameworks: for example with Mootools has changed quite a bit the structure of the library several times. And when using plugins using Mootools, it becomes a real headache!

  5. Stuart Robson

    I’ve been thinking about my ‘toolbox’ ever since coming across @colly’s ‘ultimate package’ about a year ago.
    Every design thus far though has been a complete restart in my framework codebase etc etc.
    With this post now resonating clearly I will endeavor to sort my tools out over the Christmas holidays.
    Thanks for a great article Ben!

    And 24ways, you’ve surpassed yourselves this year, great work!!!

  6. Phil Ricketts

    Your point about printing things off has only just been discovered by myself a couple of days ago.

    I’ve been building a site which is in the midst of being designed, and considering what classnames and conventions to use, I thought it would be helpful to print out the comps and do exactly what you said – write all over them.

    I’ve never thought about planning my markup before, but it makes total sense.

    Have a great Christmas Ben!

  7. Chris Garrett

    From everything you’ve described Ben, it sounds like your outlook is similar to mine, in that frontend development will take on many of the well established principles of backend development.

    We’ve long held this outlook and won’t generally look for a frontend developer who’s not additionally well versed in object oriented programming principles.

    The current patterns emerging around Javascript are really hitting this home, moving towards MVC implementations, proper class implementations etc. It’s definitely going to be an interesting year!

  8. Thijs Kuipers

    Love the article! I recognize the feeling when I’m hacking around something and it actually physically hurts. However, using the word “craftsman” goes back to Romanticism, which, in the current (at least Dutch) revival of romantic nationalism leaves me with a bit of a bad taste. That might be a personal thing, though.

    When you make a list of what something is in your opinion, like a craftsman, you can be sure some people want to add or remove items from it. For me, the thing you’re trying to describe can be summed up in one sentence: the man and the work he produces are one. That’s why hacking around something hurts, your work is an extension of yourself. Like trying to bend your knees backwards.

  9. Suleiman Leadbitter

    Great great article. Just a note, my father is also a carpenter & I worked on & off with him all through my childhood through to my twenties. The main thing carried across to my design career was ‘look after your tools’. Man did I learn that.

  10. Ben Bodien

    @Thijs That’s a great way of defining craftsmanship. The list was meant to be more of a starting point than anything definitive. I’m sure I’ll think of things to add and remove as well.

    As for the political connotations, I’d say we should do our utmost to keep our crafts agnostic of any such influences, and remain true to our work which in turn is true to its purpose. Think again of the Bauhaus and their ill fated struggle against rising national socialism in the 1930s. The ideologies are thankfully worlds apart and there need be no blurring of boundaries there.

    @Suleiman thanks for sharing! I’d be interested to hear how you apply that lesson learned from your father to your day to day work. Tweet at me or something :)

  11. Mike Healy

    Like lupalz I was unsure that minimalism was a necessary trait. I thought of a piece of furniture with detailed decorative carvings. Those details are unnecessary for its function to be sat on, eaten at, or hold socks, but add a lot to the value of the object. Some would say that beauty and pleasure are functions, and for that reasons the decorations are not superfluous.

    Perhaps no unnecessary irrelevant bits would be more appropriate? No junk class names spat out by a CMS for styling that never comes, no obscure social sharing buttons that never get clicked, no excess descriptions and instructions that never get read.

    On a side note ‘craftspersonship’ and ‘craftpersonhood’ have got to be the clunkiest and inelegant words I’ve ever read. It’d be great if some women could give permission for craftsmanship to be the cover all.

    Good article.

  12. Dave

    I have for years marketed myself as a craftsperson, holding to all the values and traits you have so beautifully communicated Ben.

    I think it is important to point out though, to any self employed ‘craftspeople’ that aspiring to this level of artisanship will not always be your ally in the ‘real world’ of trying to make ends meet.

    Clients on the whole do not ‘get’ this attention to detail this passion and therefore are unwilling to pay a premium for it, so unless you can do all this and still bring it competitively and remember you have to be competitive against the ‘blodgers’ who don’t give a monkeys about quality it may be better reserved for personal projects.

    Having said that i still continue to adopt the approach of a craftsperson but loose a lot of potential clients who don’t understand why my prices are higher. I think my main issue is dealing with local market and would perhaps have more success with a pre educated market who understood the difference between cutting edge, best practices versus pre 2003 DW table design!! help!! aghhh!

  13. Harmony Steel

    Great article, thank you Ben :) The craftperson’s gland cracks me up, that is so true.

    After watching that excellent CSS as lego’s (http://www.slideshare.net/stubbornella/object-oriented-css) presentation a few years ago I’ve had my own html/css framework which I use for every project and continually improve, however I like the idea of adding more modules to it and I’m going to do that.

    Thanks too for the idea about printing out wireframes and scribbling on them to identify common modules, I’m going to try that as well.

    Harmony

  14. diseñador madrid

    I would say that clients largely fall into two groups. Firstly there are those who appreciate quality and craftsmanship, and care enough about their product that they want the best for it and are willing to pay the price in money and time.

    Then there are people that just want a website built, and see what we do as a commodity industry – they’ll write a brief and get estimates from several people, and will likely go with the cheaper end.

    If you consider yourself a craftsman, then obviously the second type of client is of no value to you whatsoever (I’d say they’d even do you more harm than good). Learn to judge based on early interactions, including their brief, their budget (always insist on being given a number), and their answers to your questions which category a prospective client falls into, and respond accordingly. As you raise it with experience, you aren’t getting more expensive, you’re simply providing good value to a higher calibre market.

Impress us

Be friendly / use Textile