Site review...

[Nightfire]

Just got the basics of my site up and just wondering if anyone can tell me what's missing. No matter how hard I look at it, I just can't find it. Something just doesn't look right.

http://nightfire.org.uk

[newmand2]

As you already say on the site, It needs content. Perhaps a bit more colour? I've personally liked greys alot, but with perhaps a few dashes of colour

[ronaldb66]

Color, that's what it's lacking! and perhaps a little heading styling (border, background color, background image?).

[Ember~Daze]

Yes, color would do it well. Maybe some more "images" would be nice. Your loading time is great (and I'm on 28.8 dial-up) so I don't think a small picture here or there would hurt. They'd just have to be implemented in the correct spots to achieve that "nothing's missing" look. For example, maybe an image aligned to the right side of the top section/banner/header (whatever you please to call it ;) that fades to white as it draws closer to the 'NightFire' text on the left.

Also, Yes. You could change the color of the news headings to something that stands out from the news content. That would be nice. Some darker tones in the main body section would be good for contrast too.

Hmmm... that's all I can think right now. Good job though. :)

[MysteryMan]

Night - I think that your choice of white, grey, and black is excellent.

It has a very ethereal look.

I think what you need to do is not have the site span the entire width. You ought to focus it in on 75% of the page, in the center.

And make the background grey, the center white, and white entry backgrounds with black text.

Then what you should do is make ONLY the main banner some outrageously shiny colors. This will give it attraction, but keep the relaxing ethereal look on the rest.

That will put you at an awesome looking site. Otherwise you have the same taste as me, I like it!

[Nightfire]

Is this any better?

I can't seem to get the maindiv to center align in IE though :mad: Anyone know why?

http://nightfire.org.uk/style.css

[MysteryMan]

No that looks worse.

If you want it center just put center tags!

It's easy :)

The red looks bad - it looks nicer with grey, black, and white....

[Nightfire]

If I use center tags then I won't be using xhtml anymore, I'd be using tag soup :)

I'll change the red

[oracleguy]

Originally posted by MysteryMan
No that looks worse.

If you want it center just put center tags!

It's easy :)


Except that the <center></center> tag was deprecated long before the XHTML 1.1 doctype he is using was made.

[Paul Jr]

Originally posted by MysteryMan
If you want it center just put center tags!
Which has been deprecated, I believe.

Try adding text-align: center; to your body styles. You may have to add some text-align: left;'s to some other stuff, but that should do it.

And I agree the red looks kinda... well... yeah.

[Nightfire]

Ta Paul, that did the trick. *Shaking head and fist at IE* I remember when NS was the pain in the rear to code for and everything worked in IE, seems everything's done a back flip

[Paul Jr]

Originally posted by Nightfire
Ta Paul, that did the trick. *Shaking head and fist at IE* I remember when NS was the pain in the rear to code for and everything worked in IE, seems everything's done a back flip
Nice. ;)
Yeah... too bad we couldn't get rid of IE... once and for all. *Evil genius look*

Dig the design, I love the white and gray and black! :D

[MysteryMan]

Oh sorry.

I stopped design many years ago :(

So now, help me out - xhtml is used now, not html?

Doesn't things like php etc.. get translated down into html for the computer?

[Nightfire]

xhtml is now the modern language to use, it helps you code for cross-browser compatability, wap phones, pda's etc. It saves on bandwidth, as your page size will be about 70% smaller than using just html. It makes site changes very easy, as your content and styles are separated. It's not really that much different from html, but is worth learning :) http://www.w3schools.com/ have some good tutorials on xhtml

php doesn't know what html is :) php runs on the server and only knows the 'server code'. You can have php print out whatever you want to and it won't complain :)

[mindlessLemming]

How about a simple bg image around the content?
Here's a quick try and a sample of what it looks like in your site.
I like it :)

[mindlessLemming]

....and here is the 46byte .gif that is being repeated.

Andrew

[Nightfire]

I'll give it a try, don't go anywhere ;)

[mindlessLemming]

Also, with that bg image, it may look nice if you put a left and right border with a style of ridge or groove on the centred content div. Just an after thought ;)

[Nightfire]

How's that? or maybe add the background image to the body instead?

Border was a good idea, I'll play around with it a bit more ;)

<edit>Just tried it in the body, made the page way too dark for my liking</edit>

[mindlessLemming]

I like that much more :)
It looks classy.
Maybe a 1px solid border on the top and bottom to fix those loose ends on the left+right borders, but if that makes the content div look too "heavy" on the page you may want to ditch the borders entirely.
Glad I could help:thumbsup:
Andrew

[Nightfire]

Lightened the borders a bit and I like it alot :) Ta for the help

[Paul Jr]

Background image is a bit too dark for my taste.

[ronaldb66]

Nightfire,

I have to agree with Paul Jr, background is way too dark. The content area seems completely seperated from the background, and thereby from the other page elements. Try a much lighter background image (I like the pattern repeat, though!).

Furthermore, I feel the content area is much too w i d e . The lines get far too long, which makes it tiresome to read.
How 'bout some column on the right, for example navigation (instead of up top)? Would give it a really "bloggy" feeling... :D
Also, use lots of margin to free the content from its container.

[Nightfire]

Just lightened it :)

Funny you should mention about putting something on the right side, I was just working on a little something to go there

[Nightfire]

Hit another stumbling block, this time in mozilla.

How can I add right margin on the content div, when it's set to margin: 0 auto for center aligning it?

div.content{
width:750px;
margin: 0 auto;
font-family: arial, verdana, sans-serif;
font-size: 0.8em;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
border:1px solid #000;
text-indent:20px;
background-color:#fff;
background-image:url('images/yetanothersite.jpg');
background-repeat:no-repeat;
background-position:bottom right;
text-align:left; /* DUMB IE HACK */
border-left:3px ridge #575656;
border-right:3px groove #575656;
border-top:2px solid #A2A2A2;
border-bottom:2px solid #A2A2A2;
}


I've tried putting the margin: 0 auto; into the maindiv, but then I can't get the content div centered.

If you don't want to look at the source, here's a basic idea of how it's working right now

<div class="maindiv">
<div class="content">
<div class="nav">
</div>
</div>
</div>


The nav div is set to float:right

See the site to see what I mean

[Nightfire]

Actually, nevermind. I've figured out that it's just the background image of the <h1> tags that were running underneath the nav. I'll just put the nav underneath that background image :)

[ronaldb66]

Why did you place the nav div inside the content div?
Won't it do to have them both in the maindiv div, and float the nav div right? That way, you can have the content div fill the main div (width: auto; hack applies for IE5.x/Win) with a sufficiently large right margin to make room for the nav.

By the way: if you are iffy about the source order (nav first, then content), a solution concerning a couple more wrapper divs can be found at Mezzoblue (http://www.mezzoblue.com/): Friday challenge (http://www.mezzoblue.com/archives/2004/01/23/friday_chall/). Takes a bit of reading, but very good stuff. Arguably semantically not very strong because the need for a set of extra wrappers, but the advantages are big enough for me. I tried the three-column version proposed in comment 50, and it's excellent!

[Nightfire]

Cheers for that :)