The choice of colors for your web page is not as easy as you think, that you like something does not mean that others will like it; That is why in this article we are going to give you some tips for choosing colors for your Web page.
In studies carried out on color theory, it is found that colors affect the perception of users about a product, some colors attract the attention of users, others are easier to read, others can even affect our mood .
Your Company Colors
There are several factors that you must take into account when choosing colors for your web page.
All companies always have a logo, something that identifies them, from a drawing to typography for the company name; in case you don't have it, try to make one, this generates brand identity.
Whenever possible, try to use the colors of your company's logo on your page, trying not to saturate, you can get an idea by visiting the portals of the big brands that you like or admire.
Colors also define behaviors; As an example I give you the following:
Black is associated with elegance, quality and distinction; To cite some examples, you can see this color on pages like:
Mercedes Benz https: //www.mercedes-benz.com/en/
Apple https: //www.apple.com/
Red is associated with emotions, sensations and desire; for example, we can see it in brand identities like:
Coca-Cola https:/ /www.coca-cola.com
Ferrari https://www. ferrari.com
Blue is associated with tranquility, efficiency, confidence; You can see it in brands like:
IBM https://www.ibm .com
General Electric https://www.ge.com/< /a>
Orange is associated with enthusiasm, change, attention;
MySQL https://www.mysql .com/
Ubuntu https://ubuntu.com/< /p>
Less is more?
This phrase attributed to the architect Mies van der Rohe (there is debate as to who said it first), tells us that for something to be visually attractive it does not necessarily have to be full of details or saturated in some way, be it colors, images , texts and whatever you can think of that you can put on a page.
Remember that simplicity does not mean absence of information; try to offer a clear page that provides your customers with what you want to convey, using colors that facilitate and highlight the information you want to project; with menus that are easy to locate and access, that present a good contrast with the texts they contain.
Studies determine that you should not use more than four colors on your Web page, between texts, menus, highlighted information, bars, etc.
To define the colors and their combinations, we have several schemes already studied; It is up to you and your development team to define which ones are closest to what you want to project:
This scheme uses two high-contrast colors, such as black and white; it is especially used for reading, highly used in press websites.
In the event that you want to present only text, a black text with a white background is more readable; Although studies say that this generates more eye fatigue, so a dark mode can be used, but it is also related to the amount of lighting that the reader has, a dark mode is valid in low light conditions, but this is not possible. meet him.
This scheme takes a color as a base, and obtains the other colors by changing the tones and intensities; In this case, you can take the predominant color in your company's logo as the base color.
Complementary Color Scheme
In this scheme the chromatic circle is taken and the two colors are used that combined give a neutral color; for the example we observe that, for the color red, the complementary colors are blue and yellow; the mixture between blue and yellow gives green color, which is the complementary color to red (opposite on the color wheel).
For this scheme we must evaluate the saturation and purity of the colors, by using only pure colors we can generate a saturation for the user.
Analogous Color Scheme
In this scheme the colors that are adjacent in the chromatic circle are taken, this color scheme is quite seen in nature; where we observe that there are no sudden changes of colors, but a degradation of tones, to cite an example the leaves of the trees in the seasons, they are degraded or intensified according to the state of the tree.
According to our experience we have summarized the following tips.
- Do not take lightly the choice of colors for your page, try to generate an identity with what you want to convey.
- A second opinion is never bad, if you can ask for opinions to evaluate your design.
- If mixing colors isn't your thing, ask someone who has more experience; everyone has different knowledge and talents.
- For pages with a lot of text, prefer high contrasts (black text/white background); dark themes work well in low light, but you don't get that feedback.
- Check out different sites to get an idea of ??how they handle colors.
- Use color generators, they are free tools that can give you an idea of ??the colors that can be combined; some of them are:
- Coolors https://coolors.co/
- Adobe Color https://color.adobe.com/create/color-wheel/
- ColorHexa https://www.colorhexa.com/color-gradient
- ColourCode https://www.toptal.com/designers/colourcode
- ColorHunt https://colorhunt.co/