Let’s look at Symmetry
Humans like Symmetry
Human beings have a natural ability to recognise symmetry usually what is referred to as reflectional symmetry. This is where you put a dividing line down the centre of an object and the left hand side directly mirrors the right. It has been found that people seen a most attractive exhibit high degrees of reflectional symmetry.
When we look at objects and in our case websites and the images on those websites we often get the feeling that something isn’t quite right. Many people don’t know what it is that is jarring their senses but they know something is wrong. If they feel this way then they are going to be put off reading and taking in your content no matter how important or valuable it is.
Now I know she is pulling her “Popey” face but partly what makes and otherwise pretty face appear unattractive is that it no longer has any symmetry.
We can innately tell that it is a distortion and in this instance recognise that the distortion is deliberate for comic effect. This allows us to accept the lack of symmetry for what it is.
Another funny face. This one I think was “the wide mouthed frog” and although it is not the prettiest of looks it is less “ugly” than the previous image. This is partly due to the fact that although the face is distorted it is symmetrical.
Now without any distortion she is restored to “Granddad’s beautiful girl” her face is now symmetrical. The degree of symmetry will affect our view of beauty. Regardless of ethnicity and different culture “view” of what is a beautiful woman or a handsome man the common unrealised factor is symmetry.
What is true for a face is also true for a website. You should endeavour in your layout to create a symmetrical approach. This does not mean that the whole page should achieve reflective symmetry on both horizontal and vertical axis. It means the tops of two images on the same row should align at the top, at their centres or the bottom. In general the best fit would be aligned at the top but there may be a genuine reason, explained by the text layout, why that is not the case. In the same way images in the same column should align left or right which of these to choose will depend on the image content as one set of images may look good aligned left but a different set will look good aligned right.
Where images are use alongside text make sure the top of the heading or the top of the text either aligns with the top of the image or is set deliberately and an appreciable amount below the top edge (as with the images above). Text that doesn’t quite align will spoil the overall appearance of the page.
White Space Synonym of Symmetry
What is “White Space” – it’s the gaps between blocks of text, between images, between image and text and the spacing between lines of text. The white space on a page is about a synonym of symmetry – balance. Not enough white space and the page looks crowded, disorganised and unattractive to a visitor. They assume they are going to have to work hard to find the information on this page. Too much white space and the opposite it true the page appears sparse and uninteresting because the visitor perceives that there is little content on the page.
Above there are three image each with some associated text. If they had been arranged with the images all in the left column then there would have been large amounts of white space between the blocks of text. By alternating the images the white space is better distributed on the page.
Recent Comments