Slashdot Log In
Web Graphic Design for Small Businesses
Posted by
Soulskill
on Sunday February 10, @10:01AM
from the make-it-pretty dept.
from the make-it-pretty dept.
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)."
Related Stories
Firehose:Web Graphic Design for Geeks by Anonymous Coward
The Fine Print: The following comments are owned by whoever posted them. We are not responsible for them in any way.
Get someone else (Score:5, Insightful)
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?
Unify your online presence and Marketing programs. (Score:5, Insightful)
You want a Marketing Pro, who can deliver the rain, handling the "Vision", while you can concentrate on the implementation.
Re:Unify your online presence and Marketing progra (Score:5, Funny)
Re:Unify your online presence and Marketing progra (Score:5, Informative)
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 [freecsstemplates.org] and Open source web design [oswd.org].
Art Institute (Score:5, Insightful)
And yeah, she'll probably be a she
Re:Art Institute (Score:5, Insightful)
Re:Art Institute (Score:5, Informative)
I second that. You need a web designer (or a designer with web experience) otherwise:
1. They will use shiny fonts...It will work on their PC, but of course those exotics fonts won't be installed on the surfer PC.
2. Pixel != DPI (you will find yourself with a web page width: 123345px)
3. Impossible layout (things that look beautiful but you cannot translate into HTML)
4. Layout with no flexibility (don't understand that a web page content may change)
5. Content mixed with graphics (If you use FLASH no real problem...But with HTML...)
6. Scroll down layout (big headers! beautiful ones...But the content remain invisible until you scroll down)
7 Etc.
But it certainly doesn't mean that a non designer should make the layout. It will be probably technically perfect but it will be usually plain ugly too.
CSS Zen Garden (Score:5, Informative)
HTML is *NOT* Art (Score:5, Insightful)
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...
Webpages aren't (usually) artwork. (Score:5, Interesting)
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).
Re:HTML is *NOT* Art (Score:5, Informative)
While parent post is not untrue, it comes across as a self-serving piece written by a graphics designer who needs to convince the world that he has much value to add to someone else's web site engineering. I don't know that is the case, but that is the appearance the words convey.
Graphics design is not all about Mysterious Talent: there are some basic rules that can be learned and applied by anyone. Conforming to these rules will add "punch" to your web pages, whether you understand the reasons for them or not. Use of them will not of itself get you any artistic awards, but since they can be translated into your daily work with CSS on layout and color, they can be applied without increasing your operating expenses. Which appears to be what the boss wants. It seems very unlikely that the boss is going to add the cost of a contract with a graphics design artist to the company's overhead. The goal is clear: take what has been done and make it better. Don't throw it away and reconstruct with someone else's template. Grow what's already done into a more pleasing form.
Google for "color theory" and "graphic composition": those are the two basic fields you need to look at.
Under color theory, look for discussions of
Under composition, look for discussions of
What you probably want to do is to find some formula that will work for the web site, can be applied throughout it (helps with "branding" by providing the user with a constant, reliable theme), and can be followed pretty much as a recipe (without you needing to remember what the rules are or why this set of details works). A $20 set of watercolors, or even a box of crayons, can help in exploring and gathering comments on initial drafts of the presentation. The end result will probably be mostly CSS snippets you can treat as black boxes.
Another excellent resource is an artist supply store that caters to newbies and hobbyists: it will have books on beginning watercolor or acrylic painting that will go over this material, and it should have a clerk or two who are helpful.
Re:Get someone else (Score:5, Insightful)
Re:Get someone else (Score:5, Insightful)
Hire someone (Score:5, Insightful)
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.
Re:Hire someone (Score:5, Insightful)
How can you advise someone capable of learning not to do so? No one's asking to become a professional marketting expert in ten days. The potser is asking to learn over a long period, and to start with something small.
That's certainly doable for someone clearly able to learn.
I seem to recal a book review on slashdot some year or six ago that proposed a web design book for programmers. It described basic colour and layout theory and such. I haven't the foggiest as to when or what, but certainly they do exist.
As a web developer myself -- I do handle both the programming and the design work. I shy away from the serious design work if only because it isn't worth my programming time, but the simple design work is easy and fun. Just sit there with the blank canvas and be patient. Many many iterations is the key. Just talk it out. Think about your design goals, break them down, try them out. It's really just pseudo-code and a paint-brush.
Zen of CSS design? (Score:5, Informative)
Pay someone else (Score:5, Insightful)
You've already got a lot on your plate.
Re:Pay someone else (Score:5, Insightful)
The whole point of a service economy whether you're marketing, graphics or IT is getting a specialist who can knock your socks off and use their time to the fullest advantage. I'm getting bummed by the whole 'kitchen sink' fad because it's really not only lowering the bar - but it's really pandering to the jack of all trades master of none crowd. I know enough code so that my designs and templates will hook with the back end effectively and I can make revisions, but I put in big flashing neon when a recruiter or client comes calling because they see all the languages I have listed on my resume that it's not my passion, interest, or the best most effective use of their time to be mucking about with their systems or the back-end more than I should.
I came out of publishing, printing initally on the way to design & advertising - and it always was an advantage to be able to interface with the production directors and speak their language later on in my career and know that my stuff could get on and off the press with minimal fuss (not to mention having a better grasp of really cool things that could be added to the design). I never claimed to be a true dot-head who could read screen angles and see color through the seps exclusively (true side-story - the best color expert on one of the pre-press and high-end publishing campuses I worked with was actually color-blind. But GEEZ could he read film).
I always am quick to point out when a client is bogging themselves down timewise when they go outside of my usual skillset. Sure I could learn advance scripting for building new libraries to hook into - but is it really worth their time? And by worth I mean money.
Punch up (Score:4, Insightful)
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.
Use a theme for a website engine (Score:5, Informative)
A Contrarian View (Score:5, Informative)
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 [webdesignfromscratch.com]
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.
useful points (Score:5, Informative)
* 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/ [alistapart.com]
* http://www.csszengarden.com/ [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.
Look at sites that showcase good design... (Score:4, Informative)
http://www.stylegala.com/ [stylegala.com]
http://www.thefwa.com/ [thefwa.com] http://www.csszengarden.com/
http://www.styletheweb.com/ [styletheweb.com]
These are all good directories of good web design you can get 'inspiration' from
Seriously don't... (Score:4, Insightful)
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/ [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.
Re:Get a professional to do it (Score:5, Insightful)
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.