Should I use the <p> tag or the <div> tag here?

Question

I feel pretty stupid when asking this question, because I'm sure it will be just an opinion, not the correctness that will prevail.

But I have a "button" which is fixed in the lower right part of the screen, which the user can click to open the chat window.

I currently have this:

<div id="chatbtn">Sales help online</div>

I chose the <div> tag so that search engines do not consider it to be the main text element. Should I choose a <p> for semantic correctness here? ... or maybe even <input type="button">

What do you think?

Answer 1

The button has its own tag:

 <button type="button" id="chatbtn">Sales help online</button> 

The default type is sometimes presented in such a way that it’s best practice to always say “normal button, not send”.

If you need to consider it as a block element, you can place it inside with a <div> or manually change its style to display: block; .

Referring to what you said, <input type="button"> is certainly not correct in your case, since it forms an element and you do not have a form here, so the button tag "pure" is more suitable.

Answer 2

Always try to use the semantic correct element. If you want to create a button, use the <button> element. If you want to display a paragraph, use <p> . If you want to group elements in a container without the semantic information provided to this container, use a <div> .

Answer 3

For the button itself, you can use input type=button if there is nothing special (like here) or button type=button if you need richer formatting (for example, an image or line break inside a button).

As a shell element outside of it, use a div if the button just needs to appear on a separate line, p if you want to additionally have empty space above and below (in the case of rendering without CSS), there is no real semantic difference between these elements; in specifications and use of HTML, p means a paragraph only in the free sense (see, for example, HTML5 p ).

In any case, since the button appears to be controlled by JavaScript and does nothing when JavaScript is disabled, it would be better to generate the element (and possibly the including element) dynamically in JavaScript, instead of having it as a static part of an HTML document .