Какие шрифты на сайте будут смотреться лучше всего?

Анонимный вопрос
  · 32,4 K
Делаю веб-сервисы в Яндексе, мечтаю стать дворником

В веб-дизайне (точнее, вообще в компьютерных интерфейсах) рекомендуется использовать шрифты без засечек. Тому есть две причины:

  • во-первых, разрешение экрана ниже, чем качественной печати на бумаге, поэтому мелкие хвостики на буквах плохо отрисовываются (впрочем, в последние годы это уже не так актуально),
  • во-вторых, они просто выглядят «чище» – в них нет мелких необязательных деталей.

Однако надо учитывать, что если у вас на сайте есть большие массивы текста (например, статьи), имеет смысл для них использовать шрифты с засечками – засечки помогают читать длинный текст. Но для элементов управления и навигации всё-таки оставить шрифты без засечек.

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

30 марта 2019  · 6,3 K
Добавлю, что размер шрифтов имеет немаловажное значение. Текст должен быть умеренными (не мелким и не крупным)... Читать дальше
Комментировать ответ…
Ещё 7 ответов
Продуктовый дизайнер (UX/UI), веб-дизайнер и бренд-дизайнер. Опыт проектов в...  · ux-journal.ru
Кратко: Если нужно быстро получить рабочий вариант, то можно взять шрифт из Google Fonts и посмотреть его в работе на различных сайтах. Все шрифты там отлично заточены под веб и легко подключаются. Если копать глубже, то нужно еще учесть культурные моменты бренда. Культура бренда – это система ценностей и нормы. На картинке примеры ценностей. Идея... Читать далее
Преподаю дизайн в Институте программных систем, godesign.school и онлайн.Перейти на breezzly.ru
Комментировать ответ…
Веб-студия ByWeb - https://byweb.by
Сейчас модно ставить шрифты без засечек и по популярности их можно выбрать из Google Fonts. Хотя любые шрифты на любителя и концепции веб-дизайна и объема контента (если контента мало то без засечек, чтобы создать иллюзию вертикального объема, если контента много и текст кирпичем, то шрифт должен держать строку т.е. глаз не должен терять горизонтальну... Читать далее
30 июня  · 126
Комментировать ответ…
Postium: бизнес, реклама и digital-маркетинг.  · postium.ru
Отвечает
Саша Кит
1. Сведите количество шрифтов к минимуму (двух более чем достаточно, часто хватит и одного) и придерживайтесь использования одних и тех же на всем сайте. Если вы решите работать с более чем одним шрифтом, убедитесь, что семейства шрифтов подходят друг другу с точки зрения ширины букв. Например, у комбинации Georgia и Verdana есть общие характерист... Читать далее
10 января  · 171
Комментировать ответ…
Диджитал дизайнер. Основная деятельность — веб и интерфейсы. Увлекаюсь вёрсткой...  · romanbaev.com

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

16 мая  · 120
Комментировать ответ…
Понимаю толк в онлайн-бизнесе и в удаленной работе ¯\_(ツ)_/¯ https://svob-writer.ru/raznoe...  · svob-writer.ru
Отвечает
Светлана К.

Только не пишите белым шрифтом на черном фоне! Даже если дизайнер станет убеждать, что это очень модно.

И если сделаете версию "для слабовидящих" с увеличением размера шрифта - проверьте, пожалуйста, как съедет верстка. Особенно на кнопках и в формах для заполнения.

12 апреля  · 111
Комментировать ответ…
Профессиональное создание сайтов и интернет магазинов. Оперативное продвижение...  · cbsystems.ru

Любые Гугл шрифты, они созданы специально для сайтов. На сайте гугл фонтс их можно посмотреть, выбрать и добавить себе на сайт. Большинство из кроссбраузерны и прекрасно отображаются на сайтах любого типа.

Комментировать ответ…
Вопрос простой ответ почти: 1. Шрифт должен быть проработанным, т.е. сделанный профессиональными дизайнерами, ибо только с опытом приходит осознания количества символов, структуры... 1.1. Ибо отсюда вытекают случаи, когда можно откопать шрифт с ascend-ом в 3–4 раза больше, чем x-height, это, в свою очередь даст весьма кривой результат при верстке. 2... Читать далее
Комментировать ответ…
Вы знаете ответ на этот вопрос?
Поделитесь своим опытом и знаниями
Войти и ответить на вопрос
Читайте также

Как изменить шрифт в html?

Артур Санамян
Эксперт
299
Руководитель веб-студии Artworkshop. Разрабатываем сайты и помогаем компаниям получать...  · aws.su

Неважно какой тег, но для примера возьмем <p>

пишете атрибут style=""

Пример:

<p style='font-size:10px ; font-weight:100; font-family: Geneva, Arial, Helvetica, sans-serif;'>Текст</p>

Font-size - размер шрифта

Font-weight - толщина

Font-family - Семейство шрифтов. Также помимо стандартных можно подключить другие шрифты например из каталога Google Fonts

Но содержимое атрибута Style лучше размещать через класс в CSS-файле или на крайний случай в теге <style>

3 декабря 2018  · 32,9 K
Прочитать ещё 1 ответ

Почему многие издательства печатают книги шрифтами с засечками, если их читать куда менее удобно, чем шрифты без засечек?

журналист, дизайнер

Легкое, беспрепятственное чтение текста достигается за счет того, что мы можем без труда отличить одну литеру от другой — и в то же время, за счет того, что все литеры построены по одному принципу и относятся к одной общности (то есть шрифту или, если брать шире, гарнитуре). Вообще, принцип различия и, одновременно, сходства, лежит в основе функционирования языка (можете почитать Фердинанда де Соссюра).

Более «простая» форма литеры не всегда гарантирует, что текст будет удобен для чтения. Действительно, в таком случае глаз меньше цепляется за «родимые пятна» того или иного знака, однако это наоборот, усложняет работу мозга — ему становится труднее отличить одну литеру от другой, а значит снижается скорость чтения (если форма особенно нелогична и неудачна, чтение может стать дискомфортным).

Шрифты с засечками (антиквы) ведут свою родословную от древнеримского маюскула — то есть надписей на фронтоне какого-нибудь Пантеона или амфитеатра в Пуле. В Средние века к начертанию, которое мы теперь знаем как прописное, добавились строчные (то есть минускульные) буквы — их форма сложилась за много веков развития латинской рукописной традиции. Таким образом, всякая антиква строится сообразно с механикой человеческой руки, будь то рука писца или камнетеса. Принято считать, что именно поэтому антиква так хорошо воспринимается человеческим глазом (кроме того, форма антиквенного шрифта прошла длительную эволюцию, которой не может похвастать гротеск).

Шрифты без засечек стали массово нарезать в 19-м веке — тогда их облик был всем в новинку, отсюда и наименование «гротеск». Первые гротески своим построением были основаны на так называемой антикве «нового стиля» — те шрифты вошли в обиход к концу 18-го века, от «старостильных» антикв они отличаются гораздо большим контрастом между штрихом и белым пространством, а также меньшей разницей в высоте прописных и строчных букв (за счет этого они гораздо менее удобочитаемы, хотя и чрезвычайно изящны). К гротеску 19-го века восходит общеизвестный шрифт гельветика со своими многочисленными родственниками.

Известный типограф Ян Чихольд отмечает, что многие гротески, стремящиеся к построению за счет простых геометрических форм (самый известный пример — футура), страдают от «орнаментальности», то есть буквы, будучи набранными в строку, оказываются слишком похожими по построению, что затрудняет восприятие текста. Чихольд указывает, что в верхней половине геометрические литеры a, q, g абсолютно идентичны, хотя ни в каком антиквенном шрифте такое невозможно. В статьях 1950-х годов он рекомендовал использовать гротеск британского дизайнера Эрика Гилла, формы букв которого основаны на очертаниях антиквы старого стиля (сейчас такие гротески принято называть «гуманистическими»).

8 апреля 2015  · 3,4 K
Прочитать ещё 2 ответа

Где скачать шрифт Yandex Sans (во всех начертаниях), используемый в оформлении Яндекса?

Этот действительно суперский и стильный шрифт уже три года, как создан Яндексом, а раньше они пользовались шрифтами Arial и Textbook New.

Но – увы! – в отличие от Apple и Google, раздающих свои шрифты направо и налево, Яндекс к своему детищу относится более заботливо. Это, собственно, понятно: Apple и Google делают эту раздачу ради того, чтоб приложения под iOS и Android сторонние разработчики делали, а для Яндекса этот шрифт – элемент бренда, как и логотип, обновленный, кстати, как раз таки после презентации Yandex Sans.

Насчет скачать, тут, по-моему с 2016 года ничего не изменилось: шрифт только для внутреннего использования. То есть, при большом желании найти-то и скачать его, конечно, можно, да вот только это подсудное дело фактически.

24 мая 2019  · 10,1 K
Прочитать ещё 2 ответа

Какой на ваш взгляд самый удобный и приятный шрифт для чтения и усвоения информации?

Студент-архитектор

Обычный гротескный шрифт (без засечек). Хотя это зависит от контекста. 

Helvetica для лат. и areal или gotham pro для кириллицы.

С помощью декоративных шрифтов, как в заставке вопроса, много информации не усвоишь)

4 августа 2017  · 2,8 K
Прочитать ещё 1 ответ

Какой шрифт вам больше всего нравится?

Магистр графического дизайна, web-дизайнер

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

Мне очень нравится, как развиваются сейчас гротески, НО они очень медленно адаптируются под web и часто глючат (прыгают размеры букв, интервалы, портится качество), поэтому каждый не испробованный ранее в web шрифт надо проверять отдельно.

Поэтому мне нравится гарнитура Open Sans! Кстати, полюбила я её ещё до работы с web-дизайном. Эта гарнитура выглядит гармонично и уравновешенно, никакие буквы не выбиваются из композиции текста, все знаки и цифры на месте, и, отдельный плюс для web-дизайнера, она есть на Google Fonts, т.е. её удобно использовать верстальщику и программисту, она не глючит и все счастливы.

Прочитать ещё 2 ответа