Archive for the ‘Web Design & Development’ Category

I’m currently working on a new layout for this web site and hope to have it up by the end of June. Get ready for some awesome-ness!

At the moment I am learning Ajax with the help of a very easy-to-use class called JQuery. I am a big fan of tutorials when it comes to learning and have found the following sites to be very useful:

• 8 Fantastic JQuery Tutorials for Designers
• 50 Amazing JQuery Examples
• JQuery Tutorials for Designers

I visit the CNN and BBC web sites each about once a week, and noticed that both sites have remade their layouts to look more like blogs. Both sites now have a very soft, rounded overall feel. There are lots of rounded corners, lightly colored text, and user changeable interactive elements.

The only thing that irks me is CNN’s use of bright red text on an almost black background. What were they thinking??? The use of red text on a black background reminds me of the 90’s when inexperienced web designers created entire pages with nothing but bright red text on a black background. Eventually you want to rip your eyes out! The BBC web site on the other hand, does a much better job with the blog style. They’ve employed lots of soft color (beige and grey) with easily read text. It’s a much more professional look than CNN’s use of teenager style stars in multiple places. Don’t get me wrong, I love stars, but they remind me of a giddy high school girl.

CNN Main Page

CNN Article Page

BBC Main Page

UPDATE:

I didn’t realize that CNN’s black and red with stars theme was created just for the presidential election. Their current site has the same theme structure, but with white and red colors. Either way, my opinion about red on black still holds true.

I was asked to make a few changes to the Vails Gate MySpace page.

I made a few changes to font size, font color, table width, contact table font and color, and the page’s background image. Even though I was asked to make simple changes, the boxy layout reminded me the typical MySpace page: boxed text on crazy backgrounds that no one can read. So, I set out on my search for easier-to-read MySpace layouts and came up with a few that I find really bright and fun, but also easy to read.

Two web sites offering MySpace layouts that I found to be the most helpful (offered the code for a layout with no strings attached) were Createblog and Ultimate Myspace.

A good way to learn how to make layouts like the ones above is to download the code for a pre-existing layout and then add it to your own MySpace page if you have one. Then download Firebug for Firefox and use it’s “Inspect” tool to figure out the name of elements. For example, if you have a box on your web page and you can’t determine if it has a parent box, use Firebug’s Inspect tool to hover over the box and gradually move the mouse outward to determine if there is a parent. Once you know the names of different elements you can add or modify elements of your own.

One of my favorite web sites in the web design community is Open Source Web Design (OSWD), which offers a place for web designers and developers to submit their designs for users to download for free. It is a great resource for getting design ideas and a way to learn HTML and CSS by thumbing through submitted code.

Some of my favorite layouts I have found so far are shown below: