How can i create a button that opens another page in html?

Question

HTML

Answer 1

Wrapping the button inside a <a> tag seems to work

<a href="https://google.com/">
<button type="button">Google</button>
</a>

(Edit)
Upon a note from my friend EmmanueLZ, I had just found out that such approach is invalid. So I'm proposing another approach by the use of `window.open` method.

https://www.w3schools.com/jsref/met_win_open.asp

<button type="button" onclick="window.open('https://www.google.com/', '_blank');">Google
</button>

Answer 2

Use javascript for this purpose.

There are plenty of things which can be done using javascript.

Else simply use anchor tag and make it to look like a button using css

Answer 3

In writing and markup, a functionality which when clicked will open a web page is called 'hyperlink'. Hyperlinks in HTML are created with anchor <a> tags. It is not semantically correct to use a <button> for this.

Bikila Ketema Can you give more details on why you want to use a button?

In my opinion, you should use <a> tags. You can style them like a button with css but you should not except it performs as a button e.g an "open cart" link. If that is the case make sure to give it a role="button" attribute.

Answer 4

Now listen, there are many ways to do this both in js, php and html. Based on your question, you can simply use anchor tags <a href="http://">Button</a>
But in js, you can use window.location property

Answer 5

Ipang ,Bikila Ketema hi
Indeed despite the fact that a button nested in an <a> tag work, when go and check your code in the w3c validator, it raises an error.
-->button is not allowed to be used as a descendant of an <a> tag....
I don't know why, maybe because of semantics accessibility and search engines, they don't explain.
Depending what your working on, though, it have to be considered.
But it do work....

Answer 6

EmmanueLZ.
Thank you for the heads up 🙏
I didn't validate it just saw it worked 😁
Will note that ...

Answer 7

Ipang , you're welcome, I did the same, coding a bunch of that on a page, thought it was ok but then the validation and had to change everything.🤪

Answer 8

I have got the Answer, Thanks!

Answer 9

simple::

<a href="another.html"><button>click</button></a>