Как правильно делать popup?

блока-попапа где то на главной странице(где лучше всего?) и скрывать его через css

так обычно и делают.
А про лучшую реализацию посмотрите как сделаны у fancybox и magnific можно втупую забрать их стили

position: fixed;
top: 40%; //в зависимости от высоты попапа.
Размещайте где угодно, смотря зачем его используете. У меня, например, используется для выведения развернутой информации по пункту (ссылке на попап). Это на рядовых страницах. Регистрация/вход - на главной. И ли может не понял вопроса.

Создаётся блок с position: fixed; top, left и т.д. параметрами где бы вы хотели чтоб блок выглядывал. Даёте блоку display: none;

Дальше вам нужно будет написать небольшой кусочек JS, что при клике на какой-то элемент вам нужно повесить класс popup-active на этот блок и он успешно появится, а при нажатие на крестик или ещё куда-нибудь он успешно закроется.

popup-active в css дайте display: block;

Если же хотите чтоб Поп-Ап сразу появился на сайте, то делайте тоже самое что я описал выше, только немного наоборот. Сначала поп-ап даёте display: block; а при нажатие на крести или ещё куда-нибудь, навешиваете ему класс popup-off.

У popup-off разумеется задаёте display: none;

Очень легко это.