Jesse Moodys Web Site
polycounter lvl 17
Ok so my site is finally launched. I am still very much working on it daily and adding / changing content to better fit the site. So I am looking for feedback on whats good, whats bad and what is just plain ugly.
Let me know what you guys think. Thanks again as always.
www.artbyjessemoody.com
Let me know what you guys think. Thanks again as always.
www.artbyjessemoody.com
Replies
Before you read anything I say, it's always a good idea to check out Jon Jones' bit on how to create a great portfolio.
Linky
The site layout is good, simple, and has your contact information, and desired position on every page.
Your screenshots are well lit, and have a watermark as well. (This is thumbs up shit, cause if anybody saves your work, they'll remember where to go if they want to look you up later.) But don't forget to show off your polycount, wire frames and texture pages, they're a must.
There are a few things I'd recommend changing. In your 'link bar' you have to think about what you sections you need, and what sections are redundant. Specifically the 'Projects' section. To make the site more streamlined, you could probably keep WIPs and Personal Pieces in your portfolio section. If it irks you to have such things in your portfolio section, then maybe rename it something like 'artwork'.
Jpegs are prettier than GIFs, it's true, but low quality jpegs aren't exactly a good sight either as your average PR man won't know 'why' it looks messy. For things like your contact information in the corner which is comprised of 3 core and maybe 4-6 shading colours, you could simply save it as a 8 or 16 colour gif, have a smaller or similar filesize, and much more clarity. Keep Jpegs for your actual screenshots, consider the gif in other cases.
Colour scheme and design. Personally, the gray background and yellow on the beveled and embossed metal kinda turns me off. You are an artist, and you'll want to show that off using a more attractive colour scheme. and the header looks like a straight paint fleck texture off of CGTextures.com.
And to end it on a trivial note, Favicons. Like a good business card, a Favicon, (the little icon beside your website) will make your website stand out infinity percent amidst other potential hire'ees on a bookmarked list of artists.
Either way, it's a great step in the right direction, and the most important thing is that you got the layout right the first time, which is the hardest thing to make changes for.
i have gotten mixed feedback on where to put wips. So anyone else out there that has any input on that would be great.
I was told keep it in a different section by some and same as my other work by others.
I'll skip right to the crits, and ditch the sugar.
The site is too wide for the content. It's 2.5 times wider than the thumbnail section.
You have too many menu options for a portfolio site. Do you NEED a news section? Will it be regularly updated. No, it doesn't, and no, it won't.
Al those sections mean that at the minute you simply have a half finished site. Drop them. If at a later date you get content for them, then put them back in - but do you REALLY need a Projects section?
The bevelled metal buttons for Enviroments/Props etc. Ugly.
THe font used for the text? Ugly. Those are rollover images youve used - for txt. Why not just use text?
I was actually contemplating canning the news / projects sections until like you said they are needed.
I'll play with some more designs for the buttons, etc and see how they look.
Thanks again Rick.
Before playing with the designs for buttons, play with the idea "Do I need buttons?" CSS text rollovers are easy and cheap.
got any suggestions
a, a:visited {
text-decoration: none;
color: #ffffff;
}
a:hover, a:active {
text-decoration: underline;
color: #000000;
}
It's that easy - when you hover the text changes colour.
EDIT: I think i found some stuff in dreamweaver on messing with CSS and how to change cursors etc.
Your Site's Error Count
<table id="Table_01" width="1280" height="876" border="0" cellpadding="0" cellspacing="0">
Change width="1280" to width="900"
I figured out the mouse over text stuff. Thanks Rick
I am also playing with the width to make it a bit more compact.
Thanks again for all the feed back.
Find a simple colour scheme, easy to read fonts, (something my own site suffers from atm) and a clean layout to make it really shine.
Keep up the updates, it's getting better.
Had a few more suggestions from Poops so I went ahead and fixed some of those and resized some more items. It should fit better now and load a little bit faster hopefully.
Dear boy!
Ditch those tables for two reasons - speed, and ease of editing.
Try something like this:
<div id="contentarea">
<div class="contentblock">
<h1>Environments</h1>
<a href="someartpage"><img src="thumnail"></a>
<a href="someartpage"><img src="thumnail"></a>
</div>
<div class="contentblock">
<h1>Props</h1>
<a href="someartpage"><img src="thumnail"></a>
<a href="someartpage"><img src="thumnail"></a>
</div>
</div>
You get the idea.
Thats all you need, then you simply style those things. You have an "id" for contentarea, that's just a container for all the content, just like your table tag.
You want it 50 pixels from the left? Just do this:
#id {
margin-left:50px
}
And that's it.
Class contentblock is just a container for each block of thumnails. All that you really want in it is some padding:
.contentblock {
margin:0;
padding:10px;
}
Done.
Rather than an image for Environments, Props etc, I just used the H1 tag. But it's ugly! So? Style it!
h1 {
font-family: font-family: arial, "lucida console", sans-serif;
font-size:1.2em
font-weight:600;
color:yellow; (or use #rrggbb for the colour you want)
background:grey; (or use an image)
display: block;
padding:3px;
}
Another good thing of using the H1 tag is that it works semantically - people expect headlines, so your page flows like a structured document.
Finally, those thumnails?
.contentblock img {
padding:5px;
}
That just tells the browser that an image tag that is inside a contentblock should have 5 pixels of padding with it.
Also another question i had was if i were to set up frames would that move things quicker. Like have the top nav bar in a frame so it's not loaded on every page and have the middle section for content that way it only loads that part when the site changes.
Just a thought...
Want stuff to be fast? Use CSS - it stores all your formatting in one file, so it's only downloaded once. Want things to be really really really fast? Use Server Side Includes.
To be honest, you don't need SSI for such a simple site.
Anyways I'll get to your suggestions this weekend. Thanks again man.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>JESSE MOODY | ENVIRONMENT ARTIST</title>
</head>
<body>
<div id="masthead">
Header stuff here
<div id="navigation">
Navigation here
</div>
</div>
<div id="contentarea">
<div class="contentblock">
<h1>Environments</h1>
<a href="someartpage"><img src="thumnail"></a>
<a href="someartpage"><img src="thumnail"></a>
</div>
<div class="contentblock">
<h1>Props</h1>
<a href="someartpage"><img src="thumnail"></a>
<a href="someartpage"><img src="thumnail"></a>
</div>
</div>
<div id="footer">
Footer stuff here
</div>
</body>
</html>