1

I'm wondering if I should bother providing a fallback for HTML5 tags and attributes and CSS3 styling at this point in time.

I know that there's probably still a lot of people out there who use older versions of browsers and HTML5/CSS3 are still fairly new.

I read this article: Should I use non-standard tags in a HTML page for highlighting words? and one answer mentioned that people kind of "cheat" with older browsers by using the new tags and attributes, but styling them in CSS to ensure they show up right. This question: Relevance of HTML5: Is now the time? was asked about two years ago and I don't know how relevant it is anymore.

For example, I want to use the placeholder and required attributes in a web form I'm building and it has no labels to show what each <input> is. How do I handle this, or do I bother?

Community
  • 1
Abluescarab
  • 521
  • 5
  • 14
  • A topic that would be relevant for review would be progressive enhancement. – Jack Stone Jun 29 '12 at 04:18
  • @ClintNash From what I'm seeing, "progressive enhancement" is the concept of supporting older browsers while still using cool new features. So providing "fallbacks" for older browsers, even ones rarely used (such as IE6 and etc.) is still a good idea? I've been doing it up to this point, but it was just getting tedious, hence the question. – Abluescarab Jun 29 '12 at 04:28

1 Answers1

1

It really is up to who is your target audience? Is it fair to expect decent level of techiness (read: probably uses the latest browsers), so it would be a non-issue to use whatever technology the last couple versions of the major browsers support. If you can expect a sizable portion of the visitors using outdated browsers, you might want to consider using fallbacks.

In almost all cases, that means creating a separate CSS for mostly Internet Explorer, heh. For the issues not related to formatting, there's the possibility of using a separate container page for a HTML 4.01-based version. But of course keep the content separate, so you don't have to maintain two versions of the same data!

A simplified example, using PHP:

<html>
...
<?php
    $browser = new SupportChecker();
    if($browser->supports('html5') == true) {
        echo '<section id="news">';
        include('content.txt');
        echo '</section>';
    } else {
        echo '<div class="news">'
        include('content.txt');
        echo '</div>'
    }
?>
...
</html>

Of course for an actual page, a more sensible way to achieve that would be used. The above is just a description of the idea. The same will apply for the header of the page. You could start the page with the inclusion of a header based on the support:

<?php
    $browser = new SupportChecker();
    if($browser->supports('html5') == true) {
        include('html5_header.txt');
        $_SESSION['support'] = 'html5';
    } else {
        include('regular_header.txt');
        $_SESSION['support'] = 'regular';
    }
?>

That could be usable, I would presume. Then just compare to the session variable.

Juha Untinen
  • 983
  • 6
  • 14
  • I've been using fallbacks since I learned about HTML5 and CSS3, it just gets tedious after a while, supporting browsers that aren't updated (which, you know, I don't blame people who don't update if they can't afford a new version of their OS). As it is, this is in general, so I suppose I should look at the audience for each separate project I do. Thanks! – Abluescarab Jun 29 '12 at 07:33
  • Checking browser capabilities *on the server* is a bad, bad idea. – tdammers Jun 29 '12 at 07:45
  • @tdammers Do you mean checking browser capabilities as the user loads the page? Or something else? – Abluescarab Jun 30 '12 at 13:23