SITE REVIEW: Infomania

  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Hi, I made a template for my site and I want you to review it and tell me what you think.

url: http://www.freewebs.com/elitezenith/Inf ... index.html

Thanks.
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • Breeze
  • Photographer
  • Guru
  • User avatar
  • Posts: 1029
  • Loc: Australia

Post 3+ Months Ago

Nice simple design there Professor Bogey. The main text is a bit dark, maybe make it a light grey or white? Also you should make the header text smoother.

You should use div instead of a table though, it's easier... if you know CSS.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

ok, thnx breeze, I'll fix the template.

BTW, is the template that good that nobody can find anything to say?
  • Breeze
  • Photographer
  • Guru
  • User avatar
  • Posts: 1029
  • Loc: Australia

Post 3+ Months Ago

Bogey wrote:
BTW, is the template that good that nobody can find anything to say?


I think they're just staying away for fear you'll steal their coins on Greed.

Edit: BTW, I think you should switch the background colour with the colour in the table, and use more than just blue :)
  • spork
  • Brewmaster
  • Silver Member
  • User avatar
  • Posts: 6252
  • Loc: Seattle, WA

Post 3+ Months Ago

Breeze wrote:
BTW, I think you should switch the background colour with the colour in the table, and use more than just blue :)


Agreed. I like the simplistic design, but all the blue is a bit much, and the red buttons don't seem to fit in (color-wise) with the rest of the page.

Overall, a nice start.
  • Breeze
  • Photographer
  • Guru
  • User avatar
  • Posts: 1029
  • Loc: Australia

Post 3+ Months Ago

Yep. Find a nice design and play around with it until it's perfect.
  • find webster
  • Born
  • Born
  • find webster
  • Posts: 3

Post 3+ Months Ago

Great site...nice design
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

I just don't like the header image, it looks a bit pixelated, or stretched rather ...
Image
As you can see the colour of the menu isn't quite the same as the background, but that's in IE7 and IE's colours seem to be a bit off or something ...

Also 40 w3c validation errors ... click here to see them in action ...

Maybe also disable the link of the page that the user is on, and make it another colour ...
  • casablanca
  • Proficient
  • Proficient
  • User avatar
  • Posts: 481

Post 3+ Months Ago

The menu text seems to be a bit small and cramped up (maybe I'm the only one who thinks so)
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

THanks, I took all of the advice into consideration and I will change the background color to blood red and darken the blues and make the font another color.

I'll see what I can do to fix the validation errors, I want my site to be 100% validable. Thanks for all of the reviews, more would be greatly appreciated.

Yes Righteous_trespassor, just for you I will disable the link that the users would be on :).

Thanks and more would be greatly appreciated.
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

Bogey wrote:
Yes Righteous_trespassor, just for you I will disable the link that the users would be on .

Thank you, you know I always complain about that ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

I updated the index file only and I didn't bother with the others right now since they all look the same (until now).

The navigation buttons is just a test, I'm going to remove them and make my own buttons.

Is the text readable (at home page)?

Righteous_trespasser I didn't disable the link on the test, but I will on the other REAL buttons that I'm going to put there.

Thanks.
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

Yeah that's nice and readable ... I also think the red is nicer than just blue ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

I would need help on the buttons though. My photoshop quit working, I re-installed it and it still doesn't work.
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

That sucks big time ... How do you need help with the buttons?
  • tay_ay
  • Student
  • Student
  • User avatar
  • Posts: 84

Post 3+ Months Ago

i think you should change all colors. try 3-colors
and choose some relevant and smoother colors

i am not an expert but as a user i think this kind of sites are much more easy on eyes.

i hope this helps
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

righteous_trespasser wrote:
That sucks big time ... How do you need help with the buttons?


I does, I need some one to make a button for me (I'll give the specification if anybody volunteers VIA PM.)

Thank you.

WARNING: This is not a job offer, I wouldn't pay for anybody to make the buttons. I'll give credit though if the person who made the buttons has a site.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

tay_ay wrote:
i think you should change all colors. try 3-colors
and choose some relevant and smoother colors

i am not an expert but as a user i think this kind of sites are much more easy on eyes.

i hope this helps


Which colors do you suggest?
  • murcielagossi
  • Proficient
  • Proficient
  • User avatar
  • Posts: 457

Post 3+ Months Ago

When you get your ImageReady or Photoshop working try the colors: (#29385c bgcolor) (#7986a6 table/div color)(white or #9caacf for links). And the top banner I don't think you should have the browser interpret the height/width, make it the full size or something, because it's pretty stretched.
  • murcielagossi
  • Proficient
  • Proficient
  • User avatar
  • Posts: 457

Post 3+ Months Ago

Here I redid your banner are here's what I got, It's just an idea though.
http://farm2.static.flickr.com/1104/531067893_72880e94ae.jpg?v=0
It has several versions of the text in different places to add a little variety so you can see how it looks in different places.

/* Edit: You will have to make it shorter and longer(height/width) to fit what you want though */
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

murcielagossi wrote:
Here I redid your banner are here's what I got, It's just an idea though.
http://farm2.static.flickr.com/1104/531067893_72880e94ae.jpg?v=0
It has several versions of the text in different places to add a little variety so you can see how it looks in different places.

/* Edit: You will have to make it shorter and longer(height/width) to fit what you want though */


Thanks, I'll look into it.

Any more would be great.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Also, thanks for the color advice. I'm changing them right now.
  • tay_ay
  • Student
  • Student
  • User avatar
  • Posts: 84

Post 3+ Months Ago

Bogey wrote:
tay_ay wrote:
i think you should change all colors. try 3-colors
and choose some relevant and smoother colors

i am not an expert but as a user i think this kind of sites are much more easy on eyes.

i hope this helps


Which colors do you suggest?


i think your favorite color is blue. so you shoul try to select a very dark blue, a light blue, and a contrast color
i tried these colors. they are easy on eyes and also look nice
for background : 29 - 32 - 70 (hex : 1D2046)
for borders : 190 - 239 - 151 (hex : BEEF97)
for background between borders : 110 - 160 - 206 (hex : 64A0CE)
you can use the main background color as fore color

try these colors on paint together hope you like it
  • murcielagossi
  • Proficient
  • Proficient
  • User avatar
  • Posts: 457

Post 3+ Months Ago

For the menu you want to create look at: http://css.maxdesign.com.au/listamatic/ to get some ideas or just take one of the nav menus. Good luck.
  • Fabinator
  • Proficient
  • Proficient
  • Fabinator
  • Posts: 467

Post 3+ Months Ago

I don't like the header much.
Maybe try to edit a photo and paste text on it.

And don't let it strech, that's not good for the quality.

The colours don't fit. The red-brown combined with blue :? Maybe use some colour sheme or such.

Maybe add some photo's
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

I haven't worked on my site for some time now, but now I have re-chosen my colors and re-aligned my logo and now I have a big blue spot to the left of my logo. I want to right a centered and on the bottom text but I can't find a way to do that. Everytime I try something the main table the logo is in splits.

The url is: http://www.freewebs.com/elitezenith/Inf ... Index.html

righteous_trespasser, you may do the buttons for my site. I'll show how I want them to look. I did them already, but the only thing that stops me from uploading them to my site is that the transparencies aren't there.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Should I make my links as text? I mean, just regular links not images or anything? Although I'd like the images I made (not really "made" but used the template from Adobe Fireworks).
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

I like it without the stretch much more (the logo) ... and In my opinion text links are great, because they get search engine spiders to crawl the whole of your site, you can make those image rollovers with text links on top ... with some simple css ... If you don't know how, I'll be glad to help out ...
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8388
  • Loc: USA

Post 3+ Months Ago

Please help me out righteous_trespasser (I'm still trying to learn how to spell your name right without peeking :)). I tried simple rollover textual links, but the rollovers don't work and the links are an ugly blue on the blue background.
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

firstly for the links in the stylesheet you'll have something like:
Code: [ Select ]
/* so this is the first part that defines all the links in the document */
a
{
font-weight:normal;
color:#000000;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a:link
{
border:0px;
font-weight:normal;
color:#000000;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a:visited
{
font-weight:normal;
color:#000000;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a:hover
{
font-weight:normal;
color:#000000;
text-decoration:underline;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}

/*then let's say we have different colour links for the menu/navigation */
/*we'll then give them a class called "menu" */

a.menu
{
font-weight:normal;
color:#444444;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a.menu:link
{
border:0px;
font-weight:normal;
color:#444444;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a.menu:visited
{
font-weight:normal;
color:#444444;
text-decoration:none;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
a.menu:hover
{
font-weight:normal;
color:#444444;
text-decoration:underline;
font-size:12px;
font-family:arial,helvetica,sans-serif;
}
  1. /* so this is the first part that defines all the links in the document */
  2. a
  3. {
  4. font-weight:normal;
  5. color:#000000;
  6. text-decoration:none;
  7. font-size:12px;
  8. font-family:arial,helvetica,sans-serif;
  9. }
  10. a:link
  11. {
  12. border:0px;
  13. font-weight:normal;
  14. color:#000000;
  15. text-decoration:none;
  16. font-size:12px;
  17. font-family:arial,helvetica,sans-serif;
  18. }
  19. a:visited
  20. {
  21. font-weight:normal;
  22. color:#000000;
  23. text-decoration:none;
  24. font-size:12px;
  25. font-family:arial,helvetica,sans-serif;
  26. }
  27. a:hover
  28. {
  29. font-weight:normal;
  30. color:#000000;
  31. text-decoration:underline;
  32. font-size:12px;
  33. font-family:arial,helvetica,sans-serif;
  34. }
  35. /*then let's say we have different colour links for the menu/navigation */
  36. /*we'll then give them a class called "menu" */
  37. a.menu
  38. {
  39. font-weight:normal;
  40. color:#444444;
  41. text-decoration:none;
  42. font-size:12px;
  43. font-family:arial,helvetica,sans-serif;
  44. }
  45. a.menu:link
  46. {
  47. border:0px;
  48. font-weight:normal;
  49. color:#444444;
  50. text-decoration:none;
  51. font-size:12px;
  52. font-family:arial,helvetica,sans-serif;
  53. }
  54. a.menu:visited
  55. {
  56. font-weight:normal;
  57. color:#444444;
  58. text-decoration:none;
  59. font-size:12px;
  60. font-family:arial,helvetica,sans-serif;
  61. }
  62. a.menu:hover
  63. {
  64. font-weight:normal;
  65. color:#444444;
  66. text-decoration:underline;
  67. font-size:12px;
  68. font-family:arial,helvetica,sans-serif;
  69. }


Now that we have our links in place we need to add a hover event for the table cells we're targeting ... so let's say you have two images (normal.gif and mouseover.gif) ... we now give a class element to the cells that we want to show these rollovers on ...
Code: [ Select ]
/* so we're calling the class "nav" */
td.nav
{
background-image:url('images/normal.gif');
width:100px;
height:25px;
margin:auto;
}
td.nav:hover
{
background-image:url('images/mouseover.gif');
width:100px;
height:25px;
margin:auto;
}
  1. /* so we're calling the class "nav" */
  2. td.nav
  3. {
  4. background-image:url('images/normal.gif');
  5. width:100px;
  6. height:25px;
  7. margin:auto;
  8. }
  9. td.nav:hover
  10. {
  11. background-image:url('images/mouseover.gif');
  12. width:100px;
  13. height:25px;
  14. margin:auto;
  15. }

please note that the widths and heights above are targeted to the table cell and not the image ... if you want to change the values of the images you can add:
Code: [ Select ]
td.nav img
{
height:100px;
width:25px;
}
  1. td.nav img
  2. {
  3. height:100px;
  4. width:25px;
  5. }

now that we have the stylesheet set up, next thing we'll do is edit the html ... we now have to remember that the table cells where we want the rollovers to happen must have a class called "nav" and for the menu we have a link class called "menu" ... so in the following code I'm just going to show that part of the code ...
Code: [ Select ]
<tr>
<td class="nav">
<a class="menu" href="#">HOME</a>
</td>
<td class="nav">
<a class="menu" href="#">INFORMATION</a>
</td>
<td class="nav">
<a class="menu" href="#">SOMETHING</a>
</td>
<td class="nav">
<a class="menu" href="#">SOMETHING ELSE</a>
</td>
<td class="nav">
<a class="menu" href="#">OTHER</a>
</td>
<td class="nav">
<a class="menu" href="#">CONTACT INFO</a>
</td>
</tr>
  1. <tr>
  2. <td class="nav">
  3. <a class="menu" href="#">HOME</a>
  4. </td>
  5. <td class="nav">
  6. <a class="menu" href="#">INFORMATION</a>
  7. </td>
  8. <td class="nav">
  9. <a class="menu" href="#">SOMETHING</a>
  10. </td>
  11. <td class="nav">
  12. <a class="menu" href="#">SOMETHING ELSE</a>
  13. </td>
  14. <td class="nav">
  15. <a class="menu" href="#">OTHER</a>
  16. </td>
  17. <td class="nav">
  18. <a class="menu" href="#">CONTACT INFO</a>
  19. </td>
  20. </tr>

So now that part will have table cells with "normal.gif" for background-images, and when we hover over any part of the cell the background image becomes "mouseover.gif" and the links in those cells are the colour "#444444" where the rest of the links in the page are "#000000" ...

I'm really sorry if I am talking to you like you know nothing ... I do tend to do this because I have two smaller brothers and a little sister, so it becomes a habbit that not everyone likes ...
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

Post Information

  • Total Posts in this topic: 42 posts
  • Moderator: Website Reviewers
  • Users browsing this forum: No registered users and 16 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.