SEO <h1> tag question in Front Page

Get Started
1

I am informed by a Bing SEO analyzer that my CONTACT page is missing the <h1> tag.
I don’t know enough about code to figure out where or how to insert the <h1> </h1>tags and would appreciate any hints about how to enter that tag into the FP code which I am posting here:

<HTML>
<HEAD>
<META HTTP-EQUIV=“Content-Type” CONTENT=“text/html; charset=windows-1252”>
<META HTTP-EQUIV=“Content-Language” CONTENT=“en-us”>
<meta http-equiv=“Content-Type” content=“text/html; charset=UTF-8”>
<meta name=“description” Content=“rainbowsedgefineart.com offers fine art for sale”>
<TITLE>contact</TITLE>
<meta name=“Microsoft Theme” content=“clearday 011”>
</HEAD>
<BODY id=“main_body”>
<p align=“center”><img border=“0” src=“rainbows-edge-2.jpg” width=“391” height=“92” alt=“Rainbow’s Edge Fine Art logo”><font color=“#0000FF” face=“Arial” size=“2”><a href=“contact.htm”><br>
</a></font></p>
<p align=“center”><b><font color=“#0000ff” size=“6” face=“Verdana”>CONTACT
THE ARTIST<br>
</font></b>

I believe the <h1> tag goes with “CONTACT THE ARTIST” but don’t know how to do it…???
Thanks for your help here,
jim :slight_smile:

2

All the tags in HTML should ‘surround’ content and, in that way, defines and encapsulates it. It also important that each tag has an “opening” and “closing” partnership.
There are numerous tags available. In your post you will see ‘html’, ‘p’, ‘body’, ‘font’ for example.

The h1 is used to define a Top Level (Level 1) Header. I suspect the “SEO expert” is advising you surround the CONTACT THE ARTIST as you said.
I am not familiar with Front Page but would guess you can simply select that text and choose a button to add the H1.

If not, you can edit the HTML like this


<h1>Contact The Artist</h1>
3

Few people would be now asmost people stopped using it about ten years ago. The latest browser it properly supports is Internet Explorer 6 and Microsoft themselves declared it to be dead so long ago that the replacement software they released called “Expression Web” has recently also been declared to be dead by Microsoft with “Visual Studio” being its replacement.

4

Parkin:
Ok, I went into the code and fiddled around with it as you suggested. Working from the Normal View and the HTML (code) view, I finally ended up with this version - which works!:
<b><font color=“#0000ff” size=“6” face=“Verdana”><h1 align=“center”>CONTACT
THE ARTIST</h1></font></b>
The portion: <h1 align=“center”> was created by Front Page after I manually aligned the page from “normal” view. Any other configurations caused left alignment or gaps between the lines of print. By making the page look as I want, the code re-arranged itself into the final version I posted above. I know just enough about code to “dabble” with it in FP pages so, thanks a lot for the tip and response to my question. It’s working!!!

HAPPY HOLIDAYS,
jim :slight_smile:

I just tried the: FP Insert HTML method that you mentioned, without going into the page HTML code and it produced the same result by placing the <h1> tag into the code and leaves the page configured as I want. Actually, using the “Insert HTML” method would have been easier and quicker if I had followed that at first.:shifty:
:blush: jim

5

That will not necessarily work in all browsers. Most of that code was removed from the HTML standard back in 1997.

There is no such thing as a <font> tag any more.
There is no such thing as an align attribute any more.

Also it is invalid to wrap inline tags such as <b> around block tags such as <h1>.

The correct HTML to do that is:

<h1>CONTACT THE ARTIST</h1>

You would then have CSS that looks something like the following to style it:

h1 {color:#00f; font-size: 1.1em; font-family: verdana; text-align:center;font-weight:bold}

6

[QUOTE=felgall;5604341]That will not necessarily work in all browsers. Most of that code was removed from the HTML standard back in 1997.
There is no such thing as a <font> tag any more.
There is no such thing as an align attribute any more.
Also it is invalid to wrap inline tags such as <b> around block tags such as <h1>.

The correct HTML to do that is:
<h1>CONTACT THE ARTIST</h1>

>>> Jim: I tried that code combination and it DOESN’T WORK! I had to go to the page view and manually rearrange all of the information which FP then converted to quite a different code set-up in the HTML view.
Have you ever worked with Front Page?:rolleyes:
FP 2000 works very well for me.
jim :slight_smile:

7

[ot]It may work very well for you. But using mark-up that’s now ~13 years old (in tech time that’s ages) will not “work very well” for all modern browsers for any guaranteed amount of time.

You’ll only be able to apply “patches” for so long. You can’t rely on backwards compatibility being supported forever.

Continue to use FP2000 if that’s what you’re stuck with but don’t be surprised if you do some cross-browser compatibility testing and find that some browsers “fix” the mark-up for you in ways unexpected.

Personally, I would rather hand-code in plain old notepad rather than use FP2000 this long after its demise.
Don’t get me wrong, I’ve used FP2000 myself, had fun with it and liked using it back in the day.

But I guess this is a topic for another thread.[/ot]

8
Off Topic:

Yes, but the code it’s producing is from another century, and will not hold up for long. If you are going to do much web design, I encourage you to grab a modern HTML book or do a simple course—of which there are many. It’s well worth it. :slight_smile:

9

To be honest, I learned myself coding with FrontPage (an old version on a floppy, included in a computer magazine).
First just using the design view and the prefab FP buttons. Then I started to look “under water” in the code view, to see what was really happening in the code. That was interesting, but I didn’t understand everything. Next step: learning with Google! :slight_smile:
On the web and in forums I discovered that FrontPage had some build-in errors. And more and more I went into the code view to make the code myself without the FP failures. In the meantime I’d read about “CSS” (Cascade Style Sheets), which was an eyeopener.

Instead of putting all styling things into a messy html, you can split it in a clean html page and a connected stylesheet with all the design matter.
And more: a stylesheet can be used for more than 1 page: it is recyclable. That means: no more typing of repeated styling code in each page (for the header, the menu-styles, the font-sizes etc.), but once for all. What is very easy too: ion case you decide some time to change the style (for instance: a new background image, or an other font type), you can do that in the 1 stylesheet, and whoooosh, it’s applied in all pages. Wonderful! :slight_smile:

So I can advise you to go over to hand-coding the html, and to step in the world of CSS.
But I think words only aren’t enough, and made an example for you: the contact page in a new coat.

Comparing the code
The FrontPage emission:

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1252">
<META HTTP-EQUIV="Content-Language" CONTENT="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" Content="rainbowsedgefineart.com offers fine art for sale">
<TITLE>contact</TITLE>
<meta name="Microsoft Theme" content="clearday 011">
</HEAD>
<BODY id="main_body" background="_themes/clearday/cdbkgnd.jpg" bgcolor="#FFFFFF" text="#000000" link="#0033CC" vlink="#6699FF" alink="#00CC33"><!--mstheme--><font face="Verdana, Arial, Helvetica">
<p align="center"><img border="0" src="rainbows-edge-2.jpg" width="391" height="92" alt="Rainbow's Edge Fine Art logo"><font color="#0000FF" face="Arial" size="2"><a href="contact.htm"><br>
</a></font></p>
<h1 align="center"><!--mstheme--><font color="#000099">
<b><font color="#0000ff" size="6" face="Verdana">CONTACT THE ARTIST</font></b>
<!--mstheme--></font></h1>
<p align="center"><font face="Verdana, Arial, Helvetica"><font size="2"><a href="index.htm"><font face="Arial">Home</font></a><font face="Arial">&nbsp;&nbsp;</font>
<font color="#0000ff" face="Arial">|&nbsp;&nbsp; <a href="bio.htm">Bio</a>
&nbsp;<a href="http://users.smartgb.com/g/g.php?a=s&amp;i=g18-00040-d7"><br>
</a></font>
<font size="3" face="Arial"><br>
</font><b><font size="4" face="Arial"><i>To make an offer for Irene's artwork or
to get more details about&nbsp; purchases, contact the artist at:</i></font></b>
</font>
<p align="center"><font face="Verdana, Arial, Helvetica"></p>
<div align="center">
  <!--mstheme--></font><table cellSpacing="0" cellPadding="10" width="60%" bgColor="#EBEBEB" border="1" bordercolordark="#6699FF" bordercolorlight="#99CCFF">
    <tbody>
      <tr>
        <td align="center"><!--mstheme--><font face="Verdana, Arial, Helvetica">
          <p align="center"><font size="4" face="Arial"><b>Irene Nowicki</b><br>
          </font><font size="3" face="Arial">17950 Burbank Blvd.<br>
          Suite 21<br>
          Encino, CA 91316-1673</font></p>
        <!--mstheme--></font></td>
        <td><!--mstheme--><font face="Verdana, Arial, Helvetica"><p align="center" style="line-height: 150%"><font size="3" face="Arial">Studio: 818-757-3022<br>
          Cel: 818-770-9439<br>
  </font>
</font>
          <font size="3" face="Arial"><a href="mailto:.......">.......</a></font></p>
      <!--mstheme--></font></td>
        </tr>
      </tbody>
    </table><!--mstheme--><font face="Verdana, Arial, Helvetica">
</div>
<!--mstheme--></font></body>
</html>

The html of the new version:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Rainbow's Edge Fine Art | Contact the artist</title>
	<meta name="description" content="Contact options for the artist of RainbowsEdgeFineArt.com">
	<link rel="stylesheet" type="text/css" href="stylesheets/refa.css" />
</head>

<body>
	<div id="header">
		<a href="http://rainbowsedgefineart.com/"><img src="http://clba.nl/sitepoint/images/refa-logo-nw.png"
		width="290" height="100" alt="Rainbow's Edge Fine Art logo" title=""></a>
	</div>

	<p id="nav"><a href="/">Home</a> | <a href="bio.htm">Bio</a></p>

	<h1>CONTACT THE ARTIST</h1>

	<p><strong><em>To make an offer for Irene's artwork<br>
	or to get more details about purchases,<br>
	contact the artist at:</em></strong></p>

	<div>
		<span class="box">
			<strong>Irene Nowicki</strong><br>
			17950 Burbank Blvd.<br>
			Suite 21<br>
			Encino, CA 91316-1673
		</span><span class="box">
			<strong>&nbsp;</strong><br>
			Studio: 818-757-3022<br>
			Cel: 818-770-9439<br>
			<a href="mailto:...">.......</a>
		</span>
	</div>
</body>
</html>

And this is in the connected stylesheet:

/* refa.css */
/* rainbowsedgefineart.com */
html {
	height: 100%;
	padding-bottom: 1px;
	}
body {
	margin: 0;
	padding-bottom: 10px;
	background: url(http://clba.nl/sitepoint/images/refa-bg-nw.jpg);
	font-family: arial, helvetica, verdana, sans-serif;
	text-align: center;
	font-size: 100.1%;
	}
#header {
	padding: 25px 0 0 0;
	}
a img {
	border: 0;
	}
h1 {
	color: blue;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 2em;
	}
#nav  {
	color: blue;
	}
#nav a {
	margin: 0 5px;
	}
p {
	margin: 1em;
	padding: 0;
	}
.box {
	width: 15em;
	margin: 5px -2px;
	padding: 1em 0;
	background: #EBEBEB;
	border: 2px ridge #C0C0C0;
	display: inline-block;
	}

What I did with the html:

Some other benefits of the new version, because of the flexibility of css:

  • The page can be viewed in each screen size from small to big:

    [CENTER][/CENTER]
  • Page-size html (0,7kB) + stylesheet (0,4kB) together: 1,1kB. - That is less than the half of the old html-only version (was: 2,6kB)!

Extra:

Page speed new version (with the css and the new images): ca. 570ms for total 16,3kB (was: ca. 1.25sec for total 23.7kB).
Download time decreased with 55%. :slight_smile:

10

That floppy must be really old. The code it is generating has been obsolete since 1997. Browsers have changed a lot in the last 16 years and you can’t expect code written for Internet Explorer 3 to work properly in Internet Explorer 11 (or other modern browsers).

11

Yessir, it was once upon a time when the were only 5¼ inch floppy’s … prehistoric long ago! :smiley:
I hope I’ve made some progress since then. :wink:

12

The five and a quarter minifloppies aren’t prehistoric. The eight inch floppies were around for a long time before anyone ever thought of increasing the capacity and decreasing the size. More like stone age.

13

Franky:
Thanks for the tips and code. Your code for our Contact page is interesting but does not work for me whereas the Tidy-up code from W3C works very well with little adjustments in the FP program. I am beginning to study up on code via the web and it’s helping me “fix” my pages along with the codes I get at W3C Validator. I may not be able to use the code and version of Contact that you posted but I am gaining quite a lot from what you wrote about CSS and modern code so THANKS VERY MUCH for your feedback here.
:slight_smile: jim

14

Microsoft made Expression Web available as a free download when they declared it (Expression Web) dead. As it was the replacement for FrontPage and is free there’s no reason to stay with FrontPage - after all the most recent browser that FrontPage supports is Internet Explorer 6 - which is why Microsoft abandoned it many years ago and replaced it with Expression Web.

Effectively the only way to create web pages that work in modern browsers is to write all the HTML in it yourself. Just about ANY other editor will be quicker for doing that.

A better alternative even than Expression Web for WYSIWYG web editing is Blue Griffon - http://bluegriffon.org/ - a free WYSIWYG web editor that when used the right way will produce valid (or almost) HTML from the WYSIWYG interface.

As for direct editing of the HTML - even notepad is a better editor for that than FrontPage.

Switching to ANY other editor than FrontPage will have saved you hours of time by the time you get to working on your second web page.