Designing for Content: Part One

In our introductory article we gave an overview of the more important aspects of professional web design. Now, in the article that follows, we are attempting more depth looking at web design in its relation to various commonly-used types of content.
The most common types of Web Content

Text: which normally holds

general information,
paragraphs of prose,
organized data, etc.

Multimedia: which commonly includes

images,
videos,
audio,
animation.

These types of of content are usually found intermixed on most websites . Very few websites are exclusively Text (e.g. Index of sporting fixtures and/or results might be) or exclusively Multimedia (e.g Google Images pages are thus)

Advertisements

When one is considering placing within the website pages advertisements which offer goods and services, one should generally bear in mind these few tips:

Be aware of the size and shape of any boxes within which ads are to be set. Place the boxes according to what appears most aesthetically acceptable – such as with wider ads these usually look best placed within a main content column, or else can sometimes be placed at the head of a page; whereas narrower, taller ads sit better within sidebars or maybe within narrower columns. And in addition fitting your ads at their correct size whilst taking into account one’s standard column widths is something a good designer needs to consider with care and attention.
The style and design of any ads placed on your site will always look better when they are able to sit comfortably with the larger style and design of the site itself. There is a difficulty arises sometimes here however: in making the ads clearly showing to be ads and so in essence extraneous to the main matter of the site, but at the same time not making ads look glaringly inappropriate design-wise.Integration of ads into a website theme then may not always be easy without ‘losing’ any impact the ad itself as advertisement ought to have upon persons viewing. Perhaps a use of a set of fixed standard conventions in one’s ads and their placement is desirable? One which utilises basic colorings and font configurations, which evoke some separational distinctiveness for advertising from the website subject matter itself, but which at the same time do not obviously clash with and look incongruous with your website’s general look and feel?
There are certain Ad service guidelines which should help you in the distribution of ads throughout your site. The chief ones may be:
Stay below a maximum recommended number of ad placements per page (AdSense limits this to (I believe?) 3 placements,)
There are certain placement no-nos (for instance it doesn’t make good sense to place, say, text ads – especially those with linking units – near to site menus. To do so is a recipe for user confusion and encourages them in making annoying and accidental clicks away from your business)
You should not shrink the size of an ad so as to get it to fit the space you have available especially not mobile ads or those ads with responsive layouts.  This shrinking down tends to be seen as cheating by the ad client. Besides respecting the original size and resolution of the image ad means it doesn’t display smaller than intended. This in turn means that click aways and links to other sites remain able to be made with facility by persons interested who are browsing the ad)
Interstitial ads are ads that display as superimposed over a web page proper. (These are a certain kind of ‘pop-up’).  Many web surfers view these images that suddenly hijack the page they want as intensely annoying and so maybe they are best avoided? You don’t just alienate the surfer from the product being advertised, but from using your site itself.  (BTW There may be copyright issues also arising sometimes when these interstitial ‘pop-ups’ carry materials that have been directly imported from other sites)

How Arrangements of Content Types Affect Layout

Articles of Text (or similar forms of long-text content like tables of figures) are better viewed laid out with minimal distractions surrounding them, so that there is minimal clutter and maximum clarity. In these instances one generally uses clean one-column layouts, with generous font sizes, line heights and lots of breathing room, so that the experience of a reader becomes similar to, as close as possible to, a real-world book page reader.

One should avoid ‘glare’ in the wrong places, such as the effect given by a clash of colours or bright colours which act to distract from the task of reading and digesting the text. Likewise flashing images and other annoyances can cause a reader just to ‘give up’ on a site, even though the content itself might be excellent and exactly what he was after. Perhaps the message here is: don’t try to be smart and keep it simple.

No elaborate fonts, nor any twirls or fancies: these act to distract or to take away from the reading experience. If a person is at the page and has stayed there longer than 10 seconds he is reading and will not want disturbances, even ones intended to ‘grab’ the casual visitor’s interest or attention.

A general rule is: Look at the display of your pages as if you were the newbie visitor to your website – what would you like to see? How can you make it easy for such a newbie to get that positive and satisfactory experience – and without her having to ‘go around the houses’ to obtain it.

‘Oh, would some god the giftie gie us,
To see ourselves as others see us’

There is considerably more to say on this topic of Designing for Content, and this article is getting overlong as it is. And so we recommend to you the second part of this topic which has been separated off as a discrete article in its own right. Amongst other things it deals with navigation, and an allowance of ample time to chew over beforehand your projected design.

There will follow this second part a third and final part.