Если Вы подтянули знания, то почему бы и нет?!
Настойчивость, целеустремленность!

"Стучите - и Вам откроют!"

Меня, вероятно, закидают тапками, но я так же как и Вы и как Юпитер Макс верстаю старым дедовским методом)

Но есть и и другие современные методы.

+ С помощью сборщиков: gulp (уже устарел) , webpack.
Быстро собирают все файлы, минимизируют css\js файлы, оптимизируют картинки, установка необходимых бибилиотек и прочее.

+ С помощью препроцессоров: css - sass\scss\less, html - pug.

+ С помощью js фреймворков: vue, react, ...

Но все это подходит для каких-нибудь глобальных проектов, потому как одна только настройка такого сборщика займет много времени (чтобы там не говорили что раз настроил и пользуешься - это не так, каждый проект все равно приходится "донастраивать", обновлять и т.д).

Препроцессоры, как по мне, тоже не совсем удобные инструменты. Автопрефиксы есть в emmete любого редактора кода, т.е. уже не нужно писать\вставлять дополнительные sass\less ф-ии и прочие возможности препроцессора (миксины, экстенды, переменные, ... ) проще и быстрее написать ручками простым css)

Это все лично мое мнение.

Стандартно же, на любом сайте можно посмотреть реализацию.

Обертка или ссылка, внутри изображение:

<a href="#" class="img__link"> <img src="path" /></a>

дальше используются псевдоэлементы:

a { display: block; position: relative; }

a:after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5);  opacity: 0; }

a:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url(icon-path); opacity: 0; }

a:hover:before,
a:hover:after { opacity: 1; }

Второй вариант (больше подходит если вн. есть еще и текст описание):

<a href="#" class="img__link"> 
  <img src="path" />
  <span class="img__mask"><i class="img__icon"></i></span>
</a>

Стили примерно те же:

a { display: block; position: relative; }

.mask { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.5);  opacity: 0; }

a:hover:after {
  opacity: 1;
}