My Homepage

[aquatsr]

http://dhost.info/aquatsr/Looking for suggestions on optimization, and also general comments on the layout.There isn't much actual info on there cause I'm lazy/busy with other stuff.Warning: if you have a slow connection the image(s) may take some time to load.P.S. I like making simple, clean sites. Keep that in mind.

[Natechs]

I like it. The link font was good and the colors are well coordinated. 10/10 for overall design

[Ingolme]

It's a nice design, but there are things in the code that could be improved.

<dl id = "imap" align = "center">	<dt>		<a id = "title" href = "#" title = "Main Navigation">					</a>	</dt>	<dd id = "pichome">		<a id ="home" title = "Home" href = "?nav=home">			<span>				Home			</span>		</a>	</dd>	<dd id = "picresearch">		<a id ="research" title = "Research" href = "?nav=research">			<span>				Research			</span>		</a>	</dd>	<dd id = "picproj">		<a id ="proj" title = "Projects" href = "?nav=proj">			<span>				Projects			</span>		</a>	</dd>	<dd id = "picacad">		<a id ="ucd" title = "Academics" href = "?nav=ucd">			<span>				Academics			</span>		</a>	</dd>	<dd id = "piccontact">		<a id ="contact" title = "Contact" href = "?nav=contact">			<span>				Contact			</span>		</a>	</dd></dl>

This is not the proper way to use a definition list. This is a job for unordered lists, just put each of the menu elements into an <li> element.

<p><b>Home</b></p>

This looks more like a job for an <h2> element, because this isn't a paragraph, is it? You can remove both the <p> and <b> tags and use an <h2> element, which can be styled with CSS, and gives a semantic meaning to this text.

<div id="header"><center>

No need for center tags here. You can do two things, depending on what you're trying to do here:1. Give the #header class in CSS "margin: 0 auto;" to center the box itself2. Give the #header class in CSS "text-align: center" to center the text inside the boxIf you remove all the presentational markup (bgcolor, <center>, <b> and <i>) and substitute it for CSS on the corresponding elements, you'll be able to use an XHTML Strict, or HTML Strict DOCTYPE, which is much more recommended.

[Synook]

It's alright, but hte lack of a main title / banner confused me (i.e. will confuse some people). Also, it looks rather weird without images on at least give the body a colour background as well as an image.Something to help you code properly is the W3C's validator at http://validator.w3.org/ .Otherwise, not too bad.

[23.12.2012]

OMG! At first, I thought it was a haunted castle's web page. Mate, the navigation makes the whole page look... creepy. Also, the pattern for the content's background is kinda creepy as well.And fix your code errors.Overall, it looks okay, but change the damn font for the navigation!

[Kahor]

You are using font from Diablo for your menu, riiiiiiight ?

[aquatsr]

I like it. The link font was good and the colors are well coordinated. 10/10 for overall design

Thanks

It's a nice design, but there are things in the code that could be improved.

I know. My design skills are moderately good, but my optimization can use a lot of work.

<dl id = "imap" align = "center">	<dt>		<a id = "title" href = "#" title = "Main Navigation">					</a>	</dt>	<dd id = "pichome">		<a id ="home" title = "Home" href = "?nav=home">			<span>				Home			</span>		</a>	</dd>	<dd id = "picresearch">		<a id ="research" title = "Research" href = "?nav=research">			<span>				Research			</span>		</a>	</dd>	<dd id = "picproj">		<a id ="proj" title = "Projects" href = "?nav=proj">			<span>				Projects			</span>		</a>	</dd>	<dd id = "picacad">		<a id ="ucd" title = "Academics" href = "?nav=ucd">			<span>				Academics			</span>		</a>	</dd>	<dd id = "piccontact">		<a id ="contact" title = "Contact" href = "?nav=contact">			<span>				Contact			</span>		</a>	</dd></dl>

This is not the proper way to use a definition list. This is a job for unordered lists, just put each of the menu elements into an <li> element.

Will the main navigation look the same if I change it? The navigation looks the way I want it to... but if this isn't good practice I'll try to change it.

<p><b>Home</b></p>

This looks more like a job for an <h2> element, because this isn't a paragraph, is it? You can remove both the <p> and <b> tags and use an <h2> element, which can be styled with CSS, and gives a semantic meaning to this text.

I suppose. I've never really used headers in my code, that's why it's like that.

<div id="header"><center>

No need for center tags here. You can do two things, depending on what you're trying to do here:1. Give the #header class in CSS "margin: 0 auto;" to center the box itself2. Give the #header class in CSS "text-align: center" to center the text inside the boxIf you remove all the presentational markup (bgcolor, <center>, <b> and <i>) and substitute it for CSS on the corresponding elements, you'll be able to use an XHTML Strict, or HTML Strict DOCTYPE, which is much more recommended.

I see. I think when I get a week off (since I'm working right now) I'll tackle this issue. I know my code is interspersed with presentational markup that I've just been too lazy to incorporate into the stylesheet. But I've wanted to get strict validation for a while, so I'll definitely work on this.

It's alright, but hte lack of a main title / banner confused me (i.e. will confuse some people). Also, it looks rather weird without images on at least give the body a colour background as well as an image.Something to help you code properly is the W3C's validator at http://validator.w3.org/ .Otherwise, not too bad.

I know. It confuses me too sometimes. I used to have ads/a banner at the top but I removed them a while back. The background color I should really do; oft times I've had a slow connection and been like 'hmmm... without the back-image I can't read anything!' so probably a good idea.I already know of the validator, and while having code up to standard is very important to me, more important to me is the layout of the site, cross browser compatibility, and ease of navigation. Sometimes those come with standardized code, sometimes they don't. In any case that's why I created this topic - to ask for advice to change specific things when I get time.Thanks.

OMG! At first, I thought it was a haunted castle's web page. Mate, the navigation makes the whole page look... creepy. Also, the pattern for the content's background is kinda creepy as well.And fix your code errors.Overall, it looks okay, but change the damn font for the navigation!

I'd rather not actually. I want to be able to use this design later, and I see a lot of pages that have the same feel as mine but they look too plain. The creepy font makes it stand out. I actually added that dark, 'creepy' font recently. I was going for a marble-like look with the background but it didn't quite work out. Maybe I should add flames/chains to the sides to complete a 'creepy' look?

You are using font from Diablo for your menu, riiiiiiight ?

Yes, it's the Diablo font; but on my computer it's called AvQuest.---Thanks to everyone who responded. I'll try to incorporate your suggestions into my work later this month. One of my main (personal) issues with this site is that any useful information is three links deep. Any suggestions on how to present important information with less clicks? (As an example go look at the ECS page)