Another website critique please

Soldato
Joined
1 Nov 2008
Posts
4,537
My one this time. I've been working on it slowly for the last couple of months and it's nearing a stage that I'll be happy with it although I still have a few things in mind that I want to alter.

It was built in Squarespace as my coding from scratch isn't quite up to scratch yet and it allows me to easily edit and modify things. Eventually I hope to convert the whole thing to a Wordpress site and host it on my own server.

One thing I'm not 100% happy with is the bike on the banner image, I've got quite a good quality version of the image in PS, but when I save it with transparency I still get white bits around the bike at this smaller resolution, which makes it look a bit messy IMO. Any suggestions on how to fix that?

All of the graphics on the site were done by myself (apart from the blog post images and exhibition image in the news section) in an effort to help teach myself Photoshop and learn some skills.
 
Last edited:
I like the design. The problem with your bicycle image is the matte. Try using a png24 instead of GIF, prob be the easiest solution.

Validation for having inline JavaScript and the document type being strict. You aren't allowed iframes, and anchors aren't allowed targets in strict. You would need to change it to transitional. To fix it in strict you would need to use JavaScript to open links in a new window/tab, and a server side include to fix the iframe. The error "Line 735, Column 390: there is no attribute "allowTransparency"" You can fix by changing the source to '...style="border:none; overflow:hidden; width:185px; height:62px;" allowTransparency=true;">' allowTransparency needs to be in the style or a css file to validate. I didn't spend the time going through the JS tbh.

You would be better off starting ground up if you are going to convert it yourself to WordPress, else it might be better to send a PSD to someone and have them convert it. If building HTML/CSS ground up was a bit of a challenge then making it a WP theme will be quite a challenge. If you give someone the code produced from the site builder, they might not like it, I know I wouldn't, there are a few "what the hell" bits of code you often get from site builders, and would need tidied up a lot. It would be easier for someone to build it ground up for WP, instead of sifting through the source code and fixing things.

There is also a few spelling mistakes i noticed through the site, you should always try get a couple of people to proof read everything before publishing.

There is a 404 on a link to /shop. Are you intending on setting up an ecommerce site? There are a few things missing on your site to comply with the law, T&C's etc. you would need to address them issues too.

If you were making an ecommerce site, it would be better to have a user sign up, in which case you could make the "upload" link only available to users signed in. Although you are going through rapidshare, you do accept .rar files, for your own security, it would be better to allow only registered users to upload, or limit the upload to image files only as you might extract something pretty nasty on your comp.

Do you already have a server running for something else? Or are you thinking it would be better to host your own? I would personally suggest you stick to some reliable hosting. It is actually a lot cheaper in the long run, and easier on yourself. From bandwidth, server maintenance, electricity, etc. All the cost and hassles do start to add up.
 
Thanks for taking the time to post such a reply!

WRT the image - will have a mess in PS this afternoon and check that out to see if it eliminates the white edges.

WRT the JavaScript I don't think I've personally inserted any into the page at the moment, so it's probably Sqarespace code. I did mess around with some a week or so back, I was trying to get it so that the side bar scrolls with the page. I managed to find a css adjustment that fixed it absolute and scrolled, but I want to get it so that it scrolls to the top of the page first until the top banner disappears and then sticks to the top as you scroll down. I couldn't get it working in the end so I decided to leave it until I convert it so I have 100% control over the code.

TBH I may give it a go from scratch in the next week or so, but the idea of converting it to Wordpress was so that my front page blog and news sections would be easy to setup and then maintain for there on out.

Indeed there is a shop page, it's been disabled for now while I was working on it and getting a few products to put up, which is why the link is broken, plus the prices aren't all completely accurate right now. I've just gone and re-enabled it so you can see what it like and get the gist of it. TBH I don't expect to do much, if any business through the shop online as 99% of the business is local to students at the Uni who call direct, it was more of an exercise for myself and a way of displaying some local artists work on the site.

I do have a server, I've got a Site 5 Host Pro + Turbo account which I use to host several other very basic sites that I have at the moment.

Also - do you remember where you spotted the spelling mistakes? I've re-read the site numerous times recently but I must have missed them! It's probably not the best thing getting my dyslexic house mate to proofread :/ ;)
 
Last edited:
No need for the background image to be a png.

Looking pretty good..

Kk

Nothing special but it works.

Got a few validation errors though :)

http://validator.w3.org/check?uri=h...e=Inline&group=0&user-agent=W3C_Validator/1.2

Yeah, it's not revolutionary, but functional! The most important part of the site for me is the file uploader and probably the main reason that anyone really visits apart from checking prices occasionally.

I'm not sure how much control I can have over the validation errors seeing as the majority of the code is SquareSpace controlled. I just submit the content and a just a tiny amount of other code snippets right now.
 
Your background image is painful to load, its 800KB, most of it is hidden from view and crawls down my screen :)

Maybe you could use two images on left and right of the content wrapper div instead of as a background, then change it to jpeg and reduce the export quality.
 
If you are wanting to use WordPress, then I would recommend stopping with the builder you are using now. The basic layout of your website is very popular, and with a little searching you will more than likely find a decent free WordPress theme you can customise yourself.

800 is a little big for a background, I have seen worse, though. You will need to change it from indexed color to RGB in photoshop first, though. That should get it to an acceptable size. You could even look at Optipng if you wanted to help optimise your images further.

If you need help then just ask, can usually spare some time. But I would recommend finding a free WordPress theme and modifying it from there, if that is what you want to use. No point beating around the bush. The hard part is constructing the theme, modifying a prebuilt one is pretty easy, if the license allows you to modify it, pretty sure it will, though.

There are a lot of ecommerce plug ins for WordPress I have read about too. I haven't used any of these yet to be honest with you, but sure you will find something good.

If the site is just used for uploading and checking prices, then consider doing a little marketing. If you are at uni yourself, then I am sure you will have friends from school at different universities. Ask them to spread the word. There is a lot of free promotional things you could do to start attracting customers from further afield and start using the site

The spelling mistakes...
Home Page - “stand...one creatve approach to a university” - creative
News Page - “adue” - I'm pretty sure its spaced “a due”
File Prep Page - “ Gloss and rolled cartidge can be printed” - cartridge
Main Prices Page - “ 1.5m wide guillotene a huge (capable” - guillotine
Student Prices Page – As above
Portfolio Printing Page - “ a time contraint or tied” - constraint
Shop Page - “ we can also accomodate this” - accommodate
Gallery Page - “If your're a digital “ - you're
 
I was aware of the large size of the background image but wasn't sure how to get it smaller - will try the above tips to try and reduce it.

Right, I think this is the kick in the butt I needed to just go for it with Wordpress, will start working on it tonight!

And OMG about the spelling mistakes, I guess when you re-read something too often it's easy to miss things like that. Will get that sorted!

3dcandy - main reason is because I'm already paying for hosting elsewhere, so it would save me $20 a month not having to pay SquareSpace.
 
WRT to the marketing too Mulac, I've been flyring campus quite a lot - it's handy being able to print my own :D Which is pretty effective, word of mouth is very effective too. Recently I've found Facebook is absolutely invaluable though, the friend suggester comes into play big time. I've created a fbook page too on which we run monthly competitions now to enourage people to like it and spread the word.
The main idea behind the blog post on the site too is to allow us to regularly update our fbook friend and page with posts that will appear in newsfeeds regularly without beeing spammy, plus hopefully sharing appealing articles with our customer base that they actually want to read, thereby encouraging traffic to the site.
 
Right, images sorted now, fixed the white around the bike - using PNG24 sorted it!

Also the background image has been shrunk down to 237Kb - hopefully a bit more reasonable :)

Edit: Just altered the skype button too so it fits in a bit better with the colour scheme.
 
Last edited:
I discovered a site called Woopra today, recommended by a buddy. A quick JS snippet enables some pretty cool tracking and analytics features - but even cooler is a live chat widget that you can install to the site.
I've just set it up and it seems to be working brilliantly, I definitely recommend it at first impressions!

www.woopra.com
 
I'm having trouble centering the like button in the sidebar.
It's an iframe and I've tried adding the align="middle" attribute and it doesn't seem to work, i've also tried surrounding the iframe with <div align="center"> </div> tags and that doesn't seem to work either, any ideas?
 
Generally it looks pretty good. A couple of things I'd pick out:

The border which you have around the 'news just in' image doesn't work for me. The gradient looks a bit strange combined with the background colour. I'd make the border a solid colour, but that's really just personal choice.

The text alignment in the posts doesn't look quite right to me. The gap after each post is too small and the gap between the post title and the post is too big. The first image below is what you have at the moment. The second is how I'd have it.
1.png


2.png
 
Okay here's my two cents on the design, when the page first loaded the big logo came up and it took me about 2/3 seconds to understand what it said (may be my slow brain today) but if it was me I would like the viewer to know the brand name instantly!

Secondly, with the upload, subscribe link area, I think the font size and padding of the text in the grey boxes should be consistent otherwise they look out of place.

Also the "like" and "call me" buttons are not aligned in the middle and ones left which causes some distractions with the eyes. I don't know about the navigation but have you tried to aligned to the left or have the links fill up the whole navigation area?

I know this is nit picking anyway's so you can ignore it if you want xD I think its a lovely simple design :) Good luck!
 
Generally it looks pretty good. A couple of things I'd pick out:

The border which you have around the 'news just in' image doesn't work for me. The gradient looks a bit strange combined with the background colour. I'd make the border a solid colour, but that's really just personal choice.

The text alignment in the posts doesn't look quite right to me. The gap after each post is too small and the gap between the post title and the post is too big. The first image below is what you have at the moment. The second is how I'd have it.

Thanks for the feedback Mattus. The border was me being experimental in photoshop, I'm planning to chance the image in the 7 days so will experiment with a different one for that!

The text alignment you picked up on is interesting as that's all header content, the first actual 'post' is the third title (currently 'Pick a line...')
So that entire block was created in the WYSIWYG Squarespace editor and then the colour changed in HTML mode, this is the code so I'm not sure if I can ammend it much for that little spacing?

Okay here's my two cents on the design, when the page first loaded the big logo came up and it took me about 2/3 seconds to understand what it said (may be my slow brain today) but if it was me I would like the viewer to know the brand name instantly!

Fair point! It is a little bit OTT but most people get the name from the posters on campus or facebook already so know who it is when arriving on the site, will bear it in mind if we redesign though :)

Secondly, with the upload, subscribe link area, I think the font size and padding of the text in the grey boxes should be consistent otherwise they look out of place.

Hmmm...I know what you mean. Initially there was only the 'Upload' button and we wanted it big as for the majority of people the call up and I instruct them to visit the site and upload, so we wanted to to be big and easy to find then click, then I added the matching 'Like' button to relate to the facebook button - but I couldn't fit all the text in at the same size and the 'Subscribe' one came only after I setup the subscribe page later on. I've rearranged them in size ascending order if that's any good? lol I will redesign them with better edge padding this week though, it doesn't look good now you mention it.

Also the "like" and "call me" buttons are not aligned in the middle and ones left which causes some distractions with the eyes. I don't know about the navigation but have you tried to aligned to the left or have the links fill up the whole navigation area?

Now aligned! :) I was having trouble centering the like button until I realised I'd specified the iframe the button is in to be the width of the whole sidebar, hence it wouldn't centre! But all sorted now.

I know this is nit picking anyway's so you can ignore it if you want xD I think its a lovely simple design :) Good luck!

Thanks for the feedback! It's all appreciated :D
 
Last edited:
No problem :D Looks better now! I'm a perfectionist now thanks to some womanly member of my family when designing stuff for her -.-
 
I just wanted to say a quick thank you to everyone who has contributed with the feedback and suggestions with my site so far.

We contacted somebody about providing printing for an architecture competition 2 days ago and I'm convinced that our website (in conjunction with our competitive price I'm sure) contributed to us becoming a recommended printer of choice even though we're based in a completely different city. This in turn turned into a HUGE amount of business (for us anyway) in the last 24 hours, and the single Paypal checkout button (installed specifically for this purpose in about 10 minutes) at the top of the shop has worked flawlessly for accepting payments.

So anyway, cheers guys! :D
Once the rush dies down it'll be time to improve it even more! ;)
 
Back
Top Bottom