How to style a button

I’m fairly sure I understand what you want to do; what I don’t understand is why you want to do it.

Your problem, as stated, is that you are linking to the same content from two different pages, and you don’t want Google to penalise you for duplicate content. (It’s most unlikely they would; they’d simply show one page in search results and not the other.)

Your chosen solution to this is to open the link in a new window/tab (I’m not entirely clear how this helps the Google issue), and you now want to use JS to create a button which will close that window/tab.

It has been explained to you that simple links to a single page are both the easiest solution and the recommended solution. It has further been explained that opening links in a new tab/window is considered bad practice for reasons of usability and accessibility. And while it may not have been mentioned in this topic, I’m pretty sure I’ve already pointed out to you that if you use JavaScript for basic functionality, you need to ensure your site still functions with it disabled.

Despite all that, your chosen solution is still to open and close a new tab/window using JavaScript, and you want help creating and styling a button to accomplish the “close”.

If that’s not an accurate summary, then I apologise; I have, indeed, misunderstood the issue and I would be grateful if you could explain it again.

If that is accurate, then I suggest you first read http://webaim.org/techniques/hypertext/hypertext_links#new_window, which explains techniques to make opening new tabs/windows more user-friendly. I suggest you also read up on accessible use of JavaScript: http://webaim.org/techniques/javascript/. Otherwise, you may be solving your own perceived problem at the risk of creating problems instead for your site users.

2 Likes