Оформление результатов поиска по книгам

[audetv]

          ### Как-то так можно оформить поисковую выдачу по книгам.

Номера параграфов — ссылки на страницу контекста. Названия книг в подписи под цитатами.

Картинка

  > 

Originally posted by @iprst in https://github.com/terratensor/book-parser/issues/2#issuecomment-1612219010

[iprst]

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

[audetv]

Ага, согласен, так лучше.

А по поводу шаблонов, мне проще если нарисовано, сверстать самому, чем искать что-то, хотя я часто на том же бутстрапе смотрю примеры и если ничего нет подходящего, то приходится из их блоков собирать, хороший у них фреймворк, уже 10 лет пользуюсь, еще со 2ой версии. Попсовый но можно делать быстро и качественно, а если есть дизайн нарисованный, так вообще хорошо. Для меня привычный вариант, когда дизайнер рисует, скидывает и делаем верстку.

[audetv]

Пробовал times new roman поставить, но визуально не нравится, и не привычно уже с компьютера читать с шрифты засечками. Вот в бумажной книге, похоже с засечками - лучший шрифт, а на компе нет. Но могу поставить, для пробы.

[iprst]

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

Можно будет далее так и пробовать делать.

Пробовал times new roman поставить, но визуально не нравится, и не привычно уже с компьютера читать с шрифты засечками. Вот в бумажной книге, похоже с засечками - лучший рифт, а на компе нет. Но могу поставить, для пробы.

Не критично. Шрифты с засечками с экрана читаются в основном когда у них достаточный размер. Посмотрите cont.ws vk.ru или telegra.ph — статьи и заметки там прекрасно держат шрифты с засечками, однако их размер довольно крупный изначально. Поэтому если делать с засечками, то можно увеличивать шрифт. То же можно сказать про электронные книги, подавляющее большинство которых предлагает форматирование с шрифтами с засечками, и всё прекрасно.

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

[audetv]

Да, посмотрел cont.ws захожу туда периодически и с телефона в том числе, и не замечал засечек, а они есть. Там Georgia, serif 17 px Да, поставлю на пробу, посмотрим.

[iprst]

Можно уменьшить ширину текстового блока, сделать его пусть и резиновым, но вертикальным. Сразу будет лучше восприниматься как «книга». Комментариям это не требуется, а для книг будет хорошо. Но про вёрстку и резиновость не скажу, надо смотреть на устройства. Я только про декстоп говорю сейчас. Опять же, примеры всё тот же конт, вк (статьи) и телеграф — там это сделано по одному шаблону. Я кстати пример делал вконтакте, функционал статей. Лень было открывать программы, а браузер уже открыт.

[audetv]

Можно уменьшить ширину текстового блока, сделать его пусть и резиновым, но вертикальным. Сразу будет лучше восприниматься как «книга». Комментариям это не требуется, а для книг будет хорошо. Но про вёрстку и резиновость не скажу, надо смотреть на устройства. Я только про декстоп говорю сейчас. Опять же, примеры всё тот же конт, вк (статьи) и телеграф — там это сделано по одному шаблону. Я кстати пример делал вконтакте, функционал статей. Лень было открывать программы, а браузер уже открыт.

Сейчас ширина параграфа 1102 px на десктопе, можно и еще меньше сделать контейнер параграфа. Сделаю, изменю шрифт на georgia, сделаю размер шрифта побольше и отступы в контейнере слева/справа побольше побольше. Посмотрим.

[audetv]

Сделал шрифт как в vk "PT Serif", "Noto Sans Armenian", "Noto Sans Bengali", увеличил размер шрифта, уменьшил размер контейнера с текстом. Все это уже с резиновой версткой.

[iprst]

Есть ощущение что полученный результат прекрасен и пока надо оставить оформление таким, попользоваться, посмотреть на разных устройствах. Ну а когда будет доделана схема со сносками, вообще отлично всё будет.

На разных размерах хорошо работает. Всё читабельно. С разным масштабированием страницы тоже всё отлично, от 75 до 150 процентов результаты выглядят абсолютно натурально.