Semantic HTML5 structure and Google penalty I'm in need for clarity. I'm at an annoying step in my development of a website, and I have read a lot about semantic structure etc, but I'm a bit nervous for my current structure, so I would like to ask your expertise to see, if I might get problems with search engine bots with this setup.

&lt;body itemscope itemtype="http://schema.org/WebPage"&gt;
    &lt;a class="skip-link screen-reader-text" href="#content"&gt;Skip menuen&lt;/a&gt;
    &lt;header class="site-header" itemscope itemtype="http://schema.org/WPHeader"&gt;
        &lt;h1&gt;
            &lt;a class="site-title-link" href="https://crafthouse.dk"&gt;
                &lt;svg id="header-logo" class="header-logo" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="title desc" viewBox="0 0 158 24.7"&gt;
                    &lt;title id="title" itemprop="headline"&gt;Brand Name&lt;/title&gt;
                    &lt;desc id="desc" itemprop="description"&gt;- brand description&lt;/desc&gt;
                    &lt;!-- A lot of svg logo code here --&gt;
                &lt;/svg&gt; 
            &lt;/a&gt;
        &lt;/h1&gt;
        &lt;nav itemscope itemtype="http://schema.org/SiteNavigationElement"&gt;
            &lt;button id="hamburger-btn"&gt;
                &lt;span&gt;&lt;/span&gt;
                &lt;span&gt;&lt;/span&gt;
                &lt;span&gt;&lt;/span&gt;
                &lt;span&gt;&lt;/span&gt;
            &lt;/button&gt;

            &lt;div id="site-navigation" class="site-navigation"&gt;
                &lt;ul class="navigation-list"&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                    &lt;li&gt;&lt;a class="navigation-link" href="#"&gt;page&lt;/a&gt;&lt;/li&gt;
                &lt;/ul&gt;
            &lt;/div&gt;

            &lt;div id="menu-speciel" class="menu-speciel"&gt;
                &lt;div class="nav-btn-wrap"&gt;
                    &lt;button id="siteLogin" class="nav-btn"&gt;
                        &lt;span class="screen-reader-text"&gt;Admin login&lt;/span&gt;
                        &lt;svg class="nav-admin-icon nav-icons"&gt;
                            &lt;use xlink:href="img/generel/svg-system.svg#admin-icon"&gt;&lt;/use&gt;
                        &lt;/svg&gt;
                    &lt;/button&gt;
                &lt;/div&gt;
                &lt;button id="siteSearch" class="nav-btn"&gt;
                    &lt;span class="screen-reader-text"&gt;Søg&lt;/span&gt;
                    &lt;svg class="nav-search-icon nav-icons"&gt;
                        &lt;use xlink:href="img/generel/svg-system.svg#search-icon"&gt;&lt;/use&gt;
                    &lt;/svg&gt;
                &lt;/button&gt;
            &lt;/div&gt;
        &lt;/nav&gt;
    &lt;/header&gt;

    &lt;main id="content" class="main" itemscope itemprop="mainContentOfPage" itemtype="http://schema.org/WebPageElement"&gt;
         &lt;h2&gt;Main content header&lt;/h2&gt; 
    &lt;/main&gt;

    &lt;footer itemscope itemtype="http://schema.org/WPFooter"&gt;

    &lt;/footer&gt;


In the outline it will look like this:


Brand name - brand description


untitled nav
Main content header
Semantically, a heading should contain text, not an image.

Also, somewhat more important from an SEO perspective, the &lt;h1&gt; element should relate to the specific page. Unless this site is a single page, having the same &lt;h1&gt; on every page would be a very bad idea.

Generally, ranking for the company name is a given (unless the company is called 'Cheap Viagra Cialis Online ltd"...).

I would remove the heading tag from the page header:

    &lt;header class="site-header" itemscope itemtype="http://schema.org/WPHeader"&gt;
        &lt;a class="site-title-link" href="https://crafthouse.dk"&gt;
            &lt;svg id="header-logo" class="header-logo" xmlns="http://www.w3.org/2000/svg" role="img" aria-labelledby="title desc" viewBox="0 0 158 24.7"&gt;
                &lt;title id="title" itemprop="headline"&gt;Brand Name&lt;/title&gt;
                &lt;desc id="desc" itemprop="description"&gt;- brand description&lt;/desc&gt;
                &lt;!-- A lot of svg logo code here --&gt;
            &lt;/svg&gt; 
        &lt;/a&gt;
        &lt;nav itemscope itemtype="http://schema.org/SiteNavigationElement"&gt;


And swap the &lt;h2&gt; in the content section for an &lt;h1&gt;:

&lt;main id="content" class="main" itemscope itemprop="mainContentOfPage" itemtype="http://schema.org/WebPageElement"&gt;
     &lt;h1&gt;Main content header&lt;/h1&gt; 
&lt;/main&gt;