archelon

Во-первых, в любом случае надо взять тех.требования для файлов у "печатников". Там уже освещено куча важных моментов.
Во-вторых, нужно изначально все делать в цветовой моделе CMYK.
В-третьих, нужно не забывать про границы и расположение информации. Я считаю, что от обрезного края до текста должно быть 3мм минимум, лучше больше.
В-четвертых, нужно помнить, что на разных бумагах ваше творчество будет смотреться очень по разному.
В-пятых, как по мне самое важное - ВСЕГДА согласовывайте макеты, цветопробы и пробники материалов у ответственного лица с подписью.

Недавно была отличная и наглядная статья на эту тему. Там расписаны самые частовстречаемые "узкие" места в подготовке к печати.

з.ы.: Да и про черный цвет в предыдущем коменте - это тоже очень важно. Расползание черного на составляющие - это одна из самых распространенных проблем и при конвертации файла из RGB в CMYK, поэтому лучше изначально делать все в CMYK.

з.з.ы.: В векторных редакторах (Иллюстраторе и Кореле) очень удобно при предварительном просмотре перед печатью посмотреть как файл раскладывается на цвета (Колор сепарейшен) - сразу видно все косяки.

Не знаю насколько интересно, но может кому пригодится. Частями найдено на просторах интернета, использую в своем template + normalize.
Заменяем длинный текст placeholder многоточием:

input[placeholder]          {text-overflow:ellipsis;}
input::-moz-placeholder     {text-overflow:ellipsis;} 
input:-moz-placeholder      {text-overflow:ellipsis;} 
input:-ms-input-placeholder {text-overflow:ellipsis;}

Скрываем placeholder при фокусе:

:focus::-webkit-input-placeholder {color: transparent}
:focus::-moz-placeholder          {color: transparent}
:focus:-moz-placeholder           {color: transparent}
:focus:-ms-input-placeholder      {color: transparent}

Курсор для label + отмена раздражающего выделения при клике:

label {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

Только вертикальный ресайз для textarea (horizontal часто ломает диз):

textarea {
	resize: vertical;
}

Убираем дефолтный курсив у address:

address {
	font-style: normal;
}

Убираем подсветку полей:

input:focus,
textarea:focus {
		outline: none;
}

Адаптивные img:

img {
	height: auto;
	max-width: 100%;
	width: auto\9;
}

Адаптивные видео:

.video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.video iframe,  
.video object,  
.video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

Перенос слов:

.break-word {
        word-wrap: break-word;
}

Обнуляем списки глобально, т.к. часто используется для навигации и проч., в области контента можно задать другие стили.

ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

Нумерованный список с подпунктами:

ol {
	counter-reset: list1;

	li:before {
		counter-increment: list1;
		content: counter(list1) '. ';
	}

	ol {
		counter-reset: list2;

		li:before {
			counter-increment: list2;
			content: counter(list1) '.' counter(list2) '. ';
		}

		ol {
			counter-reset: list3;

			li:before {
				counter-increment: list3;
				content: counter(list1) '.' counter(list2) '.' counter(list3) '. ';
			}
		}
	}
}

update дополнительно стили для печати

P.S. Что-то конечно юзается не всегда, по желанию лишнее удалить, замечаниям и критике буду рад.

Бесплатные коллекции шрифтов:
www.google.com/fonts
webfont.ru/category/#all
Не знаю, обычные ли это или "более дизайнерские"

Для начала отмечу, что нет необходимости оборачивать заголовок в дополнительный тэг в вашем случае.
Рассмотрим варианты.

1. Заголовок и описание.

<header>
    <h2>Заголовок</h2>
    <p>Описание к заголовку</p>
</header>

Так как описание является продолжением заголовка в семантическом смысле, мы должны объединить их в одно смысловое целое, сохранив при этом разделение собственно заголовка и описания. Для этого используется тэг header, который, согласно спецификации, служит контейнером для создания шапки какого-либо элемента (не заголовка, а шапки).

2. Несколько заголовков.

<hgroup>
    <h1>Титульный заголовок</h1>
    <h2>Подзаголовок</h2>
</hgroup>

Так как у нашей секции несколько заголовков разного веса, их так же стоит семантически связать. Для этой цели можно использовать hgroup, который, согласно спецификации, служит для группирования нескольких заголовков. Но, так как его убрали из спецификации, полагаю, эту роль возьмет на себя header.

3. Ваш вариант.
<h2>Заголовок</h2>
Заметьте, у вас всего лишь один элемент, который не требует группировки с чем-либо. Он самодостаточен, и по смыслу соотносится с секцией, в которой находится. Нет никакого смысла выделять ему дополнительный контейнер в данном случае.