is there anyway to make something in <h1> tags smaller to fit in with normal sized text that would be on the rest of the page [for SEO reasons] cheerio
If you're using CSS, just enter this in your stylesheet: h1 { font-size: 1em; font-weight: normal; } The second declaration makes the H1 font weight normal instead of bold - now your <h1> text should look exactly like your <p> text. See this page for example: http://nettome.info/ ... and the stylesheet: http://nettome.info/stylesheet.css Hope this helps.
you could also use CSS h1 { font-size:12px; font-weight: normal } If you dont want all h1 to be the same you could also use classes example: .mainheader { font-size:12px; font-weight: normal } This would apply to <h1 class="mainheader">text here</h1> EDIT --> Hey dlcmh looks like we were both thinking the same thing at the same time!
For SEO purposes your H1 tags should vary from your normal text. This isn't to say that it should be drastically different, but it should be different in some way. Otherwise you face a possible penalty from the Search Engines. This is along the same lines as having hidden text on a page (text the same colour as the background) were it me I would use dlmch's method but change the line font-size: 1em; to font-size: 1.1em; Not so big of a difference as to be that noticble but different enough not to incur any search engine penalties. I might also change the colour of the text. Say your normal text coulour is #000000, then I would use #000001 for the header text. Also if there is a font variant which is super close to your normal text then that would be even more differentiation as seen by the search engine but not by your visitors... Provided it doesn't mess with the layout that much. For instance if your default font is Arial I might use Geneva. The differences between the two fonts are very minimal.
* { margin:0; padding:0; font-size:100.01%; font-family:Arial, Helvetica, sans-serif; } This is a modified version of the universal reset that I use ( with a font size and font family, which override the browser default sizes and apply them to ALL elements ). In firefox, html.css makes all first level headings 2em. Most browser default font sizes are 16 pixels, so an h1 without any styling would equal to about 32 pixels. The 100.01% will override the 2em so an h1 will be 16 pixels, and so will every other element. Now if I were to make the <body> 62.5%, each element would be 10 pixels. This is easy because i can do p { font-size:1.1em; } and that would be equal to about 11 pixels, 2em would be 20 pixels, etc. This method (originally posted on Clagnut) assumes the browsers default font size is 16 pixels, and there may be a chance that someone modified the default browser font size, which is why I recommend that you at least set the minimum font size on elements such as paragraphs to 1.2em, so even if one changed their default font size, it's still big enough to be readable. 1.2em would be 12 pixels, and if they changed their default font size to say.. 20 pixels then .625 * 20 * 1.2 = 15 pixels. If they set it to 14 pixels, .625 * 14 * 1.2 = 10.5 pixels, and that's more readable than a default 1em which would be 8.75 pixels