1. Computing

The Academy of Motion Picture Arts and Sciences

By

The Academy of Motion Picture Arts and Sciences
The Oscars Website

The Oscars Website

Image submitted for the HTML5 Design Gallery courtesy The Academy of MPAS

http://www.oscars.org/

The Oscars website is a site where you'll probably have some strong expectations of how it will look. You expect things like:

  • elegance
  • photos of stars
  • announcements about the ceremony

And you wouldn't be disappointed by this site. The black background, which typically I don't like, works well for this site because black gives a sense of prestige and elegance. When you combine that with the gold accent colors and that's exactly the sense you take away from the site. In fact, the only disappointment I might have is that there are only a few pictures of stars.

In terms of the HTML, this site is a fairly typical HTML 4/XHTML 1 site. It uses the DIV element almost exclusively, although there is some use of lists for the navigation menus. The designers clearly have some focus on speed, because they do things like put the scripts at the bottom of the page. But then marketing gets in the way and places the promo box below the scripts. I suspect that this is a case of multiple developers, one assigned to speed up the page, and the other told “put this at the bottom of the page.”

There are also some errors that I'm surprised haven't caused problems. The biggest one I noticed is the LINK element in the BODY of the page pointing to a style sheet. There is also a STYLE element not in the HEAD. While most browsers can figure this out, it can cause your styles to display in unexpected ways. You don't gain speed advantages by placing CSS at the bottom of the page the way you do JavaScript. It's better to place all your CSS in one file and link to it at the top.

One interesting problem is how they handle the alternate domain http://oscars.org/. When I typed that in the page failed to load. Since this is a way that many people type in domains—leaving off the initial “www,” it's a good idea to set up your server to handle both URLs.

Have you built an HTML5 site? Or do you know of one that does a great job with HTML5? Submit HTML5 site designs to be featured on this site.

  1. About.com
  2. Computing
  3. Web Design / HTML
  4. Web Design
  5. Inspiration
  6. HTML Design Gallery - The Academy of Motion Picture Arts and Sciences

©2014 About.com. All rights reserved.