display: none; completely disappears the element from the web page, why would we use
The only advantage we may acquire by using
visibility: hidden; over
display: none; will be for layout purposes. If after having the value
none on the
display property, our web layout changes from what we want it or need it to be, then
visibility: hidden; will be our best option. That said, neither option is accessible to most screen readers, which allow the visually impaired to interact with web pages, therefore options, like positioning the element outside the boundaries of the screen and changing its opacity value to provide transparency, might be things worth exploring when thinking on inclusiveness.