Логотип и заголовок

Способ разместить логотип и заголовок с кратким описанием в шапке сайта. Размещённый логотип с заголовком в шапке сайта, который ссылается на главную страницу, на многих сайтах как стандарт.

Результат:

Логотип и заголовок с кратким описанием в шапке сайта
Логотип и заголовок с кратким описанием

HTML

<header>
  <div class="logo">
    <h1><a title="htmlhook.ru" rel="home" href="http://htmlhook.ru/">htmlhook.ru</a></h1>
        <p>Скрипты для веб-приложений</p>
  </div>
</header>

CSS

.logo {
    font-family: arial, sans-serif;
    padding-left: 64px;
    background: url(http://htmlhook.ru/logo.jpg) 0 50% no-repeat;  /* логотип */
}
.logo, .logo > * { /* блок */
    display: inline-block; 
    margin: 0;
}
.logo h1 {
    line-height: 45px;
    font-size: 45px;
}
.logo h1 a {
    color: DarkSlateGray;
    text-decoration: none;
    display: inline-block;
}
.logo p { /* краткое описание */
    font-size: 12px;
    text-transform: uppercase;
    text-align: justify;
    display: table;
    color: sienna;
    background-color: GhostWhite;
			
    letter-spacing: .3277ex; 
}

Если нужно меню, баннеры, поиск и т.д. расположить с правой стороны блока, им нужно добавить правило стиля display: inline;