You are on page 1of 46

The Emerging Profession

14 April 2008

as i worked on what I wanted to say, a new talk began to take shape

as i considered what makes a professional, i kept coming back to a certain word again and
The Emerging Craftsman
14 April 2008

and so this talk will actually be about the emerging craftsman, as in the craftsmen of the web

and here i should take a moment to point out that I'm using "man" in the sense of "human"--
this applies to women as well as men, and no gender specificity is meant
crafts·man (krafts′mən, kräfts′-)
noun pl. -·men--mən
1. a worker in a skilled trade; artisan
2. any highly skilled, painstaking,
technically dexterous worker, specif. in
the manual arts

so what is a craftsman? we can turn to the dictionary for explanations of the word's meaning,
crafts·man (krafts′mən, kräfts′-)
noun pl. -·men--mən
artisan, craftsperson, handicraftsman, skilled
worker, skilled tradesman, skilled workman, master
craftsman, journeyman, maker, wright, smith,
union member, technician, manufacturer,
machinist, mechanic, artificer; see also artist, worker

or a thesaurus to get related concepts,

“A man who works with his hands is a laborer;
a man who works with his hands and his brain
is a craftsman; but a man who works with his
hands and his brain and his heart is an artist.”
~ Louis Nizer ~
(1902 – 1994)

but I think in a lot of ways the best summation of craftsman is this quote from louis nizer

now, i can't tell you how to get to that third stage-- i suspect that nobody can

We cannot teach students to use their hearts, but we can teach them how to use their hands
and brains in service of their hearts - how to be craftsmen, and thus give them the chance to
become artists

to me, a craftsman is someone who is good at what they do not because they have to be, but
because they want to be

craftsmen will have a sense of the history of their craft, which deepens their pride because of
their understanding of what's gone before and the foundation on which they build themselves

so let us consider the history of the web (okay, not the whole thing)
“The web is more a social creation than a
technical one. I designed it for a social effect
— to help people work together — and not as
a technical toy. The ultimate goal of the Web
is to support and improve our weblike
existence in the world.”
~ Tim Berners-Lee ~

TBL created the web as a way of connecting not just information, but people; that goal
informed the technical design
“The most important thing that was new was
the idea of URI or URL, that any piece of
information anywhere should have an identifier,
which will allow you to get hold of it.”

this extends even to the humble (yet mighty) URL/URI

“That idea of URL was the basic clue to the
universality of the Web. That was the only thing
I insisted upon.”

the ability to get to any resource via its URI is the most commonplace aspect of the web, so
it's easy to forget just how revolutionary that was at the time

(for comparison, Gopher had unique servers but you had to navigate them from the top level,
much like BBSes)
“The power of the Web is in its universality.
Access by everyone regardless of disability is
an essential aspect.”
~ Tim Berners-Lee ~

once it's possible to reach any bit of information, it becomes equally important that anyone
be able to do something with the information that's been reached

accessibility isn't an add-on, isn't a thing of fear: it is infused into every aspect of the web,
and it takes effort to suppress it

but oh, how we as an industry have worked

some of you may recall the days of Mosaic -- you're looking at the height of 1993 web design
right here (even though this is from later on)

at first, there was almost no worry about browser consistency because there were only a
couple of browsers and they didn't offer anything in the way of authorial intent

(in fact, the paradigm was an inversion: the user could define the presentation of any element,
where the author could not)
authoring was done with anything that could edit text; I used Word 5.1a

then Netscape was formed, and things started to shift

no user settings; introduction of things like font and tables and blink

IE started competing with its own invented stuff like marquee, and then the browsers wars
came into full swing

browsers became incomptaible with each other on purpose, inventing their own versions of
html as they went
“In ‘93 to ‘94, every browser had its own
flavor of HTML. So it was very difficult to
know what you could put in a Web page and
reliably have most of your readership see it.”
~ Tim Berners-Lee ~

as TBL says, things started to diverge; you couldn't even be sure of HTML authored to one
browser's abilities would display comprehensibly in another
“Anyone who slaps a ‘this page is best viewed
with Browser X’ label on a Web page appears to
be yearning for the bad old days, before the
Web, when you had very little chance of reading
a document written on another computer,
another word processor, or another network.”
~ Tim Berners-Lee ~

badges came up (this site best viewed on my computer)













Internet Explorer
Netscape + Gecko family (Firefox et. al.)


and then right as netscape and IE started to change places in the market,

the wasp was born

their mission was very simple: to force browsers back together, to return the web to its roots

there was some self-interest, because we were all tired of navigating the incompatibilities and
in some cases building parallel sites

it became a movement to smooth out a very rough playing field in order to give us the chance
to actually learn a craft
“When it comes to professionalism, it makes
sense to talk about being professional in IT.
Standards are vital so that IT professionals
can provide systems that last.”
~ Tim Berners-Lee ~

this is quote that survives from the original title of the talk, but it’s an important point

(substitute “craftsman” for “professional” if you like)

it is important not only that we have pride in the work, be craftsmen of the web, but that in
that capacity we take the web’s nature seriously, that we work to preserve and even defend it,
and strive to be the best we can be so that what we build can last
so where are we today? what defines a craftsman of the moment?

we still have lots of browsers and lots of things to learn

incompatibilities, while much smaller than in the past, are still with us and will never be
completely banished so long as more than one browser exists

so how do we navigate the landscape?

we have tools now, very powerful tools, that can abstract away much of the difficulty
but this is where a web craftsman is at home

yes, I really am saying that a true web craftsman should be able to hand-author a site,
markup and CSS and all -- not that they must do so, but that they be able to do so at any

IDEs like dreamweaver and expression abstract too much, especially when learning the craft
craftsman.web {
coding: by-hand !important;

so yes, learning all the elements and attributes and properties and values is important,
indeed crucial, to anyone who wishes to be anything more than a web laborer

once you’re mastered those things, you can use tools like IDEs with confidence and use them
Which of the following is more semantically
correct? (For the title of a document.)

A. <span class="title">This is a Title</span>

B. <h1>This is a Title</h1>

C. <p><b>This is a Title</b></p>

© Dan Cederholm

teach markup and semantic markup

they will groan, just as middle-schoolers groan when forced to learn English grammar and
basic algebra

these are important skills because they are foundations

start simple, covering not only what is best, but why

Which method makes the most sense when floating
an image and caption within a body of text?

A. <p class="floatimg">
<img src="image.jpg" alt="good alt text here" /><br />
Description goes here

B. <div class="floatimg">
<p><img src="image.jpg" alt="good alt text here" /></p>
<p>Description goes here</p>

C. <dl class="floatimg">
<dt><img src="image.jpg" alt="good alt text here" /></dt>
<dd>Description goes here</dd>

© Dan Cederholm

then build up to more advanced topics and reach the points where there are no right answers

because this is a field where there are many choices, none of them truly correct, and only a
master craftsman will be able to evaluate situations and make informed judgments

poetry; street addresses

“We can only progress if we question ourselves
at every step and then ask ourselves if the
question is the right one. At least if we look for
alternatives, or at least try and fail to make
improvements, we are pushing at the edges of
what is possible and one day might find
ourselves breaking through into new territory.”


with the right foundation, students will become able to not only challenge their teachers, but
challenge themselves-- to know when they’re up against the edges of the profession and
when they’ve pushed beyond the realm of easy answers
with that skill, they can adapt to evolutions of the web such as microformats
<div class="vevent">
<span class=”summary”>MinneWebCon</span> -
<abbr class="dtstamp" title="20070928">April 14, 2008</abbr>
<div class="location vcard adr geo">
<span class="fn">McNamara Alumni Center</span><br />
<span class="org">University of Minnesota</span><br />
<span class="street-address">200 Oak St. SE #35</span><br />
<span class="locality">Minneapolis</span>,
<span class="region">MN</span>
<span class="postal-code">55455</span><br />
<span class="tel">(612) 624-9831</span><br />
<span class="latitude" title="44.975015"></span>
<span class="longitude" title="-93.232534"></span>

after all, imagine trying to decipher this markup without that grounding
the best IDEs are frankly the ones you can create out of web browsers

web developer toolbar

the best IDEs are frankly the ones you can create out of web browsers

web developer toolbar

the best IDEs are frankly the ones you can create out of web browsers

web developer toolbar

the best IDEs are frankly the ones you can create out of web browsers

web developer toolbar

the best IDEs are frankly the ones you can create out of web browsers

web developer toolbar


working natively in the medium is an inherent advantage


working natively in the medium is an inherent advantage


working natively in the medium is an inherent advantage


working natively in the medium is an inherent advantage


there are also warning signs that indicate someone still has a ways to go in order to reach
their full potential as a craftsman
layout tables, particularly nested
solely presentational markup
frequent use of deprecated elements
lots of line-breaking
class-itis & div-itis

poor style organization

lack of accessibility
dependency on scripting or plug-ins

and if they evince these?

© Marc Hanot
Reproduced with permission of the author
“First of all, I'd like to say here the fact that
I'm not naturally a craftsman has made me
work very hard.”
~ Beatrice Wood ~
(1893 – 1998)

with all due respect to beatrice, a craftsman is someone who almost by definition works hard
because they are compelled to do the best job they can
“An apprentice carpenter may want only a
hammer and saw, but a master craftsman
employs many precision tools. Computer
programming likewise requires sophisticated
tools to cope with the complexity of real
applications, and only practice with these
tools will build skill in their use.”
~ Robert L. Kruse ~

this has long been true of the physical arts, but it is just as true of the digital arts such as
programming or the web
“When a work lifts your spirits and inspires
bold and noble thoughts in you, do not look
for any other standard to judge by: the work is
good, the product of a master craftsman.”
~ Jean de La Bruyère ~
(1645 – 1696)

ours is a profession that makes possible the bold and noble in bringing people together, in
connecting information, in revealing patterns, in a whole host of ways

it is just as important, and just as critical, that we build it well, so that it will last and the
changes it makes possible will be equally lasting
The Emerging Craftsman
14 April 2008