Разница между display: none и visibility: hidden?

Оба правила скрывают элемент на странице. display: none — скрывает элемент со страницы, убирает элемент из основного потока, скрывает контент для поисковых роботов, элемент доступен лишь в DOM дереве. visibility: hidden — скрывает элемент со страницы, но не убирает из основного потока. В итоге он не виден, но занимает отведенное ему место в основном потоке.