Links...Buttons... HTML5

Both <button> and <a> are clickable elements. To place one inside of another makes no sense and will only confuse screen readers (including search engine bots).

Come to think of it, if <button> is not of the type 'submit' or 'reset' within a form, it becomes a useless clickable element unless we use JS to perform an action. Outside of a form element, it could be used to send the user to another link as per

<button onclick="window.location.href='http://www.hyperlinkcode.com/button-links.php'" role="link">Go to Hyperlink</button>

To keep screen readers happy, I think that it be made clear that this is a button that acts as a link.

Taffypro  wrote Hi, I am accustomed to creating links using the <a> tag.  Suddenly I am confused when creating a button and the proper way to apply a tag using HTML5. I’ve read conflicting information about this and am wondering what is the proper way to do it.  I’ve read that it should be within a <form> tag, wrap the <a> tag around the button, assign it to class=“button”,or it should be javascripted(??) <a href="https://www.mywebsite.com/html/"><button>Visit our Website!</button></a> ?? Thanks for the help.

Wrapping an anchor tag around a 'button' tag is not vaild any longer in html5, I think.

If you're linking to a page I would just use the normal anchor tag:

<a href="https://www.mywebsite.com/html/">Visit our Website!</a>

If you are doing something with jquery/javascript:

<button class="myButton">Click Me</button>

$('.myButton').click(function() {

alert('clicked');

}

or

var myButton = document.querySelector('.myButton');

myButton.addEventListener('click', myFunction);

function myFunction() {

alert('clicked');

}

You can use it also in a form and submit your form using javascript insead of a 'submit type' form field.