Design Craftsmanship on the Web

I just read this article, which stirred up this recollection: Why I learned to make things – Signal v. Noise

I learned to code by necessity back in 1996/97. I was responsible for building my agency’s first Web site, and those of our clients, and my colleague who understood ASP was also the person who had to figure out why people on Windows computers couldn’t print. (He was busy, in other words.) So I wasn’t always able to get an answer or a fix when I needed it.

Beyond the necessity, I was flat-out fascinated with how things worked on the inside. This was just an extension of what I had always done as a kid – take things apart, and see if they still worked after I put them back together.

I have heard countless times, on this list and others, that “visual designers” don’t need / want to know about “code” (often written in scare-caps as CODE). I can’t agree with that stance. At all.

Before I answered the siren call of HTML/CSS/PHP/Ruby/SQL/JavaScript, I was an agency Art Director and Creative Director. Before that I was an advertising photographer. I studied graphic design and cabinetmaking and hollowware and English literature along with photography in college. Each of those pursuits gave me another avenue to pursue my muse(s). Each of them taught me a healthy respect for the “rules”, as well as ways to divine when breaking those rules was okay. I learned to trust my materials, and to understand each of them at an intuitive level, so I was no longer a slave to those rules.

When you design for the Web, your materials are not ink and paper and dot gain and spread. You aren’t worried about paper bias or signature creep. You are, however, going to have to understand what it is you ARE working with. To know at a fundamental level why you can’t alter the distance between two items by changing the line-height of the text, just as you would never set a table of data by pressing the space-bar a couple dozen times until it “looked right”.

Freeway does you a huge service by removing the traditional early learning curve from Web design. Instead of getting hung up on the semantic differences between a UL, DL, and DIV, you just start making things. That’s a very powerful hedge against the death-of-a-thousand-cuts of trying to learn the alphabet and the language and how to write a convincing argument all at at the same time.

Beyond a certain point, though, you need to understand your craft at a different level. Just as the administrative assistant to the third vice-president might fire up PageMaker on her PC to make a flyer for the lunchroom bulletin board, and would never understand why the color she thought she saw on her monitor didn’t come out of the printer, what you do when you use Freeway in earnest – but without learning about the materials you are shaping – is similarly headed for disappointment. At best, you’ll make the same mistakes over and over.

I recommend that everyone on this list who has not already done so get a book about HTML and CSS, a programmer’s text editor (TextWrangler is free and very powerful: http://barebones.com), and do the following in Freeway:

  1. Pull down the File / Preview in Browser / Browser Setup… menu item.
  2. Click on the New button, and navigate to your text editor to add it to the list of possible “browsers”.
  3. Start using File/Preview in Browser/YourTextEditor to see how Freeway is structuring the design you’re making.
  4. If everything you see is crammed on to three lines without a line-space in sight, turn on “More Readable” in the output options of the Document Setup dialog, and publish again.

Start small: start by reading the code, finding one bit of text you wrote, and looking outward from that point to see the code that holds it in place and gives it its shape and style. When you don’t understand what a tag is, look it up. Start to assemble the kind of appreciation for your materials that you may once have gathered for other modes of communication. You wouldn’t mix C99 Y99 M99 K99 in ink, would you? Remember that you had to learn that – maybe the hard way.

You’re a professional and a craftsman, after all. Learn your materials.

Peace,

Walter


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Though I didn’t state it as thoroughly as you did (my target audience is potential clients, not designers), I essentially said the same thing in a section of my personal site. It’s amazing to me how pervasive this is among professional designers.

I remember that article and I’m glad you revisited it.

Todd


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’m hand coding more and more sites – Text Wrangler, CSS Edit and Espresso – the more I learn the more fun I’m having. FW is a great tool and I have learnt a lot about building websites but there is so much more once you take a look under the hood. Especially building responsive sites, doing it by hand on a solid framework is the way to go.

I often do a quick layout in FW and then strip out the funky CSS and rework it in a text editor.

Marcel


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 17 Dec 2012, 4:19 pm, waltd wrote:…
So I wasn’t always able to get an answer or a fix when I needed it.

Beyond the necessity, I was flat-out fascinated with how things worked on the inside.

You’re a professional and a craftsman, after all. Learn your materials.

Peace,

Walter

And thanks to you taking the time to explain the How-to and the Why I got interested in HTML and CSS as well…!

Nice to read your background. Cabinetmaker. You must love tools, I guess. My background is being a sculptor. Stone and wood and all that. And above all, tools. Started with webpages because I could not afford to pay someone to do it for me. To be able to run my business better I even started building some apps in FileMaker, which I still understand better than spreadsheets funny enough. And after a few years with Freeway and ExpressionEngine I find myself using code almost all the time. Using Freeway app as a framework builder.

So true: learn your materials. And tools, I would add.

Thanks.

Hans


offtopic mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options