Как сделать красивее: HTML+CSS или изображениями?

Question

Дмитрий Подабед @debian2

Full-stack эксперт

Как сделать красивее: HTML+CSS или изображениями?

Channel%2BArt%2BTemplate%2B%2528Photosho

Есть в голове такая шапка для сайта. При адаптивности надпись "Кэдди пахнет деревьями" должна оставаться сверху по центру и чуть слева также должно быть дерево, лучи, которые отходят от слова "пахнет", должны упираться в края видимой области. Надпись и дерево, естественно, должны изменять размер под размеры экарана. Для всего этого есть SVG и шрифт. По адресу caddysmelledliketrees.ru есть черновик. Если центральную надпись было сделать просто, то что делать с деревом и лучами? Сейчас пошёл путём рисования. Нагуглил рисование круга на CSS, полоски через <hr>. Вот что пока есть:
CSS:

@import url('http://webfonts.ru/import/hagin.css');

html {
    text-align: center;
    background: #f4f4f4;
    color: #0a0a0a;
}

*::-webkit-selection {
    background: #0a0a0a;
    color: #f4f4f4;
}

*::-moz-selection {
    background: #0a0a0a;
    color: #f4f4f4;
}

*::-ms-selection {
    background: #0a0a0a;
    color: #f4f4f4;
}

*::-o-selection {
    background: #0a0a0a;
    color: #f4f4f4;
}

*::selection {
    background: #0a0a0a;
    color: #f4f4f4;
}

img {
    padding: 2em;
    width: 3em;
    display: inline-block;
}

.caddysmellsliketrees {
    margin: auto;
}

.caddy, .smells, .like_trees {
    font-family: 'Hagin Caps';
    font-weight: normal;
    text-transform: uppercase;
    line-height: 0.95em;
    text-align: center;
    width: auto;
}

.caddy {
    font-size: 6em;
    padding-top: 0.1em;
}

.smells {
    font-size: 5.3em;
}

.like_trees {
    font-size: 3.3em;
}

.filled_circle {
    background-color: #0a0a0a;
    height: 2em;
    width: 2em;
    -webkit-border-radius: 1em; /*50% of height and width*/
    -moz-border-radius: 1em; /*50% of height and width*/
}

hr {
    border: 0.2em solid #0a0a0a;
}

.half-open_line_segment_left {
    position: fixed;
    left: auto;
}

.half-open_line_segment_right {

}

.tree {

}

HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset='utf8'>
        <meta content='Кэдди пахнет деревьями' name='description'>
        <title>Кэдди пахнет деревьями</title>
        <link rel='shortcut icon' href='./image/favicon.ico' />
        <link href='./css/main.css' rel='stylesheet'>
    </head>
    <body>
        <div class='half-open_line_segment_left'>
            <hr>
            <div class='filled_circle'>
            </div>
        </div>
        <div class='caddysmellsliketress'>
            <div class='caddy' title='Кэдди'>
                Кэдди
            </div>
            <div class='smells' title='пахнет'>
                пахнет
            </div>
            <div class='like_trees' title='деревьями'>
                деревьями
            </div>
        </div>
        <a href='https://vk.com/caddysmelledliketrees' title='https://vk.com/caddysmelledliketrees'><img src='./image/vk.svg' alt='VK'></a>
        <a href='https://instagram.com/caddysmellslike' title='https://instagram.com/caddysmellslike'><img src='./image/instagram.svg' alt='Instagra'></a>
        <a href='https://youtube.com/channel/UCDUU-xPtMQ2VOpYaMv-OvLw' title='https://youtube.com/channel/UCDUU-xPtMQ2VOpYaMv-OvLw'><img src='./image/youtube.svg' alt='YouTube'></a>
        <a href='http://last.fm/ru/music/%D0%9A%D1%8D%D0%B4%D0%B4%D0%B8+%D0%BF%D0%B0%D1%85%D0%BD%D0%B5%D1%82+%D0%B4%D0%B5%D1%80%D0%B5%D0%B2%D1%8C%D1%8F%D0%BC%D0%B8' title='http://last.fm/ru/music/%D0%9A%D1%8D%D0%B4%D0%B4%D0%B8+%D0%BF%D0%B0%D1%85%D0%BD%D0%B5%D1%82+%D0%B4%D0%B5%D1%80%D0%B5%D0%B2%D1%8C%D1%8F%D0%BC%D0%B8'><img src='./image/lastfm.svg' alt='LastFM'></a>
        <a href='https://soundcloud.com/caddysmelledliketrees' title='https://soundcloud.com/caddysmelledliketrees'><img src='./image/soundcloud.svg' alt='SoundCloud'></a>
        <a href='https://caddysmelledliketrees.bandcamp.com' title='https://caddysmelledliketrees.bandcamp.com'><img src='./image/bandcamp.svg' alt='BandCamp'></a>
    </body>
</html>

Собственно, как лучше поступить? Рисовать и позиционировать блоки? Или просто впихнуть картинку?