Website review - personal website
Moderator: General Moderators
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
Website review - personal website
Hi.
I've just finished with my personal website.
Any input on any aspect of the site would be appreciated.
http://www.jamieshields.co.uk
I've just finished with my personal website.
Any input on any aspect of the site would be appreciated.
http://www.jamieshields.co.uk
Re: Website review - personal website
max-width should be set. On 1920x1200 it's hard to read so long texts.
In portfolio provide sreenshots for projects which are not live (or even better for all).
Captcha, are you serious? I understand need for it if form content is posted online, but for contact form in my opinion that's too much.
Your main page is empty, while that's probably most important page, see http://www.smashingmagazine.com/2009/02 ... o-website/ for some ideas.
I like clean design.
In portfolio provide sreenshots for projects which are not live (or even better for all).
Captcha, are you serious? I understand need for it if form content is posted online, but for contact form in my opinion that's too much.
Your main page is empty, while that's probably most important page, see http://www.smashingmagazine.com/2009/02 ... o-website/ for some ideas.
I like clean design.
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
Re: Website review - personal website
Thanks for the input.
Good idea. What max-width would you recommend? And should I leave everything left aligned if a max-width is set?kaszu wrote:max-width should be set. On 1920x1200 it's hard to read so long texts.
I don't quite know what you mean by that. I do provide screenshots for the projects which aren't live?kaszu wrote:In portfolio provide sreenshots for projects which are not live (or even better for all).
Maybe you're right here. I'd like other input on this. I have had bad experience with (non-CAPTCHAd) contact forms in the past so wanted to make sure this one didn't go down the same path.kaszu wrote:Captcha, are you serious? I understand need for it if form content is posted online, but for contact form in my opinion that's too much.
You're probably right on this too. I couldn't think of anything relevant to add. Do you think I should transform it into an about me page? I can't think of much information I could provide which isn't already on the CV.kaszu wrote:Your main page is empty, while that's probably most important page
Thanks for that, it was a good read. I'll definitely implement the obvious, easy ideas that are suggested there. I think the tag line idea is something I definitely missed.kaszu wrote:see http://www.smashingmagazine.com/2009/02 ... o-website/ for some ideas.
Re: Website review - personal website
Max width I think shouldn't exceed 1280px - chrome - small padding of ~5% on each side = ~ 1100px. Page should be aligned center.
By screenshots I mean actual full screen screenshots (not larger than 1024x768) to show how different sections/pages of full website looks like, not just small left top corner.
); something other? What you want people to do when they visit your site: visit again; hire you; emm.... something?
First page is a first impression and if designed poorly then most likely the last and people won't event visit other pages.
There are a lot of articles about promotion, web design, etc.
http://sitepoint.com
http://alistapart.com
http://smashingmagazine.com (for ideas, sometimes I disagree with their recommendations)
By screenshots I mean actual full screen screenshots (not larger than 1024x768) to show how different sections/pages of full website looks like, not just small left top corner.
Ask yourself, why do you made this website? Do you want to promote your skills to get a job / contracts (then examples of portfolio, short contact form / call to action button or link, something what would make them to want to contact you); is it a blog (it's not a blog obviouslyYou're probably right on this too. I couldn't think of anything relevant to add. Do you think I should transform it into an about me page? I can't think of much information I could provide which isn't already on the CV.
First page is a first impression and if designed poorly then most likely the last and people won't event visit other pages.
There are a lot of articles about promotion, web design, etc.
http://sitepoint.com
http://alistapart.com
http://smashingmagazine.com (for ideas, sometimes I disagree with their recommendations)
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
Re: Website review - personal website
That's funny. I've already gone ahead and changed the max-width to 1100px with center alignmentkaszu wrote:Max width I think shouldn't exceed 1280px - chrome - small padding of ~5% on each side = ~ 1100px. Page should be aligned center.
Thanks for the rest of your input. I definitely need to brainstorm over what else to include on the home page. Maybe one of those "Web 2.0" "call to action" buttons that you/the article mentioned - to push people along to the other, more content-heavy pages.
Re: Website review - personal website
Design:
It doesn't show off what you can do.
Where's the glitz? Where's the fancy <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span>? Where's the stuff that I can visit your website and say to myself "hey, that's <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span> cool, I can sell that to my clients! Better recruit him so he can write that for me!". Why aren't the tabs done with JQuery UI loading the content with AJAX (while still degrading back to how it works now)? Why isn't the form using CSS focus pseudo classes? Can you use Flash? Make some little widget or other. Show me. Can you use an API? Pop in a news feed or some Twitter crap. Show me.
Trust me, that's the sort of thing that makes your site stand out just a little more than the next CV. Unless the next CV is mine, in which case you're <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span>.
- Neutral colour scheme. It's easy to read, which is good, but it's also a little boring. Fair enough if you're not a designer, but try playing with something like http://colorschemedesigner.com/ for some ideas. A few spots of colour will add a lot.
- Masses of whitespace. There's a HUGE chunk of whitespace beneath the content on the index page. It looks very empty. Do you really need the portfolio stuff on a separate page? Why not put those links on the homepage?
- Scrollbar Shuffle. The index content being short means there's no scroll bar. The CV page is long so there is. Consequently the navigation 'dances' as you move from page to page. Use CSS to force the scrollbar to be there all the time.
- The portfolio boxes. The boxes in the portfolio page should be exactly 1/3 of the width (minus spacing) so there isn't whitespace at the right.
- The contact form. That form is very, very basic. It could really use some styling.
- Good accessibility. Overall the site ticks all the boxes for accessibility. Impressive stuff, nice one.
- Validation on contact form. Good use of server-side validation, but I would prefer to see some JS validation as well to save a round trip to the server for obvious stuff.
- Required elements. There's no indication on the contact form which fields are required. There should be.
- Email addresses. Your reference's email addresses aren't links, they should be. You can use clientside scripting to make them links in order to avoid spam crawlers. They'll degrade back to what you currently have for non-JS enabled browsers.
- You have some unexplained abbreviations on your CV. I appreciate that it's geared towards people recruiting for web dev roles, but you should still expand things like MVC and IDE. My boss wouldn't know what they are.
- Your link to Accenture is typo'd,
- Personally, I'd move boxes in the Portfolio that don't link anywhere to the end.
- How come the box for your final year project isn't a link?
- The text on the home page is phenomenally dull. Sorry, but it is.
It doesn't show off what you can do.
Where's the glitz? Where's the fancy <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span>? Where's the stuff that I can visit your website and say to myself "hey, that's <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span> cool, I can sell that to my clients! Better recruit him so he can write that for me!". Why aren't the tabs done with JQuery UI loading the content with AJAX (while still degrading back to how it works now)? Why isn't the form using CSS focus pseudo classes? Can you use Flash? Make some little widget or other. Show me. Can you use an API? Pop in a news feed or some Twitter crap. Show me.
Trust me, that's the sort of thing that makes your site stand out just a little more than the next CV. Unless the next CV is mine, in which case you're <span style='color:blue' title='I'm naughty, are you naughty?'>smurf</span>.
Re: Website review - personal website
The other guys have given you better tips than I can, but one small thing occurs to me: in case you don't already do this, make the "20" on the first page a calculated age so that it's always correct. I don't know about anybody else, but whenever I see a birth date and then an age, and the age is obviously wrong, it creates a terribly negative image. It's an obvious calculation in PHP.
Other than that, it's a nice, clean design, but I agree with most of the other comments. Good work.
Other than that, it's a nice, clean design, but I agree with most of the other comments. Good work.
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
Re: Website review - personal website
I have already done thatcalifdon wrote:in case you don't already do this, make the "20" on the first page a calculated age so that it's always correct.
Onion2k, I'll hopefully get back to you in more detail when I've got some time later on.
Re: Website review - personal website
As others have said, the main problem with the site is that it's pretty dull. Even though you are not a designer, the look of your site affects perception of people visiting. When your site looks professionally designed it makes you look like a professional.
A couple of quick improvements -
- Use a smaller maximum width for the site, or at least for your paragraphs. The recommended number of words per line should be seven to allow for easy reading. You can go a little over, but not so much over (hard to read so far horizontally).
- Write a short summary of your skills and major relevant accomplishments (ie significant web projects) on the home page. It should be strong enough to convince a potential client to read on.
- I'd suggest redoing the CV page. It's too by-the-numbers and generic, and yet not informative enough on the important points. I want to know how you use the technologies you represent to know. What development methodologies are you familiar with ? (OOP, design patterns) how secure is your code? how maintainable? do you have familiarity with code-versioning systems? are you a team player?
- In my opinion, the experience section should be divided into "skills" and "experience". Experience should recount projects you've done and what did you do there in brief. Skills should cover technologies and methodologies. Both should come before education, which is less relevant for this profession.
- Have your CV available in downloadable format (PDF).
Good luck!
A couple of quick improvements -
- Use a smaller maximum width for the site, or at least for your paragraphs. The recommended number of words per line should be seven to allow for easy reading. You can go a little over, but not so much over (hard to read so far horizontally).
- Write a short summary of your skills and major relevant accomplishments (ie significant web projects) on the home page. It should be strong enough to convince a potential client to read on.
- I'd suggest redoing the CV page. It's too by-the-numbers and generic, and yet not informative enough on the important points. I want to know how you use the technologies you represent to know. What development methodologies are you familiar with ? (OOP, design patterns) how secure is your code? how maintainable? do you have familiarity with code-versioning systems? are you a team player?
- In my opinion, the experience section should be divided into "skills" and "experience". Experience should recount projects you've done and what did you do there in brief. Skills should cover technologies and methodologies. Both should come before education, which is less relevant for this profession.
- Have your CV available in downloadable format (PDF).
Good luck!
- jayshields
- DevNet Resident
- Posts: 1912
- Joined: Mon Aug 22, 2005 12:11 pm
- Location: Leeds/Manchester, England
Re: Website review - personal website
Sorted.onion2k wrote:Scrollbar Shuffle
I've attempted to improve this but I'm stuck for a better way of going about it. Now I've got a container for my portfolio boxes, which is fixed width (just less than the max-width of the main container). This is centered, but the boxes inside are floated left. It looks better now at full width than before but I have the same problem when the viewport width is less than the max-width of the main container. I can't make the boxes span 1/3 of the width because I want the fluid width to change the boxes to 2 per line if it gets too thin to fit 3 boxes in a row.onion2k wrote:The portfolio boxes. The boxes in the portfolio page should be exactly 1/3 of the width (minus spacing) so there isn't whitespace at the right.
I could probably use some more input for this bit.
As suggested I have added some on-focus styling and changed the alignments.onion2k wrote:The contact form. That form is very, very basic. It could really use some styling.
Sorted.onion2k wrote:Validation on contact form. Good use of server-side validation, but I would prefer to see some JS validation as well to save a round trip to the server for obvious stuff.
The legend states that all fields are required, is that not enough?onion2k wrote:Required elements. There's no indication on the contact form which fields are required. There should be.
Sorted. I think I've done what you meant.onion2k wrote:Email addresses. Your reference's email addresses aren't links, they should be. You can use clientside scripting to make them links in order to avoid spam crawlers. They'll degrade back to what you currently have for non-JS enabled browsers.
Sorted.onion2k wrote:You have some unexplained abbreviations on your CV. I appreciate that it's geared towards people recruiting for web dev roles, but you should still expand things like MVC and IDE. My boss wouldn't know what they are.
Sorted.onion2k wrote:Your link to Accenture is typo'd
Although I do have a live demo up of the Web interface, it's not public. I've got 2 Java app's (for ordering/viewing pending orders) and a PHP app (for managing the stock, etc.) so just seeing the management interface wouldn't be much use anyway. I've put a link to my dissertation in there now too, if you want to know more.onion2k wrote:How come the box for your final year project isn't a link?
Sorted.pytrin wrote:Write a short summary of your skills and major relevant accomplishments (ie significant web projects) on the home page. It should be strong enough to convince a potential client to read on.
Sorted.pytrin wrote:Have your CV available in downloadable format (PDF).
Thanks for all the input so far. The things I haven't replied to I've decided not to implement for one reason or another. Things which I'm still considering are looking into jQuery UI and adding more content to the home page (maybe even a picture?).