Based on research I acquired over the summer break, our 'design for web' brief calls for us to display this information in the form of a multi-page website. To prepare for the first support session, I've had a look at a few websites which have used different techniques to deliver their content.
wearelookingsideways.com has a large image in the head with no border - essentially 'full bleed'. This and the title comes before the website links and logo, which is positioned in a margin on the left hand side.
This website manages to include a lot of text and decent sized images, balancing the content with the amount of negative space, which leaves the user less distracted and confused when navigating through the site.
The TED website has a different approach to the layout design, having a horizontal scroll feature rather than top to bottom as the majority of websites do. The nature of the content (primarily videos) allows a more versatile structure, showing certain clips at a larger size than others depending on their importance, rating and popularity. When the user hovers over a particular video, the image changes and reveals a longer description, yet keeping the video thumbnail showing through a transparent overlay. This in itself is an interactive way of presenting the necessary information.
TED has it's logo for the brand at the top of the site, above the main links. Underneath the main section which uses horizontal scrolling, there are subcategories 'popular playlists' and 'latest stories', which contain links to other videos on the website that fall under a different section. By having a smaller, square icon for these videos that stays at that size, it differentiates these links from the headlining videos and pushes them further down on the hierarchy of the site.
A completely different type of website that I find effortless to use is a much simpler, blog format site which showcases a graphic designers work. His multi-page website includes categorised areas of his practice: print, publication, identity, about, personal work, and his shop.
Though simplistic, it does the job, allowing images to be of high quality at a large size which is clearly why Daniel has the site in the first place - showcasing his work.
allday.com posts articles about events or locations around the world, and hosts a two column grid allowing the images to be displayed at a larger size. This is an effective way of drawing the reader in as photos have a large impact on whether the viewer will read further. Especially when scrolling down the website, there's a short amount of time to catch the viewer's attention, so both clear headings and good quality photos make a simpler, more effective website.
It even keeps the background image full bleed when the webpage isn't at 100%.
No comments:
Post a Comment