Magic exist

I believe in magic… and miracles :)

NM3208 Presentation 1

Leave a comment


Please list 3 good websites which you like and evaluate these websites. Do these websites use CSS (Cascading Style Sheet) ? If yes, how do they implement the CSS across the websites? If no, why? What make them good?

I chose the three games websites I like most as it is important for a game website to be visually attractive to users, so that users will be willing to try out the games promoted and also to purchase them.

1. Big fish Games website: http://www.bigfishgames.com/

Colour Scheme: The colour scheme of this website changes every other month according to the game of the month. The website uses dark background colours like dark purple, black and blue to promote their game “The Curse of the Ring”, while their white scrolling page uses blue and yellow for their font colours.

As their recommended game of the month is related to themes like dark magic, curses etc, using dark purple, blue and black colours brings users the excitement of the game, triggering their curiosity and encouraging them to purchase the game.

On the other hand, the clean white background also provides a nice neutral backing for the website to display other games, allowing users to choose for themselves the game they would like to try.

Layout: The website uses a 3-column table to display the various games. The text in the website in the first and third columns were aligned left, while the text in the middle column were centered. This give the website a slightly disoriented look, especially with the animation in the top 2 rows.

CSS: Yes. Website uses Flash, javascript and external stylesheet

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

2. IAH games’ Dragonica website: http://dragonica.iahgames.com/site/default.aspx

Colour Scheme: The dragonica website has a white background with brown, wooden coloured buttons. It uses this simple colour scheme to bring out the graphics of the game characters.

Layout: Dragonica website has three columns and it is filled up with graphics, and the words are all located in the second column. The overwhelming graphics may cause the users to be slightly lost, not knowing where to look. However, the concentration of text in the center attract the users to read the words instead of looking at the graphics.

CSS: Yes. Website uses

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

3.Playfish Website: http://www.playfish.com/

Colour Scheme: Playfish, the website holding some of Facebook’s most played and popular games uses light blue for their headers and white background. They also used primary colours for its other buttons. This give the website a relaxing and light-hearted feeling which is how the games hosted by playfish are like.

Layout:Playfish has three clearly-defined columns. The clean and simple layout with clearly stated headers make it easy to read and well-organised. It has a good  balance between graphic and text.

CSS: Yes, the website uses Flash, javascript and external stylesheet.

II. What are the advantages of using CSS?

CSS allows the web designer to change the style of documents without editing every single page within the entire website. It also allows the layout and position of text or graphics to be consistent across the entire site. CSS makes it convenient and efficient to maintain a consistent look.

Also, a CSS-enabled website uses less bandwidth as a lot of code is condensed into one file. Only one style sheet needs to be downloaded for a browser to render the entire website.

@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@

III. What is Woff?
Woff stands for Web  Open Font Format, a simple compressed font format used in webpages, developed in 2009 by three font designers, Erik Van Blokland, Tal Leming and Jonathan Kew from Mozilla. The designer get to decide on the set of fonts, and Woff tells the browser the correct font to download and use. The WOFF format is directly based on the table-based sfnt structure used in TrueType, OpenType and Open Font Format fonts, which are collectively referred to as sfnt-based fonts.

What are the advantages of using Woff? Any disadvantages?
Using woff allow website to use lesser bandwidth and it will load faster as the font data is compressed. As Woff uses ‘real’ fonts, it is easier to edit any typo error without having to change the whole image (eg. Headers jpg OR flash).

Also, the fonts can be searched via websearch as they are fonts, this allow optimization in terms of search engines.

The main disadvantage of Woff is that it may allow people who know css to rip off the fonts without paying (for paid fonts).

Find 2 good websites which apply Woff. Elaborate how Woff is used in the websites.
1st website: http://lostworldsfairs.com/atlantis/

I think many people will have this website as it’s like one of the top choice in Google search. In the picture, you can see at least 4 different type of fonts and they are not images! They are all real fonts!

In this website, you can scroll all the way down and the font type changes as the user moves further and further down.

This enhance the website aesthetically and it will be easy to change their content or information when there is a need.

2nd website: http://lostworldsfairs.com/moon/

In this webpage, there’s 10 different fonts used. Although it is not encouraged to use so many different types of fonts on the same page, but as there isn’t much text, the use of the different fonts does not really make the webpage look bad.

So I felt it is quite successful in that sense.

Advertisements

Author: Tiffany Yong

The ABC Girl (Actor, Blogger, Consultant) in Singapore!

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