The graphic designer in me that I’ve been repressing for so many years is edging her way out and is screaming. You might remember earlier when I was gaga for text, clamoring for color, aching for artistry? Now I’ve dabbled in depth — and I love it! Look at these: “30 Awesome Web Designs that Create the Illusion of Depth” from Six Revisions.
How fun is depth in designing a web site? Okay, I will acknowledge right now that most of those incredible sites I drooled over as design art had elements of depth. I just didn’t isolate it when I was ogling their overall awesome-ness. When you see sites that look like a child’s pop-up book, or make you feel you are at the very top of a tree in a birdhouse community above the clouds, or have you unfolding the pages of a book to see the different parts of the site, you know what depth can add to a site. I was also digging the site that featured a photorealistic room with various clickable photorealistic mechanisms, and it made me picture being able to do the same thing with a high school locker. That’d be cool, if it hasn’t already been done.
Now is when Ms. Devil’s Advocate comes out with her party-line speech: it’s all good to a point. Everything in moderation. Blah, blah, blah. But it’s also true. Depth could be overused, to the point of user confusion, and would not be nearly as effective as the web sites referenced above if the intended effect is not immediately clear to the end user. In fact, the appropriateness of its use should be considered based on the client and the image they want to portray. It definitely represents a more laid-back, fun page – not necessary good for serious business.
Regardless, used appropriately and effectively, depth is a fun aspect of open and creative web design.
Now that we are getting into the meat of coding in HTML (not experts but any stretch of the imagination, but familiar enough to read a little source code on our own), I’m learning about so many resources available for web design.site construction that I never knew existed. And now I have to look at them critically to decide whether they will be a resource I utilize, or one a eschew.
Take, for instance, something call the Tabs Generator. Very cool little gadget to play around with.
I can see both sides of an argument about using something like this. Before I endeavored to enter the master’s degree program, I tried rather unsuccessfully to build a few websites. I mean, they worked and everything, but I was flying blind and using whichever template tool I could figure out. I might have used something like this to make my life easier, but I didn’t even know you could find these things online. I’m guessing most individuals taking a stab at creating at web page don’t know about these sites. I didn’t know how to code then, but I was able to at least give the owners of the sites a presence on the web.
Did I consider myself an expert? Heck, no!
In fact, I still wouldn’t call myself an expert, but that is the goal. I see where these sites can give great options to beginners, but if everyone uses them, then everything will begin to look the same — and didn’t those amazing designs of one of my previous blogs discuss why those designs made me fall in love with web design? They’re different, they’re beautiful, they’re made by experts who know how to use all the tools and resources at their disposal to create something very different from ever single other site on the web.
In order to learn my craft and become an expert in web design and development, I’m going to need to know all my tools and all my resources. That includes coding. Like everything else in life, there are no shortcuts to long-term success.
In class for the last several weeks we’ve been focusing on learning HTML, and I’m noticing with frequency that what we are learning is deprecated. I realize that you have to learn the basics before going off on your own. I think about my son and wakeboarding — he learned every single little step before flying, whereas so many people show up and try to go big right away and flounder away.
But I am chopping at the bit to learn and use CSS. I love how much CSS frees up designers to be as creative as they want to be. Designers become artists rather than computer geeks. But the web existed and grew way before CSS, and it functioned just fine. So why use CSS? (Here’s a great article on the subject through A List Apart.)
Obviously, CSS is not completely necessary for web design. But spend some time on the Wayback Machine and see how far your favorite websites have come. What CSS does offer, though, is flexibility, a more open canvas, better usability and accessibility, and out-of-the-box design. There is always the chance of too much of a good thing.
CSS allows the web to naturally evolve, like anything else. I used to be so excited when my dad would bring home long banners of perforated printer paper with my name spelled out or an image of Snoopy made of all S’s. Now, not only do kids have not idea what dot-matrix printing is, they’d laugh at those banners as gifts. Naturally, gradually, publishing has evolved into what it is today. That is the role of CSS now, and it will pave the way for what comes next.
I was looking through a piece from Flash Criminals blog titles “35 Most Creative Web Design Interfaces” featuring sites pulled from Deviant Art.
The visual artist in me adores these sites. They are incredible feats of digital artistry that right now I can only dream of ever coming close to achieving. Unfortunately, not everyone has the same appreciation for the combining of art and function in this manner. So, let’s look at these from different perspectives.
The benefits of such rampant creativity include a more stimulating web experience that fully engulfs the user in the site/business/art/whatever. The boxy, framey, logical, and stuffy layouts traditionally expected of user-friendly websites become only an option for users and designer/developers. Designers can showcase their abilities in new and unexpected ways, and make web surfers stop, look, and maybe even listen.
With such artistry, though, comes a certain amount of risk. Those “others” that don’t share my appreciation are instantly caught breathless and cannot find their back button quick enough. Visual over-stimulus in the site — and sight — may confuse users looking for something specific, may create too much noise to effectively convey what the site owner intends to convey – be it sales, service, portfolio, or anything else.
The best presentation would find a balance between creativity and usability. That is, they will still more or less achieve their vision in incredible, jaw-dropping artistry, but make the sites purpose and its functionality obvious to all users of all abilities. (I’m not even sure we want to start a discussion about the accessibility of such sites. Talk about a big risk!)
There’s an article from A List Apart titled “From table hacks to CSS layout: A web designer’s journey”. This article from 2001 is an interesting read, believe it or not, and it doesn’t sound all that different from the challenges of web design in 2012. Odd considering it’s been 11 years, which is like 5,000,011 in technology years.
Of course, there are a few things that make this article a bit dated — Jeffrey Zeldman talks about IE4/5, Netscape 6, and Opera 5 being the browsers “on the market now”. He mentions the “future” regarding CSS and web standards, a laments the issues between coding for Mac or IE.
But still relevant more than a decade later are his main points about separating style and content, and the need for following standards and using cascading style sheets effectively to do so. Many of his coding issues are still issues today. Using CSS to create websites that can be viewed equally on even more platforms than 2001 is a point being repeated over and over again for our web design and digital imagery courses. Coding still looks like the same coding — that hasn’t changed and isn’t going anywhere real soon.
So what does it mean that a web design student in 2012 can take away valuable information from an article posted in 2001? Does it mean that web evolution is that slow? Absolutely not. It means that you must crawl before you walk and walk before you run — the fundamental foundations are strong, relevant and still holding everything up. (Thank goodness.) Standards (W3C was even mentioned in the article) are standards for a reason. As we begin our own journey into web design, we are learning “old school” coding in HTML before we move on to CSS. Why? Well, because that’s where it started, it still works now, and it is the basis for everything we’ll learn from here on out. Separating style and content has given designers freedom from tables and allowed greater accessibility for users. Zeldman was right when he said, “Because very, very soon the whole web will work this way. And you’ll want to be part of it – because ultimately it is a better, less-frustrating, more powerful way to build websites. Of course, if you choose not to learn about CSS and other web standards, MacDonald’s restaurants are said to have an excellent management training program.”
The more I am learning about web design and development, the more I find that there seem to be — in the past, at least — a division between the two. I guess I can see where it stems from. I mean, it seems like another version of the same right brain/left brain division that has existed in other fields forever. It’s just that now, these two divisions must actually try to work together and communicate in the same language on the same projects.
For example, I have always been a writer in one form or another. I am creative and impulsive and adventurous. My husband is an engineer. He is logical and has to analyze everything before making a decision. In web world, he’s the developer and I’m the designer. But a web page does not work effectively with one over the other; it’s optimal to have both working together. But I think it would increase understanding, communication, and work efficiency if both are at least speaking the same language. It is important, even vital, for a designer to have a working knowledge or better of code. A website – one that achieves all the objectives of the entity providing it — is all about code, even a “pretty” site.
I want to start freelancing, so I’m going to have to play both roles and, therefore, must code, code, code. But I can see where a large corporate web environment may divvy up the responsibilities, and a designer will be in charge of just designing under deadline pressure. Although an artist knows the abilities, limitations, and possibilities of all the art tools (and some things not considered art tools) available for creating his or her masterpieces. And what good leader doesn’t know all the resources of the team that she or he leads? Whichever the breakdown of roles, I still think a designer should have a basic knowledge of and ability to code.
To Code, by all means.
In his article “What is an Accessible Website” for the Guild of Accessible Web Designers (GAAWDS), Jim Byrne poses the problem of designating a definition to website accessibility – what is the definition for making the content of a website available to all people everywhere? He details four possible definitions and, frankly, overwhelms me with his first three possibilities. With possibly thousands of different languages around the world and countless disabilities/disadvantages among web users, how in the world do you come up with one site for everyone? How would my site be understood by both a blind Ugandian and a learning disabled businessman in Berlin? The idea of creating content in multiple languages for multiple abilities is daunting. I see the fairness in such a task and the advantages of reaching a greater audience, but how in the world…?
So his conclusion, which I agree with, is to not design a site from this perspective of accessibility. Design a site with specific users in mind for most aspects, but when it comes to accessibility, design to the computer first. This makes sense and is much less worrisome for a newbie, like me. Use cascading style sheets in order to make available those layers that people with disabilities and/or assistive technology will be able to utilize for their specific purposes. This allows the designer/developer the freedom to create while giving them the flexibility to consider accessibility without getting bogged down by it.
Though I still have miles and miles to go before I learn all I need to learn as a web designer and developer, it is lessons such as this that give me the perspectives and guidelines I need to see a website for more than just interesting words in pretty designs.