You build websites. It is a passion. You have taught yourself everything and continue to do so because the industry demands it. You wrangle code with the best of them. You design user interfaces to help users get things done. You document sitemaps, wireframes and workflows that will take the clients site to the next level and beyond. You know your craft well and you love it…

A Scenario

Company X, your average ad agency, wants to work with you on a website a client needs done. The budget is tight so you work a deal out based on the budget at hand and start the process. During some meetings with Company X, the client and yourself, crazy ideas are brought to the table. You cringe a little bit knowing that the ideas are above and beyond the scope of the project. Politely, you calm the ideas down and decide to work on what can be done within scope. After a few days of work, you send a mockup to Company X for review with their client.

A few days go by and Company X sends feedback along with an attachment. The feedback:

“We took a look at the mockup you sent, and decided to go in a new direction”.

After opening the files containing the new direction, you begin to cringe again. This “new direction” is extremely out of scope and will not work within the constraints of the system you had originally designed for. The design contains a Flash splash intro page, no solid navigation, moving animations everywhere and most likely funky sound effects. Oh yeh, the client also “loves it”.

The Problem

We are dealing with two clients: Company X and Company X’s Client. This scenario has many issues, but the big one is client education and expectation.

You have been hired by Company X to solve their clients problems. You attempted to do this within the scope of the budget, but Company X had their own agenda for the client. The lack of communication and education on how to solve both clients problems has turned the situation into a downward spiral. Company X, with what they know and understand, thinks they solved the client problem with their solution. The client loves it. You, with what you know and understand, see failure. What happened here?

The Solution

Communicate. Define the client’s problem. Solve that problem.

Design is about solving problems first; then, maybe, making things look “cool”.

Share your process with Company X and the client. Define the expectations based on the budget and make the clients feel comfortable. You are the expert at what you do, that is why you were hired. If you do not educate your clients on what to expect, they will want the world and/or something that will not help solve their problem.

I understand this is much easier said than done. I would love to hear what others have done to make this situation calmer, easier, or at the least less frustrating.

I few months ago I developed a simple but effective little web page with some javascipt and jQuery that would allow me to determine, based on a width, a 16:9 aspect ratio. I found myself always having a specific width from a content area and I wanted to determine the video size I could fit in there. Problem was, I didnt want to waste time calculating the all important aspect ratio from the width I had.

I searched the net and couldnt find anything useful, so I built one myself:

jQuery 16:9 Aspect Ratio Tool

This was just whipped together quickly and I found it useful. I’m pretty sure it could be tweaked, but it fits its purpose as is right now. Let me know if this helps you at all. enjoy.

It seems, or, should I say, still seems that many people consider themselves web designers just because they can hook up a downloaded template to blog software. This is fine if you want to be heard and share content with the world, but it DOES NOT make you a web designer (I’ll use the generic term “web designer” to encompass a spectrum of web design, including the front-end developer).

Knowledge

Modern day web designers have a deep understanding of the internet and the underlying structures that define it. These include languages like HTML, CSS, Javascript, jQuery(a javascript framework), PHP, and a plethora of other programming languages. Each one of these languages is a powerful tool in the hands of the web designer that specializes in it. For example, you would not call a plumber to install electrical outlets. You would also not have an interface designer program the interactions between the server and a database (this is what web developers do).

The modern day web designer must also have an understanding of web standards and be familiar with the works of the major players behind it. The blogs, books, and musings of people like Jeffrey Zeldman, Eric Meyer and Dan Cederholm (to name a few) are must reads.

Tools

There are many tools the modern day web designer uses on a daily basis to code, solve problems, design and develop. The most used and well known design programs are Adobe Photoshop and Adobe Fireworks. I personally find Fireworks to be a better web design (specifically user interface design) program over Photoshop, but modern day web designers use what they are comfortable with.

Modern day web designers think in pixels. They design for the screen, not paper. Screen sizes vary across all users, and one must take that into account before starting the visual design. The design from Photoshop or Fireworks directly correlates, by the pixel, to what will appear on the screen in a browser. A 300 dpi 1800 x 1800 illustrator file is not an adequate starting point for a web site design.

Most, if not all modern day web designers can code by hand and from scratch. Software such as Coda (my favorite), Textmate, CoffeeCup’s HTML Editor, Notepad++, and even Dreamweaver (in the code view) can assist in hand coding, making things a bit faster. Software that generates code, also known as a WYSIWYG (What You See Is What You Get), is frowned upon and will most likely cause problems down the line when trying to fix issues.

The modern day web designer also codes to make sites compliant in modern browsers like Firefox or Safari first. After the site works in these browsers, others, such as Internet Explorer (version 8,7,and sadly, sometimes 6), Chrome and Opera are tested. The reason I code to Firefox first is because of a plugin called Firebug. This plugin lets me solve problems by inspecting the code, tweaking the css, and testing the javascript right in the Firefox browser. It is a HUGE timesaver. Any modern day web designer worth something uses Firebug, or a similar plugin on their browser of choice.

Passion

The most important aspect of the modern day web designer is passion. This work is not just a job, it is a labor of love. If you consider yourself a modern day web designer, you must constantly strive to learn more, constantly stay on top of what is happening in the industry and constantly think to yourself, “I love what I do”.

I just scratched the surface of this broad topic. It is something that one could write about for weeks. Modern day web designers most likely did not learn anything new from this, but if you consider yourself a web designer in any form, you must have and use the knowledge that is mentioned in this article. If you don’t, learn it.

What else does the modern day web designer need to know? If you have any resources, or comments, feel free to share.

It is gorgeous outside. The sun is shining, the churning breeze feels good and the birds are chirping. I am sitting at a picnic table at a local park while on my lunch break. How can such a simple situation like this feel so damn good?

It is truly amazing how simplicty can affect very complex objects(the human brain) when applied right.

What is your simple pleasure? What activity do you partake in when you just need to “get away” or take a brain vacation? I’m curious.

While down in Austin, Texas this past March for the South By South West interactive conference, I filmed a few hours of video for a short documentary I have planned. This is a little teaser of some of the footage.

A SXSW interactive 2009 experience from Brian Artka on Vimeo.

To know more about why styles are disabled on this website visit the Annual CSS Naked Day website for more information.

Pressure. Its a big word. Pressure is good, but it can also be bad. Pressure is what I attribute to finally re-birthing this blog. My name is Brian Artka and I passionately build, browse and breathe the world wide web.