diff --git a/src/pages/post.md b/src/pages/post.md index 331da73..0ee1981 100644 --- a/src/pages/post.md +++ b/src/pages/post.md @@ -9,9 +9,12 @@ description: 'Сomplete list of posts' --- - ## 2020 +- [RU] [Typographic linter](/post/2020/typographic_linter/) + + Prettier для текста. Автоматизация рутинной типографики. + - [RU] [Initial post](/post/2020/initial_post/) Какие инструменты были использованы для создания этого сайта, какие решения были приняты и почему. diff --git a/src/pages/post/2020/typographic_linter.md b/src/pages/post/2020/typographic_linter.md new file mode 100644 index 0000000..593a51a --- /dev/null +++ b/src/pages/post/2020/typographic_linter.md @@ -0,0 +1,75 @@ +--- + +layout: post + +lang: 'ru' +date: '2020-11-18' + +year: '2020' +section: 'post' + +title: 'typographic linter' +description: 'Prettier для текста. Автоматизация рутинной типографики.' + +--- + +# Типографика как code style + +## Основы + +Для того чтобы тексты было удобно читать и неудобно писать, человечество придумало разные правила. С орфографией и пунктуацией всё понятно, но про типографические правила говорят редко. + +Типографика - набор правил вёрстки текста призванных повысить эстетику и читаемость. Именно в таком порядке, потому что люди сначала замечают текст и только потом начинают читать. + +Про шрифты, отступы и прочие кернинги в этот раз говорить не будем, потому что мне понравилось крутить ползунки в [Typography.js](https://github.com/KyleAMathews/typography.js) и не переживать об эстетике. + +Разговор пойдёт про висячие предлоги и прочие тире с кавычками. + +## Проблематика + +Сайты в интернете делятся на два типа: те, кто запаривается за подготовку текстов, и те, кто забивает. [Meduza.io](https://meduza.io/) расставляет неразрывные пробелы в текстах новостей, а [rbc.ru](https://www.rbc.ru/) - нет. Это не единственное отличие этих новостных порталов, но очень знаковое, как мне кажется. + +### Нужно забить! + +Я прекрасно понимаю тех, кто не запаривается. Часть не знает, часть забивает ([Вастрик](https://vas3k.ru/), например), а у остальных user-generated content, который довольно рисковано автоматически форматировать. Аргументы для каждой группы: + +- И так всё понятно; +- Условный Markdown со спецсимволами теряет половину обаяния; +- Правильные автоматические кавычки-ёлочки не сделают из комментария в facebook литературный памятник, зато случайный японский эмотикон может разрушить цивилизацию:
+`Прости ^_^" Забыл купить "Доширак"` превращается в
+`Прости ^_^« Мы испортили »Твой текст«`; +- У студентов должен быть отдельный курс по расшифровке смайликов и компилированию C++ из чатов. Бонусный аргумент. + +### Нужно запариться! + +Википедия утверждает, что [типографика](https://ru.wikipedia.org/wiki/%D0%A2%D0%B8%D0%BF%D0%BE%D0%B3%D1%80%D0%B0%D1%84%D0%B8%D0%BA%D0%B0) - это "свод строгих правил", но список не показывает и ссылок не даёт. Стандартом де-факто в рунете являются правила из [§ 62 «Ководства»](https://www.artlebedev.ru/kovodstvo/sections/62/). С ними или соглашаются, или [громко спорят с некоторыми](https://medium.com/@kapanaga/62-6c664105dd30). + +Пусть мне и не нравится полное отсутствие у Лебедева обоснований или ссылок на источники, но самому погружаться в историю вопроса и читать какой-нибудь авторитетный [«Справочник издателя и автора»](https://www.artlebedev.ru/izdal/spravochnik-izdatelya-i-avtora-2017/) страшно: в нём 1010 страниц. + +Авторы, которые хотят радовать читателей с помощью тире, обычно не пишут в блокноте (мне так кажется) или носят свои тексты из блокнота в [Типограф](https://www.artlebedev.ru/typograf/) от Артемия Лебедева, а потом назад. Про первых я ничего не знаю, а ко вторым сам отношусь, когда нужно причесать один или два текста. + +У Типографа и аналогичных веб-сервисов есть фундаментальные проблемы: + +- Копировать текст из редактора в браузер, а потом назад - неудобно; +- Сервис может быть офлайн в неподходящий момент, я тоже; +- Сервис может читать мои тексты до публикации; +- Некоторые тексты никому нельзя показывать (по разным причинам); + +Признаюсь, что раньше я ни разу не думал об использовании типографа вне браузера, но как только образовалась перспектива заниматься этим на постоянной основе, стало понятно, что копировать текст из редактора в браузер и назад - не самое оптимальное решение и нужно что-то с этим делать. + +## Решение + +Очевидный вариант - научить текстовый редактор автоматически расставлять неразрывные пробелы, исправлять мелкие опечатки, приводить кавычки к правильному виду, заменять дефисы на тире в нужных местах и многое другое.
+Вот [плагин для VS Code](https://marketplace.visualstudio.com/items?itemName=rusnasonov.vscode-typograf). + +Мне больше нравится другой подход. Мы уже давно используем линтеры для языков программирования, давайте использовать их и для контента. + +Конечно, я не первый, кто так подумал. Плагин выше построен на основе замечательной библиотеки [typograf](https://github.com/typograf/typograf) и прямо в README.md файле этого проекта можно найти ссылки на плагины для Babel, Gulp и Grunt. + +Библиотека очень гибко настраивается, умеет применять [сотню готовых правил](https://github.com/typograf/typograf/blob/dev/docs/RULES.ru.md) и позволяет легко добавлять кастомные. + +В комплекте есть cli-утилита, которая умет читать файлы, форматировать их и выводить результат в консоль, но почему-то не умеет файл перезаписывать. Поэтому для своих целей я написал небольшой скрипт, который принимает локаль, имя файла и изменяет его содержимое. С правилами тоже пришлось немного поиграть, потому что дефолтные принимают списки за диалоги и ломают markdown-разметку :) + +Теперь для расстановки всех хитрых значков не нужно ходить в браузер, достаточно просто запустить скрипт, посмотреть с помощью `git diff` на результат и закоммитить нужные изменения. + +Красивые тексты лучше некрасивых.