PDA

View Full Version : layout review

comicw
09-15-2002, 01:41 PM
I've been working on 2 sites (this is the other one). Below you'll find the layout code of the contact page of the site (without text). Please take a look to see if everything in the HTML code is problem-free.

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Contact</title>
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta name="Microsoft Theme" content="none, default">
<meta name="Microsoft Border" content="none, default">

<style type=text/css>

A.set:link {font-size: 10pt; font-family: "Verdana"; color: #EFEFEF; text-decoration: none}
A.set:visited {font-size: 10pt; font-family: "Verdana"; color: #EFEFEF; text-decoration: none}
A.set:hover {font-size: 10pt; font-family: "Verdana"; color: #52525F; text-decoration: none}
A.set:active {font-size: 10pt; font-family: "Verdana"; color: #EFEFEF; text-decoration: none}

A.hdl:link {font-family: "Franklin Gothic Demi"; color: #FFB336; text-decoration: none; font-size: "12pt"}
A.hdl:visited {font-family: "Franklin Gothic Demi"; color: #FFB336; text-decoration: none; font-size: "12pt"}
A.hdl:hover {font-family: "Franklin Gothic Demi"; color: #FFB336; text-decoration: none; font-size: "12pt"}
A.hdl:active {font-family: "Franklin Gothic Demi"; color: #FFB336; text-decoration: none; font-size: "12pt"}

A.par:link {font-family: "Franklin Gothic Book"; color: #AAAAB9; font-size: 12pt; font-weight: 600}
A.par:visited {font-family: "Franklin Gothic Book"; color: #AAAAB9; font-size: 12pt; font-weight: 600}
A.par:hover {font-family: "Franklin Gothic Book"; color: #FFB336; font-size: 12pt; font-weight: 600}
A.par:active {font-family: "Franklin Gothic Book"; color: #AAAAB9; font-size: 12pt; font-weight: 600}

Body {scrollbar-3dlight-color : #AAAAB9; scrollbar-arrow-color : #FFB336; scrollbar-base-color : #AAAAB9;
scrollbar-darkshadow-color : #AAAAB9; scrollbar-face-color : #AAAAB9; scrollbar-highlight-color : #52525F;
scrollbar-shadow-color : #52525F; scrollbar-track-color : #AAAB9}

</style>

</head>


<body bgcolor="#AAAAB9">

<div align="center">
<table border="0" width="750" height="118" cellspacing="0" cellpadding="0">
<tr>
<td width="739" height="15" colspan="8" bgcolor="#52525F">
<p align="center">
</td>
</tr>
<tr>
<td width="739" height="64" colspan="8" bgcolor="#52525F">
<p align="center"><a href="home.htm"><img border="0" src="images/bigl.png" width="295" height="99">
</a>
</td>
</tr>
<tr>
<td width="739" height="11" colspan="8" bgcolor="#52525F">

</td>
</tr>
<tr>
<td width="93" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="snapshots.htm">snapshots</a></b></font></td>
<td width="93" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="reviews.htm">reviews</a></b></font></td>
<td width="93" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="snatch.htm">snatch</a></b></font></td>
<td width="92" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="lowdown.htm">lowdown</a></b></font></td>
<td width="92" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="forum.htm">forum</a></b></font></td>
<td width="92" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="about_us.htm">about us</a></b></font></td>
<td width="92" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="links.htm">links</a></b></font></td>
<td width="92" height="28" align="center"><font color="#EFEFEF" size="4" face="Mufferaw"><b><a class="set" href="contact.htm">contact</a></b></font></td>
</tr>
</table>
</div>


<div align="center">
<table border="0" width="750" height="614" cellspacing="0" bgcolor="#52525F" cellpadding="0">
<tr>
<td width="728" height="14" colspan="3">


</td>
</tr>
<tr>
<td width="728" height="1" colspan="3">
<p align="right"><b><font color="#FFFFFF" size="4" face="Franklin Gothic Demi">CONTACT</font>

</b>

</td>
</tr>
<tr>
<td width="11" height="668" rowspan="2">
<p class="MsoNormal"> </p>

</td>
<td width="717" height="963" align="justify">
<span lang="EN-GB" style="font-family:&quot;Franklin Gothic Book&quot;;
mso-ansi-language:EN-GB"><o:p>
</span>

</td>
<td width="14" height="668" rowspan="2">

</td>
</tr>
<tr>
<td width="717" height="18">

</td>
</tr>
</table>
</div>

</body>

</html>
Tonz
09-15-2002, 11:15 PM
The only obvious problem would be the font - not everyone might have franklin gothic demi.

Keep to web safe colors too - just to make sure every body sees the site the same way

Oh and make sure all the table cells have some content - even if it is a & n b s p ;

Tonz:cool:
comicw
09-16-2002, 08:49 AM
Okay,

Fontwise: does the same count for Franklin Gothic Book and Arial Black?

I'll put &nbsp; in some the empty tables!
ronaldb66
09-16-2002, 11:06 AM
If you're gonna use style sheets anyway (which is a great idea), why not use them consistently? Get rid of the FONT tags and color and alignment attributes as far as possible (P and DIV elements, BODY bgcolor) and use CSS instead.
comicw
09-16-2002, 01:39 PM
Well, I can't use css all the time. I could do that, but because some text is centered and some is aligned left, it'd take as much time to compose a CSS for almost each element.
Or is there any other way I could fix it?
hairynugs6382
09-16-2002, 02:04 PM
If you are talking about aligning text use this
body, div, p, {text-align:center;}
mat
09-17-2002, 09:11 AM
what is the advantage of using internal style as opposed to an external style sheet? i see this on web pages alot but always use external sheets myself. :confused:
ronaldb66
09-17-2002, 03:28 PM
External style sheets enable you to use a single sheet for multiple pages and thus improve uniformity and reduce work. Internal styles could be added to a particular page to add styles on top of an exisiting (external) style sheet while still using the styles defined in the style sheet.
While developing a style sheet, keeping it internal for the time being might speed up the development process since updates are performed more quicky and can be checked right away.
comicw
09-19-2002, 04:12 PM
Do you think a lot of people don't have Franklin Gothic book?
mat
09-19-2002, 11:20 PM
i for one have deactivated that font and is it a standard system font on macs?