webguide
Feb 3 2005, 08:59 PM
| | Ever been to a website that is barely readable because of the bad color design? Well here's some tips to make sure that you don't fall into the same trap.
* Black text on a white background, while not exciting, is the most practical color combination.
* Try and not use more then four colors on your website, too many can be disorientating for the user.
* Find out what each color represents to the users mind. For example green represents wealth while red represents daring.
* Don't use yellow for web page backgrounds.
* Take a look at Visibone or get any number of color charts that are avialble on the internet if you cannot create a suitable combination yourself.
* I've found the best color combinations to be monocrome. Which means multiple shades of the same color. NOTE: make sure there is contrast between the colors, or else the text will be diffecult to read.
Hope thats helpful |
Comment/Reply (w/o sign-up)
harriko
Feb 3 2005, 09:21 PM
yeh this is really usefull. i have used monochrome on my most recently wesite. it came out really good. its all shades of blue. the site is www.harryly.cjb.com. i have to move it to a this astahost which is way better than the free one i got now. recently got the package so i be moving soon!
Comment/Reply (w/o sign-up)
boten
Feb 5 2005, 03:48 PM
Another nice background would be an image showing a gradient. You can make it small enough (say 800x5 pixels) and fill it from light-blue to white. Then just use it as background image.
Comment/Reply (w/o sign-up)
NilsC
Feb 5 2005, 06:18 PM
So for colorscheme, would this be acceptable  Lindy Farms of CTI'm working on the framwork for this site and it will be using, css, php and mySQL when done. Right now I'm just working on the color schemes and layout of the site. 3 column, with header footer and no frames unless used for data that belongs in frames. Right now I'm testing the footer, It's supposed to stay glued to the bottom of the screen in the page is short like now. I'm having some trouble with the code  when the footer is glued to the bottom, the center context have a small hole in the bottom left hand side. As soon as I figure out what I forgot it should work... The menu on the left side will be content driven using mySQL to populate thae data. Now it's just there as a place holder to see what it would look like. I have a yellow line in the left column, right under the text... I have to figure out where that comes from (It must be in my css file) Any opinion on this color scheme? Nils
Comment/Reply (w/o sign-up)
dissipate
Feb 8 2005, 06:25 AM
one way to expose yourself to suitable colour combinations that established companies and people use on the internet is to surf around and keep an eye out for popular sites. you can be sure one of the reasons why they're popular is because of the colour combination they use - pleasant and comfortable to the eye and not at all jarring or blinding. take note of the colour combinations they use and you'll soon be familiar with colours that can be put together to enhance your site and colours that will turn people away from your site.
Comment/Reply (w/o sign-up)
kraizii88z
Feb 8 2005, 09:35 PM
on my site i use a purple/ black color combination.There are different shades of purple in the banner image, and the background is black, with a sort of a smoky purple iframe. The font color is black. It's not really an interesting layout, though ,so i'm thinking of making a different layout, maybe one with more graphics..
Comment/Reply (w/o sign-up)
webguide
Feb 12 2005, 10:40 PM
If anyone needs more information try using colorimpact or similar programs.
Comment/Reply (w/o sign-up)
fieldsfan336
Mar 8 2005, 03:34 PM
I use a variety of colors for my different sites, but a black background paired with a bright color for text helps make my pages really stand out
Comment/Reply (w/o sign-up)
chiiyo
Mar 14 2005, 03:39 PM
And don't forget that any colours you use should be from the 216 web-safe colour palette, otherwise some colours would look different on different systems and browsers. I use the one in Photoshop, but there are websites like webmonkey.com that show the web-safe palette. Also, when you have a page that has white backgrounds, and coloured backgrounds (maybe the menu), make sure that the active link, unvisited link and visited link colours don't blend into either of the backgrounds. CSS gets around this easily, but always a good thing to keep in mind.
Comment/Reply (w/o sign-up)
mpinsky
Jun 15 2006, 03:23 PM
Not only that, but when making your website with coordinated colors, your best bet is to go with complementary colors. They look good together and create a stunning contrast. The best way to find complementary colors is look at a color wheel. The color directly across from it is its complementary color!  Basic Complementary Colors:Red=Green Purple=Yellow Blue=Orange
Comment/Reply (w/o sign-up)
iGuest
Aug 15 2009, 04:07 PM
Credibility of your article
Creating A Color Combination
While the content of your article may be accurate, your lack of proofreading diminishes your credibility. There are several spelling and grammatical errors needing correction. I'm not trying to be a snob, just suggesting your clean up the article to convince the reader that you know what you're doing.
(Ironically, the guidelines listed above for acceptance of comments include "decent grammar and English."
-reply by Sherry
Comment/Reply (w/o sign-up)
ethergeek
Nov 5 2007, 05:57 PM
QUOTE(webguide @ Feb 3 2005, 01:59 PM)  Ever been to a website that is barely readable because of the bad color design? Nope. Site-specific user CSS ftw! 
Comment/Reply (w/o sign-up)
mHelmy
Nov 5 2007, 04:13 PM
I implemented "color from header image" on my websites. You can see the example at http://www.iyoh.uni.cc. I put some header images and randomize it, so text, ads and sidebar color will follow the base color of header image.
Comment/Reply (w/o sign-up)
ossanzi
Aug 19 2007, 03:35 PM
in order to find color codes to use in my site i use this web-site may be you want to try it ? http://wellstyled.com/tools/colorscheme2/index-en.html
Comment/Reply (w/o sign-up)
matthewk
May 29 2007, 01:30 AM
I agree that monochrome is probably the best. I don't think just using complementary colors will cut it. I don't want to stay at a website that long if it looks like a christmas tree, haha. So, green and red have always seemed difficult for me to use for website colors.
Comment/Reply (w/o sign-up)
Similar Topics
Keywords : creating, color, combination, guide, color, combinations
- Creating Your Own Simple But Effective Site
To be resumed soon (26)
Creating A Simple But Effective Website
Part 1 - Design (10) WARNING: This is a VERY image heavy tutorial and will take time to complete Topic closed
until I can find the time to complete it, and I am getting mad with the large scale plagrism of
other articles. Also, the images will no longer work, as I have changed domain name and also
removed the images to make space. Creating a basic but effective website For beginners
Introduction: Ok, so maybe you want to make a website that is “worthy” of the web. That is to say,
you have made small taster sites before in FrontPage or something basic like it. And realised t....
Creating Rollover Images With Css
Eliminate the need for Javascript (12) I have seen it reported that 10% of Internet users have Javascript disabled. Whether for security
concerns or to curtail annoyances like pop-up windows, it seriously limits your ability, as a web
designer, to mold your website into something creative and novel. This is where CSS rollovers come
in. You know that effect you get when you roll the cursor over an image, and then the image changes?
Traditionally, that effect has been accomplished by using Javascript to swap out images. I present
here my own index page which has been made only with CSS and html. If you are u....
Creating Tooltips
DHTML, HTML, CSS, Javascript... (7) Here is a little tutorial to make those small yellow-background boxes (tootltips) that pop-up for
some links that describe them when you hover the mouse over them, it uses DHTML, CSS, HTML, and
Javascript, so it gives us a much more wide range than my previous tutorials that just where on
HTML. OK, so here we go... Put this right under CODE var offsetxpoint=-60 //Customize x
offset of tooltip var offsetypoint=20 //Customize y offset of tooltip var ie=document.all var
ns6=document.getElementById && !document.all var enabletip=false if (ie||ns6) var tipobj=doc....
Creating A Css Rollover Menu (with Table Cells)
for those bandwidthed challenged (9) Ive found this code very usefull when it comes to clients who cant afford Flash (and I hate
JavaScript rollovers as they only work half the time and when you hold the mouse over the button for
5 seconds) When your done here you should be able to create a menu that looks like the following:
click here to see what it looks like Step 1: setting up the framework Get the framework in
there for the script to work , I generally link to my stylesheets externally so I will show you how.
Now open a simple text editor such as Notepad. set up your page with the following bas....
Creating A Webpage Using Photoshop
(4) I've read that this can be done with greater ease by using Ready Image, but since I'm more
familiar with PS, I shall use PS as the guide. This guide does make a few assumptions :: 1) You
already knew how to use Photoshop. 2) You already knew how to write HTML codes 3) You knew both of
the above but did not ralise that it can be done .. Thus, I shall not touch on those 2 topics, as
books a thousand pages thick have been written on them. So, I would wanna waste my time and yours
and all the disksapce that could be used to host some useful stuff. 01:. Open the....
Creating A Roll-over Effect With Text
Save time and bandwidth-simple scripting (11) This short, but consise tutorial presents how to create a dynamic navigation bar using simple
scripting verses using an image roll-over script. Using text instead of images offers 3 benefits
while sacrificing only a little in design. The end resault is a navigation bar that looks great,
dosen't bog the server down with images, loads fast, and is search engine friendly. In addition,
you save time by not having to design two images for every link required. Using simple combination
of Html, CSS, and Javascript we are able to create links in which both the color of th....
Add Favicon To Your Site
Creating, Converting to icon, Setup (39) Have you ever wondered how to get those icons displayed in your address bar for your own site? If
you do not know what I mean, you could possibly have a browser that does not support favicon.ico or
you just have not noticed. If you visit Google they should have a favicon in their address bar,
if it's not displaying just goto this place to get the idea of what it would look like, but in
your address bar, it should show just before the http part but sometimes it does not show so what I
want to do is show you how you can force it to be shown on browsers that sup....
Looking for creating, color, combination, guide, color, combinations
|
See Also,
*SIMILAR VIDEOS*
Searching Video's for creating, color, combination, guide, color, combinations
|
advertisement
|
|
