Once again, technology rocked the entire creative industry. Creating, designing, coding and publishing content...
...without paper media's distribution constraints — was liberating. (Blogging validates this concept today.) However, I was also following the money. Much like the DTP Revolution of the '80s, clients dumped print assignments while throwing money at anyone said they could code.
A freelance client hired me to design some web graphics. When the graphics work was commpleted, he offered me HTML assignments. Since I didn't know how to code, they snuck me into his introductory HTML class. Within 8 hours, I wrote my "Hello World" page and never looked back.
I blew off print gigs while teaching myself more advanced HTML. My one-bedroom Brighton apartment was covered in tech manuals, sketches and notes that looked like they were written by a madman.
Some people do well in abstract, institutional educational environments. I seem to only learn with a gun to my head. My goal of getting in on the HTML gravy train could only be reached by building my own website. Below is the site's development history, defined by version number:
Marshall Art Studio 1.0
- Imagemapped Prime
- July 1997-November 1998
My first site, written in undeclared HTML. Each page is a giant IMAGE with navigation links in IMAGEMAPs. The minimal text is positioned with BLOCKQUOTEs. There are some UI concepts that can only be described as "odd". Not using HTML element tags or usability testing sure speeded up the development process!
During this 18-months, I was managing an active print media career (mostly illustration, with some page design). As a back-burner project, my HTML skills were strong enough to land interviews. The HTML shortcuts left me unqualified for larger corporate assignments. But living below the radar meant I had lots of time to learn.
Marshall Art Studio 2.0
- Blue Rough Diamond
- December 1998-December 1999
My first two-column TABLE layout. Based the left-thin navigation column's font treatment on ESPN's, with my own Midnight Oil-inspired, over-rendered background image. IMAGEMAP navigation replaced by linked text. The expandable width wasn't so distracting on 800 x 600 monitors.
I started off by using Adobe PageMill 3.0, tempted by its editable Preview mode, control pallets and drag-and-drop functionality. Working with it for a month proved it an unreliable development tool. The Preview didn't render exactly like real web browsers, causing major positioning discrepancies. The Source mode was equally problematic, destroying any custom line-wraps and interpreting anything it didn't understand as a potential error. Correcting published errors created by working in this buggy application erased any benefit of using the shortcuts.
To avoid these hassles, I went back to coding in SimpleText and previewing with Netscape. As my old HTML teacher explained "that's all a WYSIWYG editor is anyway."
Coding a complex website in pure HTML was very time-consuming. Without color-coded syntax, keeping track of all those embedded FONT tags was a maddening and error-prone process. In the name of "learning experience", my actual working hours easily dwarfed the billable hours. Again.
I was astoundingly ignorant of HTML fundamentals at this time. Take the BODY's background image for example. Instead of stacking a thin 144 x 288 graphic and coloring the BODY white in HTML, the background image is a really wide 1800 x 288 bandwidth hog!
Fortunately, a few factors saved me from paying the price for this markup incompetence. During this version's 14-month shelf life, the internet was still an infant in capabilities and expectations. By the time hiring managers started doing code reviews, I learned enough to correct most of these types of errors. Earning my degree from the School of Hard Knocks, I became a better designer and developer.
Of course, the learning didn't stop there.
Marshall Art Studio 3.0
- Blue Brushy Slick
- January 2000-July 2002
At this point, the primary marketing purpose was promoting my illustration and graphic design capabilities. Since I had a full time web design job, my freelance web capabilities and training were a back-burner project.
With that in mind, here's another outstanding 2-column TABLE layout. A lot of people said 2.0's navigation column was difficult to read. This version is an overall cleaner, more corporate look. (For some reason the Typewriter font seemed cool), loosely based on v2.0's "Five Step Artist" illustration. The layout TABLE's 532 pixel width looks small now, but was optimized for Y2K's average monitor resolution of 600 x 800 pixels.
<h4>Foo Headline Going Across the Line</h4> <p>Do FOO sentences go on this long, with no real purpose?</p> <p>Yup, and another Foo sentence goes like that.</p>
Instead, here's how I would've marked up this same content back then:
<b>Foo Headline Going Across the Line</b><br> Do FOO sentences go on this long, with no real purpose?<p> Yup, and another Foo sentence goes like that.<p>
In my defense, I was far from being the sole culprit. This markup was considered standard practice in the work world, and didn't break in Netscape or IE. However, it exposes a lack of fundamentals that would get me laughed out of the business today. Back then? No harm, no foul. In fact, my day job rewarded me with hefty annual bonuses.
Marshall Art Studio 4.0
- Gray White Fade
- July 2002-June 2004
Possibly my final layout TABLE. Expanded content width to 800 pixels. Introduced CSS and declared my first DOCTYPE. Used element tags without closing them, mostly paragraph tags with "class-itis". Navigation column restored to HTML text, with the current state having a unique class selector.
The visual design was formatted to fade behind the content. The third "striped" column was an attempt to keep the the fixed-width content column looking good on increasingly-wide monitors. Returning to previous interface, the section landing pages have clickable visual elements. It probably would've been a good idea to dump the section descriptions, but they looked so nice under the headline.
Emulating some of Merrill Lynch workflow practices, I started referring to illdave.com redesigns as "releases".
Since print design and illustration assignments slowed down, each major release was an announcement of my growing capabilities. Gaining expertise through experience, I became known for merging technology with visual design principles to create customized websites.
In a move to market my accomplishments to hiring managers and technicians, I introduced detailed project pages with a "situation/action/results" format. This practice, along with doing better work, gained me the next level of clients and employers.
Marshall Art Studio 5.0
- Red No Table
- June 2004-October 2006
After testing the waters on developing client websites, this is the site's first TABLE-free, all DIV layout. Applying standards practices, all HTML element tags are open/closed properly. It's even almost WAI-compliant (images have ALT, but links don't have TITLE). By the standards of the time, a technical masterpiece.
The visual design's a bit loud, probably an obnoxious over-reaction to those who felt the previous version was too boring. I sure showed them!
The toggled UI buttons (Illustration, Print + Web) was a bit restrictive as well. The buttons only looked good with complete rows of 3, creating a "tail wagging the dog" dynamic for choosing what content got posted.
In an effort to create a more "marketing" feeling, I removed the Sketchbook and Personal Stories sections.
Since I had a full time job, the site became my testing ground for developing new XHTML/CSS practices. In two years, I had a better understanding of UI, functional visual design and standards-compliant markup.
Now all I had to do was prove it.
Marshall Art Studio 6.0
- Blue Pinup
- September-October 2006, unpublished
Promotes my web design capabilities more than the print media skills. Shoved current content into a new "skin" based on classic pinup illustrations. While this seems like madness now, others were doing the same thing.
As the 2-month development process ended, I realized that neither the visual design, UI or coding reflected my current philosophies of good web development. In order to get newer, more lucrative clients, I gotta rebuild from scratch.
Marshall Art Studio 7.0
- Wide Format
- October 2006-March 2021
So far, this design has been enhanced with rethought elements, new functionality and easily modified content. All without having to touch every page or rebuild overall markup structure. It's taken a decade, but I think the site's finally decent.