Slashdot Mirror
Web Graphic Design for Small Businesses
An anonymous reader writes "I'm a competent geek running a one-man-show for a small business. I do everything IT in this company; servers, email, desktop support, managing Ethernet switches, cash registers, inventory database, and the company website. My boss has asked me to 'punch up' the website to make it more appealing. Although I can hold my own with HTML, PHP and a couple SQL products, graphic design isn't one of my strengths. I'm looking for some advice on how to improve the site without making it overstimulating for the webophobic. It's also important that it conform to ADA accessibility guidelines. In particular, I'm looking for books or tutorial websites that teach the basics of good graphic design — how to make it more appealing without losing the ability to communicate effectively. Also, I would appreciate suggestions for tools to use to make this more efficient (Windows and Linux are both OK)."
I'm a good geek of all arts. But when I try to dabble in graphical design, I always fail spectacularly.
Get someone with actual talent to do it.
Do really you think you can train a graphical designer to code with a few book and tutorials, and not get out results fitting for thedailywtf?
One of my favorite that really impacted that way I developed web sites: "Don't Make Me Think" by Steve Krug.
I have a little bit of advice in this area from experience too. I was the IT department of a small company like that once. I was ask the samething. I can put together a home page but a business page is a whole different bowl of wax. You screw it up and you can lose customers.
My advice would be to scout some of the local talent first. You can find some really good artists and designers out of the local techschools. Most of them will work cheap, a good page might set you back 200 bucks.
Supporting World Peace Through Nuclear Pacification
The Zen of CSS Design won great praise when it was released for its call for beautiful and natural graphical interfaces built on top of semantically meaningful and conformant (X)HTML. Perhaps you could take inspiration from that?
Contract out to a professional.
You've already got a lot on your plate.
[Fuck Beta]
o0t!
Sounds like the project has already failed, then.
Seriously, start by asking questions, not offering answers. And I mean to him, not to slashdot. What is it the site is meant to communicate? What services does it provide? What values should it express? Why does he think it is not appealing now? Who is the audience? What are their values and expectations? Why are you worrying about this on Sunday?
People that do this are called graphic artists for a reason, and art is communication and it has a vocabulary. Start with what you want to communicate and how it can/should be communicated, then find colors, shapes, symbols and relationships that express that.
Get a professional if you can, he's the one that knows to ask those questions, and how to execute the answers he discovers.
Insightful and funny are really the same thing, except one has a punch line.
Your best bet here is to start with a system like Wordpress, Joomla, or Drupal and theme it. You can start with one that has the basic layout you like and modify according to your GIMP skill level. Usually all the accessibility work is done for you with this approach.
Websites are MARKETING tools, and must be part of a unified Marketing Strategy.
You want a Marketing Pro, who can deliver the rain, handling the "Vision", while you can concentrate on the implementation.
Technology -- No Place For Wimps! Grateful Dead and Jerry Garcia Chatroom -- http://www.wemissjerry.org
Absolutely. Get someone from the local Art Institute of $yourCity to look at your current glossy brochures and do it. Grahpic design is as far from programming as grahpics are from the mechanics of the printing press.
:) That's the bonus, you'll get to work with a creative, and see how the other half live (gender- and professionally-wise). Then actually follow through with what she designs for you, don't just cringe at the large grahpics and crazy layout.
And yeah, she'll probably be a she
Lies about crimes
I just got back from an Adobe Flash 3D (Papervision 3d) training approximately one week ago, and there were many designers who attended. There were also some coders, but all the larger companies hire full blown artists. For example, Starbucks currently has two artists who create the concepts, and then they have two Actionscript/PHP coders who translate the artists' vision, and they have a back end coder for database stuff and other heavy-logic items. If an artistic element is a requirement, you really should outsource/hire someone who actually has a true art background (with experience in visual design), because artists just think in very different ways than coders do, and most people can't bridge the gaps. Sure, you can make something that could be pretty good, but it will never have the actual "feel" of an art project.
One more thing-80% of the audience had MacBook pro's. Why? The majority of people felt that the workflow was more intuitive/refined than what Microsoft Windows has to offer.
Just because you get modded "insightful" on Slashdot doesn't mean you actually are in real life.
Good design is not black magic. There are rules and conventions just like there are for any other discipline. There are also trends and fashions like there are for any other discipline. You can learn them, if you want.
There are sites that serve as reference points for design professionals; There are many, but this is one: http://www.webdesignfromscratch.com/current-style.cfm
So look through the galleries of what design professionals themselves consider exemplary, then shamelessly copy; after all, that's exactly what design professionals do--they're constantly stealing from each other.
Beyond that, you only require finicky, anal attention to detail. If things don't look evenly spaced, measure it with the ruler tools. If the font renders fuzzy, use a better one. But chances are, if you're in I.T. you already possess the fine attention to detail required.
In sum, it's a different way of thinking, but not impossible or even that difficult to acquire. Fair warning, though, if you start wearing those glasses you may suddenly find yourself remarking how that women's shoes don't go with her outfit, or the stitching on his jacket is clumsy, or that the lines on the new Mazda give you an angular, cramped impression.
Do what you can, with what you have, where you are.
The CSS Zen Garden is a great place to get some ideas. No book will teach you creativity, you can learn some general rules or tips and tricks but good design ultimately comes down to experience. The best advice, in my opinion, is to keep it simple and clean. Most visitors will appreciate a clean, easy to navigate site more than fancy flash graphics or a Photoshop jungle.
Murphey's fighting Occam, and we're in the stands.
Copying someone's site design is bad policy in general.
I think the many people who either give the advice to copy or copy another site themselves risk ending up on this site:
http://pirated-sites.com/
I graduated with a BFA and took my share of communication design courses.
I worked hard the past 7 years learning to be a competent developer so I've been on both sides of the boat.
It's just bad to have some douchebag steal the site design it actually took a design degree and years of experience to create.
Geek translation: It's like someone putting GPL code in closed source software.
You 're familiar with the geek outrage when that happens.
Well that's the same outrage that designers feel when you steal a site design.
I've muddled through over the years, mostly by looking at what actual graphic designers have done and trying to learn their techniques. A few things to remember:
* a boring design is better than an ugly one. Don't try too hard.
* learn about negative space, colour theory, and usability. There's generally math behind them that you can learn and use.
* go find some attractive sites, try to figure out 2 or 3 elements that you like, and try to copy them.
* don't be afraid to rip off other sites; generally by the time you're done tweaking, your design won't look anything like the original. (Just don't steal their actual images or code)
* HTML naturally leads to boxy layouts; that's okay! Don't mangle your HTML trying to avoid it; you can de-boxify with CSS and images.
* find an artist friend and get them to critique your design; a few offhand comments from them can save you days!
* most of the neat effects on the web these days are clever images (3-column layouts, reflection effects, rounded corners), and most of the rest are clever CSS.
* you *can* get the same level of quality as a professional designer, it will just take you 100x as long.
* http://www.alistapart.com/
* http://www.csszengarden.com/
That said, you probably don't want to be learning this stuff on the job while your servers catch on fire. It will be better for all involved if your boss hires someone who is already a talented designer; even an amateur designer will probably be faster than you. Design is definitely a time-money tradeoff; professional designers charge a lot because they do good work quickly. If you really want to learn this stuff, you probably don't want to do it under a deadline.
I was pretty much in the same situation until somebody recommended to me "The Principles of Beautiful Web Design" By Jason Beaird http://www.amazon.com/Principles-Beautiful-Web-Design/dp/0975841963/ref=pd_bbs_sr_1?ie=UTF8&s=books&qid=1202658998&sr=8-1 since then I've done several websites and got several contracts from people who've seen those sites. The book assumes you know stuff like HTML and CSS and just covers things like layout, color schemes and graphics.
Blazing Spiders
I run into this misunderstanding all the time, on both sides (geek and suit).
There is nothing about being a "geek" or knowing HTML, CSS, or javascript that magically grants someone designer chops. It's like expecting the guy who sets type and runs the printing press to be a novelist or journalist, or expecting the chemist who mixes the paint to also be a canvas artist.
This misunderstanding was prevalent back when the web was "new" (circa '94-95), but it's inexcusable today. In any case, it's a lot easier to teach HTML and CSS to a legitimate designer, than design to an HTML jockey.
If the work of a real designer or design firm is simply not in the budget (which is crazy talk, because there are firms online that grind this stuff out now for chump change), than find some CSS book with a CD full of templates that grant license to modify. But please, for the sake of art, sanity, and all that's holy, keep IT out of web design!
Please note: Code is *not* poetry, and HTML is not code...
Ask yourself - would you let a typical graphic designer manage those Ethernet servers, etc. that you currently maintain on your network? No! It works both ways.
That's not a valid argument. To take it to an extreme, you'd never let a chef do brain surgery on you, but you might let a brain surgeon cook you a meal with some help from a cookbook. Just because one profession has little chance of succeeding in another, the opposite does not have to be true.
If the design requirements are small, a capable geek can read some books, look at some design ideas, and probably come up with something worthwhile for a small business web site.
Never underestimate the bandwidth of a 747 filled with CD-ROMs.
http://www.unmatchedstyle.com/
http://www.stylegala.com/
http://www.thefwa.com/ http://www.csszengarden.com/
http://www.styletheweb.com/
These are all good directories of good web design you can get 'inspiration' from
A fool throws a stone into a well and a thousand sages can not remove it.
Comment removed based on user account deletion
As a designer in the creative industry, I have no problem being called a 'creative'. In fact it's how we refer to ourselves and what separates us from the 'suits'. You're the first person I've ever heard of that had a problem with it.
Good web design is when you can look at a site and not notice the design at all. It's simply effective and cohesive and requires no extra thought or deduction on the part of the visitor.
Okay... who let in the PHB?
... you need a web design geek.
A graphic designer knows all about fonts and colour and layout, and could design you a beautiful logo, or ad, or book layout. But they won't know about usability, accessibility, browser independence, standards compliance, performance. This is how people end up with sites where every page is an image (or worse, a chopped up image, reassembled in a table).
A typical IT geek knows about code and protocols, probably knows a well designed web site when he sees one, but often doesn't have the inclination to design something new and visually beautiful. I used to be pretty good at art and design at school, but now I class myself in this group -- if I pick two colours for a page, they'll either look hideous together, or conventional and dull.
WHEREAS - a Web design geek doesn't necessarily understand the subtleties of protocols, nor necessarily have the best programming skills. But they'll know HTML and CSS inside out, and they'll have a passion for all those important webby things the graphic designer would neglect. They'll be full of attractive layout ideas, but will stay within the bounds of what CSS can do efficiently.
You can still be involved. If there's dynamic content, you pick the CMS, you code up any new logic that's needed (learned RoR yet? Now's an opportunity!). Work with your Web design geek to agree on div classes they can write their CSS around.
There is nothing about being a "geek" or knowing HTML, CSS, or javascript that magically grants someone designer chops.
And there's one other *extremely important* fact that I've learned: there's nothing that being a graphic designer learns that magically grants them webpage design chops.
If the web was run by graphics designers, all the pages would be extremely pretty. Most would be stored as individual flash files, but some of the less important text would just be as represented as images. No text would actually be stored as text, and each page would contain roughly a sentence or two worth of actual text. To find anything meaningful would require somewhere in the neighborhood of eight clicks.
In other words, they can make the web fluffy. Today, the place of the graphic artist is starting to be more and more just devoted to logos, banners, and advertisements - like they were before the web (mostly because the web used to be just those things for a lot of companies, and is now becoming a lot more than that). The usability people are taking up the task of writing pages, and those people are very much geeks. They're the ones who make new kinds of widgets that work the way that they do for desktop apps - with things like autocomplete, AJAX, unified designs, usage of CSS, etc, standard layout and standard widget usage. These are pretty much always two different groups. Usability people fight to make things look and work naturally, while graphic artists fight to make their pages stand out and work different from everyone else's. So you aren't likely to be both.
So if I were in your position (and I actually am in my company), I'd focus on cognitive science usability studies and take my ideas of how to make things nicer from that. People who actually try to get information out of your site will appreciate it...whereas they mostly won't care much what it looks like for more than the first three seconds or so (for most companies, anyway. If you happen to sell something that's main feature is it's prettiness, then you might consider making a pretty site more important than one that you can find out about your business from).
Mod me down and I will become more powerful than you can possibly imagine!
My first recommendation would be to try Blueprint -- a set of reasonable CSS styles that make building grid-based layouts much easier. It's open source, designed by some great people and actively supported.
If you're looking for full designs, try Open Source Web Designs. There are also other free template sites out there, so search around.
Who said Freedom was Fair?
It wasn't a PHB, it was a Marketing Pro®... :-)
If you disagree, post your argument. (-1, Overrated) isn't your personal censorship tool for views you don't like.
Geek 2:
And they're both absolutely right. I would suggest starting with a free template and modifying the CSS / graphics. That saves you the initial legwork of choosing a design layout, colors, etc. Here are some sites with some really awesome templates and liberal licensing (CC for most I think): Free CSS Templates.org and Open source web design.
An old-timer with old-timey ideas.
Whups (ding) Thank you for playing.
Good marketing people are usability experts. Advertising people aren't. Best not to confuse the two.
The distinction is fairly simple; Advertising people try to sell things by annoying you, marketing people try to sell things that don't annoy you. The latter defines a niche, the former tries to cram you into it. Seriously. Advertising sells, marketing determines what will sell before the advertiser even sees it.
Other than that quibble, you're pretty much on target. Too much shiny on the site is lame, but good artwork is imperative. Remember this is the foyer of your company's premises to a lot of people, and people read "cheap" into a company really quickly on that first impression. I'd no more design the letterhead of a company than I'd let an un-ticketed outsider play with our DC's air conditioning.
Do not mock my vision of impractical footwear
Websites are communication tools, not marketing tools. By all means make them look and feel nice (and consistent with your branding), but treat your users with respect. They chose to visit your site, so don't treat them like they're just passing through while waiting for "America's Biggest Celebrity Dancing Loser" to start. You don't need to grab their attention; you've got their attention. Now give them what they came for.