Just updated my website with a different layout. Mainly I'm wondering if there's any delays in loading, but feel free to give feedback on functionality, etc.
It took about 10 seconds to load all the images on the page. Since your thumbnails are monochromatic, maybe using something like 16 or 32 color gif images could help reduce the image size and make the page load almost instantly.
As for functionality, what was bugging me a little is that I couldn't go back to main page with back button until I came back to the first image in a row. You might want to add a "home" button or something like that, to let visitors quickly get back to main page with thumbnails (yeah, I know there are links to all the pages on the side, but they are a bit out of the way from where image browsing buttons are, and people get lazy to look around). That's not really issue with 2d section, only with 3d where you have groups of thumbnails and need to come back to main thumbnail page before looking at the next group.
I am finding it pretty hard to read the red on red text, and thought you may want to keep the red on blue scheme you have already. I have mixed feelings about your layout, it just felt very cramped to me. As for the navigation I would just put a button labeled main or home next to your back and next buttons.
As for the work, I don't feel your low poly section is doing you justice anymore since the quality level doesn't seem so hold up against your high poly section. Also there doesn't seem to be enough finished work. I love the orc robot and wished it were finished, but it's not textured. Nice work though.
I saved your site (homepage) to a temp folder and it was 1.16mb, which is pretty hefty.
Using the 'save for web' option in Photoshop, one of your thumbnail images went from 22k to 1.5k with no loss in quality. That kind of optimisation through all your images will go a long way to helping the site load better. Also, could your gradient images be 1 pixel wide? You could resize them in the html and reduce the filesize dramatically.
hey gmanx, very useful tips. thanks. i was going to go on the .gif advice mentioned earlier but using save for web seems alot less of a hassle. i'm assuming you mean the spaces in between the collumns when you refer to the gradient images?
You're welcome, and yeah, I meant the blue-to-black gradient images. They could be one pixel tall (or wide), all the gradient info is there, and you just have to stretch the image to whatever you want in your html code.
so, saved out the graphics again. site should be loading much faster. my only problem, and it was a problem before, is that on the low poly page, if you scroll down, one of the gradient images has a slight border at it's bottom. i don't know where it's coming from and don't know how to get rid of it. any clues?
I think you're getting some compression artefacts from those gradients. I recommend that you re-do them in Photoshop and make them one pixel tall. I did it by changing the code where the bottom gradient sits, to this:
..which stretches that one pixel tall image to 230 pixels. an advantage of doing that is that you can save it out at the highest quality (so you don't get any artefacting) and the file is still tiny.
Here's the image I changed:
and here's how it looks on the page:
Ironically, there's artefacting on the jpeg screenshot...
Anyway, I hope you can see what I mean. On this site I did the vertical blue fade the same way.
yeah, i know, gradients ended up pretty asstastic after saving out again. thanks for the 1 pixel tip, hopefully it kills 2 birds with 1 stone. the first bird, which i was referring to in my last post, is this fucking line at the bottom of the gradient image right beneath the coffee maker on the low poly page...
...not sure what that's a product of. it's not in the gradient jpeg so must be something in the code. haven't figured it out yet.
Why are you using the gradient as a background for the table, rather than the whole page? That's probably why you are seeing the table border on your background. Also, your gradient doesn't have to be so tall. You only need it to be one pixel in height, since you're tiling it.
Either way, the border isn't that noticeable unless you're looking for it.
thanks gmanx for the one pixel tip. there is artifacting from it being stretched vertically but i can live with it. besides, that fucking line is gone now, hooray. anyway, the page loads really fast now so thanks for all the tips.
hahaa, I should read through the threads more... I didn't realize Gmanx had already covered the 1 pixel thing that I reference (and did a better job of it).
Replies
As for functionality, what was bugging me a little is that I couldn't go back to main page with back button until I came back to the first image in a row. You might want to add a "home" button or something like that, to let visitors quickly get back to main page with thumbnails (yeah, I know there are links to all the pages on the side, but they are a bit out of the way from where image browsing buttons are, and people get lazy to look around). That's not really issue with 2d section, only with 3d where you have groups of thumbnails and need to come back to main thumbnail page before looking at the next group.
There, just my $0.02.
yeah, i'd thought about adding a home button but wasn't sure. might go ahead and do that now.
As for the work, I don't feel your low poly section is doing you justice anymore since the quality level doesn't seem so hold up against your high poly section. Also there doesn't seem to be enough finished work. I love the orc robot and wished it were finished, but it's not textured. Nice work though.
Alex
Using the 'save for web' option in Photoshop, one of your thumbnail images went from 22k to 1.5k with no loss in quality. That kind of optimisation through all your images will go a long way to helping the site load better. Also, could your gradient images be 1 pixel wide? You could resize them in the html and reduce the filesize dramatically.
--oh, and there's only one 'f' in professional.
<tbody><tr><td valign="bottom" height="230"><img src="www.ent3d.com_files/gradient_3.jpg" width="1100" height="230"></td>
..which stretches that one pixel tall image to 230 pixels. an advantage of doing that is that you can save it out at the highest quality (so you don't get any artefacting) and the file is still tiny.
Here's the image I changed:
and here's how it looks on the page:
Ironically, there's artefacting on the jpeg screenshot...
Anyway, I hope you can see what I mean. On this site I did the vertical blue fade the same way.
...not sure what that's a product of. it's not in the gradient jpeg so must be something in the code. haven't figured it out yet.
Either way, the border isn't that noticeable unless you're looking for it.