Fonts: em,px,pt, %

Jason’s hit it on the head. It’s like hiring a guy to build your house; he comes back with a beautifully rendered picture of a house and saying, “Here you go.” The PSD-first crowd seems to think that the real work of designing a site is done in Photoshop, and then they turn it over to the little code monkeys who spend their free time grunting, slobbering, and picking lice from their pelts. Wrong.

The main tool a “Web Designer” should be using is - CSS.

Even when they are drawing a pretty picture in Photoshop they should have some idea of the CSS they are intending to use to implement that design. If they don’t know how to implement their picture using proper CSS then all they have is a picture and not a web design.

The real work of a web designer is in implementing a picture of a web page into an actual web page using CSS. Anyone can draw a picture.

Off Topic:

Does the name Libeskind ring a bell?

You guys are a bit harsh about designing comps. =p

Our web designer who I work with is actually quite experienced with HTML and CSS. We use CSS for 99% of our stuff. We don’t do stuff pixel perfect, but use the comps as a guideline. Also stuff that isn’t good (low contrast stuff, fonts too small, etc) are all vetoed (by me) and never see the light of day. We also use a fixed width for the design (they look better), but that’s a design choice. All other dimensions are left fluid so they can take up room.

However, that said, the design has to be done first in the “real world”. We all like to say markup first, but that isn’t how the real (corporate) world works, when you have half a dozen people that have to sign off on the design. If you built it and then they wanted the design to change, you’d have to do a lot of reworking and a lot of wasted time.

You guys are a bit harsh about designing comps. =p

Someone has to be. Clearly nobody in the corporate universe is. The executives want pretty pictures for web sites and that’s what they get. I’m only glad I’m geeky enough to know how to use my browser(s) and plugins to get around bad design and make stuff (mostly) work for me. Grandma don’t have that option, yo.

I always hear that excuse… and go “HOW?!?” – as in “How is it a lot of reworking”

Could you change that to the left instead of the right?
Flip floats – done.

Could you make that green instead of red?
change color attribute – done.

Could you make this wider?
change width property – done.

I don’t like that font
change font family, refactors entire page – done.

While redrawing and resizing all those image elements and layers - THAT’S a lot of reworking. Changing the layout in CSS? That’s nothing.

Or is nothing if you bother practicing separation of presentation from content and keep everything fluid… so when you make a change everything else auto-adjusts to fit said changes.

I really don’t get how that’s more work that sitting there dicking with dragging layers around. Usually it impresses people more when ^F and ten characters typed later, you have their requested changes done.

Much less that said goofy picture is only for the perfect size screen target – ignoring the billions of other things you should target on a site; and frankly ignorance of the suits is no excuse; they hired you to do the job, explain your job to them and get them to let you do it! Otherwise, why the {expletive deleted} did they hire you in the first place?

Which I’ve actually told clients and employers on more than one occasion. “If you’re not going to let me do the job, why the {expletive deleted} did you hire me in the first place? Think you can do better? YOU DO IT!”

Though of course that’s why most people are doomed to being “yes men” employees their entire lives – stuck at the low man on the totem pole because of never showing initiative or proving their own skills and worth.

That’s simply harsh. Most people who sign off those sites need to know how things will look like. They would not be able to figure out how things will work and how will look on the website without the PSD mockup. They don’t want to annoy anyone, and obviously they don’t have accesibility in mind… but it is not that they don’t want to.

It is like when you’re selling a house which is old and maybe not in a good condition. Some people are able to see the posibilities and how the house can be improved, but most people needs to see the house clean and painted to even start to figure out how it can look.

That’s nobody’s fault.

Meh, people who are Photoshop gurus can change their layered whatevers prolly just as fast as a CSS guru can change their stylesheet.

Since I now usually have more than one stylesheet (mobile and SomethingBigger), it’s no longer as fast as it used to be for me.

Most people who sign off those sites need to know how things will look like.

This definitely comes after they know what they’re putting on the page, why they have a web page, what their visitors are supposed to be doing on the web page… they have to sign off on that stuff first, or the Photoshop guy is wasting his time.

They would not be able to figure out how things will work and how will look on the website without the PSD mockup.

While some companies use a full-fledged PSD for architecture, it is not some necessity. Some companies use wireframes (sometimes created in their own large, complex software) or even whiteboard mockups. It wouldn’t surprise me if the technology used for decided what visitors do where and where things are placed is determined purely by what kinds of people they’ve got working for them (a UI architect? Or a graphic designer? Or someone else?).

It is like when you’re selling a house which is old and maybe not in a good condition.

A house is an excellent thing to bring up. It’s not a picture, either. A web page built from a picture is as bad as a house built from a picture. My harshness isn’t for sites that have a nice picture with them, but for sites (and I see them a lot) that are basically pictures completely recreated in HTML and Javascript. This is where you lose all that flexibility of the web and where these 12px fonts are coming from.
I realise developers like sanamine have to try to imitate static, inflexible raster-pixel images with their web pages, and I feel very very sorry for them, mostly because to make things actually work for people they need to work twice as hard as someone who can design for the device and for people, instead of for someone’s static canvas dream.
I know I’m privileged to buy jeans that fit me, rather than being given jeans and told to stuff my butt into something too small or wrap belts around something too big. I’m lucky I can build what’s important (functionality, flexibility, people-oriented) instead of needing to pretend the web is a billboard and cater to some artist instead of catering to the ones we should be catering to: users.

The artist should be catering to users too.

I suppose it would really help matters if some graphics company could make a graphics program that’s sorta like vectors, except flexible like web pages. Made specifically for graphics people who aren’t going to learn HTML and CSS and don’t want to. I mean, the stuff out there for specifically print is astounding. The canvas would be a pretty good imitation of a browser, with the ability to show the graphics guy the possibilities you get cross-user, cross-platform, cross-browser and cross-device.

Likely Adobe will make it and it’ll cost $4000 or something… :S

The problem is that all the people signing off on the way the web page looks are all using the same browser with the same settings so that they don’t realise that the page design is broken for all other browsers and all other settings.

It should be a part of the designer’s job to show them what happens to the page when the settings change or a different browser is used when the page sizes are defined in pixels.

You do have a point, Stomme Poes, and you’re completely right but it is also true that people don’t buy the house until they see it or at least, until they see the floor plan. Some people just need the visual to know where they heading for and be creative and start to think what they should put into it.

This is specially true when the site is brand new and there’s no content whatsoever and people are just freaking out because they don’t understand what it should go there… they do know that the address and the shopping cart and the blog is supposed to be there, but simply they don’t know what content will fill it and all that.

I don’t disagree, molona, that sighted people want a visual representation of (something) before making a decision on it.

But my objections were elsewhere really.

Those are all good points.

Luckily I’ve worked with our designer (who is primarily a graphic designer) as well as the people who sign off all know that a picture isn’t a website and vice versa and fully expect there to be adjustments from the picture. They’re more looking for a general thing (one of the higher ups in particular that signs off on stuff is a very visual person).

It would be nice if we could build the markup first, then go back and style it hand in hand with a graphic designer and/or UI architect, but that’s not very practical for small to mid-size companies.

(And, luckily our people do worry about content, flow, etc., before they design the website, so that’s good.)

I consider that the make or break point of dealing with a client – if they don’t know what they want on the site for content, that’s when it’s time get up from the contract table and walk away.

Many people do think “I want some pretty layout” and go no further than that in their site planning – and that’s where they end up dropping a couple grand or more on a “designer” to have a massive flop that’s nothing more than an expense to the company instead of a profit maker. There’s a reason the majority of new websites don’t last out a year… or turn into web rot.

If the client doesn’t know enough about their own business or product to come up with copy about it – they either need to hire a content writer, or give up on the very notion of having a website; because if they don’t, all that pretty design hung around nothing ends up being the proverbial shellac on a pile.