How to add support for HTML5 markup in Oxygen

As of Oxygen 2.0, the HTML output by Search Form, Comments List and Comment Form elements (under WordPress) are not in HTML5 standard.

We can make these HTML5-ready by declaring theme support for them by simply adding the following code:

add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) );

A few improvements in the markup include the application of classes instead of IDs so multiple elements (like Search boxes) can be used and the addition of other useful features like placeholder text in the search form.

This can be done in a few different ways like using the Code Snippets plugin (set the snippet to run only on site front-end) or in a custom functionality plugin.

Note: Doing this may add screen reader text for accessibility reasons. This text can be hidden for normal users by adding this CSS (taken from Genesis):

/* Screen Readers */

.screen-reader-text {
    border: 0;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background: #fff;
    box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
    clip: auto !important;
    color: #333;
    display: block;
    font-size: 1em;
    font-weight: bold;
    height: auto;
    padding: 15px 23px 14px;
    text-decoration: none;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}

Custom sitewide CSS like this can be added in Customizer > Additional CSS or in Oxygen editor’s Manage Stylesheets.

Source: https://developer.wordpress.org/reference/functions/add_theme_support/#html5