Blog 6: White Frontier Brewery

The website I choose for this week’s blog is a brand website for a swiss beer company, White Frontier BreweryScreen Shot 2015-04-13 at 6.44.50 PM

The website is very beautifully designed by a company called McArnolds in Belgium. What’s interesting about this website is that the landing page asks if the visitor is above the legal drinking age in their country, if you click yes, the button would take you to the homepage, and if you click no, you will  go the the web-design company, McArnolds’s homepage.

The website uses a lot of javascript to reach its artistic look and interactive functions. The homepage, for example, is very visually focused. Each navigation section is actually a photo gallery, or even a videos. If you hover on one section, the images would change, and the videos would move as well. Such as the beer section, if you hover on it, the image of beer will change, but the background picture remains the same, and it looks great.

Because the website uses a lot of javascript functions, and many of them I’m not familiar with, and not sure how they correspond to the effects, so I’d like to talk about one basic language I picked up from the source code–VAR.

Screen Shot 2015-04-13 at 6.45.33 PM

var is a very keyword that declares a variable, optionally initializing it to a value. var affects the variable scope: Inside a function, all undeclared variables are global. Only those declared with var are local. This becomes very important when you have a lot of scripts running on the same page.

<script type=”text/javascript“>

//<![CDATA[
var controllerName=”home”;
var actionName=”index”;
var base=””;
var baseLang=”/en”;
var lang=”en”;
data={“showLegal”:true};//]]>

</script>

Advertisements

One thought on “Blog 6: White Frontier Brewery

  1. I think you found a really good site with a good javascript element to identify. I think the “Var” function is important, especially when you have a lot of elements or scripts running on one page, like you said. For this brewery page, I think it was really important for each of the four separate boxes since when the user hovered over each one they did something different. I’m wondering if this could have been done with a div or class though instead.

    I guess it depends on global vs. local as well but I think the “var” tag is really good to know in general and worth looking into more.

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s