Tech Note: The HTML5 Makeover

Coding
LGF • Views: 33,257

You may not have noticed any visible changes at LGF recently, but behind the scenes major infrastructure work has been under way, and the site is now powered by totally valid HTML5 code.

This was a bit trickier than I thought it would be when I started; some of the LGF code has been there for a long time, and it took a lot of reengineering, not always in obvious places.

For one example, when I first started testing with some of the new HTML5 tags like and , I was surprised to see the tags just disappearing from the code when I loaded the page. This weird behavior was puzzling until I realized it was being caused by PHP’s HTML Tidy library, which I’ve been using for years to clean up the code before outputting it.

The version of Tidy installed on our web server was not hip to these new HTML5 tags, and it was doing what it was supposed to do with unknown tags — stripping them out. After a bit of research into the Tidy docs, I came up with the following option settings to let Tidy know about all the new tags:

$tidyOptions = array(
	'show-body-only' => TRUE,
	'hide-comments' => TRUE,
	'new-blocklevel-tags' => 'article,aside,details,summary,figure,figcaption,dialog,header,footer,hgroup,section,nav,menu,datagrid',
	'new-inline-tags' => 'video,audio,canvas,ruby,rt,rp,command,mark,time,meter,progress',
	'new-empty-tags' => 'source',
	'output-html' => TRUE,
	'wrap' => 0,
);
$htmlText = tidy_repair_string($htmlText, $tidyOptions);
?>

I may have missed one or two HTML5 tags, but I think that gets most of the important ones.

This HTML5 makeover is a big first step toward the eventual redesign I have planned, using adaptive techniques to make LGF much more compatible with smartphones, tablets, and other mobile devices.

Jump to top

Create a PageThis is the LGF Pages posting bookmarklet. To use it, drag this button to your browser's bookmark bar, and title it 'LGF Pages' (or whatever you like). Then browse to a site you want to post, select some text on the page to use for a quote, click the bookmarklet, and the Pages posting window will appear with the title, text, and any embedded video or audio files already filled in, ready to go.
Or... you can just click this button to open the Pages posting window right away.
Last updated: 2023-04-04 11:11 am PDT
LGF User's Guide RSS Feeds

Help support Little Green Footballs!

Subscribe now for ad-free access!Register and sign in to a free LGF account before subscribing, and your ad-free access will be automatically enabled.

Donate with
PayPal
Cash.app
Recent PagesClick to refresh
Why Did More Than 1,000 People Die After Police Subdued Them With Force That Isn’t Meant to Kill? An investigation led by The Associated Press has found that, over a decade, more than 1,000 people died after police subdued them through physical holds, stun guns, body blows and other force not intended to be lethal. More: Why ...
Cheechako
Yesterday
Views: 43 • Comments: 0 • Rating: 0
A Closer Look at the Eastman State Bar DecisionTaking a few minutes away from work things to read through the Eastman decision. As I'm sure many of you know, Eastman was my law school con law professor. I knew him pretty well because I was also running in ...
KGxvi
Yesterday
Views: 99 • Comments: 1 • Rating: 1