Apologies for not getting back to you sooner. I got distracted and then forgot all about it.
That blue on the black makes a nice, striking headline, in my opinion.
I’ve looked in detail at your page, and there are a number of issues you really need to clear up, including validation errors (as mentioned before). Also, some of your coding practices are very outdated, such as the use of inline styles. You really should move all styles to an external stylesheet, which also makes it much easier to maintain and update the site.
I’ve made a valid version of your index page, with the styles moved to an external style sheet. It uses the blue heading, but the rest is taken from the link in your first post. The logo image is broken on that page, so I used the GIF version I created previously. I have put that and the Copyscape image in a folder called images.
index.htm
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Waldorf PC - Home</title>
<link href="waldorf-styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p><img class="logo" src="images/logo.gif" alt="Waldorf PC and Consultancy Logo Which Says Access for Everyone" width="145" height="80"><a href="#content">Skip to Content</a></p>
<ul class="nav">
<li><a href="http://www.waldorfpcandconsultancy.com/index.htm">Home</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/searchengineoptimizationservices.htm">SEO</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/contentproductionservices.htm">Content Production</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/training.htm">Training</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/technicalconsulting.htm">Technical Consulting</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/news.htm">News</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/webaccessibilityconsulting.htm">Web Accessibility Consulting</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/contact.htm">Contact</a></li>
<li><a href="http://www.waldorfpcandconsultancy.com/about.htm">About</a></li>
</ul>
<h1 id="content">Waldorf PC and Consultancy: Where Quality Is a Number One Priority</h1>
<p class="tagline">Waldorf PC and Consultancy is your number one resource for attaining guaranteed success hands down.</p>
<p>We are a
multipurpose company seeking to meet a wide range of needs, making it so
business people can come to one place and find all the tools they need
in order to achieve their goals.</p>
<ul class="services">
<li>We produce <a href="http://www.waldorfpcandconsultancy.com/contentproductionservices.htm">top quality content</a>
that will totally enhance your professional image, as our content is
one hundred percent unique, error free, and engaging to readers.</li>
<li>We provide top-of-the-line <a href="http://www.waldorfpcandconsultancy.com/searchengineoptimizationservices.htm">search engine optimization and search engine marketing services</a> to clients in numerous industries.</li>
<li>We offer a wide array of <a href="http://www.waldorfpcandconsultancy.com/training.htm">training</a> courses to enhance success.</li>
<li>We consult with businesses regarding how they can make <a href="http://www.waldorfpcandconsultancy.com/webaccessibilityconsulting.htm">web technologies accessible</a> for persons with disabilities.</li>
<li>We offer <a href="http://www.waldorfpcandconsultancy.com/technicalconsulting.htm">technical consulting services</a>
to help businesses find solutions that will enable them to stay
connected and maintain a strong presence in their respective industries.</li>
</ul>
<p>We are
always adding more services, so you will want to check back often.
Waldorf PC and Consultancy is devoted to keeping up with the latest
online business trends, facilitating us to provide services that will
allow you to always be ahead of your competition.</p>
<p>©2007-2016, Waldorf PC and Consultancy</p>
<p><a href="http://www.copyscape.com/originality-check/"><img class="copyscape" src="images/cs-wh-3d-120x60.gif" alt="Protected by Copyscape Originality Check" title="Protected by Copyscape Plagiarism Checker - Do not copy content from this page." height="60" width="120"></a></p>
</body>
</html>
waldorf-styles.css
body {background-color: #ffffff;
font-family:verdana;
font-size:100%;
color:#000000;
line-height: 1.5;}
.logo {padding-right: 0.5em;}
.tagline {font-weight: bold;}
h1 {background-color:#000000;
color:#ADD8E6;
font-size: 1.5em;
padding:0.5em;
}
ul.nav {list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
.nav li {float: left;}
.nav li a {display: inline-block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.nav li a:hover {
background-color: #111;
}
ul .services {list-style-type:circle;}
.services li {padding-bottom: 0.5em;}
.copyscape {border: 0;}
I’ll try to indicate what changes I made, beyond simply removing the inline styles.
I added a doctype declaration and language, and changed the charset to utf-8, which is generally recommended, and also added the viewport meta tag for mobile devices.
The “Skip to content” link seemed a bit cramped where it was, so I’ve moved it to sit to the right of the logo, rather than above it.
The first paragraph <b>
tags have been removed, and the bold font achieved with CSS. (A class of “tagline” added to the paragraph and styled as font-weight: bold
.)
The <br>
tags used for spacing have all been removed and replaced by a line-height declaration, and padding where extra spacing is required.
Class names added to the two lists so that they could be styled differently. The navigation list retains its dark background and white links, while the list of services is styled in accordance with the rest of the page - dark text on a white background.
I removed the obsolete “border” attribute from the Copyscape image, and set it in CSS instead.
I’ve added <p>
tags to the copyright declaration and the Copyscape link as the easiest way to ensure both sit nicely on a new line with reasonable spacing. (I had to change the class name on the Copyscape image, because for some reason it wouldn’t show with the existing one. Somebody else may be able to explain to us both where the problem lies.)
There were a couple of typos which I fixed; a stray colon after PC in the h1 heading, and “toos” instead of “tools” in the second paragraph. There was also a malformed link in the fourth bullet point which I’ve fixed.
Hopefully that all makes sense. If you have any questions, or need help converting the other pages to use an external style sheet, please ask.