Thoughts on my portfolio layout

elektronisch

2[H]4U
Joined
Mar 22, 2004
Messages
2,305
http://www.ecal.us/ib/

Site is not finished yet, but what do you like and dislike?

I'm in the process of making a two column layout for the sub pages.

** Only tested in Firefox, let me know if it doesn't render properly **
 
I think it looks fine so far... Though I'd really want to see the "lorem ipsum" stuff setup in a more realistic fashion to how the actual content would be structured on the "Services" and "Contact Us" page.

Additonal suggestions:
- Make the "Resume" link an actual page. Put your resume in the page itself, then also offer link to download in "doc" and "pdf" formats.
- Lighten up the background that sits behind the image/text swapper. This will help the viewer's eyes to draw to the image/text more easily. I think this will become more apparent once you get some real content in that area.
 
Resume page should be an about page that has a biography of what you are/do with a link to your resume. Resume should be a .pdf not a .doc

Nice layout though!
 
I'm not a fan of those auto-scrolling headers, they tend to be distracting. Though I might change my mind once you have actual content there. Still, I'd suggest making it scroll slower or better yet, leave it up to the user to scroll the images using the arrows as buttons. Love the background image though. Will that carry over to the other pages? Right now they look pretty bland compared to the front page.

Color scheme is a bit heavy on the blues, I bet things would really pop more if you included an occasional dash of complimentary colors.

The bottom part of the pages look unfinished (on those pages that don't fill the entire height of the browser window). Maybe add some kind of border or footer section there?

The social bookmark icons seem way too big. It gives the impression those are more important to you than serious work.
 
I'm not a fan of those auto-scrolling headers, they tend to be distracting. Though I might change my mind once you have actual content there. Still, I'd suggest making it scroll slower or better yet, leave it up to the user to scroll the images using the arrows as buttons. Love the background image though. Will that carry over to the other pages? Right now they look pretty bland compared to the front page.
The sub pages are not done yet, I've been playing around with a different style layout for the sub pages.

The bottom part of the pages look unfinished (on those pages that don't fill the entire height of the browser window). Maybe add some kind of border or footer section there?
Footer will go there, have not added yet

The social bookmark icons seem way too big. It gives the impression those are more important to you than serious work.
Fixed
 
I'm impressed. I like the menu and the scroller, they look good together. I especially like how it's valid XHTML. I say good job!

Would be nice if you could slow that scroller down...
 
I'm impressed. I like the menu and the scroller, they look good together. I especially like how it's valid XHTML. I say good job!

Would be nice if you could slow that scroller down...


Thank you! That seems to be one of the biggest complaints, I've fixed this.
 
One thing that's bugging me... had some free time so I've been messing with it.
The menu_background.png matches the color (#405991) of #breadcrumb just fine in FireFox. IE8 does not match it even close.
IE7 seems to mangle it even worse.

Have you checked this in IE6? I don't have a box with that browser running right now but I'm sure it can find a way to mess it up even more.
 
Looks like every other generic web design company's website. And, it looks like you bought the template. Don't mean to be harsh, but that's what I think.
 
One thing that's bugging me... had some free time so I've been messing with it.
The menu_background.png matches the color (#405991) of #breadcrumb just fine in FireFox. IE8 does not match it even close.
IE7 seems to mangle it even worse.

Have you checked this in IE6? I don't have a box with that browser running right now but I'm sure it can find a way to mess it up even more.

I noticed this a few days ago, and I can't figure out why IE is rendering the colors differently. Hmm
 
Looks like clean code, but something that I remember seeing in 1995. Also, try rendering compliant pages with *dynamic* content, and I'll be impressed.

Good job though.
 
Looks like clean code, but something that I remember seeing in 1995. Also, try rendering compliant pages with *dynamic* content, and I'll be impressed.
What's so difficult about meshing dynamic content into clean markup?
 
Looks like clean code, but something that I remember seeing in 1995. Also, try rendering compliant pages with *dynamic* content, and I'll be impressed.

Good job though.

Last I checked the site was no where near complete and I was asking feedback on the design, not content or framework. Thanks for your worthless comment though.

I am only asking for constructive criticism.
 
Nope, not bought... but that's flattering.

Wasn't meant to be flattering. I guess a better thing to say is that the colors look washed out and bland, which matches the overall design. There's no "wow" factor to it. Not sure what you're going for but the site screams "generic" to me.

Your HTML looks ok though.
 
Wasn't meant to be flattering. I guess a better thing to say is that the colors look washed out and bland, which matches the overall design. There's no "wow" factor to it. Not sure what you're going for but the site screams "generic" to me.

Your HTML looks ok though.

I was just being a smart ass since you did not explain what you disliked about the site. Thanks for the much better criticism though, I'll look at ways I can improve the design.

I'm staying away from animations (flash/silverlight). I'm very much against it for proprietary reasons, and just do not feel it's needed here.
 
I noticed that at 800x600 and 1024x768 you get horizontal scrolling. Not a big deal, but I tried using Opera's fit-to-width to wrap things so there's no horizontal scrolling to see how things look. However, that just collapsed everything to a thin vertical bar. I wonder if things would look better if they had a reasonable min-width.

Also, using Opera's small screen rendering, things look ok except the images that have text. The text in them is all messed up (due to their resize).

Probably things that no one cares about, so just an FYI.
 
I noticed that at 800x600 and 1024x768 you get horizontal scrolling. Not a big deal, but I tried using Opera's fit-to-width to wrap things so there's no horizontal scrolling to see how things look. However, that just collapsed everything to a thin vertical bar. I wonder if things would look better if they had a reasonable min-width.

Also, using Opera's small screen rendering, things look ok except the images that have text. The text in them is all messed up (due to their resize).

Probably things that no one cares about, so just an FYI.

I'll have to look into this, thanks for pointing it out
 
I actually like it, looks clean.

It is VERY hard these days to make designs that do not look like they were from a "purchased template". Unique designs are very tough to come up with, and many times just look like 90s shit. This looks very good for an original design IMO. The gradients also look nice. It is a step up from the normal purchased templates you see designers use, but is not completely wow. In the middle ;)
 
I think what you have so far is looking pretty good. I think the color scheme is a little purplish (just a personal thing with me), and it could use a little bit of "pop" of some kind color-wise. It wouldn't steer me away from you, as I've seen great companies with worse looking sites. You can always start with something like this then see about "reinventing the wheel" in your spare time, then switch over to the new design later on. Often its a compromise between features and the timetable to get something up. Overall, not bad at all, IMO :)
 
I think what you have so far is looking pretty good. I think the color scheme is a little purplish (just a personal thing with me), and it could use a little bit of "pop" of some kind color-wise. It wouldn't steer me away from you, as I've seen great companies with worse looking sites. You can always start with something like this then see about "reinventing the wheel" in your spare time, then switch over to the new design later on. Often its a compromise between features and the timetable to get something up. Overall, not bad at all, IMO :)

Thanks a bunch for the kind words :D I'll see what I can do about the colors. Right now it's my first draft of the site, I've made some minor changes to the PSD. I'll have to take a second look at the colors and see if I can add a color that contrasts the blue and the purple.
 
I actually like it, looks clean.

It is VERY hard these days to make designs that do not look like they were from a "purchased template". Unique designs are very tough to come up with, and many times just look like 90s shit. This looks very good for an original design IMO. The gradients also look nice. It is a step up from the normal purchased templates you see designers use, but is not completely wow. In the middle ;)

Also thank you :)
 
I've fixed some elements of the site, rewrote it to load all the sub pages with ajax (the sub pages are not done.. the only one I finished was the homepage which loads the news from an external page.
 
I see some problems with the "Visualize My Talents" section:

1) Wording -- You are promoting a company. Yet it says "Visualize My Talents". You should change this to "Our" instead, or some other similar change in the possession of "Talents". too much mixing of first- and thrid-person.
2) Bars are completely useless -- What metrics do they convey? On the surface, it says that some areas are better than others. But to what factor? Do you view one area as greater importance? I say remove the bars completely. Mention the technologies that you (or should I say "your company") works with, and build on that with examples of completed projects as your company goes.

Other thoughts:
1) Contact information -- Which way would you prefer to be contacted: through the website form, or through one of the other social media/networking sites? You're better off picking one, and moving the visual emphasis of other locations someone can find information about your company to a more subtle degree. Lead the user to the way you prefer to be contacted; don't make them guess. Otherwise, you would have to triple or quadruple your monitoring of contact requests.
2) Resume -- Have it open in a new window, not the current window.
3) Push the "Information about me" to the far right -- Have it sit above the "Contact" section. You'll consequently have more realestate in your design for putting content within the first fold of the page (ie: without requiring scrolling). Also re-evaluate wording per comments in #2 of the first section above.
 
I see some problems with the "Visualize My Talents" section:

1) Wording -- You are promoting a company. Yet it says "Visualize My Talents". You should change this to "Our" instead, or some other similar change in the possession of "Talents". too much mixing of first- and thrid-person.
2) Bars are completely useless -- What metrics do they convey? On the surface, it says that some areas are better than others. But to what factor? Do you view one area as greater importance? I say remove the bars completely. Mention the technologies that you (or should I say "your company") works with, and build on that with examples of completed projects as your company goes.

Other thoughts:
1) Contact information -- Which way would you prefer to be contacted: through the website form, or through one of the other social media/networking sites? You're better off picking one, and moving the visual emphasis of other locations someone can find information about your company to a more subtle degree. Lead the user to the way you prefer to be contacted; don't make them guess. Otherwise, you would have to triple or quadruple your monitoring of contact requests.
2) Resume -- Have it open in a new window, not the current window.
3) Push the "Information about me" to the far right -- Have it sit above the "Contact" section. You'll consequently have more realestate in your design for putting content within the first fold of the page (ie: without requiring scrolling). Also re-evaluate wording per comments in #2 of the first section above.

Thanks for the awesome feedback. I have not picked a direction for the company whether I'm doing this solo or with a friend (who recently wanted to start a voip service under the companies name). That is why there is some confusion there.

The visualize my talent is not complete yet. I was going to put years of experience and more information on mouse over of each element.
 
Thanks for the awesome feedback. I have not picked a direction for the company whether I'm doing this solo or with a friend (who recently wanted to start a voip service under the companies name). That is why there is some confusion there
Just word it in third-person, and call it done.


The visualize my talent is not complete yet. I was going to put years of experience and more information on mouse over of each element.
Why build an extra step to finding out the years of experience, or any other metric? That extra step could even go unnoticed by potential customers, possibly causing them not to contact you for potential projects.

Either get rid of the bars completely, or always show the number in the bars... and without requiring a mouseover event.
 
The only thing I noticed so far is on the Resume the dates for your student employment are backwards--September is after March, not before.

My personal opinion on the resume is that there's way too much bold text, to the point that it doesn't seem to set anything off. That's likely a personal preference on my part--I prefer size differences over excessive bolding.

You do mention that you're "adept at relating well with all levels of management..." but I don't see anywhere in your job experience where you would've had to do so. If you have a job experience where you directly worked for a C-level executive on a project, or can prove such a statement, would be nice.

As for the website, I'm pretty happy with it, but I don't tend to get picky on minor website details. Everything I clicked worked as I expected it to, and from a user's perspective that's how it's supposed to be.

2.png
 
My biggest issue is that the the email address under "Need to Contact Me" is not selectable. You don't have to have a mail-to link but at least make it text and not an image so that people can select the text for copy/paste
 
My biggest issue is that the the email address under "Need to Contact Me" is not selectable. You don't have to have a mail-to link but at least make it text and not an image so that people can select the text for copy/paste

Common practice, helps ward off spammers - to some degree. It will be send the person to a contact form that I'm designing.
 
Back
Top