Lorem ipsum: что это такое, откуда взялся и где взять текст-рыбу

Что такое Lorem ipsum?

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

Слова в нём подобраны не случайно. Лоскуты взяты из трактата Цицерона «О пределах добра и зла»: GeekBrains указывает, что первая строка «Lorem ipsum dolor sit amet» происходит из раздела 1.10.32. Само «lorem» осталось от слова dolorem, которое, по описанию Практикума, потеряло первый слог. Смысл фразы для макета не важен: точный перевод слов значения не имеет.

Историю находки рассказывает Марк Пак. В итоге поиска латинист Ричард МакКлинток из колледжа Hampden-Sydney в Вирджинии взял одно из редких латинских слов, consectetur, проследил его по цитатам в античной литературе и вышел на «De Finibus Bonorum et Malorum». Выходит, бессмыслица в макетах имеет автора и дату рождения: текст ему больше двух тысяч лет.

Есть и забавный эпизод вокруг перевода. По данным The Guardian, о которых пишет Lorem Ipsum, Джасприт Сингх Бопарай решил перевести текст на английский так, чтобы он остался таким же нелепым, как латинский:

настолько же бессвязным на английском, насколько он бессвязен на латыни

Джасприт Сингх Бопарай, переводчик Lorem ipsum, в материале Lorem Ipsum

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

История текста: от Цицерона до Letraset

Чаще всего пересказывают легенду о безымянном печатнике XVI века, который показывал заказчикам образцы шрифтов на этом отрывке. Rusbase относится к ней скептически: вся история держится на заметке самого МакКлинтока, а других доказательств нет.

Вместо легенды у Rusbase есть улика из книжной серии. Для Loeb Classical Library, издаваемой Гарвардским университетом, Харрис Рэкхем перевёл этот абзац на английский в начале прошлого века. В англо-латинском издании слово dolorem обрывается ровно там, где начинается новая страница. Отсюда вывод: как заглушка текст начал жить не раньше выхода этого издания.

Версия с Letraset остаётся рабочей теорией: Rusbase не выдаёт её за окончательную и допускает, что когда-нибудь найдётся более ранний пример. Для практики важнее другое: за десятилетия отрывок обкатали типографы и дизайнеры, и теперь любой редактор готов вставить его одним кликом.

• I век до нашей эры: Цицерон создаёт трактат «О пределах добра и зла», из которого позже вырежут отрывок.
• XVI век: по легенде, неизвестный печатник показывает шрифты на искажённой латыни, но доказательств нет.
• Начало прошлого века: выходит английский перевод Рэкхема в серии Loeb Classical Library.
• 60-е годы: Letraset ставит отрывок в рекламу переводных шрифтов.
• 80-е годы: Aldus переносит практику в издательскую систему PageMaker, а затем заглушка попадает в редакторы.

Как заглушка попала в редакторы

Самый ранний найденный пример применения относится к 60-м годам прошлого века. Британская Letraset продавала переводные шрифты и ставила отрывок в свою рекламу, а в 80-х практику переняла Aldus, которая выпускала издательскую систему PageMaker. В том же материале Rusbase сказано, что дизайнеры заполняют макеты искажённой версией трактата из-за одной находки маркетолога Letraset.

Британская компания Letraset продавала именно переводные шрифты, поэтому ей нужен был нейтральный текст для образцов. Затем отрывок перекочевал в Photoshop, Word и другие программы. По словам GeekBrains, при выборе инструмента «Текст» в Photoshop редактор сам подставляет Lorem ipsum нужного размера. Создатели Lipsum добавляют, что многие программы вёрстки и HTML-редакторы используют его как текст по умолчанию.

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

Зачем в макете нужна текст-рыба?

Главная причина проста: читаемый текст перетягивает внимание. Практикум объясняет, что в макете на знакомом пользователям языке человек начинает вчитываться и теряет из виду дизайн. Lipsum формулирует то же: при оценке композиции читаемый текст мешает сосредоточиться.

Вторая причина касается работы с заказчиком. GeekBrains разбирает типичный случай: дизайнер показал макет с осмысленным текстом, заказчик прислал правки по формулировкам, до фонов и кнопок дело не дошло, и дизайнер потратил время на корректировку текста вместо своей работы. Итог для проекта: выросли стоимость и срок разработки. Заглушка возвращает обсуждение к форме: цветам, отступам, иерархии блоков.

Простые замены хуже, чем кажутся. Пять раз вставленная фраза «Здесь будет текст» выглядит неестественно. Серые или чёрные полосы тоже работают: Практикум замечает, что зритель понимает, где будет текст, и не пытается его читать. Но такая схема не показывает шрифт и не показывает, как лягут строки.

Текст-рыбу используют и для проверки вёрстки. Timeweb отмечает, что с её помощью оценивают, насколько контент вписывается в дизайн и не «плывёт» ли вёрстка. Подробнее о том, как макет превращается в страницу, читайте в разборе про вёрстку.

• макеты сайтов, лендингов и мобильных приложений;
• оценка внешнего вида шрифта, например в Google Fonts;
• логотипы и брендинг, где слова нужны только как форма.

Иногда заглушка становится частью дизайна. Художники студии Sequence разработали для Chipotle серию бумажных пакетов и написали на них отрывок lorem ipsum маркером от руки, об этом рассказывается в том же материале. Результат: пакеты с латынью-фактурой, где авангард смешан с шуткой для своих, а на столах остались следы маркера. Заказчик получил упаковку с характером, а дизайнеры доказали, что бессмысленный текст воспринимается как узор. В обычном макете такой приём не нужен.

Плюсы и минусы Lorem ipsum

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

Минусы вылезают позже. Когда настоящий текст приходит, в дизайне часто нужны правки, от отступов до размеров компонентов. Хуже всего другое: по словам Практикума, если держать рыбу до последнего, растёт риск запустить страницу с Lorem ipsum.

Особая история с кириллицей. Skillbox советует для макета с русским текстом брать кириллический плейсхолдер: в кириллице слова в среднем длиннее, а буквы неоднородны по ширине, поэтому ритм предложений отличается от латиницы. Латынь показывает шрифт, но обманывает по высоте абзаца, и макет, нарисованный на ней, при замене текста может разъехаться.

Есть случаи, где Lorem ipsum лучше не брать вовсе. В том же материале Skillbox их четыре:

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

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

Генераторы и плагины для рыбы

Начать можно с редактора, в котором вы работаете. Практикум называет плагины для Figma: Lorem Ipsum, Lorem Ipsum Generator и FishText in Russian. Если вы рисуете в Photoshop, нужный объём подставится автоматически, как описывал GeekBrains.

Среди сайтов Практикум выделяет Lipsum: в фильтрах можно указать число абзацев, слов, байтов или списков. Это оригинал, и он же предупреждает о главном. На оригинальной странице создатели пишут, что у большинства вариантов есть неприемлемые для серьёзного проекта модификации, поэтому выбирайте проверенный классический текст.

Для русского языка есть собственные генераторы. Практикум описывает «РыбаТекст»: русский генератор на основе советского кода речей, где можно задать число абзацев и получить текст с канцеляризмами и стилистикой стенгазеты. Это вариант для макетов, где нужны кириллические буквы и русский ритм слов. Фантазийные тексты полезны для презентации заказчику, но в рабочий файл их лучше не тащить: шутка в стенгазетном стиле может случайно уйти в публикацию.

Выбирая инструмент, ориентируйтесь на три параметра:

1. Язык. Для русских страниц берите кириллическую рыбу, для международных проектов классическую латынь.
2. Объём. Задавайте число абзацев, слов или знаков под реальные блоки, а не одним куском на всю страницу.
3. Формат. Если генератор отдаёт чистый HTML или текст, скопируйте его сразу в нужное поле без лишней разметки.

Чем опасен Lorem ipsum на готовой странице?

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

Яндекс Справка относит страницы-«заглушки» и черновики к тем, что не предназначены для посетителей. Если такие страницы попадут в поисковый индекс, по описанию Справки, они могут конкурировать с важными страницами и дезориентировать пользователей. Для владельца это означает прямую задачу: пока текст не готов, страницу надо закрыть от индексации.

Закрыть можно двумя способами. Директива noindex запрещает роботу индексировать текст страницы, и она не будет участвовать в результатах поиска. Директива Disallow в robots.txt запрещает обход разделов или отдельных страниц. Для тестовой версии обычно подходит закрытие целиком, а перед запуском закрытие снимают.

Проверить результат поможет Яндекс Вебмастер. Откройте Индексирование, затем Страницы в поиске, вкладку Исключённые страницы, и посмотрите, что робот обошёл и не добавил в поиск. Если среди проиндексированных страниц есть заглушки, закрывайте их и просите удалить из поиска.

Перед публикацией пройдитесь по короткому чек-листу:

1. Найдите в шаблонах и текстах слова lorem, ipsum и dolor sit amet: поиск по проекту и по админке CMS займёт минуту.
2. Проверьте заголовки, meta-описания и подписи к картинкам: там заглушку забывают чаще всего.
3. Убедитесь, что тестовая версия закрыта от индексации и не открывается по старому адресу.
4. После запуска посмотрите страницы в Вебмастере и откройте сайт глазами пользователя.

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

Как заменить заглушку настоящим текстом

Замена текста выглядит мелочью, но именно здесь рождаются большие правки. Поэтому порядок работы стоит продумать заранее, ещё до начала вёрстки. GeekBrains замечает, что копирайтер и дизайнер нередко работают одновременно, и текст на этапе рисования макета ещё не согласован. Если синхронизации нет, расхождения копятся.

Вот последовательность, которая сокращает правки:

1. Согласуйте структуру. До макета определите, какие блоки нужны на странице и какой смысл у каждого: заголовок, подзаголовок, абзац, список.
2. Задайте лимиты. Для каждого блока укажите число знаков, чтобы автор писал по размеру.
3. Берите рыбу по лимитам. Генерируйте абзацы нужной длины, отдельно для каждого блока: так макет честнее показывает перенос строк.
4. Заменяйте блок за блоком. После каждой замены смотрите на экран телефона и на широкий монитор: узкие заголовки ломаются первыми.
5. Ищите остатки. Пройдите по странице и по админке, пока в шаблонах есть слова lorem и ipsum.

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

Для небольших проектов полезно завести общий документ, где у каждого блока есть пометка «текст готов» или «заглушка». Такая таблица экономит время и защищает от случайной публикации, о которой Практикум предупреждает отдельно. Для команды из двух-трёх человек этого достаточно, чтобы не потерять заглушку на второстепенной странице.

Частые вопросы