Media Button Video Production

Web design is a good example of where creativity and function must work together or the whole damn reason for being is lost.

A beautifully designed website may be visually stunning, but if it doesn’t work – it doesn’t sell. This brings us back to the ideal principals of design in the marketplace:  function and form. Here are a few guidelines to help you design a website that works, because on the Internet form must follow function.

Lylia Brik yelling “Books”.

Web Design Function:

Website Navigation – a clear menu is essential. The menu is typically placed at the top of the site, because that’s where we all expect it to be. There is no need to be different just for the sake of it. People like to be inspired by images and entertained by funny captions, but not if it causes confusion and makes it difficult for them to find what they are looking for.  If you have a scroll down page ask your developer to add a sticky navigation menu bar, users truly appreciate sticky nav bars if they have to scroll down through a few pages of information.

Website Design Load Time:

Does your site load quickly? If not fix it. You may need to resize images or take Flash and add-ons off your site. In this instance, the beauty of your site only lasts as long as the visitors’ patience, and in web time that’s about 10 seconds.

Website Alt Tags:

We all need those bots to search our sites, and alt tags are vital if you want the search engines to understand your images. It’s a great aid to optimization outside of copy content.
Besides, sight-impaired visitors use ALT tags, which means you should definitely use them to maximize reaching all your potential clients.

Use Inbound Links on your Website:

Long descriptive links are recommended. Gone are the days when single keywords were considered sufficient to tell the bots what your site is all about. Nowadays we want to be more specific to help users understand exactly what they’re clicking to.

So, if you are in the footwear business and want to link a page on your site selling boots, you might want to hyperlink a longer phrase than just the single word boots – try women’s tall leather boots, to be more specific. It not only helps the bots index your site, it helps target more qualified visitors.

Use Outbound Links too!

When selecting which outbound links to embed in your site, make sure they are relevant to your industry. The search engines will cross-reference links to determine the legitimacy of your site. Not to mention offering your visitors valuable information that will encourage them to think of you as a trusted resource.

Cross-platform/browser compatibility: 

You may think everyone uses Chrome and no one important uses Bing, but that is simply not true, so step out of your Google bubble and test your site in the latest versions of browsers. They all have different rules for displaying content.

Ads and Pop Ups

If you are going to place ads and pop ups on your site, be smart and place them in an unobtrusive position. Smack bang in the middle of the page is highly annoying and causes users to close the ad in irritation, however, placed on the lower left hand corner allows the message to remain on screen longer, and your visitor will absorb the message through their peripheral vision.


The Copy – Give it to them straight:

Writing is where the left and right brain meet; we had a difficult time deciding whether this should be in the form or the function of the website since it’s clearly both, so we put it in the middle.

The font on a website  is clearly, a crucial component of form, but the copy needs to be clear, concise and compelling, which means it is also a vital element of function. You can read more about font functionality on this blog post.

Website copy should be written in a pyramid format, which means the most pertinent information is at the top.  Don’t try to be too clever or cute at the risk of losing your reader through misunderstanding, however, as with all creative, if funny and cute is your brand, or your talent – go for it.

Don’t forget to incorporate your keywords in funny and cute ways (remember search engine bots have no sense of humor, they do not understand allegory or metaphor). On the Internet, we write for both humans and algorithms, which takes us to the next point…


The function of a website is to bring your product, service or personality to the public – right? This means SEO is your marketing munchkin and should be engaged to help promote your site. You can help the bots find the relevant keywords by bolding or italicising. Placing keywords in your headlines, title tags and URL are good tactics and if possible, use the keywords in the first paragraph.

Keywords should fall naturally into the copy. Don’t be greedy and stuff keywords into the copy on your site. It is a good idea to think of long tail keyword phrases; this helps narrow the margins and helps searchers find sites more specific to their search terms.

Website Design Form:

Color choice for a website  is a primary concern of many designers and a standard rule is to use no more than three colors, however, as with all rules in creative endeavours – rules need to be broken to make a breakthrough. Every art movement in history began by breaking the rules.

The three-color rule is a good standard and generally follows a pattern of dividing the three colors into percentages of 60, 30 and 10.

 Be aware, the colors you choose carry cultural signifiers.

It’s no accident that oil companies choose green for their websites. The subconscious is highly susceptible to suggestion. So choose your colors wisely and think about your market, if you are marketing to the West, white generally signifies purity; in India, however, it means death.


Website Layout:

Design like an artist but think like a visitor.  Remember less is often more and simplicity is the key to success.  Whitespace is like a long, cool drink of water after trawling though a vast sandstorm of text heavy and graphically indulgent sites. Take a look at all the content on your site and like a ruthless editor cut, slash and delete all unessential elements.

Video in Website Design

Video is a great way to keep your visitors engaged, encourage click through and impart a great deal of information quickly. But remember, not all video is created equal and as with all creative and commercial projects, quality is key to success. The same applies to video. Recently, websites have not only incorporated video onto their site, they are using it as a backdrop, and it definitely encourages interest at first glance. Video could be the antidote to a heavy bounce rate.

Here is a great example of full screen video used as a background of a website.

The idea of melding function and form is not new; it dates back to the turn of the late 19th and early 20th century when the politics of the time were taking a left turn all over Europe. In the years preceding communism, art was not accessible by the public. Constructivism and Modernism were born out of an ideology that brought art into the streets and hands of the ordinary man.

The Bauhaus movement picked up the torch under the belief that art could be functional and that the functional could be art. This was the new direction of art in the early 20th century and it has held true throughout design in the 21st century. Think Apple, think Ikea, think Ferrari, all examples of form following function quite nicely.




Book A Free Consultation +
Video / Blog

We are working-around the impact of Coronavirus and providing communication solutions

Media Button continues to provide safe and reliable video production services in response to COVID-19. We continue to do our part by following health guidelines...

Video / Blog

Where to film? Vancouver vs. Kelowna

For decades the Okanagan has been heralded for its lush landscapes, it’s sparkling lakes, and let’s not forget it’s award winning wine.  It’s top of...

Video / Blog

How To Successfully Advertise Online to the 50-something Demographic

“As soon as our design team found out the product would be marketed to the 50+ market, the room began brainstorming a digital campaign aimed...