You are invited to Log in or Register a free Frihost Account!

New Design Please Review


The design is not finished, and the there is zero content on the website, so the navigation doesn't actually do anything at the moment.

I'm just looking for some preliminary feedback while the design is in the early stages so that any somewhat largish design changes aren't terribly painful.

It may not validate because I'm working on it off and on.

The menu is a vertical jquery conversion of the famous JavaScript slider menu that was seen about a year ago. The original was about worthless, as it had 100% CPU utilization. The Jquery one only uses maybe 15%. So this menu is a hack of a hack of the original. The jquery version can be found here:

The curved corners are one of the various ways to create curves without images. The one I used just had a nice web based code generator, which makes it easier when your changing colors.

There is some nifty PHP underneath everything, but I'll save that for when it's finished.
It seems to me that the header is a bit too big. I might size that down a bit and move the menu to a horizontal one or off to a sidebar on the right. Of course that would mean giving up more space, so maybe that's not a good idea. I'd go for a horizontal bar then.

Everything else is fine by me, as long as the games are fun!
GB wrote:
It seems to me that the header is a bit too big. I might size that down a bit and move the menu to a horizontal one or off to a sidebar on the right. Of course that would mean giving up more space, so maybe that's not a good idea. I'd go for a horizontal bar then.

Everything else is fine by me, as long as the games are fun!

Out of curiosity what resolution are you using? I think the large header was caused by me using 1680x1050 to develop it in, I may reduce the size a bit when I get around to it. Thanks for the review.
I'm using 1600x1024 resolution in Firefox 3 on a Mac running OSX 10.5. Here is a screenshot:
GB wrote:
I'm using 1600x1024 resolution in Firefox 3 on a Mac running OSX 10.5. Here is a screenshot:

Very very nice.
This shade of blue is hurting my eyes, it's just to powerfull. Try something less nagging.
The header could use a little more pizzazz. You have a big chunk of off-center white space between the logo and the navigation. I'd center the logo in the space to the left of the navigation, or play around with some graphics, or both.
It's kinda average...

The colors could be a little bit softer as said above, and if i were you i would rescale the header also.
look sweet , but i think the menu should be in the left side
i like the menu style very much, also i like the light blue background, congrulation its very nice but the pale colour is not matching with the blue
I think if you add a drop shadow around the panels it would spice up pages. Look around the web and you will see the drop shadow on many site to help them to look different than a simple flat page.

If you right click on the drop shadow edges on the sides of the panels, and click view background image, you can see what I'm talking about.

I, myself, have been trying to figure this method out. For optimization purposes, the images are just slices on the screen which are repeated for the duration of the panel. I know how to do the overall background but the panels have eluded me up.

I think it is a table surrounding the panel but I'm not sure.

I agree with alot of the other posts in that it is a little plain, which is fine depending on the look you are going for. I also agree that the header needs some work, in addition to being too big, the title Java Script Games needs some work. If you are intentionally overlaping the text it should all be equal or it will looks sloppy and unfinished, you also might consider another font or stlye instead of the large and small caps. It is overall a good starting point but it needs more work on the details.
How To Create A Website
If you are new to web design and would like to create a website, this section is for you. Creating a website from scratch can be daunting for beginners, especially for someone who has no or little experience with the internet. For the first time, the Sitecritic team has put together a guide for people who want to create a website but do not know how to go about doing it. If you like, you can call this guide "Website Creation For Idiots".

The objective of our tutorial is to guide you through the complicated process of creating a website without doing any programming.

After you have created the website, you can always go back and add more advance features to your site or refine your webpages anytime.

Getting The Mindset Right
Firstly, you must know what you want to do with the website. Do you want to create a website for fun or for business? Do you intend to make money out of it? If you are serious about website creation, you must be prepared to invest at least $150 USD even if you are to design your own website. Why $150? For domain hosting and registration. If you just want to play around, you can get free domains easily by just googling for 'free domains'. Domain registration and hosting will be discussed more later.

There may be times when our guide may be different from the norm. It is hard for us to explain everything in every step and we do not want to complicate you with new terms. As mentioned, this "How To Create A Website" guide is for beginners. Therefore in every step, we try to be as brief as possible without using too many computer jargons. If you are stucked because of certain concepts, the first website you should visit is (This is one of those websites that you have to remember). Our article section is a also good resource for web design and internet technologies.

Software That You Must Install
We strongly encourage you to install 3 free software before you start. They are the Google toolbar, Alexa Toolbar and Firefox browser. You can download Google's toolbar from, Alexa toolbar from and firefox browser from

Google pagerank(PR) is an estimate of how important a website is to the google search engine. Many people believe that the higher the page rank, the better your website will be ranked in the google search engine results (This is still debatable at the time of writting). Alexa ranking gives you an estimate of the traffic of a website; The higher the traffic, the lower the figure. for example, has an alexa ranking of 1 for a long time already. Though not accurate, many people still use it as a gauge of the performance of a website. It works by giving a website a vote everytime someone with alexa installed visited the site. You will need to use these toolbars when doing search engine optimisation.

Why Firefox browser? Firefox is the next most popular browser after Internet Explorer. When designing your website, you want it to look correct both in IE and Firefox. This is the aesthetic part.

Website Creation Quick Summary
To let you have an overview of what is happening, we have summarised "How to create a website" in 6 steps:

1. Keyword research and how to choose good keywords
2. Buy a domain name and a hosting package.
3. Create your web pages.
4. Upload your website.
5. Optimize your site for search engines.
6. Monitor your website traffic.
The seven (7) step method
    Step 1

Web Design

What will your web site look like and what features will it contain? Write it down on paper using a stepwise approach:

Features List
Layout & Navigation
Keyword Analysis
Artistic Preference
    Step 2

Bandwidth & Web Space Requirements Analysis

What will it take in terms of web hosting to accommodate the web design in Step 1? Estimate the host disk space and monthly traffic requirements. We provide formulas, calculators and examples. How will you create the web pages? Web authoring software options examined.

    Step 3

Domain Name Registration

Do you need one? Effective domain name selection and domain name registration procedures. Price comparisons.

    Step 4

Web Hosting

Choose a web hosting service that meets your web site design requirements in Step 2. Web host comparisons, criteria driven searches, expert reviews, QA process.

    Step 5

Web Development

Build the web pages. Method depends upon decisions reached in Step 2. Expert guides to coding, testing, validating, uploading, performance concerns.

    Step 6

Web Site Promotion

Get your web site indexed. Search engine promotion and submission strategies. Proper keyword selection. Search engine ranking and web site optimization rules.

    Step 7

Web Site Maintenance

Ongoing web site promotion, traffic analysis, web site performance, links testing, popularity testing, host performance.
everfine99 thanks its very nice tips with 7 great steps its very useful to me
its kinda boring
Related topics
New design of the home page
Donutey, Version 3 New site, please give feedback
new design - opinions?
feedback on my new design!!
Amazing concept! Looking for guides!
Boffel Production with new site design!
Feedback on new design for client... own little hobby website
Absolutely New Design
Desktop Contest - please review!
Please Review my Blog and Please follow it
Reply to topic    Frihost Forum Index -> Webmaster and Internet -> Design Tips

© 2005-2011 Frihost, forums powered by phpBB.