chris-pearce

<div role="search">
    <form class="t1-form form-search js-search-form" action="/search" id="global-nav-search">
        <label class="visuallyhidden" for="search-query">Search query</label>
        <input class="search-input" type="text" id="search-query" placeholder="Search Twitter" 
        name="q" autocomplete="off" spellcheck="false" aria-autocomplete="list" 
        aria-expanded="false" aria-owns="typeahead-dropdown-7" dir="ltr">
        <span class="search-icon js-search-action">
            <button type="submit" class="Icon Icon--search nav-search" tabindex="-1">
                <span class="visuallyhidden">Search Twitter</span>
            </button>

chris-pearce

<button type="button" class="modal-btn modal-close js-close" 
aria-controls="global-tweet-dialog-dialog" aria-describedby="global-tweet-dialog-body">
    <span class="Icon Icon--close Icon--medium">
        <span class="visuallyhidden">Close</span>
    </span>
</button>

chris-pearce

<button class="c-menu-button" aria-haspopup="true" aria-expanded="false" type="button">
    <strong class="c-menu-button__label">Chris Pearce</strong>
    <img class="c-menu-button__avatar" src="gravatar-url" alt="Avatar of Chris Pearce" width="30" 
    height="30">
    <span class="u-hide-visually">Open the sub menu with the enter key and close it with the 
    escape key; use the up and down arrow keys to navigate.</span>
    <svg class="c-menu-button__arrow" aria-hidden="true">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#drop-down-trigger-arrow"></use>
    </svg>
</button>

chris-pearce

<form action="/w/index.php" id="searchform" role="search">
    <div id="simpleSearch">
        <label for="searchInput" class="h-hide-visually">Search Wikipedia (shortcut key 
        combination: ctrl-option-f)</label>
        <input type="search" name="search" placeholder="Search" accesskey="f" id="searchInput" 
        tabindex="1" autocomplete="off">
        <input type="hidden" value="Special:Search" name="title">
        <input type="submit" name="go" value="Submit search" id="searchButton" 
        class="searchButton">
    </div>

chris-pearce

<form action="/w/index.php" id="searchform">
    <div id="simpleSearch">
        <input type="search" name="search" placeholder="Search" 
        title="Search Wikipedia [ctrl-option-f]" accesskey="f" id="searchInput" tabindex="1" 
        autocomplete="off">
        <input type="hidden" value="Special:Search" name="title">
        <input type="submit" name="go" value="Go" 
        title="Go to a page with this exact name if it exists" id="searchButton" 
        class="searchButton">
    </div>

chris-pearce

<button class="header-nav-button time-icons time-icons-menu" type="button">
    <span class="h-hide-visually">Navigation menu</span>
</button>

chris-pearce

<a class="header-nav-button time-icons time-icons-menu" title="Click to show site navigation"></a>

chris-pearce

.h-hide-visually {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px ;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

chris-pearce

<button class="feed-carousel-control feed-left" type="button">
    <span class="h-hide-visually">View the previous lot of 4 items</span>
    <span class="gw-icon feed-arrow" aria-hidden="true"></span>
</button>

<button class="feed-carousel-control feed-right" type="button">
    <span class="h-hide-visually">View the next lot of 12 items</span>
    <span class="gw-icon feed-arrow" aria-hidden="true"></span>
</button>

chris-pearce

<a class="feed-carousel-control feed-left" href="#" aria-hidden="true">
    <span class="gw-icon feed-arrow"></span>
</a>
<a class="feed-carousel-control feed-right" href="#" aria-hidden="true">
    <span class="gw-icon feed-arrow"></span>
</a>