Review Request: The Silo Network Version 3
I have recently finishing redesigning The Silo Network; although a few bugs and problems still have to be fixed. I was wondering what everyone thinks of it? Any compatibility issues? bugs? problems? thoughts?
nuk3 posted this at 06:32 — 27th September 2003.
They have: 238 posts
Joined: May 2002
Posted in wrong forum, could a mod please move to correct forum. Thanks
Abhishek Reddy posted this at 06:51 — 27th September 2003.
He has: 3,348 posts
Joined: Jul 2001
Is it heiroglyphic? Is it Morse code? No, it's small font!
I can hardly read it... size="1"?! :eek:
And whaddaya think yer doing not coding to xhtml! All those tags...
CSS hover/font sizes are inconsistent. Really, try xhtml.
The design is very content-manager-ish. The colours are ok. But the whole thing lacks personality. Well, not entirely -- I think the simple look might grow on me. But it's still probably too simple.
And that's one big title image you have there. Might be a good idea to shrink it a bit.
The anti-aliasing on the rounded corners isn't very good. Looks jaggy.
That's about all I can think of atm.
Good luck.
nuk3 posted this at 09:26 — 27th September 2003.
They have: 238 posts
Joined: May 2002
Abhishek Reddy posted this at 09:57 — 27th September 2003.
He has: 3,348 posts
Joined: Jul 2001
Fonts - much better.
xhtml - where shall I begin?
Eliminate tagsoup, update easier, and follow W3C recommendations, and perhaps most importantly in your case (webmaster resource site), show your users how it's done! 
The cursory ALA article: http://www.alistapart.com/stories/csstalking/
design - yeah, it is growing on me. But I still think you should introduce some character into it, make it unique. It's probably just a matter of coming up with a distinct logo or colour scheme and making minor adjustments to incorporate it.
header image - vertically, I was thinking at first. Come to think of it, it might be a good idea to shrink it horizontally too. Rather than a large banner, you might be better off with a small logo.
more comments - I'll have another look later.
nuk3 posted this at 13:30 — 27th September 2003.
They have: 238 posts
Joined: May 2002
That article was a very interesting read. I'll definetly be looking into how css layouts work. So far it looks suprisingly easy to do. As for XHTML, I'm strongly considering converting to that too.
The Webmistress posted this at 15:02 — 27th September 2003.
She has: 5,586 posts
Joined: Feb 2001
Either you are in the middle of updating it or it isn't owrking properly!
nuk3 posted this at 16:38 — 27th September 2003.
They have: 238 posts
Joined: May 2002
Yeah sorry about that, I'm implementing a few suggestions that Abhishek made. I'll put up the old version again so you can see it:
http://www.silonetwork.com << OLD VERSION
http://www.silonetwork.com/index2.php << WORK IN PROGRESS
ComposerRyan posted this at 02:30 — 28th September 2003.
They have: 22 posts
Joined: Jul 2003
Looks like a great site, good work.
And I noticed it had some interesting articles there too, like the one about Fixed vs Expandable Layouts. That is an issue that seems to be springing up on a lot of forums lately...and your article made many good points regarding fixed and expandable layouts!
Again, good work and I will visit your site again to read some more articles!
Ryan
Need a website? WebQuad offers high quality website design services at affordable prices! Click here now to visit webquad.com
Megan posted this at 13:42 — 29th September 2003.
She has: 11,421 posts
Joined: Jun 1999
I think this looks better than some of your past efforts, although I don't remember them for sure.
I do think that the header graphic could be a little shorter (vertically). it's just taking up space there. Also do something with your links so they look like links rather than plain text. Your whole menu system will look nicer.
I also think that you should get rid of the right side polls and junk and go down to a two column layout (unless you can think of something better to put there).
On a deeper level, I think that your header graphic could use some work. I'd like to see a little more variation in the colours of the squares in the corner - try having them fade from grey to blue more gradually, maybe with a few other hues trown in here and there for interest (like a tinge of green for example). And do it more on a 45 degree angle rather than the more upright line you've got there. The font for the text isn't working at all. It looks too mischapen and blob-ish. Try to find something more structured.
Megan
Connect with us on Facebook!
nuk3 posted this at 03:41 — 3rd October 2003.
They have: 238 posts
Joined: May 2002
Thanks for your comments Megan. I'm in the process of fixing up the header graphic (the points you mentioned) and I'll probably scrap the right column.
nuk3 posted this at 06:45 — 4th October 2003.
They have: 238 posts
Joined: May 2002
What do you think of it now?
http://www.silonetwork.com/index.php
Abhishek Reddy posted this at 07:21 — 4th October 2003.
He has: 3,348 posts
Joined: Jul 2001
http://validator.w3.org/check?verbose=1&uri=http%3A//www.silonetwork.com/index.php
It's better without the right column. The rounded corners are still not anti-aliased very well. The "Latest Links" links aren't displaying right -- wrong font, size. Validator catches that, I think.
I like the new banner, but I don't see the logo's relevance to the content. Still a lot of white space (wasted?), but it's much better.
slimpy posted this at 08:17 — 4th October 2003.
They have: 11 posts
Joined: Oct 2003
I agree lose the right colum. Besides that I give your site a thumbs up! Its easy to nav and you already have some good articles that I must return and read.
http://www.verifyurl.com
Your gateway to the search engines!
nuk3 posted this at 10:40 — 4th October 2003.
They have: 238 posts
Joined: May 2002
The latest links are fixed up and I'll work on the aa for the rounded corners. I might also add a background to the site in the future.
Abhishek Reddy posted this at 12:56 — 4th October 2003.
He has: 3,348 posts
Joined: Jul 2001
I hope you don't mind... I was toying with the EditCSS extension on Firebird, and ended up hacking your stylesheet.
I ended up with this:
/* Type CSS rules here and they will be applied
to pages from 'editcss'
immediately as long as you keep this window open. */
/**** LINK-tag style sheet css.css ****/
#pageheader {
width:750px;
height:150px;
background-image:url(<a href="http://www.silonetwork.com/images/header.gif" class="bb-url">http://www.silonetwork.com/images/header.gif</a>);
background-repeat:no-repeat;
background-position:center; }
#main_container {
clear:left;
width:750px;
border-width:0px;
background-color:transparent;
color: #000000;
font-family: Verdana,Tahoma,Arial,serif;
font-size: 9.5pt; }
#menu_container {
float:left;
border-color:black;
border-style:solid;
border-width:1px;
width:130px;
background-color:#transparent;
color: #000000;
font-family: Verdana,Tahoma,Arial,serif;
font-size: 9.5pt; }
#spacer {
float:left;
width:20px; }
#content {
float:left;
width:450px;
border-color:black;
border-style:solid;
border-width:1px;
background-color:transparent;
color: #000000;
font-family: Verdana,Tahoma,Arial,serif;
font-size: 9.5pt; }
#menuheading {
text-align:left;
width:130px;
height:20px;
border-width:0px;
background-color:#003B7A;
color: #FFFFFF;
font-family: Verdana,Tahoma,Arial,serif;
font-size: 9.5pt; }
#menucontent {
text-align:left;
width:130px;
border-width:0px;
background-color:#DBDBDB;
color: #000000;
font-family: Verdana,Tahoma,Arial,serif;
font-size: 9.5pt; }
.maintop {
display:none;
height: 22px;
background-color: transparent;
}
.mainback {
height: 22px;
background-color: #fffbfb;
border:1px solid #ddd;
}
.mainbottom {
display:none;
height: 22px;
background-image: url(<a href="http://www.silonetwork.com/images/mainbottom.gif" class="bb-url">http://www.silonetwork.com/images/mainbottom.gif</a>);
background-color: transparent;
}
body { margin: 5px; font-family: Verdana,Tahoma,Arial,serif; background-color:#efeff6;
background-image:none;
}
A:link { text-decoration: underline; color:#000000; background-color: transparent; font-size: 9.5pt; font-family: verdana; }
A:visited { text-decoration: underline; color:#000000; background-color: transparent; font-size: 9.5pt; font-family: verdana; }
A:active { text-decoration: underline; color:#000000; background-color: transparent; font-size: 9.5pt; font-family: verdana; }
A:hover { color:#000000; background-color: transparent; text-decoration: none; font-family: Verdana,Tahoma,Arial,serif; }
a.menu:link { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: none; }
a.menu:visited { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: none; }
a.menu:active { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: none; }
a.menu:hover { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: underline overline; }
a.updates:link { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: underline; }
a.updates:visited { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: underline; }
a.updates:active { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: underline; }
a.updates:hover { color: #000000; background-color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-decoration: none; }
.menu_heading {color: transparent; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; text-align: left;}
.text { color: #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 9.5pt; background-color: transparent; }
.small-heading { color: #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 10pt; background-color: transparent; }
.medium-heading { color: #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 12pt; font-weight: bold; background-color: transparent; }
.large-heading { color: #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 14pt; background-color: #efeff6; margin-top:-27px; display:block; width:150px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; border-left:1px solid #ddd; text-align:center;}
.menu-heading { color: #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 9pt; text-decoration: none; background-color: transparent; }
input, textarea, select { border:2px solid #000000; font-family: Verdana,Tahoma,Arial,serif; font-size: 8pt; color: #000000; background-color: transparent; }
table[width=130]{
border:1px solid #ccc !important;
}
table[width=130] td {
background-color:#dfdfff !important;
}
.menu_heading b {
display:block;
background-color:#009 !important;
padding-top:3px;
padding-bottom:2px;
margin-top:-16px;
z-index:100;
color:#fff;
}
.menu_heading b:before {
margin-left:3px;
margin-right:3px;
content:">>";
}
Try replacing your current stylesheet with that one. (Backup yours, of course). The CSS I used is very very ugly, because I had to work around your markup (*sigh*, if only it was XML), and I can only guarantee it "works" as I intended it to on Firebird 0.7 20030925 on Linux. Anyways, I hope it gives you some ideas...
edit: here's a screenshot of what it should look like, in case the code doesn't work.
nuk3 posted this at 07:10 — 5th October 2003.
They have: 238 posts
Joined: May 2002
Half that code in that style sheet is not actually being used by the current layout. But I'm in the process of making a css layout. So what you've taken the time to "hack" above will be of use to me in the near future. Thanks Abhishek.
Abhishek Reddy posted this at 07:30 — 5th October 2003.
He has: 3,348 posts
Joined: Jul 2001
heh, no problems. I was just having some fun with EditCSS.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.