Is this a clean code / best practice?

[mark_yieh]

Hi everyone. I just wanted a second opinion on whether or not my code conforms to best practices and such. Please take a look at this page and let me know if there's anything you would change or if there is a simpler solution especially in regard to the CSS.

Here's a link to the page.
www.mark-yieh.com/anneSharp/speaking.html

Thank you for your input.

[ray326]

There's a lot of non-semantic (presentational) markup in the body and a syntax error in a meta tag. It's quite readable with CSS disabled, though, so that's a good thing.

[The Little Guy]

This is just personal prefference, but I like to write my css code vertically instead of horizontally if that makes sense. For me it seems easier to read.
Example:
You:
.content {font-family: arial; text-align: justify; width: 525px; position: relative; top: -415px; left: 175px;}

Me:

.content
{
font-family: arial;
text-align: justify;
width: 525px;
position: relative;
top: -415px;
left: 175px;
}

BTW -- Some Tips
- When you specify a font-family, it is best to have more than one font listed.
- You don't need to add px after a 0 this makes your file size a little smaller, but not much.

- Otherwise you CSS looks Good.

[mark_yieh]

there is only one meta tag in the document and i can't find what's wrong with it.

[WebJoel]

there is only one meta tag in the document and i can't find what's wrong with it.


<meta http-equiv="content-type" content="text/html; charset="ISO-8895-1" />

content="text/html"; perhaps? I'm not quite sure what is wrong here, either..

[WebJoel]

This is just personal preference, but I like to write my css code vertically instead of horizontally ....

You know, -I've read about that somewhere. -Ettiquette for posting in Forums, to make your code 'vertical' for ease of eye-strain. Yet, *I* find that annoying. I prefer my coding 'horizontal', with NO horizontal scroll-bar, of course. ;)
That, and absolute URLs. Not "< img src ="/images/this.jpg" />" but < img src =" h t t p//w w w(dot)mysite(dot)com/images/this.jpg" />. That way we can lift the code and use it offline (sort-of) on editing software and (with internet-access) get all the images intact, present and accounted for.
This is the first thing I do when working with someone's code... is to get the URLs absolute so I can use it in editing software. I often end up 'horizontalizing' their code for my own benefit with the understanding that they will 'verticalize' it back again...
:)

[ray326]

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

[mark_yieh]

does the capitalization in the meta tag make a difference? I'm looking at a book "The Complete Reference HTML & XHTML fourth edition" by Thomas Powell and his examples show

<meta http-equiv="content-type" content="text/html; charset=ISO-8895-1" />


That, and absolute URLs. Not "< img src ="/images/this.jpg" />" but < img src =" h t t p//w w w(dot)mysite(dot)com/images/this.jpg" />. That way we can lift the code and use it offline (sort-of) on editing software and (with internet-access) get all the images intact, present and accounted for.


thank you for this tip WebJoel. It makes sense. I'm going to use this method from now on.

[WebJoel]

I'm not sure if capitalization makes a difference or not, but I know that lower-case always does not make a differance. I usually just use lowercase, but I have an editing tool that creates a working template that includes upper & lowercase letters. I usually just leave it alone (I merely assume that it is correct).

Oh yes, -Ray, -yeah! That meta-tag thing... you're right. I looked at that and it was so obvious after seeing the way you wrote it. I don't write too many meta-tags... I just let the html-editor do it and that is one of my weaknesses I guess. :confused:

[ray326]

Actually Fx/Tidy showed me that extraneous quote.