Grade My Site!

[Pracht]

Hello all,

I was recently hired to make a simple, clean site for a small business that builds pools. Being my first project, I tend to be hard on myself about its quality.

I would greatly appreciate any feedback, browser compatibility issues, etc.

Thank you for any time!

http://www.ecolopackpools.com

Pracht

 

[Apple OC]

Logo needs to be bigger ... not bad for your first project.

cheers

 

[v66jack]

Yep logo needs to be bigger I agree.

Also maybe make the header a bit more graphically exciting, a list of bullets looks a bit dull. Maybe jazz it up a bit with some photos. Just out of interest did you write the code yourself or use something like dreamweaver? I can't see the code because im on an iPad.

But good project for your first site.

 

[AFPoster]

Great for your first site, I agree logo needs to be bigger, any chance you can retake some of those photos as well to make them crisp & clear like HD.

 

[Pracht]

Wirelessly posted (Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_3 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/5.0.2 Mobile/8F190 Safari/6533.18.5)

Thanks for the kind comments!

Unfortunately all of the things you guys noticed (the boring header, unclear photos, etc) are out of my control, as it's exactly as the company wants it.

It makes me cringe a bit but what can you do? They're satisfied.

Also v66jack, I coded it by hand. I often find things like dreamweaver to just confuse me even more haha.

 

[harpster]

This could be improved in so many ways... I know it's your first project but it looks unfinished. Here's come general comments.

1. The graphics are awful. Photos are blurry and the artwork like the logo is of poor quality. Just improving these items will make the site more professional.

2. When you click Home, then Gutters do you see the header jump. This is a common beginner thing I see a lot... you should not see the header jump around when you click on the nav buttons. It only seems to happen between the Home and other nav links.

3. Too much Centered text and pretty much all the same size.

4. Header is boring, boring... if you did some nice design comps I think the company would like something better then what you got there. Have you studied the competitors sites?

5. The square bullets in the header could be replaced with something a lot nicer. Everything doesn't need to be done in html. You could do a nice graphic is Photoshop showing the features and put it in there.

6. No margin/ padding at the bottom of the page.

It's a good start but I wouldn't stop here... there is a lot of room for improvement and won't take too much work to make this a lot more appealing site.

 

[Consultant]

As it's been said, there are lots of "areas to improve." Examples:

Logo does not go to home page. (should link)
Requires scrolling on 1024 displays. (should not)
Add tagline with focus / location.

I would use a CMS such as wordpress f or something much more usable.

 

[Laird Knox]

Add the company name to the title. When I look at the tabs in my browser it just says "Home" - make it something like "Ecolo•O•Pack Home" or "Ecolo-O-Pack Home".

Ecolo? Ewe, sounds like a virus.

 

[staciejortega]

you should add more images or designs to make you site more exciting

 

[ezekielrage_99]

For a first try it's not too bad, I would suggest the following for improvements

1) Check the alignment
2) Align the designs to a grid
3) Use higher quality images (and format them for the web)
4) Learn Wordpress, iWeb is good for a home thing but I would strongly suggest that it's not good enough for a business site because it lacks functionality.

 

[Pracht]

Requires scrolling on 1024 displays. (should not)
Add tagline with focus / location.

I would use a CMS such as wordpress f or something much more usable.

Would you mind elaborating on these two suggestions? I'm not sure I understand

1) Check the alignment
2) Align the designs to a grid
3) Use higher quality images (and format them for the web)

What do you mean with #1 and #2? The only alignment issues I've found is when viewing it on a mobile device the header gets slightly skewed... I'm working on it.

Unfortunately, the images, logos, bullets, colors, layout, etc. are almost entirely out of my hands. I've proposed other ideas (asking for better pictures, etc) and have been shot down.

The main issue is that all of their pictures are either tiny digital copies or physical copies that look poor when attempting to make them digital.

This is a company that for the most part has only used computers for basic accounting. Even email is not commonly used for clients. Consider that the logo on the site is a scan of a business card

For what they've spent on it (I've way under-charged and comped a lot of hours) it seems to fit what they had in mind. I think they feel like the only people seeing the site will be blue collar, dirty, hardworking men who wouldn't notice a slight blur in images or too much centered text.

A lot of people have suggested wordpress and other tools, but for what I'm (They're) aiming for, is there really much to gain from it?

Thanks again for your time and suggestions, and putting up with the fact that I am an amateur

 

[Apple OC]

The logo must have existed when they printed the business cards.

Ask them if they can get you that logo? It probably lives as a Vector file somewhere.

A bigger logo would make it look much better.

 

[cwalker107]

Code Anyone

I took the liberty of going into your HTML formatting. Here are some things I noticed.

• Have you thought of switching to an all CSS layout. Although, table layouts can still be used, it is still best to use a CSS design with DIVs or SPANs.
• I noticed you have a linked CSS file however you still have attributes in some DIVs that can be changed with external or inline CSS. For example: The contact information at the bottom of the page. <div align="center">---</div>. Also the align attribute for DIV and any HTML tag is deprecated.
• You use a lot of BR tags. This could be avoided by adding some <P> tags around your main content blocks.
• Also along with <BR> tags, to comply with XHTML standards, all HTML tags that do not require a closing tag (i.e. <BR>) should end with a />, so <BR> would become <BR />.
• Image file names should not contain spaces as some earlier HTML parsers in web browsers cannot read the space.
• Also, <IMG> tag "alt" attributes should contain a little more description.
• Your main table for the layout is missing a summary attribute.

Other than those things in the code and things listed by other viewers above, good first public website.

I would like to caveat and stress the importance of good quality images though. If a grainy, possibly scanned photograph is the first impression a customer sees coming to the website it could throw them for a loop if they continue to a business with high quality images of their pool handiwork.

 

[ezekielrage_99]

What do you mean with #1 and #2? The only alignment issues I've found is when viewing it on a mobile device the header gets slightly skewed... I'm working on it.

Grid Based Design Article via Smashing
Design by Grid

Those are the best examples of design to a grid I can think of... The idea being you design to a defined structure, this will give your site a far more professional feel and logical order. I really think you could create the site on 3 pages without loosing anything.

Unfortunately, the images, logos, bullets, colors, layout, etc. are almost entirely out of my hands. I've proposed other ideas (asking for better pictures, etc) and have been shot down.

I've been in this situation before, the issue being the currently supplied graphics are just not professional or suited to the brand. Though it does sound like they are married to them which will make it impossible to change.

 

[Consultant]

Would you mind elaborating on these two suggestions? I'm not sure I understand

As it's been said, there are lots of "areas to improve." Examples:

1) Logo does not go to home page. (should link)
2) Requires scrolling on 1024 displays. (should not)
3) Add tagline with focus / location.

I would use a CMS such as wordpress f or something much more usable.

1) logo on site.com/page should go to site.com
2) set your display to 1024. site requires horizontal scrolling
3) Under logo it should say: Serving XYZ at Location or something like that.