HTML5 Error on Body Element

3 Views

When I run the W3C validator for this page: http://getinjuryanswers.com/practice-areas/dog-bites/, the outline view tells me:

  1. Body Element with no heading,
  2. Nav element with no heading, and
  3. Section element with no heading

I can’t add an H tag to those areas. Is there a way to change the HTML5 in Genesis/Wordpress so that those 3 areas don’t register as part of the outline?

Read More

Thanks.

W3C: https://validator.w3.org/nu/?doc=http%3A%2F%2Fgetinjuryanswers.com%2Fpractice-areas%2Fdog-bites%2F&showoutline=yes

Sorry for all the code, but below is the BODY code, Nav Code, and first article. 

<body class="page page-id-31 page-child parent-pageid-25 page-template page-template-practice-areas-template page-template-practice-areas-template-php header-image header-full-width content-sidebar" itemscope="itemscope" itemtype="http://schema.org/WebPage"><div class="site-container"><header class="site-header navbar navbar-fixed-top" role="banner" itemscope="itemscope" itemtype="http://schema.org/WPHeader" id="header"><div class="container"><div class="title-area navbar-brand"><p class="site-title" itemprop="headline"><a href="http://getinjuryanswers.com/" title="San Diego Personal Injury Attorney"><img src="http://getinjuryanswers.com/wp-content/themes/start/images/logo.png" alt="San Diego Personal Injury Attorney" title="San Diego Personal Injury Attorney"></a></p></div><div class="mobile_menu navbar-default" role="navigation"><button type="button" class="navbar-toggle toggled" data-toggle="collapse" data-target=".navbar-collapse"><span class="sr-only">Toggle navigation</span><i></i></button></div><nav class="nav-secondary navbar-collapse pull-right in" role="navigation" itemscope="itemscope" itemtype="http://schema.org/SiteNavigationElement"><p class="tel hidden-xs hidden-sm"><a href="tel:6195257007">(619) 525-7007</a></p><ul id="menu-home-menu-2" class="menu genesis-nav-menu menu-secondary nav navbar-nav pull-right"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-39"><a href="/">Home</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-40"><a href="http://getinjuryanswers.com/about-us/">About us</a><ul class="sub-menu"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-41"><a href="http://getinjuryanswers.com/about-us/curtis-quay/">Curtis Quay</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-42"><a href="http://getinjuryanswers.com/about-us/vikas-bajaj/">Vikas Bajaj</a></li></ul></li><li class="menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor current-menu-ancestor current-menu-parent current-page-parent current_page_parent current_page_ancestor menu-item-has-children menu-item-45"><a href="http://getinjuryanswers.com/practice-areas/">Practice Areas</a><ul class="sub-menu"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a href="http://getinjuryanswers.com/practice-areas/boating-accidents-attorneys/">Boating Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47"><a href="http://getinjuryanswers.com/practice-areas/car-accidents/">Car Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48"><a href="http://getinjuryanswers.com/practice-areas/child-injuries-attorneys/">Child Injuries</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"><a href="http://getinjuryanswers.com/practice-areas/construction-accidents-attorneys/">Construction Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-31 current_page_item menu-item-50"><a href="http://getinjuryanswers.com/practice-areas/dog-bites/">Dog Bites</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-73"><a href="http://getinjuryanswers.com/practice-areas/elder-abuse-attorneys/">Elder Abuse</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-51"><a href="http://getinjuryanswers.com/practice-areas/san-diego-motorcycle-accident-attorney/">Motorcycle Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-52"><a href="http://getinjuryanswers.com/practice-areas/san-diego-pedestrian-accident-lawyer/">Pedestrian Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-53"><a href="http://getinjuryanswers.com/practice-areas/slip-and-fall-attorney/">Slip and Fall Accidents</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-54"><a href="http://getinjuryanswers.com/practice-areas/toxic-exposure-attorneys/">Toxic Exposure</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-55"><a href="http://getinjuryanswers.com/practice-areas/wrongful-death/">Wrongful Death</a></li></ul></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-43"><a href="http://getinjuryanswers.com/blog/">Blog</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-44"><a href="http://getinjuryanswers.com/contact-us/">Contact Us</a></li><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-134"><a href="http://getinjuryanswers.com/abogado-de-lesiones-personales-en-san-diego/">Español</a></li></ul></nav></div></header><section id="hero-dog-bites" class="hero-wrapper section_wrapper"><div class="hero"><article class="hero"><img class="hero-article-img" src="/wp-content/uploads/2015/07/san-diego-dog-bites-attorney.jpg" width="1584" height="477" alt="san diego dog bite attorney"><div class="info"><div class="container"><div class="table-grid"><div class="table-row"><div class="column column-one"><div class="cell"><p class="h2">Are you a<br><strong>dog bite victim?</strong></p><p class="large"><strong>Let us help you get compensation<br> for your injury.</strong></p><p class="hero-button"><a class="btn btn-info btn-lg" href="/contact-us/">Start your <strong>FREE</strong> consultation</a></p><p class="hero-button visible-xs"><a class="btn btn-info btn-lg" href="tel:6193877497">Call us</a></p></div></div><div class="column column-two"><div class="cell visible-xs visible-sm visible-lg"></div></div></div></div></div></div></article></div></section><div class="site-inner"><div class="content-sidebar-wrap"><div class="container"><div class="row"><main class="content col-xs-12 col-sm-12 col-md-7" role="main" itemprop="mainContentOfPage"><div class="breadcrumb" itemprop="breadcrumb"><span xmlns:v="http://rdf.data-vocabulary.org/#"><span typeof="v:Breadcrumb"><a href="http://getinjuryanswers.com" rel="v:url" property="v:title">ITL Home</a> / <span rel="v:child" typeof="v:Breadcrumb"><a href="http://getinjuryanswers.com/practice-areas/" rel="v:url" property="v:title">Our Practice Areas</a> / <span class="breadcrumb_last">Dog Bites</span></span></span></span></div>
Post Views: 3

Related posts

3 comments

  1. The outline feature of the W3C HTML checker is purely informative (I know because I’m the person who added the feature to it…). The [body element with no heading] message doesn’t indicate an error. Instead it’s just stating a fact. I think the only way to not have that message appear is to not have an h1–h6 element as a direct child of the body element. But since it’s fine for an HTML document to not have a h1–h6 element as a direct child of the body element (depending on what the purpose of the document it is), then you shouldn’t worry about it. It’s not broken or invalid or bad. It’s not something you need to fix.

  3. Late answer here for what it might be worth:

    After validating my code with the w3 nu validator, Access Assistant tool in Firefox and both macOS and iOS’ safari screen readers, no errors are showing, and it all works.

    Not exactly sure how the semantic structure is different from other attempts, but here is a sample for others to analyze and try out if needed:

    >>here’s a codepen with styling and JS

    <!DOCTYPE html>
<html lang="es">

<head>
    <title>Title for browser tabs specific length.</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>

<body style="overflow-x: hidden;">
    <header class="bg-top">
        <div class="dinblock mb pl w75 vertical-al-mid" style="width: 74%;height: 99%;">
            <h1 class="my0 txc1">
                <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="1" y="1" width="100%" height="100%" viewBox="0 0 120 20" preserveAspectRatio="xMinYMin meet" style="width: 100%;height: 100%;" aria-labelledby="svg_titlemanusis" aria-describedby="svg_descmanusis">
                    <title id="svg_titlemanusis">Manualsistemas</title>
                    <desc id="svg_descmanusis">Empresa de estructuras fotovoltacias.</desc>
                    <style>
                        .manualsistemas {
                            fill: currentcolor;
                            font-size: 12px;
                            letter-spacing: .15px;
                            font-weight: 500;
                        }

                        .manuf {
                            fill: currentcolor;
                            font-size: 6px;
                            letter-spacing: .15px;
                        }
                    </style>
                    <text textLength="120" lengthAdjust="spacing" xml:space="preserve" text-anchor="start" x="0.25" y="12" class="manualsistemas orbitron" font-size="12" fill="currentcolor" style="fill:currentcolor;font-size:12px;">manualsistemas</text>
                    <text textLength="119" lengthAdjust="spacing" xml:space="preserve" text-anchor="start" x="0.5" y="18" class="manuf" font-size="6" fill="currentcolor" style="fill:currentcolor;font-size:6px;">manufacturas numéricas del aluminio</text>
                </svg>
            </h1>
        </div>
        <div id="myInput" tabindex="0" aria-haspopup="true" class="dinblock txtcent vertical-al-mid" style="width: 24%;height: 99%;">
            <h2 id="menuelement" class="my0 dinblock txc1" style="width:99%;height: 99%;">
                <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="1" y="1" width="40" height="10" viewBox="1 1 40 10" preserveAspectRatio="xMinYMin meet" style="width: 99%;height: 99%;max-height: 112px;max-width: 125px;" aria-hidden="true">
                    <style>
                        .name {
                            fill: currentcolor;
                            font-size: 10px;
                        }
                    </style>
                    <text xml:space="preserve" text-anchor="middle" x="21" y="7" class="name outw" font-size="10" fill="currentcolor" style="fill:currentcolor;font-size:10px;">menú</text>
                </svg>
            </h2>
            <div class="dinblock out1 txtcent" style="width: 49%;height: 99%;">
                <div id="menuToggle" class="out2" style="width: 99%;height: 99%;max-height: 87px;max-width: 76px;">
                    <input id="dropdown" type="checkbox" title="menu" style="width: 99%;height: 99%;" />
                    <span class="bgc1"></span>
                    <span class="bgc1"></span>
                    <span class="bgc1"></span>
                </div>
            </div>
            <ul class="navul" id="dropdown-content" style="text-align: left!important;" aria-expanded="false">
                <li class="ml navli">
                    <a href="cnc.html">
                        <p>Control numérico informático</p>
                    </a>
                </li>
                <li class="ml navli">
                    <a href="informacion.html">
                        <p>Como contactarnos</p>
                    </a>
                </li>
                <li class="ml navli">
                    <a href="index.html">
                        <p>Nuestra empresa</p>
                    </a>
                </li>
                <li class="mb0 ml navli">
                    <a href="contacto/formpage.html">
                        <p>Datos sobre el aluminio</p>
                    </a>
                </li>
            </ul>
        </div>
        <div class="dinblock w100 vertical-al-mid" style="width: 99%;height: 99%;">
            <h3 class="txc1">
                <svg class="pl" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="1" y="1" width="100%" height="100%" viewBox="1 1 161.3 11.6" preserveAspectRatio="xMinYMin meet" style="width: 99%;height: 99%;" aria-labelledby="svg_titleestruct" aria-describedby="svg_descestruct">
                    <title id="svg_titleestruct">Estructuras de aluminio</title>
                    <desc id="svg_descestruct">Estructuras fotovoltaicas en aluminio:</desc>
                    <style>
                        .estruct {
                            fill: currentcolor;
                            font-size: 12px;
                            letter-spacing: 1px;
                        }
                    </style>
                    <text xml:space="preserve" text-anchor="start" x="1" y="12" class="estruct" font-size="12" fill="currentcolor" style="fill:currentcolor;font-size:12px;">Estructuras de Aluminio</text>
                </svg>
            </h3>
        </div>
        <div class="dinblock mt w100" style="width: 99%;height: 99%;">
            <p class="mb0 txc1">
                <svg class="pl" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="1" y="1" width="100%" height="100%" viewBox="1 1 151 8" preserveAspectRatio="xMinYMin meet" style="width: 99%;height: 99%;" aria-labelledby="svg_titlelaca" aria-describedby="svg_desclaca">
                    <title id="svg_titlelaca">Slogan de empresa</title>
                    <desc id="svg_desclaca">La calidad protege nuestro trabajo</desc>
                    <style>
                        .laca {
                            fill: currentcolor;
                            font-size: 6px;
                            letter-spacing: 1.6px;
                        }

                        .fstlet {
                            fill: currentcolor;
                            font-size: 6px;
                            letter-spacing: 1.6px;
                        }
                    </style>
                    <text xml:space="preserve" text-anchor="start" x="1.3" y="7.1" class="laca" font-size="6" fill="currentcolor" style="fill:currentcolor;font-size:6px;">
                        <tspan xml:space="preserve" text-anchor="start" x="1.55" y="7.1" class="laca fstlet orbitron txc2" font-size="6" fill="currentcolor" style="fill:currentcolor;font-size:6px;">l</tspan>a calidad protege nuestro trabajo.
                    </text>
                </svg>
            </p>
        </div>
    </header>


</body>

</html>

    Any constructive criticism and or clarification regarding the reason behind my somewhat random positive result, are both much appreciated.

Comments are closed.