Несмотря на популярность ютуба и то, что у каждого сейчас есть телефон с камерой, текст остается основным источником полезной информации, которую мы получаем из интернета.
Когда текст хорошо написан и оформлен — его легко и приятно читать, а когда плохо, то хочется выкинуть глаза не очень.
Существует множество правил оформления текста на экране, чтобы он был приятен глазу, которые пришли в веб из типографского дела: книг и газет. Часть описаны у Лебедева в ководстве еще в 2000 году.
И, хотя, я пользуюсь типографской раскладкой Ильи Бирмана и большую часть спец. символов типа длинных тире и кавычек «ёлочек» пишу на автомате, я никак не могу заставить себя расставлять неразрывные пробелы. Это такие пробелы, которые не дают переносить следующее за ними слово на новую строку.
Чтобы как-то решать этот вопрос есть огромные серьёзные и не очень библиотеки, типа этой. А я пользуюсь вот такой крохотной функцией:
/*нужен jQuery*/
function typo(selector) {
$(selector).each(function(){
$(this).contents().each(function(){
if (this.nodeType == 3) { /*только текстовые ноды*/
let text = this.textContent;
text = text.replace(/(\s)(\S+)$/gm, "\xa0$2");
text = text.replace(/(\s\S{1,3})(\s)(\S+)/gm, "$1\xa0$3");
text = text.replace(/(\d)(\s)(\S+)/gm, "$1\xa0$3");
text = text.replace(/(\s)(—)/gm, "\xa0$2");
this.textContent = text;
}
});
});
}
typo(".content p");
Она просто проходится по тексту и расставляет неразрывные пробелы за меня:
- после предлогов (на самом деле после любого слова длиной до 3-х букв, но это покрывает все возможные кейсы)
- между числом и словом (10 рублей, в 2021 году, 5 землекопов)
- перед длинным тире
- перед последним словом в предложении, чтобы не висело.
