Gaming Nexus's move to new technologies and design

Article

posted 9/19/2005 by John Yan
other articles by John Yan
One Page Platforms:
For the drop down menu at the top, I started out with an open source .NET menu system entitled skmMenu. Unfortunately, changing our DocType in our web page to tell the browser to use a strict rendering method and trying to conform to web standards caused the menu’s drop down to behave erratically. While I would normally delve into the code and try to fix it myself, I didn’t want to spend the time when I had another easy alternative on my hands. What I do now instead is use an HTML list and use CSS to convert the bullet items to a drop down menu. Here’s a sample of the HTML:



And with just a reference to a CSS style, it changes it from the traditional bullet list that we are all familiar with to a nicely formatted drop down menu.

I’ve always hated the fact that text in programs such as Photoshop and Flash look a lot better than HTML text. Because HTML text doesn’t have any anti-aliasing, it will never look as good. There’s a great text replacement tool titled sIFR that I use to generate those nice looking headlines. If you don’t have Flash, you get the traditional HTML text but for those that have Flash enabled, you get very clean looking headlines. All the replacement is done using an SWF with the font I specified and a javascript include that has the code to do the replacement.

One of the biggest challenges was making benchmarks a lot easier to do. Previously, I would put all my test scores in an Excel worksheet and generate graphs from that. I’d then take the graph and put it into Photoshop to create a GIF. It’s a tedious process and I knew there had to be an easier way. I spent a lot of time on the database structure to allow me to enter in a wide variety of combinations of variables that make up a benchmark. So I can add benchmarks for different systems, product patches, video drivers, and picture quality features to name a few. There’s even support for doing time based benchmarks with a line graph rather than the traditional average bar graph should I decide to go with that benchmarking approach. With that in place I looked for some graphing utilities. There are some nice free ones and some great open source ones but I decided to do something simple and leverage the .NET GDI API and write some objects to draw them on the fly. They do have some nice methods to create some effects such as the gradient on the bars themselves. The code wasn’t that much and I’ll be continuously upgrading the object to add more charting features. Since branding on the site can change, I can now change the benchmark branding and it will be reflected by all the past ones I’ve done. It’s actually one of the things in the redesign that I am most proud of. You’ll be able to see this in a week or so as I put the data in to replace the old images.

AJAX is the big buzzword being thrown around lately. If you don’t know what AJAX is, it stands for Asynchronous JavaScript and XML. By leveraging the XMLHttpRequest object that’s supported by most modern browsers, you can render portions of websites with data without having to refresh the browser. I’ve done something like this many years ago on a web application I worked on where I displayed information from a server in real time without having any interaction from the user using DHTML. I had an object that would subscribe to a messaging service that would listen to incoming messages and display them as needed. AJAX is taking off now and I decided to add some of the technology into the site. If you go to the About US page, you can see it in action when you click on a writer’s name. What happens is there’s a JavaScript call that requests the data. When it finishes retrieving the data, another JavaScript function displays the retrieved data all without rendering the rest of the page which doesn’t change. You can also see this in action when displaying articles written by a writer and changing between review, preview, and articles. And the big demonstration of this feature is when you switch article pages with the arrows. There’s still the drop down with the page numbers and the normal submit button just in case.
Page 3 of 4