The basics of web design – part 3: design and color scheme


In the initial two pieces of our three section arrangement, we covered both the arranging and ease of use parts of website architecture. Partially three, we are spreading out the most key target of website composition: the genuine look of a webpage. Logos, plans, and tones unequivocally impact how clients see a web presence. Notwithstanding content (text, pictures, recordings, and so on) and how it is orchestrated, high significance should likewise be put on a site’s looks. The whole plan measure adds to the general view of your site, content, and the organization or brand. Clinging to the accompanying plan rules will help you locate the correct search for your site.

  1. The requirements for a good design concept
  2. Corporate Design
  3. Guidelines for corporate web design
  4. Colors for web design
  5. The effect of colors
  6. Further important aspects for web design

The requirements for a good design concept

When managing questions with respect to your site’s appearance, it’s essential to initially have an exact vision of what fundamental substance you wish to incorporate. This progression is essential, for content generally impacts the design of a site. Make a point to explain precisely how the data, administrations, or items that speak to your site should look and feel. Exactly what is it precisely that your organization or brand is attempting to impart? What isolates your item or brand from the opposition? Handing-off a picture to your intended interest group that is custom-made to your ideal appearance is crucial for an effective plan. Organizations ought to besides guarantee that their site mirrors their respective corporate plan.

Corporate Design

The overall picture and appearance of an organization is known as corporate plan. Foundations, associations, clubs, and brands additionally regularly keep a brought together corporate plan. The look and feel of logos, promoting materials, items, and sites are totally characterized by a corporate plan conspire. Having a place with such plans is a variety of inventive constants (for example certain tones, shapes, and text styles) that show up in the different items and specialized instruments of their particular company.  Essentially, sites comprise only one part of corporate plan. While making a site for a grounded organization, creators are frequently ready to draw motivation from the shading of the logo or the typeface of showcasing materials, for example, leaflets, promotions, or public statements.

Guidelines for corporate web design

Corporate plan consistently means to pass on a specific picture. By guaranteeing a bound together and simple to-get a handle on look that all distributions and methods for correspondence hold fast to, a strong corporate plan can give a high acknowledgment incentive to the organization or brand it speaks to. In this sense, corporate plan stays consistent with the rule “structure follows work”. Singular plan components should offer more than acknowledgment esteem—they likewise should be useful. Joining logos and text styles that are both simple to peruse and, as an additional worth, outwardly engaging is an illustration of this guideline.

The accompanying sections separate the main parts of corporate plan.

The logo

A logo is a graphical character and the centerpiece of corporate plan. Logos impact the presence of all ensuing distributions for a given plan mission or plan. The logo’s shading can be found in most, if not all, of an organization’s promoting material. Regularly single components or parts of lettering plans make up a pictorial component or image of a logo. Now and then logos are made exclusively out of symbols or highlights taken from the organization’s lettering. Interestingly styling symbols and the presence of organization lettering can deliver a really unmistakable plan.

A unique brand or symbol is basic to isolate your organization’s picture from the traditional pack of corporate plan. Logos should be obvious on each page of your web presence and are by and large found in every header. The realistic should be compact and ought to endeavor to build up a brand’s picture. Remembering the accompanying focuses while considering an idea for your logo should help you better satisfy the previously mentioned measures.

  • Clarity: the logo fills in as an intermediary of sorts for a brand. It ought to consistently help the watcher to remember the brand and some way or another insinuate the brand’s qualities. Highlighting adapted portrayals of items or administrations in the logo can build its coherence.
  • Uniqueness: A decent logo is effectively discernable from those of different organizations. Essentially appropriating the plan of a contender’s logo for your image fundamentally diminishes the odds of setting up an autonomous character. This may likewise empower the copyright proprietors of the first plan to seek after legitimate activity.
  • Memorability: Logos shouldn’t be excessively nitty gritty or excessively perky. Basic logos are frequently simpler to recall.
  • Reproducibility: Logos have a wide range of uses. Regardless of whether it be business cards or stamps, it is fundamental that they are similarly as unmistakable in more modest organizations as they are on bigger ones, for example, banners or boards. Drafting a high-goal logo is prudent all together increment versatility. Besides, logos should be accessible in various organizations (for example JPG; PNG, and PDF) with the goal that they can to be all around applied.

Corporate font, imagery, and color scheme

Notwithstanding the logo, there are further corporate website architecture components that should be viewed as when drafting any idea. Here are the absolute most significant ones to consider:

  • Corporate textual style: A corporate textual style is a typeface that is utilized by an organization or business. Text styles can be somewhat executed or utilized only. In addition to the fact that they need to offer high acknowledgment esteem and be anything but difficult to peruse, they ought to likewise help advance the ideal picture or organization reasoning they look to speak to.
  • Symbolism: There are numerous situations where it is important to fuse pictures into a site. Pictures add additional variety into plans and stir feelings in watchers. Different media structures, for example, pictures, photographs, films, and images make the premise out of symbolism. Similarly just like the case with textual style, all types of symbolism should be uniform and shown in a reliable way. The substance and style of the applied pictures should underscore the picture or reasoning the organization is endeavors to extend. Amateurish pictures with low goal ought to consistently be dodged. These may seem awkward and make the watcher question the reputability of the site.
  • Shading plan: Color use additionally should be mindfully and painstakingly utilized. Shading plans should commonly consolidate the different shades that are utilized on the subpage of your site. The logo configuration, picture components, and foundations should all be founded on a formerly settled upon shading plan.

The previously mentioned shading idea presents a wide scope of practices to consider. Certain tones effectsly affect their substance. What’s more, given that different tones are illustrative of an assortment of dispositions, pictures, and sentiments, it is conceivable to explicitly focus on the ideal qualities that you wish to have your organization related with. Thus, an insightfully executed shading idea is fundamental for any corporate website composition conspire.


With IONOS’s web designer, browse a wide scope of pictures and subjects to redo your web task and make it your own!

Colors for web design

It is significant not to disparage the hugeness of a painstakingly understood shading plan. If one knows, colors regularly make an association with various contexts and feelings. Tones can be separated into two particular gatherings: warm tones, similar to orange, yellow, or red, or cold tones, for example, green, blue, or purple. Earthy colored, dim, white, and dark are viewed as unbiased shadings.

Each shading tone creates certain relationship for the watcher. Red, for instance, is regularly emphatically connected with affection, warmth, consideration, energy or valiance. It’s additionally, be that as it may, a sign tone and can convey negative meanings with it. Threat, fire, brutality, blood, pomposity, or wrath are another arrangement of emotions red stays with in its. All in all, red orders loads of consideration from its watchers.

There are both positive and negative understandings for every shading tone. Following this current, it’s prudent to adopt an expansive strategy to shading choice, and not just spotlight on aesthetical components.

The effect of colors

How a watcher deciphers a shading relies to a great extent upon the atmosphere and context that’s affecting everything. The importance of a shading additionally will in general fluctuate as indicated by the social setting wherein it emerges. The following is a review of the main shadings utilized in western nations. The recommended utilization of the individual tones has likewise been spread out:

colorpositive associatonnegative associationPreferred application in web design
whiteminimalist, sleek, neutral, peaceful, modernempty, cold, sterileGiven the strong effect it has when combined with other colors, white is generally considered to be appropriate for any sort of website. There are, however, some sectors that seem to use white more than others. These are: religion, medicine, law, science, luxury items.
blackprofessional, elegant, classic, smooth, objective, functional, modern, authoritativelonely, sad, gloomy, evil, illegalAs is the case with white, the effect of black’s use strongly depends on which colors it is combined with. Fashion, cosmetics, luxury items, or certain music genres particularly gravitate toward black.
greytimeless, upscale, premium, competent, professional, objective, neutraldreary, murky, clinical, distant, oldGrey is generally ideal for business oriented websites or luxury articles.
brownnatural, mature, fertile, warm, down-to-earth, snug, cozy.old fashioned, heavyanimal, nature, and environmental topics
redStriking, passionate, noticeable, tempting, amorous, warm, dynamic, powerful, bravedangerous, aggressive, loud, arrogant, wrathfulemergency services, fashion, entertainment, sports, food industry
orangefriendly, happy, young, warm, energetic, inviting, good valueunprofessional, pushy, restless, cheapcars, entertainment, technology, food industry
yellowhappy, friendly, young, optimistic, cheerfulpoisonous, pushy, volatile, cowardlyDue to its intensity, yellow is not often used. Moderate use, however, may be worthwhile when working with a specific brand or industry (e.g. a taxi company or a beekeeper)
greennatural, lively, fresh, happy, hopeful, positive, generous, relaxing, peacefulpoisonous, inexperienced, immature, angry, enviousanimal, nature, and environmental topics. science, tourism, medicine
bluereliable, strong, competent, professional, harmonious, friendly, relaxing, quietcold, heavy, distant, depressingeconomy, law, management, science, high tech, medicine and pharmaceuticals
purpleImaginative, spiritual, creative, extraordinaryunnatural, artificial, subjectivefashion, luxury items, cosmetics

As you can see, the world of colors is quite diverse. Which colors you choose to include and to what extent depends entirely on what color effect you wish to highlight. From a design point of view, it is best to keep your color use to a minimum and not use more than three different colors; too many colors make sites more difficult to navigate.

Further important aspects for web design

Thoughtful and creative web design commands its dues in both time and work. With a little patience, however, you’ll find that creating a compelling website is a manageable task. The basics covered in this three part series are generally intended for implementing a website. For more information on how to optimize a web presence, check out the following articles: the most important SEO tools and a comparison of the five most popular CMSs.