clean up

Ninjakreborn · May 4, 2006

Does anyone see a cleaner way to do any of this, some of the components I had to style within the same page, because the positions are going to change for each page.
I have the site up on critique, but I had a couple of questions I wanted to ask before I went to bed.

[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="freelancebusinessman.css" />
<title>Freelance Businessman</title>
</head>
<body>

<a href="index.php" onMouseover="window.status='This will take you to the home page!'; return true"
onMouseout="window.status=' '; return true">
<img src="images/logo.jpg" alt="Freelance Logo" class="logo" width="700" height="200" />
</a>


<ol class="mainlinklist">
<li><a href="aboutme.php" class="mainnav" onMouseover="window.status='This will take you to the About Me page!'; return true" onMouseout="window.status=' '; return true">About Me</a></li>
<li><a href="webdesignethics.php" class="mainnav" onMouseover="window.status='This will take you to the Web Design Ethics page!'; return true" onMouseout="window.status=' '; return true">Web Design Ethics</a></li>
<li><a href="webcodingethics.php" class="mainnav" onMouseover="window.status='This will take you to the Web Coding Ethics page!'; return true" onMouseout="window.status=' '; return true">Web Coding Ethics</a></li>
<li><a href="webprogrammingethics.php" class="mainnav" onMouseover="window.status='This will take you to the Web Programming Ethics page!'; return true" onMouseout="window.status=' '; return true">Web Programming Ethics</a></li>
<li><a href="otherwebsiterelatedethics.php" class="mainnav" onMouseover="window.status='This will take you to the Other Website Related Ethics page!'; return true" onMouseout="window.status=' '; return true">Other Website Related Ethics</a></li>
<li><a href="skillsandservices.php" class="mainnav" onMouseover="window.status='This will take you to the Skills and Services page!'; return true" onMouseout="window.status=' '; return true">Skills and Services</a></li>
<li><a href="portfolio.php" class="mainnav" onMouseover="window.status='This will take you to the Portfolio page!'; return true" onMouseout="window.status=' '; return true">Portfolio</a></li><br />
<li><a href="extrainformation.php" class="mainnav" onMouseover="window.status='This will take you to the Extra Information page!'; return true" onMouseout="window.status=' '; return true">Extra Information</a></li>
<li><a href="advancedforms.php" class="mainnav" onMouseover="window.status='This will take you to the Advanced Forms page!'; return true" onMouseout="window.status=' '; return true">Advanced Forms</a></li>
<li><a href="specialfeatures.php" class="mainnav" onMouseover="window.status='This will take you to the Special Features page!'; return true" onMouseout="window.status=' '; return true">Special Features</a></li>
<li><a href="freeresourcesandlinks.php" class="mainnav" onMouseover="window.status='This will take you to the Free Resources and Links page!'; return true" onMouseout="window.status=' '; return true">Free Resources and links</a></li>
<li><a href="recentupdates.php" class="mainnav" onMouseover="window.status='This will take you to the Recent Updates page!'; return true" onMouseout="window.status=' '; return true">Recent Updates</a></li>
</ol>


<ol id="bottomnav" style="position:absolute; top:1300px; left:300px;">
<li><a href="privacypolicy" onMouseover="window.status='This will take you to the Privacy Policy page!'; return true" onMouseout="window.status=' '; return true">Privacy Policy</a></li>
<li><a href="copyrightnotice" onMouseover="window.status='This will take you to the Copyright Notice page!'; return true" onMouseout="window.status=' '; return true">Copyright Notice</a></li>
<li><a href="basiccontactpage" onMouseover="window.status='This will take you to the Basic Contact page!'; return true" onMouseout="window.status=' '; return true">Basic Contact Page</a></li>
<li><a href="basiclinkexchange" onMouseover="window.status='This will take you to the Basic Link Exchange page!'; return true" onMouseout="window.status=' '; return true">Basic Link Exchange</a></li>
</ol>


<div class="maintext">
<h3>Welcome to Freelance Businessman</h3>
<p>I want to welcome you and thank you to the website.  I offer a variety of things on this site.  More than what you would probably expect.  I am a web designer, coder, programmer, and I also have services relating to web hosting and promotion.</p><br />
<p>My main purpose for this website, is to give you a list of what services I offer, what skills I possess, and a good variety of ways to contact me to inform me about various types of project information.  However after carefull consideration, and quite a bit of research, I decided to make it into much more than that.</p><br />
<p>There is something here for everyone, so I would ask everyone to stick around and here what I have to say, you will probably find something you can find useful.  First I would like to address any potential clients, if you have anything you need done with a website, please pour over my skills, services, and about me page to find out about me, my business, and about everything I do and believe that has to do with website.  All of my beliefs and practices when relating to design/coding/programming/promotion/hosting/other are all listed neatly under there specific areas.  Those pages will give you an idea of who you will be hiring, and who will be taking on your projects if you decide to come to me with your project information.</p><br />
<p>To potential web designers/developers/programmers, and all the way down to hardcore experts you will find something here that you can use.  I have a huge list of links under specific sections leading to huge lists of resources that took me a long time compile, I also have a few special projects in the undertaking to help freelancers be able to find work better.  I have full specifications for what I require under the correct sections.</p><br />
<p>There is another reason behind this website as well.  Something aside from trying to get projects, and somethign aside from helping other developers/programmers/coders.  I am wanting to start a new revolution in the field of websites.  I want to start spreading the ideals of good web design/coding/programming.  Everything from clean, well commented code, all the way down to deep theological misconceptions that plague the world of web sites today.  There are many misconceptions, and false rumors, and even some that are true that aren't as big of a deal as percieved.  I am here to not only information people of these rumors, but to also try and help everyone get over those minor problems understanding some of the basic concepts, and ideas that a lot of people fight with when first starting, and even some people who have been in this field a long time.</p><br />
<p>I would also like to apologize for the length of this homepage, I wanted everyone to see what there was to offer on this site, feel free to look around at your leisure.  If you are a potential client, then it would be better to refer to the Advanced Forms page for contacting me about projects, as the communication between me and you will go alot smoother.</p>

</div>

</body>
</html>

[/code]

Here is the css code, is there some other ways to clean this up, any suggestions. To tidy up here and there, or techniques I don't know about.

[code]
/* Body styling begin */
body
{
background-color:#CCCCCC;
margin-left:100px;
margin-right:100px;
}
/* Body styling ended */
/* Sets overall logo style */
/* removes logo border, and sets it's position */
.logo
{
border:none;
position:relative;
left:50px;
bottom:20px;
}
/* end main logo styling */
/* begin main list of links */
/* This removes the numbered bullets, and sets the position */

ol.mainlinklist
{
list-style:none;
position:absolute;
top:200px;
left:110px;
}

/* End main link list */
/* Begin main link list link structure and design */
/* Everything in this section sets the colors and styles of all the links in the main nav */
a.mainnav:link
{
color:#999900;
background-color:#000066;
}

a.mainnav:visited
{
color:#0000FF;
background-color:#999999;
}

a.mainnav:hover
{
color:#FF3300;
background-color:#660000;
}

a.mainnav:active
{
color:#33FFCC;
background-color:#333333;
}

/* End main link list link structure and design */
/* Begin Bottom list styling */
/* This is going to set the bottom links to go verticle and to remove the numbered bullets */

/* End bottom list styling
/* Begin bottom navigational structure */
/* Everything in this section will set the way the bottom links look, and are styled */
#bottomnav li
{
display: inline;
list-style-type: none;
}

#bottomnav a:link
{
color:#999900;
background-color:#000066;
}

#bottomnav a:visited
{
color:#0000FF;
background-color:#999999;
}

#bottomnav a:hover
{
color:#FF3300;
background-color:#660000;
}

#bottomnav a:active
{
color:#33FFCC;
background-color:#333333;
}

/* End bottom navigational structure */

/* Begin General styles of texts, headers, and various div and span positions */

.maintext
{
position:absolute;
top:200px;
left:400px;
}

h3
{
font-family:GulimChe, "Gloucester MT Extra Condensed", Gigi, "Freestyle Script", "Times New Roman";
font-size:16px;
}

p
{
font-family:GulimChe, "Gloucester MT Extra Condensed", Gigi, "Freestyle Script", "Times New Roman";
font-size:14px;
}

/* End General styles of texts, headers, and various div and span positions */
[/code]

Sign In

clean up

Recommended Posts

Ninjakreborn

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information