Designing Small Areas In Your Website

Posted on October 4, 2012 by
singleimage

Sometimes, web designers get too caught up in the big picture; like focusing on what the entire website looks like or what message it conveys. However, small spaces are just as important; your sidebars and banners can bring people into or turn them away from your website. Effective designs in constricted or restricted spaces can be the key to incorporating the right flair to your website. Basic design tools such as contrast, text display and cropping can make all the difference when developing effective designs in boxed-in areas.

Cropping
When you have small spaces in your site, it is best to avoid using wide angle images where faces are harder to identify. Properly cropped can make faces highly identifiable and clearly visible. Use the same idea when you are dealing with images of objects. Do your images still make sense? It is often necessary to take a few steps back from the monitor or zoom the image out to get better perspective. You should take into account the available space when cropping images. Also, you often need strong crops that can complement your layout.

Color
Look at the color scheme of your design and see whether you can add something exciting to the mix. It isn’t by mistake that numerous web designers use splashes of red on a black and white layout. An element with unexpected color can immediately draw the eyes. Use interesting colors to emphasize headers or bring out certain graphics elements such as colored logos. Avoid using too many colors in restricted areas. When working above the fold with banners and many smaller elements, you should use a simple palette. Using too many colors can leave your design without enough breathing room and it may make your design looks chaotic; making it more difficult for users to navigate through the website.

Text
Fonts with interesting personality can bring out your design. However, you should still use it sparingly. Think of them as elements instead of type. If you go small, the contrasting technique can be useful. A tiny bit of type may have as much as impact as something much bigger. But whatever you do, you shouldn’t forget the message you are trying to send. You can use text effects, but some of them may easily come off cheesy if aren’t used carefully. Tilted and arcing text could easily look like something people made on Microsoft Word 15 years ago.

Contrast
Yin and yang, black and white, red and blue; they remind us about contrasting elements. Nothing will stand out if everything matches too perfectly in your layout. Try to pair elements with contrasting properties, which can complement one another. The philosophy behind contrasting elements is simple and it explains why black and white layout is such common and popular. Use color wheels to define the opposing sides of colors you use. Other than colors, you can also use contrasting properties of type as well. Consider using texts of varying size and weight. You could also use colored text for headers such as dark blue and black for the text body. Another way for adding contrast in your site is by pairing small image with large type (or small type with a large image).

Content
Content is always king and the absolute best design should start with the content. Good content can keep people interested and help drive your design. You should plan content accordingly and try to keep it updated and fresh. More than anything else, this could keep people coming back. Consider content changes as well and determine what parts of your website that are frequently updated. Keep your content area fresh and elegant by using strong design instead of outdated tricks such as spinning photos and flashing text. When handling content above the fold, make sure images can effectively help users to understand the message better. If you want to use back-to-back images, try to use distinctively different colors.

Conclusion
Finally you need to use techniques mentioned above to get the desired result. You can mix contrast and proper use of color, to get the biggest bang for the buck. However, you should avoid adding too many things at the same time. When experimenting with a new technique, opt for elements that don’t have a lot of frills and generally look simple.

You can go to the minimalist route and use tightly cropped images to create dramatic emphasis or use a dramatic crop with large colored text with a novelty font. Each small part of your page should mash properly with the rest of your webpage. Let it go and don’t be afraid to try something unusual. Just because a banner looks really great standing alone; it doesn’t mean it will fit in any site. Experienced web developers often can add a professional feel and an extra bit of flair to a web design project by using the proper proportion and scale in any spot on the website layout. When designing a website within specific set of size boundaries, consider the shape your space.

Cropping, color, contrast, text and content are things you should consider when developing a website. To get the best possible result, mix and match components effectively; also remember to keep it simple. Too many effects and elements can make a small space difficult to comprehend and feel really crowded.

Author :

  • Adam Scott