Adventures with h1 tags..

**pauland** · 15 June 2009, 10:46 PM

I thought that since XWD doesn't support generation of h1 tags and text styles, I'd have a go at doing my own version. After some experiments I have a close result but it's not right. I wonder if anyone can find the missing link here?

The goal was to take the html output from XWD and add h1 tags to it (lets say because I wanted to do that - SEO relevant or not), but still retain the WYSIWYG of XWD.

The problem with just adding a <h1> tag is that it immediately restyles the text that it encloses blowing away the layout. What I have been looking for is a universal style definition that could be added to the default h1 style so that it would take on the appearance of the parent div rather than the default h1 styling. I can get the appearance right, but the vertical position is wrong. Any suggestions?

I've attached an image - the top text should have been between the red lines - it is styled with h1 tags.

The lower one is without h1 applied.

I've also attached my h1 tamperings and the original web file.

Here is my h1 style mod:

<h1 style="font:inherit; position:inherit; top:inherit; padding:inherit; border:inherit;">

I'm not sure if what I'm doing is possible, but if it is, we would be able to add h1 tags for SEO after XWD page generation. It's just an experiment.

Paul

**covoxer** · 16 June 2009, 05:45 AM

Here's the working variant.
But! It doesn't work in IE7 (neither original nor mine). So far I have also tested it in Opera and FF and both are ok.

**pauland** · 16 June 2009, 08:15 AM

Originally Posted by covoxer

Here's the working variant.
But! It doesn't work in IE7 (neither original nor mine). So far I have also tested it in Opera and FF and both are ok.

Thanks for looking in John. Yes, you're right. It seems that ie doesn't really do font:inherit. Incorporating the font style from the enclosing div, it does work as expected. Hmm.

It looks as though this would be a workable solution for a few h1 headlines without breaking the layout - sort of a manual version of "mark this text as h1".

Thanks John.