Archive for September, 2008
The Design of Photographs (Use Stock Art part 2)
Wednesday, September 24th, 2008 | Art, Design Inspiration, Web Design | No Comments
Stock art is not just about picking up random images as we touched upon in our previous post. Stock art is about deep and thorough design and thought. Every image presented on your website has to be carefully selected and should discourage the ideals of stereotypical information. Placing a girl with a headset for the “Customer Support” team is like committing electronic suicide. These harsh stereotypical and un-imaginative images will only serve to provide a negative, cheesy and wholly unprofessional look to your website. It is in fact, these types of images that people will envision when you talk about stock art, and it is these myths we must endeavour to dispel.
When considering each individual piece of stock art you wish to use, you need to ask yourself a series of questions. For example; is this concept a stereotype? Is this image relevant? Is this picture artistic, unique and interesting? Will this image appeal to the target audience of your website? You need to satisfy all of these questions before you can consider if the image is suitable.
Get a good feel for the imagery that the competition uses. Research websites that have content like your own and what kind of images they are using to convey their own ideas and products. You may find a wide range of different viewpoints stemming from one single concept. Examine which images most appeal to you and why they work and alternatively examine the ones that are uninteresting and have a negative impact on the company and think about why that is.
Creating the right blend of stock art in your website is like a well put together collage. You can have some interesting splashes of colour and random images that don’t jump out on their own as relevant or immediately associated with the concept in question. When you put them all together with a well designed website you can create a beautiful and stunning collage that immediately conveys all the right messages and ideas
Use Stock Art
Saturday, September 20th, 2008 | Uncategorized | No Comments
When designing a website, it’s not rocket science that you will need to put in some pictures and designs in there to bulk it up, give it a theme and generally make it more appealing. What you shouldn’t be tempted to do is nip onto Google and pick up the images you can find there. The problem with doing this is you will not have a license to be able to use these pictures, especially if you are selling this website to a client or using the art for anything other than personal use. If you are found out, you could not only be fined a hefty sum but you would also lose your credibility as a designer.
The solution to this is of course to use stock art. Stock art can be free or purchased, so get as many images as you can through various stock art providers and web development magazines and check for the magic words “free to use”. Make sure you can legally use the stock art for business purposes. For any other stock art and pictures, you can choose to buy a few select pieces from stock art firms which means you will be able to download the pictures you have bought which also means you will then have a license to use those pictures.
You can choose to make your own stock art if you have a high quality camera and a keen eye, ensure your pictures are clean, crisp and clear or they will only serve to cheapen the look of your website rather than enhance it.
Remember, it’s not just a case of sticking in photographs to a few places that sort of appear related to the topic. Just as you have designed the website, you need to design the look and feel of the images within it as it is all part of the same package. Every picture needs to compliment the others, and they should also be unique and relevant. Try to avoid cliché pictures and common poses or designs. You want your website to stand out and be appreciated, so put some thought into the stock art you choose.
Google Chrome
Thursday, September 11th, 2008 | Web Design, Web Technology | No Comments
Google released their new web browser, Google Chrome on the 3rd September 2008. With the launch of yet another new web browser online the professional web designer now needs to consider the appearance of their website on this new medium.
As a professional web designer you should already be factoring in the various differences between Internet Explorer, Mozilla Firefox, Opera and Safari to ensure that no matter what the person is using they can see your website clearly and as intended. Each browser has their own unique benefits and downfalls; Safari ranking at the top for speed, and Internet Explorer ranking at the bottom for pretty much everything.
So how does Google Chrome differ and how does it affect website viewing? The first thing you notice when starting up Google Chrome is the amount of screen real estate you are given. All the clutter and various tool bars you are used to seeing on browsers like Mozilla have been completely removed. Google takes great pride in the simplicity and user friendly structure of this great new browser which features “one box for everything” – an address bar you can also use for quick and effective searches on your default search engine (which doesn’t have to be Google). That means you have to be prepared to show a lot more of your website on this browser which may result in ongoing lines finishing early and blank space at the bottom of your page if your web site does not adjust properly to the size. As a user, there is the instant feeling of a much larger screen with only open tabs at the top of the web browser and your start bar at the bottom. Even the traditional progress bar at the bottom has been removed and only a small hovering bar appears during loading and then disappears afterwards.
Google have only just released the beta version of their new web browser but it is easy to see this browser picking up speed and weight in the online community quite quickly. In order to get full browser compatibility ensure you have this browser in your arsenal along side the other four main contenders and you will know exactly what your website looks like on every browser used and you can ensure your website is ready for any major web browser changes.
There is nothing worse than visiting a website that does not function properly on your web browser or looks dramatically different such as overlapping text and images on smaller viewers or misaligned content. If you are engaging in a web design project, make sure that everyone can see your website the way you want it and ensure your site only conveys messages of professionalism, not incompatibility and poor programming.
Using Tables for Layout
Monday, September 8th, 2008 | Web Design | No Comments
On the internet of yesteryear, it was the norm for websites to have the layout done with tables, but with the dawn of CSS, the rules changed somewhat. A lot of people now consider tables to be completely taboo unless used for tabular data – after all, that’s what they’re supposed to be for right? The truth is that although using tables to layout a page is bad form in general, there are times when sections of a page can really benefit from this approach.
Consider the case where we have our main structural elements in place already. We have a container DIV tag enclosing our site, then a header DIV, a navigation bar DIV, a content DIV and footer DIV, and we have everything nicely laid out with some fancy CSS and absolute positioning. What do we do then, if we have sectioned content needing to be nicely arranged within the content DIV? Do we go on nesting DIVs for each individual content area until our page becomes a “divitis” nightmare? A better approach is to simply create a table within the content DIV that can help with arranging our sections. This way we have no nested DIVs and no nested TABLE tags either. The end result is cleaner code that is easier to maintain, good cross-browser support with minimal CSS hacks, and pixel-perfect control over the placement of our content.
Just remember, although tables should be used sparingly, that doesn’t mean they should be dropped from your web design toolbox without a second thought. Being a good designer is about more than just obeying some arbitrary rules; you must use your head and know why the rules exist and when to break them. Letting a design suffer because you can’t figure out the complex CSS to make it work is just madness. If you come across a design problem that is screaming out for a table then use one.
Say it with Colour
Thursday, September 4th, 2008 | Art, Design Inspiration, Web Design | No Comments
Colour plays a very important role in graphic design for all mediums. Whether you are designing for TV, print or for the web, your choice of colour can serve to enhance your overall message and can communicate on a more subtle level with your audience. Conversely, bad colour choices can actually contradict what you are trying to achieve and lessen the impact of your design.
As an example of how colour can work against you, think about the primary colours, red, yellow and blue. These colours are bright and vibrant, and when most people see them, they automatically think of children. The primary colours have often been used for toys, commercials aimed at children, and for children’s websites to make them feel more exciting and playful. Now imagine, if you will, that you are searching for an accountant online and you come across an accountant’s website that uses a colour scheme based on the primary colours. Is this likely to inspire your confidence? The chances are it would make you less likely to take them seriously.
A lot of research has been done into the psychology of colour, and the meanings of colours can vary depending on what country you are in. You can easily see this by looking at the websites of international companies. Lots of these companies have separate websites for each of the countries they operate in, and to a certain extent, their websites will have varying colour schemes to suit the country as well. Of course, for those corporate giants with worldwide branding, their logo and marketing materials will influence colour choice, but there should still be some subtle differences.
Some generally accepted meanings of colours here in the West include: Purple for luxury or royalty, Blue for trust and tranquillity, Green has come to signify ecological concerns as well as its traditional associations with nature, money and encouragement. Colours also tend to take on a slightly different meaning depending on the other colours around it You can use colour schemes that fit certain ideas, for example, such as a colour scheme of reds, yellows, oranges and browns for Autumn, or you could use orange and black for Halloween.
Another consideration when choosing your colour scheme is that of contrast. The eye will naturally move to the area of highest contrast whenever we look at something, and you can use this principal together with a good knowledge of colour theory to guide the viewer’s eye around your design anyway you choose.
Learning more about colour, the many meanings of colours, and how to choose an appropriate colour scheme based on the content and the target audience, is definitely time well spent. A good understanding of colour will show through in your work, adding that little extra something that makes your designs stand out from the rest.
Website Accessibility
Monday, September 1st, 2008 | Web Design, Web Development | No Comments
One of the most important considerations for every web design project is the target audience. Whilst in the past a lot of people were content simply to identify the main demographic such as “male teens” or “IT professionals” and to design accordingly, with technology such as screen readers becoming readily available for those with disabilities to get online much easier these days, it is important to take them into account as well. In fact, if you don’t take the needs of disabled users into account when building a website, you might find yourself getting in trouble for discrimination.
Web accessibility is about making your websites accessible to the largest possible audience, and this includes taking into account the many different devices the website may be accessed with, and the ways in which you can allow users to customise the content. For example, even just designing your website so that it can easily scale when the user increases the font size can make it much easier to use for those with a visual impairment.
There are many organisations and agencies attempting to standardise web accessibility to make it easier for the designers and developers to integrate accessibility into their sites. This is all happening alongside the standardisation of XHTML, CSS and the other web technologies, and you may find that you only need to make a few changes to bring your sites up to scratch. One great resource for accessibility information is the W3C (World Wide Web Consortium). You can find a copy of their guidelines at Web Content Accessibility Guidelines 1.0 and a more specific list at Checklist of Checkpoints for Web Content Accessibility Guidelines 1.0 which sorts the guidelines according to priority. Priority 1, for example, are all those guidelines that a web designer or developer must adopt in order for their website to be considered accessible. Priority 2 includes all those guidelines that should be implemented and the final priority is for those that a designer may include.
Putting in the time and effort to make your websites more accessible should be one of your top priorities when building new sites. Not only will this broaden the websites potential audience, but it also shows that you are a considerate designer and that you care about the people who view your work.