Forum Moderators: not2easy
As a web editor thrown into the world of banner creation - and a self-confessed useless artist - one of the things I struggle with most is how to make text work when integrated with imagery.
You know the kind of stuff: You need to create an effective banner with a beautiful image allied to a standout message - "All flights now £99!", for example.
I need to learn effective usage of typography in this domain. I generally fall into the trap of just making text bigger, or using stroke outlines, to emphasise the text when it's set against a cluttered background when I know in reality I should be looking to find a different, cleaner image where text could achieve standout with less 'flashiness'.
I also need to figure out what colours work best together so you can achieve text standout in that way. I've checked out many sites offering the tool where you can add in hex codes and it shows you colours that 'work' together, but often I feel this doesn't help me much.
Do you know of any books or sites I should work with to better understand how to make text and imagery work together?
understand how to make text and imagery work together?
That's why people spend a long time studying graphic design :)
Text written over cluttered background should be avoided if possible. Selecting the right image, as you say, is a very important aspect. If you have no option then try to find the tonal range with the most contrast for your type or look for opportunities within the image for manipulation.
I'd avoid gimmicks - treatments that add add alot of clutter to the typeface itself will be detrimental to the design unless handled with a great deal of subtlety.
Heavier type weights 'knocked-out' of the background image can look very striking and will help keep the overall image clean.
I've just posted some reading reccomendations here [webmasterworld.com] that might be of interest.
I hope that was a joke coalman
Not it was not a joke, lets take your example of a cluttered background but we'll take it step further and say the text color we want to use is the same as what is predominantly in the background. A simple 2 or 3 px rounded edge and 2 or 3 px shadow that contrasts with the background slightly will transform the text from unreadable to very readable.
I'm not suggesting some giant shadow or huge bevel on the edge of the text but just enough to give it a defined edge.
There's a pretty good example at the Philadelphia Eagles website but probably a little more shadow that I would use.
The background color under "Eagles" is nearly the same as the text itself. The only thing that makes it work is the shadow and the slight edge applied to the text itself. Otherwise it wouldn't work, looks very good IMO.
[edited by: limbo at 9:33 am (utc) on Jan. 3, 2008]
[edit reason] Delinked [/edit]
I learned typography by listening to the old guard - to even mention 3D effects and drop shadows was sacrilege, punishable by slow death. :) I'm a bit more open minded than my peers and belive that if done with a cautious subtlety it can look great.
Mind you, I think it is a last resort and that type should be left in it's pure state if at all possible - there are usually other answers to be found.
does it mean both drop shadows and 3D Text should be avoided at all costs.
Not sure about 3D text but Dropshadows are a common thing in print publishing (large size banners for hoardings etc)
I hope that was a joke coalman
I'm even working on making photo collages now, for banners. And page curl, need to refresh memory on that one.
So, being a design-blind person myself, I hired a contract designer.
Not sure this is something you can do, but it's been really beneficial for me. I've had a lot more time to devote to (text) content creation and the business side of my work.
You can actually hire designers for fairly cheap. I'm also a big fan of participating in design "contests" for things like logos, icons, and banners. For pretty modest prizes a number of designers will post their concepts. Google "design contests" and you'll find at least one site that runs these sorts of things.
But for a highly paid designer, I dont think people are opting for such a person (except in rare cases)
Selecting the right photo with plenty of empty space is the better option-if you've got it.
HTH, YMMV, BYOB.
