Безопасные шрифты
Обратите внимание, что сначала идёт распространённый шрифт (например Arial), если его на компьютере посетителя нет, то идёт более распространённый и похожий на него (например Helvetica), и в конце если оба эти шрифта отсутствуют, подключается serif, sans-serif, monospace или cursive (данные способы начертания шрифта есть всегда).
Arial
Имя шрифта: font-family: Arial, Helvetica, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Arial Black
Имя шрифта: font-family: ‘Arial Black’, Gadget, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Bookman Old Style
Имя шрифта: font-family: ‘Bookman Old Style’, serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Century Gothic*
Имя шрифта: font-family: «Century Gothic», CenturyGothic, AppleGothic, sans-serif;
Comic Sans MS
Имя шрифта: font-family: ‘Comic Sans MS’, cursive;
Цифры: 0 1 2 3 4 5 6 7 8 9
Courier
Имя шрифта: font-family: Courier, monospace;
Цифры: 0 1 2 3 4 5 6 7 8 9
Courier New
Имя шрифта: font-family: ‘Courier New’, Courier, monospace;
Цифры: 0 1 2 3 4 5 6 7 8 9
Garamond
Имя шрифта: font-family: Garamond, serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Georgia
Имя шрифта: font-family: Georgia, serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Impact
Имя шрифта: font-family: Impact, Charcoal, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Lucida Console
Имя шрифта: font-family: ‘Lucida Console’, Monaco, monospace;
Цифры: 0 1 2 3 4 5 6 7 8 9
MS Sans Serif
Имя шрифта: font-family: ‘MS Sans Serif’, Geneva, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
MS Serif
Имя шрифта: font-family: ‘MS Serif’, ‘New York’, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Palatino Linotype
Имя шрифта: font-family: ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Tahoma
Имя шрифта: font-family: Tahoma, Geneva, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Times New Roman
Имя шрифта: font-family: ‘Times New Roman’, Times, serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Trebuchet MS
Имя шрифта: font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
Verdana
Имя шрифта: font-family: Verdana, Geneva, sans-serif;
Цифры: 0 1 2 3 4 5 6 7 8 9
*Шрифт «Century Gothic» содержится на 83% устройств, этот процент растет и в скором будущем он станет безопасным.
Увеличить количество доступных шрифтом можно за счет подключаемых шрифтов от Google Fonts, кириллические шрифты можно скачать тут. Привила сочетания шрифтов и примеры сочетаний можно посмотреть тут: Таблица сочетания шрифтов.
— http://fontstorage.com/ — База шрифтов с возможностью подбора и вывод в CSS
— http://www.typetester.org/ — Тестирование и подбор шрифтов, вывод в CSS.
— http://csstypeset.com/ — Работа с разными стилями и атрибутами текста и вывод в CSS.
— http://www.designerplaything.co.uk/designer-plaything.html — Подбор шрифта и цвета.
— http://www.texster.ru/ — Помощник в выборе шрифта.
— http://www.stcassociates.com/lab/fontbrowser.html — Аналогичен предыдущему (более расширен).
— http://www.blindtextgenerator.com/ru — Русский онлайн Lorem Ipsum генератор.
— http://wordmark.it/ — Просмотр вашего текста в разных стилях.
— http://www.myfonts.com/WhatTheFont/ — Определение шрифта по образцу.
— https://www.fontspring.com/matcherator — Определение шрифта по образцу.
— http://www.identifont.com/identify.html — Выявляет шрифт через ряд вопросов о нем.
— http://www.bowfinprintworks.com/ — поиск шрифтов по образцам.
— http://www.fontshop.com/research/ — выясняет название по форме отдельных символов.
— http://www.flickr.com/groups/typeid/ — определяет названия шрифтов, используемых в различных изображениях.
— http://fount.artequalswork.com/ — бесплатный онлайн сервис для моментальной идентификации шрифта.
— http://www.xfont.ru/ — Крупнейший сервис по шрифтам.
— http://www.fontov.net/ — бесплатный русскоязычный сервис для поиска и подбора интересующегося Вас шрифта.
— http://ifont.ru/ — Большой русскоязычный сервис шрифтов.
dafont.com/ — шрифты с просмотром вашего примера.— http://www.fonts-online.ru/ — База шрифтов с просмотром Online
— http://fontstruct.com/ — создание собственных шрифтов Online
— http://fontark.net/farkwp/ — Конструктор шрифтов Online
— http://www.fontsquirrel.com/fontface/generator — загрузка и доработка ваших шрифтов.
— http://pxtoem.com/ — Переводит одни единицы измерения шрифтов в другие.
— http://csswarp.eleqtriq.com/ — Онлайн сервис для подготовки эффектного текста.
— http://www.bestwebfonts.com/ — Удобный сервис для просмотра веб-шрифтов, в том числе с применением различных эффектов.
33 свежих бесплатных шрифта для веб-дизайнера 2017
Сегодня у меня свежая, 2017 года подборочка классных бесплатных шрифтов для веб-дизайна и не только. Я не стала делить ее на разные подрубрики типа: шрифты рукописные, шрифты гранжевые, шрифты ретро и т.п. Думаю, вы сами разберетесь, кто есть ху.
Естественно, я выбирала все больше рукописные, гранжевые и винтажные шрифты, т.
к. сама их очень люблю.
Предвосхищая стандартный вопрос, говорю сразу: кириллицы там нет. Да и не всегда она смотрится так же выразительно, как латиница. У каждого языка есть свои выгодные стороны и наоборот — не самые красивые детали. Но если кому-то очень нужно использовать эти шрифты для отображения кириллицы, то фотошоп вам в очумелые ручки и вперед! 🙂
1. Fibre — бесплатный жирный винтажный шрифт
2. King Basil — бесплатный рукописный шрифт-кисточка
3. Humger — стильный гранжевый потертый шрифт
4. Zviro — симпатичный и элегантный шрифт с засечками
5. Black Mask — рубленный брутальный шрифт с засечками в стиле гранж
6. Westfalia — бесплатный рукописный лаконичный кисточковый шрифт
7. Aruna — элегантный бесплатный шрифт для лого
8. Monk — универсальный бесплатный шрифт для логотипов
9. Metro Grunge — уникальный и очень красивый гранжевый шрифт
10.
Bajern — бесплатный и элегантный шрифт под готику11. Black Willow — бесплатный «мелковый» шрифт под леттеринг
12. Setta Script — красивый бесплатный рукописный шрифт
13. Caleb — необычный рукописный шрифт для флаеров
14. Sweet Sorrow — классный ретро шрифт
15. Aaminah — очень художественный тонкий рукописный шрифт
16. Befolk — элегантный кисточковый шрифт для леттеринга
17. SickBoy — энергичный рукописный маркерный шрифт
18. Whortle — широкий рукописный маркерный шрифт
19. Hello Stockholm — стильный и стремительный бесплатный рукописный шрифт
20. Noelan — современный каллиграфический шрифт для плакатов, флаеров и пр.
21. Old Growth — необычный и красивый шрифт
22. Molleat — бесплатный рукописный кисточковый шрифт
23. Fabulous — шикарный каллиграфический шрифт для леттеринга и пр.
24.
Hometown — очень элегантный тонкий шрифт в стиле ретро25. Chapel Script — бесплатный шрифт в стиле леттеринга
26. Bold & Stylish Calligraphy — красивый каллиграфический шрифт
27. Bardo — классический элегантный ретро шрифт
28. Electronics — бесплатный жирный псевдо-рукописный шрифт
29. Shabrina — свежий и энергичный шрифт в стиле леттеринга
30. Sketch — бесплатный рукописный шрифт в стиле широкая кисть
31. Albondigas — каллиграфический шрифт для леттеринга и пр.
32. Messenger Pigeons — стильный бесплатный каллиграфический шрифт
33. Jumper — отличный маркерный «сухой» бесплатный шрифт
На сегодня со шрифтами все. Буду рада, если вы найдете для себя что-то подходящее.
29.03.2017 | Автор: Настя Манно | Рубрика: Инструменты веб-дизайнера , Шрифты
Часто задаваемые вопросы (FAQ) — Латинские, кириллические и греческие шрифты
Вот некоторые из наиболее часто задаваемых вопросов о латинских, кириллических и греческих шрифтах SIL.
По вопросам, связанным с конкретным шрифтом, обращайтесь на веб-сайт отдельного шрифтового проекта. Общие вопросы о шрифтах SIL см. в FAQ по шрифтам SIL и в FAQ по открытой лицензии на шрифты SIL (OFL-FAQ).
Нет. Наши шрифты для латиницы, кириллицы и греческого языка не включают никаких утилит для клавиатуры. Если вы не можете использовать встроенные клавиатуры или методы ввода операционной системы, вам необходимо установить их для символов языка, который вы хотите использовать. Keyman от SIL предоставляет клавиатуры для более чем 2000 языков и работает на всех основных настольных и мобильных платформах. Информацию о других параметрах клавиатуры см. в обзоре на странице Обзор систем клавиатуры (ScriptSource).
Как набирать символы IPA? Для облегчения ввода символов IPA вам потребуется загрузить и установить клавиатуру IPA. Отличная клавиатура IPA для большинства настольных и мобильных платформ доступна на сайте Keyman.
Также доступны другие клавиатуры на основе Keyman.
Комбинации базовых букв с диакритическими знаками часто называют составными или предварительно составлено глифов. В наших шрифтах их сотни, в основном те, которые включены в Unicode. Однако есть много общих комбинаций, которые не представлены одним композитом. Их можно ввести в документ, но только как отдельные компоненты. Таким образом, «о с правым хуком» следует вводить как «о», а затем «правый хук». Наши латинские, кириллические и греческие шрифты включают поддержку OpenType, которая пытается хорошо отображать эти комбинации, хотя мы не можем предусмотреть все возможные комбинации.
Какие функции OpenType есть в шрифтах и как их использовать? Большинство возможностей шрифтов OpenType (расположение диакритических знаков, формирование лигатур) автоматически активируются в приложениях, поддерживающих OpenType.
Чтобы узнать, какие функции шрифтов могут выбираться пользователем, см. страницу Features для отдельных семейств шрифтов (например, функции шрифтов Charis SIL). Сведения об управлении функциями OpenType в конкретных приложениях см. в разделе Использование функций шрифтов. Чтобы узнать, как указать функции OpenType на веб-страницах, см. Использование шрифтов SIL на веб-страницах.
Существует функция OpenType — Slant Italic Specials (ss05) — позволяющая выделить курсивом двухэтажную букву «a».
Почему мои диакритические знаки расположены неправильно?Это может быть вызвано тремя причинами:
- Отсутствие поддержки OpenType. Приложение, которое вы используете, не поддерживает OpenType или вы используете символы из области частного использования (PUA) в приложении OpenType. Для этой ситуации нет решения.
Ошибки форматирования.
Если какие-либо символы в последовательности отформатированы другим шрифтом или с другими настройками (размером, интервалом, цветом), приложение может незаметно разбить текст на отдельные части, что приведет к сбою позиционирования диакритических знаков. Решение состоит в том, чтобы удалить все форматирование из текста и повторно применить любые стили или форматирование.Ошибка шрифта. Мы тщательно тестируем шрифты с тысячами последовательностей, чтобы избежать проблем, но если вы обнаружите комбинацию, которая не позиционируется должным образом, свяжитесь с нами, чтобы мы могли улучшить ее в будущей версии.
Если какие-либо символы в последовательности отформатированы другим шрифтом или с другими настройками (размером, интервалом, цветом), приложение может незаметно разбить текст на отдельные части, что приведет к сбою позиционирования диакритических знаков. Решение состоит в том, чтобы удалить все форматирование из текста и повторно применить любые стили или форматирование. В сочетании с некоторыми узкими глифами (например, «i») широкие диакритические знаки (например, тильда) могут конфликтовать с соседними глифами. Во многих случаях это не проблема — иногда глифы могут конфликтовать. Если это вызывает трудности с разборчивостью текста, вручную разнесите эти буквы в тексте, используя ручной кернинг или настройки межсимвольного интервала в вашем приложении.
Мы не включаем кернинг для большинства таких ситуаций, так как существуют тысячи возможных комбинаций.
Эти шрифты содержат символы с несколькими расположенными друг над другом диакритическими знаками, для которых требуется более широкий межстрочный интервал (например, U+1EA8 Ẩ). Чтобы избежать проблем с диакритическими знаками, которые накладываются на другие строки или обрезаются, мы установили межстрочный интервал по умолчанию больше, чем во многих других шрифтах.
Вы можете решить эту проблему, отрегулировав межстрочный интервал в приложении. Например, в Microsoft Word выберите Format / Paragraph и установите межстрочный интервал, чтобы использовать параметр Exactly и значение, более подходящее для ваших нужд. Например, если размер шрифта составляет 12 пунктов, выберите межстрочный интервал Ровно 13 пунктов. Это даст более плотный межстрочный интервал.
Вы можете увеличить или уменьшить значение в зависимости от того, сколько диакритических знаков вам нужно сложить. На веб-страницах вы можете явно установить свойство line-height .
Для приложений, не допускающих явного управления межстрочным интервалом, мы предоставляем «компактные» варианты шрифтов на странице загрузки шрифтов LCG.
Когда я обновил шрифты до последней версии, межстрочный интервал и разрыв строки изменились — почему? Основные обновления версий шрифтов (от v4 до v5, от v5 до v6) могут включать изменения ширины некоторых глифов и других показателей шрифта, хотя мы стараемся свести их к минимуму и обычно меняем только редкие глифы. Если это вызывает проблему, вы можете продолжать использовать более ранние версии шрифтов. Поскольку в новых версиях также исправлены ошибки и внесены другие улучшения, может быть лучше принять эти изменения. Если вы архивируете документы, мы настоятельно рекомендуем архивировать копию шрифтов вместе с документом, чтобы избежать различий в версиях.
FAQ по старым версиям шрифтов остается доступным на Latin, Cyrillic, and Greek Fonts — FAQ v5. Пожалуйста, поймите, что информация на этой странице может быть устаревшей, неактуальной или неверной для текущих операционных систем и приложений! Предоставляется только в помощь пользователям более старых версий.
Некоторые кириллические (русские) шрифты выглядят некорректно | Firefox-Hilfeforum
Дизес Тема wurde архив. Bitte stellen Sie eine neue Frage, wenn Sie Hilfe benötigen.
и.г.000
Некоторые кириллические (русские) шрифты выглядят некорректно.
Просто какой-то сайт с русскими шрифтами. Больше всего отлично выглядит.
Похоже, что Firefox не знает какой-то конкретный шрифт. Другие браузеры EI и Chrome могут корректно отображать одну и ту же страницу.
Как я могу решить проблему?
Спасибо.
Некоторые кириллические (русские) шрифты выглядят некорректно. Просто какой-то сайт с русскими шрифтами. Больше всего отлично выглядит. Похоже, что Firefox не знает какой-то конкретный шрифт. Другие браузеры EI и Chrome могут корректно отображать одну и ту же страницу. Как я могу решить проблему? Спасибо.
Ausgewählte Lösung
Alle Antworten (7)
ФредМакД
Предоставьте публичные (без пароля) ссылки, которые мы можем
проверить.
Пожалуйста, не вводите личную информацию !
Введите about:preferences#content
Информация о шрифтах — обнаружена через флэш-память http://browserspy.dk/fonts-flash.php?detail=1
кор-эль- 10 ведущих участников
- Модератор
Можете ли вы прикрепить скриншот?
- https://support.mozilla.org/en-US/kb/how-do-i-create-screenshot-my-problem
- используйте формат сжатого изображения, например PNG или JPG, для сохранения снимка экрана
Это может быть связано с недавним переключением в Firefox 52+ с Cairo на Skia для рендеринга холста/контента.
Firefox 52+ изменен с Cairo на Skia для рендеринга холста/контента.
- https://www.mozilla.org/en-US/firefox/52.0/releasenotes/
- Если Direct2D в Windows не используется, Skia используется для рендеринга контента
Вы можете изменить эти настройки gfx.*.azure.backends на странице about:config , чтобы вернуться к старому рендерингу шрифта, поменять порядок skia,cairo на cairo,skia или удалить skia и оставить cairo.
- gfx.canvas.azure.backends = direct2d1.1,cairo,skia
- gfx.content.azure.backends = direct2d1.1,cairo,skia
Вы можете открыть страницу about:config через адресную строку. Вы можете принять предупреждение и нажать «Я буду осторожен», чтобы продолжить.
- http://kb.mozillazine.org/about:config
и.г.000 Фрагестеллер
мой скрин оттуда http://leshaigraet.ru/vote-about-stream/
Geändert am von and.g.000
и.г.000 Фрагестеллер
кор-эль сказал
Вы можете изменить эти настройки gfx.*.azure.backends на странице about:config , чтобы вернуться к старому отображению шрифта, поменять порядок skia,cairo на cairo,skia или удалить skia и оставить cairo.
- gfx.canvas.azure.backends = direct2d1.1, каир, скиа
- gfx.content.azure.backends = direct2d1.1,cairo,skia
у меня не сработало
Geändert am фон и.г.000
и.г.000 Фрагестеллер
ФредМакД сказал
Предоставьте общедоступные (без пароля) ссылки, по которым мы можем проверить. Пожалуйста, не вводите личную информацию !Введите about:preferences#content
в адресной строке. Напротив шрифты и цвета, нажмите кнопку Advanced . Внизу включите Разрешить веб-сайтам выбирать свои собственные. Информация о шрифтах — обнаружена через флэш-память http://browserspy.dk/fonts-flash.php?detail=1
Да
Попробовал в первую очередь — работает.
Если я отключу «Разрешить веб-сайтам выбирать свои собственные» — я смогу правильно видеть веб-страницу. Но я думаю, что это не очень хорошее решение, потому что я скучаю по индивидуальному дизайну веб-страниц.
Насчет «Обнаружено через Flash» — все шрифты вижу правильно (спасибо за интересную ссылку)
Geändert am von and.g.000
кор-эль- 10 ведущих участников
- Модератор
Этот веб-сайт использует загружаемый шрифт под названием «Open Sans Regular», как вы можете видеть в Инспекторе.
- https://developer.mozilla. org/en/Tools/Page_Inspector
- https://developer.mozilla.org/en/Tools/Page_Inspector/How_to/View_fonts
- devtools.fontspector.enabled = истина
org/en/Tools/Page_InspectorРанее сообщалось о проблемах с этим конкретным шрифтом.
и.г.000 Фрагестеллер
Ausgewählte Lösung
кор-эль сказал
Этот веб-сайт использует загружаемый шрифт под названием «Open Sans Regular», как вы можете видеть в Инспекторе.Мы видели проблемы, о которых сообщалось ранее с этим конкретным шрифтом.
- https://developer.mozilla.org/en/Tools/Page_Inspector
- https://developer.mozilla.org/en/Tools/Page_Inspector/How_to/View_fonts
- devtools.fontspector.enabled = истина
