Computer technology has come a long way over the years, and with each generation of increasing screen sizes, web designers everywhere have taken up the challenge to best take advantage and utilise this new screen real estate.
With some screen dimensions now topping out at 2560 pixels wide, it’s no wonder that the old 1024 pixel websites now look dated and unprofessional. An easy and aesthetically pleasing way to combat this issue without compromising on content is to introduce full screen or full bleed imagery.
Full bleed imagery has been used in the past by print designers, in magazines, brochures and newspapers. However, with the rising popularity of responsive websites, full bleed imagery is now being used on screens, and with great effect. Two great ways to use full bleed imagery include a full bleed background, or using a full screen width rotating banner.
The full bleed image background is useful for websites that wish to have an overarching image that sums up the feel of their whole website. With this concept, content would usually scroll back and forth over the background, leaving the image static and unmoving. To best use this style, the image must be uncluttered and have a definite theme, whether that be a panoramic photo, or a person modelling the latest product. Secondly, the image must allow for content. In some cases, if an inappropriate image is used, it will disturb the readability of the content, and you will subsequently lose users on the website. Make sure you have a defined contrast between the background and the foreground. This can be achieved in many ways; by changing the image to black and white, blurring the image, adding or decreasing the brightness of the image or even using box between the content and the background. Here’s an example of a website that uses the background element as the full bleed image: www.enudge.com.au
The second option of using full width imagery for rotating banners is more suited to corporate websites that want impact without being too flashy. The use of a full width rotating banner allows the website to showcase a variety of things as opposed to one singular theme. Whether it be your company values, or special deals that are available, a full width rotating banner never fails to grab the attention of your audience. The other advantage of using this method is that it allows the rest of your website to sit within the 1024 space without it looking old fashioned. Using a straight 1024 pixel layout will make your website look blocky, and less engaging. A wide spread image at the top draws the eye and attention of your audience, breaking the rigid structure, which then follows through, making the rest of the content easier to absorb. A good use of this style should give impact and simplicity to your website’s main message. A good idea for image selection for this purpose are images that have a wider angle, and preferably a space for a short message. Using portrait photos limits the amount of what is visible, and using something too cluttered will compete with the impact of the text you choose to place on top. Here’s an example of a website that uses the scroller as the full bleed image: toll transitions Defence Website
Either way, applying large scale, full screen imagery now has a place on the internet, as screens get larger and wider. Using up that screen real estate has never been more important in sending your message to your consumers and clients.