XF 1.0 Semantic HTML

From the outset, XenForo has been built with semantic HTML in mind in order to facilitate styling, boost SEO and give a helping hand to screen reading software.

The W3C provides a useful Semantic data extraction tool that allows the efficacy of this approach to be tested.

Take a look at how easily the tool extracts the important content from an example thread here on XenForo.com:

Semantic Data Extraction for 'Multi-page Navigation Enhancement' thread

 

[Disjunto]

excellent job. bet google loves you

 

[CBI Web]

EXCELLENT! +1000

 

[welshstew]

Brilliant, although you are using iframes for the facebook bits - is there no way around this?

 

[Kier]

Brilliant, although you are using iframes for the facebook bits - is there no way around this?

We are looking into switching to the Facebook Javascript API in due course.

 

[moojiolu]

I like this a lot! I bet Google does, too. A question though. How will BBCodes be extracted? Will they still have their original format, or will they have raw HTML?

 

[welshstew]

We are looking into switching to the Facebook Javascript API in due course.

Schweet

 

[Floris]

Yay, FB js SDK! Asynchronous loading too

 

[Enigma]

First I'll say excellent job! It's better than the competitors. One thing that I'd ask for is that all the "site chrome"/navigation stuff/boilerplate stuff come after the page's content. This is good for SEO (search engines like the content first) and accessibility purposes (screenreaders, for example). Using CSS, you move the navigation/boilerplate stuff up to the top for a regular page view, but if you remove styles, it would come at the bottom. A standard Wikipedia page (Cows, for instance) exemplifies this well. View it and the boiler plate stuff is at the top and left. View it without page styles and you get a "jump to navigation" link near the top, and the content immediately follows. At the end of the HTML are all the lists of navigation and action links.

EDIT: XenForo already does this. My bad.

 

[Princeton]

great example of some carefully thought out planning

 

[Floris]

Having bad eye sight, simply having something that looks beautiful is one thing, but the ability to turn off js and css and still read the page clearly, is very nice. Just because html5 recommendation is respected.

 

[Floris]

Hm, that said, for some reason Safari's "shift command R" doesn't work.
http://dl.dropbox.com/u/693961/xf_safari_reader.mov

... yet

 

[jmurrayhead]

This is awesome

 

[Kier]

First I'll say excellent job! It's better than the competitors. One thing that I'd ask for is that all the "site chrome"/navigation stuff/boilerplate stuff come after the page's content. This is good for SEO (search engines like the content first) and accessibility purposes (screenreaders, for example)

We already do that...

 

[Alluidh]

Kier, which browsers are officially supported?

An interesting question ...

 

[Kier]

Officially I have no concrete answer for you on that, but I can tell you that we test in Firefox 4.x and 3.6, Google Chrome (latest), Apple Safari (latest), Opera (latest) on both Windows and Mac, Internet Explorer versons 8, 7 and 6, and with Safari under iOS.

The rendering of all those is virtually identical, with the exception of Internet Explorer which loses shadows and rounded corners, and then gracefully degrades below IE8. IE6 still needs a little work, but I think you'll find the system perfectly useable when browsing with it, and it won't make your eyes bleed to look at it.

 

[Floris]

The top 5 browsers, latest stable versions.
With legacy support for older versions, and some mobile versions.

Chrome 4 and 5, but previous should work
Firefox 3.6 and 3.7, but 3.0 should work too
Safari 4 and 5, but safari 3 should work too
Operate 10.5 and 10.6, but anything over 9 should work too
Internet Explorer 8, but 6 and 7 should work too.

Where should work = core functionality works, smexy stuff probably doesn't. such as shadows, rounded corners, wysiwyg editors or few other special effects.

If you have a modern browser, and newer version of it, it will work. If your browser supports xhtml 1.0 or higher, and css1 or higher, it will do just fine. If it supports html5 and css3, it will do even better.

I've run XF on most of them, on Mac/Windows, and I have not tested Ubuntu desktop yet. I haven't found a browser yet that showed 'major' issues or broken designs.

 

[Enigma]

We already do that...

So you do. My apologies. I had looked at the page source a couple days ago and for some reason I had the idea that it wasn't quite like that. Good job and keep up the good work!

 

[Kier]

So you do. My apologies. I had looked at the page source a couple days ago and for some reason I had the idea that it wasn't quite like that. Good job and keep up the good work!

Cheers

Apologies unnecessary - actually you're right - it wasn't like that a few days ago, I was waiting for a few styling issues to get resolved before I made the step to move it.

 

[Forsaken]

This is the main reason I'm planning to adopt this system .