Паша!

Аккуратно подобранные расстояния помогают направить взгляд читателя, выявить структуру, придать объектам значение, выделить главное и второстепенное. В свою очередь, неудачно выбранные или одинаковые отступы нарушают иерархию и создают связи там, где это не нужно.

На первом скриншоте я насчитал пять почти одинаковых отступов:

Заголовок, дата, ссылка на сайт, переключалка, задача и описание свалены в одну кучу, а потом по-разному оформлены, чтобы отличаться друг от друга. Однако в результате из-за каши стилей и похожих вертикальных расстояний строки после заголовка выглядят как набор случайных не связанных друг с другом абзацев. Содержание страницы сложно усвоить.

Чтобы не совершать ошибки, важно различать элементы вёрстки: заголовок, подзаголовок, текст, подпись, ссылки. Уменьшим количество стилей и приведём модуль к эталонному виду — заголовок с текстом. Чем ближе модуль к эталонному, тем проще его воспринимать. Заголовок сделаем составным: дату поставим над ним (получим бирку), а переключалку поставим под ним (вместо подзаголовка). Ссылку на сайт переставим в правую колонку, задачу превратим в первый абзац текста:

Чтобы бирка, подзаголовок или основной текст не влезли в интерлиньяж заголовка, рекомендую проверять вертикальные отступы сразу на двух строках.

Теперь, когда конструкция не вызывает сомнений, можно попробовать выделить задачу и посмотреть, «выдержит» ли эталонный модуль: