• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

My new portfolio is finally up!

Hi, just wondering what you think? I've still got to add a few bits and pieces, and there's a couple of projects on the front page I will replace, but for all intents and purposes it's finally done :)

does anyone know some kind of CSS code to refresh the site when you click on one of the links at the top as the previously viewed image currently sticks around... or if there's a better way of doing this kind of thing, I'm open to suggestions :)

I specialise in print so websites aren't my forté... but I'm pretty happy with it

Nik Handson : Graphic Design


ohh... and if anyone might be able to help me with adding custom scrollbars that work in FF, that'd be awesome too


Senior Member
Hi Nik, nice to see a fellow designer more interested in print than web.

One thing that really stands out on your portfolio is the green. It's too vivid. Too blinding. Consider toning it down a little, especially for your links.

I like the fact that you have your showcase as your first page. The less clicks I have to make to get to your work the better.

Consider giving just a quick sentence or two about each project. Who was it for? What were their requirements? Why did you do it the way you've done it?

One thing that's missing for a professional graphic designer is a logo. It doesn't have to be anything over the top, but some sort of mark would be nice to be able to distinguish you from everyone one.

Aside from that, while it's a basic website, it does the job of communicating your work well.
Hi Nik,

The green is too bright for me in the navigation. Maybe tone it down, or change the color of the navigation to make it stand out a bit more?

I like the change of structure from your last portfolio site. It's straight to the point now, with your work being more in focus. I think your work is excellent and I like the way you've displayed it.

Custom scrollbars are not part of the CSS standard and, as far as I know, there are no ways of getting them to work cross browser.

I love the animated favicon :up:
cheers guys... I see what you're saying about the green, it looked fine on my monitors at home and on the missus' laptop, but at work it did look a bit bright, so it could just be down to certain monitor screen configurations... but i'll edit it to make it a bit darker when I continue with it next week.

glad you guys are liking my work... I'm going to add another line to the showcase page so the work is a 5x5 square... hopefully that won't be too much, but I need to show off a few booklets/magazines/brochures I've done.

I'm not quite sure the best way to add a project spec with this design as the thumbnails open as an image in a separate frame. Anyone know of some kind of code I can add to the image link that would rectify this? I'd like to steer clear of having the images open in a separate webpage in the frame because I want to keep the site as simple as possible in terms of updating and amount of files I have to deal with :)

I'm not sure about a logo for myself, I've dabbled with them before, but I get bored of them after a while and they don't always lend themselves to a new style when I develop one... I'd like to keep myself as less of a brand and more of a blank canvas as I'm looking to work for a new company at the moment, rather than go freelance entirely. I'd like to have my work speak for itself, rather than be associated with a brand, but I can appreciate where you're coming from :)

Also, I found this re: custom scroll bars, but I can't gte it to work properly... anyone have some advice? Many thanks for all the feedback, it's much appreciated :)

fleXcroll: Cross Browser Custom ScrollBar script by Hesido


Active Member
Hey Nik,

I would stay away from trying to change the user interface, typically end users are so used to seeing the default scollbars that any changes to their appearance is often detrimental to the web page / site

as for the page refresh and removing the last seen portfolio/image this should be easy to achieve with a little javascript.

If you think the site still looks cool with the standard scrollbars I guess I'll leave them, but I'll definitely look into the java next week :)

Hey Matt, I'm currently living in Bognor, but of course I know Chi well! The guys at Thursdays are great to work with as they give me free reign to do whatever I like and really put their trust in me and I'm happy I've never disappointed them :p ... typically flyers don't bring in much money, but they're definitely projects with the most fun involved for me. Whereabouts are you based/from? You living in Chi or moved to London?
you've got some great work up on your site, are you freelancing or working for a company? I'm looking to move up to London asap. I wasn't able to find work in London after I graduated in 2003, so I freelanced back home and then worked for a small Design & Print company where I am at present. If you have any advice or are able to give me any leads that'd be awesome :)


Senior Member
oh, one thing...

On your contact page, I clicked a printing service link and it opened it in the frame where you put the thumbnail pics. think you meant to put _blank as the target. Think, meaning, know. lol
Ta very much Nik. In terms of advice it's going to be the same as I'm sure you've heard already—keep sending the portfolio out, something will bite soon enough.

I've not heard it mentioned much on this forum, but you may also want to consider sending your folio etc. to other design agencies/consultancies as many employ freelancers when they're busy enough. Whoring yourself out to small companies with tiny budgets is hard—and frankly crap—work, get onto a few of the bigger agencies' or consultancies' books as a freelancer and let them get the work in and you just turn up and do what you do best. You'll invariably end up working on much bigger and more exciting jobs than you could ever get on your own. Many freelancers I know only work for a small handful of studios, but practically on full time hours charging £250/£300 per day.

P.S. My avatar is deadly serious and I'm offended that anyone thought otherwise.


Active Member
Hay buddy I cant view any pages in IE7 so you may want to look at that.
Any way a few issues I noticed.

You have an issue where you have 2 versions of your site, this hurts your rankings in the search engines.

One version is under www. and the other is under the non www. version. To get round it you need to implament a 301 redirect.

To do that create a plain text file and name it .htaccess and place this code in it ~

RewriteEngine On
RewriteCond %{HTTP_HOST} !^www\.nikhandson\.co\.uk [nc]
RewriteRule ^(.*)$ http://www.nikhandson.co.uk/$1 [R=301,L]

Upload that file to your root directory.

You use a lot of spacer images.

<td><img src="img/spacer.gif" width="398" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="127" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="71" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="13" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="76" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="13" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="93" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="11" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="48" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="14" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="62" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="14" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="41" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="19" height="1" border="0" alt="" /></td>
<td><img src="img/spacer.gif" width="1" height="1" border="0" alt="" /></td>

Now it has been a while since I have needed to use a table layout, but I'm pretty sure you could replace all that with

<td colspan="15" id="space"></td>


Also all your images can be reduced by placing them in CSS.
So for example rather than having


Write ~
a img{border:1px solid #FFF}

By doing that you would reduce a massive amount of code bloat and would only need a fraction of the code you have currently used.

I would personally replace your current html tag with
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

As that is more correct TBH.

You also have your entire navigation in images which is a bit mad really as they are just simple words and would be better spelt out for the search engines but as your alt attributes are currenlty blank all a blind user will here is


When they should hear

[link1] showcase
[link2] cataloge etc....

But again this code ~

<td rowspan="2" colspan="2"><img name="index_r2_c1" src="img/index_r2_c1.jpg" width="525" height="82" border="0" id="index_r2_c1" alt="" /></td>
<td><a href="showcase.html" target="contentframe1"><img name="linkshowcase" src="img/linkshowcase.jpg" width="71" height="16" border="0" /></a></td>
<td rowspan="2"><img name="index_r2_c4" src="img/index_r2_c4.jpg" width="13" height="82" border="0" id="index_r2_c4" alt="" /></td>
<td><a href="catalogue.html" target="contentframe1"><img name="linkcatalogue" src="img/linkcatalogue.jpg" width="76" height="16" border="0"></a></td>
<td rowspan="2"><img name="index_r2_c6" src="img/index_r2_c6.jpg" width="13" height="82" border="0" id="index_r2_c6" alt="" /></td>
<td><a href="photography.html" target="contentframe1"><img name="linkphotography" src="img/linkphotography.jpg" width="93" height="16" border="0"></a></td>
<td rowspan="2"><img name="index_r2_c8" src="img/index_r2_c8.jpg" width="11" height="82" border="0" id="index_r2_c8" alt="" /></td>
<td><a href="about.html" target="contentframe1"><img name="linkabout" src="img/linkabout.jpg" width="48" height="16" border="0"></a></td>
<td rowspan="2"><img name="index_r2_c10" src="img/index_r2_c10.jpg" width="14" height="82" border="0" id="index_r2_c10" alt="" /></td>
<td><a href="contact.html" target="contentframe1"><img name="linkcontact" src="img/linkcontact.jpg" width="62" height="16" border="0"></a></td>
<td rowspan="2"><img name="index_r2_c12" src="img/index_r2_c12.jpg" width="14" height="82" border="0" id="index_r2_c12" alt="" /></td>
<td><a href="links.html" target="contentframe1"><img name="linklinks" src="img/linklinks.jpg" width="41" height="16" border="0"></a></td>
<td rowspan="2"><img name="index_r2_c14" src="img/index_r2_c14.jpg" width="19" height="82" border="0" id="index_r2_c14" alt="" /></td>
<td><img src="img/spacer.gif" width="1" height="16" border="0" alt="" /></td>

Would be better replaced with

<td rowspan="2" colspan="14">
<li><a href="showcase.html" target="contentframe1">Showcase</a></li>
<li><a href="catalogue.html" target="contentframe1">Catalogue</li>
<li><a href="photography.html" target="contentframe1">Photography</a></li>
<li><a href="about.html" target="contentframe1">About</a></li>
<li><a href="contact.html" target="contentframe1">Contact us</a></li>
<li>><a href="links.html" target="contentframe1">Links</a></li>

li{float:left;background:url(../img/index_r2_c12.jpg") no-repeat;padding-left:20px}

Maybe a bit of fidding would be needed but the amount of code would be hugely reduced which makes maintance so much easier.

Your title element should be Nik Handson : Graphic Designer in London

Fill in where you live as that would mean you would have a better chance of ranking for anyone looking for a graphic designer near you, no offence but I doubt you will rank in the top 10 for graphic design, and even if you did the people looking at graphic design would more than likley be graphic design students and not potential clients.

Some one looking for a graphic designer will search for graphic designer so that is the term you want to rank for.

Now TBH the other thing you are missing is a H1 tag, this is still very important from a SEO point of view. Now as you have your three images split up making you logo I would say that the best place to put it would be on this line ~

<td colspan="14"><img name="index_r1_c1" src="img/index_r1_c1.jpg" width="1000" height="20" border="0" id="index_r1_c1" alt="" /></td>

I would replace that with ~

<td colspan="14"><h1><img name="index_r1_c1" src="img/index_r1_c1.jpg" alt="Nic Henderson Graphic design" /></h1></td>


Then add all the rules under #index_r1_c1 in your CSS sheet to the end.

However I would rename it Nic Henderson Graphic designer based in London.

However to not be penalized in the search engines the image would need to say the same as well.

Not entirely sure why everything is named, that is a depricted tag and unless you need it for the Javascript which I haven't looked at they can all be removed.

All of that should only give you a few lines of code for your home page, better accessability, better keyword prominance for the search engines, faster load time, move effective rankings and a better chance to rank in higher search results positions.

With out seeing the other pages thats all I can comment on at the mo.


Red ~ Mod_rewrite
Purple ~ XHTML
Green ~ Screen reader output
Blue ~ CSS