Как установить шрифт Helvetica Cyrillic Oblique на сайт
Для установки шрифта «Helvetica Cyrillic Oblique» на сайт необходимо скопировать все файлы шрифта в папку, например, «fonts/helvetica-cyrillic-oblique». В файле стилей подключить шрифт, используя конструкцию CSS:
Скопировать в буфер обмена
@font-face {
font-family: "Helvetica Cyrillic Oblique";
src: url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.eot"); /* IE9 Compat Modes */
src: url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.otf") format("opentype"), /* Open Type Font */
url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.svg") format("svg"), /* Legacy iOS */
url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.ttf") format("truetype"), /* Safari, Android, iOS */
url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.woff") format("woff"), /* Modern Browsers */
url("../fonts/helvetica-cyrillic-oblique/helvetica-cyrillic-oblique.woff2") format("woff2"); /* Modern Browsers */
font-weight: normal;
font-style: normal;
}
Установить шрифт «Helvetica Cyrillic Oblique» для требуемого текста, поля, кнопки или другого элемента на сайте:
font-family: "Helvetica Cyrillic Oblique";
Пример применения шрифта «Helvetica Cyrillic Oblique»:
body {
font-family: "Helvetica Cyrillic Oblique";
font-size: 1rem;
font-weight: normal;
line-height: 1.2;
color: #000;
background-color: #fff;
}
Supported Languages
English, Greek, Greenlandic, Guarani, Haitian Creole, Hausa, Hawaiian, Hiligaynon, Hill Mari, Hmong, Hopi, Hungarian, Ibanag, Icelandic, Iloko (Ilokano), Indonesian, Interglossa (Glosa), Interlingua, Irish (Gaelic), Istro-Romanian, Italian, Jèrriais, Kabardian, Kalmyk (Cyrillic), Karachay (Cyrillic), Kashubian, Kazakh (Cyrillic), Khakas, Khalkha, Khanty, Kildin Sami, Komi-Permyak, Kurdish, Kurdish (Kurmanji), Kyrgyz (Cyrillic), Ladin, Latvian, Lithuanian, Lojban, Lombard, Low Saxon, Luxembourgian, Macedonian, Malagasy, Malay (Latinized), Maltese, Northern Sotho (Pedi), Norwegian, Occitan, Oromo, Ossetian, Pangasinan, Papiamento, Piedmontese, Polish, Portuguese, Potawatomi, Quechua, Rhaeto-Romance, Romanian, Romansh (Rumantsch), Rotokas, Russian, Rusyn, Sami (Inari), Sami (Lule), Sami (Northern), Samoan, Sardinian (Sardu), Scots (Gaelic), Serbian (Cyrillic), Serbian (Latin), Seychellois Creole (Seselwa), Shona, Sicilian, Slovak, Abkhaz, Afrikaans, Albanian, Alsatian, Aragonese, Arapaho, Aromanian, Arrernte, Asturian, Aymara, Azerbaijani (Cyrillic), Bashkir, Basque, Belarusian, Belarusian (Lacinka), Bislama, Bosnian, Breton, Bulgarian, Buryat (Cyrillic), Catalan, Cebuano, Chamorro, Chechen, Cheyenne, Chichewa (Nyanja), Chuvash, Cimbrian, Corsican, Croatian, Cyrillic, Czech, Danish, Dungan, Dutch, English, Esperanto, Estonian, Evenki (Cyrillic), Faroese, Fijian, Finnish, French, French Creole (Saint Lucia), Frisian, Friulian, Galician, Genoese, German, Gilbertese (Kiribati), Manx, Maori, Meadow Mari, Megleno-Romanian, Míkmaq, Mohawk, Moldovan, Nahuatl, Nenets, Norfolk/Pitcairnese, Slovenian (Slovene), Somali, Southern Ndebele, Southern Sotho (Sesotho), Spanish, Swahili, Swati/Swazi, Swedish, Tagalog (Filipino/Pilipino), Tahitian, Tajik, Tatar (Cyrillic), Tausug, Tetum (Tetun), Tok Pisin, Tongan (Faka-Tonga), Tswana, Turkmen, Turkmen (Cyrillic), Turkmen (Latinized), Tuvaluan, Tuvin, Udmurt, Ukrainian, Ulithian, Uyghur (Cyrillic), Uyghur (Latinized), Uzbek (Cyrillic), Veps, Vietnamese, Volapük, Votic (Cyrillic), Votic (Latinized), Walloon, Warlpiri, Welsh, Xhosa, Yakut/Sakha, Yapese, Zulu.
Бесплатные новогодние и праздничные шрифты (кириллица + латиница)
В отдельную группу я решила выделить шрифты, которые отлично подойдут для постеров, афиш, буклетов и другого дизайна новогодней и праздничной тематик. Естественно, их можно использовать как угодно. К тому де я постаралась выбрать именно варианты открытые для коммерческого использования.
На сайте «Дизайн в жизни» есть подборка бесплатных шаблонов открыток на Новогоднюю и рождественскую темы. Большинство из них англоязычные. Теперь вы можете смело брать шрифты из данной статьи и редактировать креативные шаблоны.
1. Фигурный Penguin Attack Cyrillic
Креативный шрифт с фигурными буквами в стиле католического Рождества. Уверена, вы часто видите подобный дизайн надписей в новогодних клипартах.
2. Изящный Rum Raisin
Шрифт под названием «Ромовый изюм» содержит набор кириллицы и латиницы. У него достаточно спокойный дизайн с закругленными краями букв. Подойдет и для детской, кондитерской тематик.
3. Снежный ARCO Cyrillic
Еще один бесплатный шрифт от которого поверяло арктическим холодом, а все потому что его буквы похожи на снежные сугробы. Он, кстати отлично подойдет для бесплатного снежного текстового эффекта, о котором я писала в статье «Текстовые эффекты для Photoshop — комикс, леденец, снег, световое искажение»
Красивый калиграфичный шрифт, который отлично впишется в новогодний, поздравительный и природный дизайн.
5. Сказочный Black and White Picture
Необычный дизайнерский шрифт, навеянный природными мотивами. Я вижу его применение в праздничной, новогодней, природной тематиках.
5. Многослойный mr_AKronimg
Буквы этого шрифта похожи на ветер. Изогнутые, изящные, плавные. Выполнены в несколько линий. Такое написание подойдет для зимней или осенней тематик. Для оформления креативных буклетов, брошюр, открыток. Шрифт распространяется по лицензии OFL, а значит бесплатен для коммерческого и личного использования.
Буквы данного шрифта похожи на сосульки, поэтому логично его будет использовать в зимней и новогодней темах.
7. Неровный Yahfie Heavy
Этот бесплатный шрифт как-будто нарисован от руки. Его можно использовать на упаковке или продукции связанной с handmade. Распространяется по лицензии OFL.
Font FAQS!
What Type of Font Is Helvetica Neue?
It is a sans-serif typeface that was designed by Max Miedinger, and Eduard Hoffmann
Can I Use Helvetica Neue Font on My Website?
Yes! You can use the Helvetica Neue website on your website and can make your website design more beautiful.
Is Helvetica Neue a Free Font?
The Helvetica Neue font is available to download free for personal use but if you want to use it for commercial purposes then you might need permission from the owner.
Can I Download and Use Helvetica Neue Font in My Pc and Mac?
Yes! It’s free to download and use the Helvetica Neue in your mac and pc.
Can I Use Helvetica Neue for My Logo?
Of course! you can use the Helvetica Neue for your logo as well as all other graphic designs projects.
What’s the Closest Font to Helvetica Neue?
The Arimo font is very close to the Helvetica Neue font.
How to Install Helvetica Neue Font in Adobe, Ms. Word, Mac, or PC?
San Francisco Display
San Francisco Display is a neo-grotesque sans-serif typeface made by Apple Inc. It was first released to developers on November 18, 2014. It is the first new typeface designed at Apple in nearly 20 years and has been inspired by Helvetica and DIN.
The San Francisco Display typeface has three main variants: SF for macOS, iOS, and iPadOS; SF Compact for watchOS; and SF Mono for the Terminal, Console, and Xcode applications. Several other variants exist for internal use by Apple.
San Francisco was first introduced in watchOS only. The next year at WWDC, Apple released the watchOS font as SF Compact and at the same time introduced SF UI (generally called SF) for OS X El Capitan and iOS 9. In macOS High Sierra and iOS 11, SF UI was succeeded by SF Pro.
Download
Search Fonts
Переходим к коду
Вступление показывает, что с появлением новых версий операционных систем приходят новые шрифты, а с ними и необходимость обновления стандартных шрифтов для сайта .
Метод 1: Системные шрифты на уровне элемента
Chrome и Safari недавно представили « system-ui » — универсальное семейство шрифтов, которое может быть использовано вместо « -apple-system » и « BlinkMacSystemFont «. Один из методов применения системных шрифтов — вызвать их напрямую для элемента, используя свойство font-family .
GitHub использует этот метод на своем сайте, применяя системные шрифты в body :
И Medium и WordPress admin используют схожий подход. Больше всего поддерживается Oxygen Sans ( создан для операционной системы GNU+Linux ) и Cantarell (создан для операционной системы GNOME ).
Данный пример также демонстрирует поддержку некоторых типов смайликов и символов :
Примечание: Этот метод можно использовать только для font family CSS стандартных шрифтов вместо более короткого font.
Метод 2: Стеки системных шрифтов
Ограничение первого метода заключается в необходимости вызывать полный стек шрифтов каждый раз, когда он применяется для элемента. А это может раздуть код, в зависимости от того, где и как оно используется.
Альтернативный метод, при котором системные шрифты объявляются с помощью свойства @font-face . Его преимущество заключается в том, что можно объявить шрифты один раз и затем применять их со свойством font-family вместо длинного списка шрифтов каждый раз.
Заметьте, что данный пример демонстрирует, как определять стандартные шрифты HTML из семейства system , которое были установлены в предыдущем варианте. При этом учитываются наклонные и полужирные шрифты.
Новые шрифты брендов и операционных систем
Эти шрифты нельзя свободно скачать, но они помогут вам вдохновиться на свой проект и развить насмотренность.
IZH 260 — официальный шрифт Ижевска. Гарнитуру разработали под руководством студии Paratype летом 2021 года. Сделали два начертания — для заголовков и основного текста. Шрифт используют на муниципальных сайтах и в городской навигации. Шрифт бесплатный, но получить его можно только по заявке — для какого-нибудь конкретного проекта в Ижевске.
Изображение: Paratype / Izh.Design
Рассмотреть шрифт подробнее или оставить заявку на его получение на Izh.Design.
PT Astra Fact — новое шрифтовое семейство от Paratype для российской операционной системы Astra Linux. Изначально дизайнеры хотели использовать Verdana, но с получением лицензии возникли сложности из-за санкций.
PT Astra Fact создавали как интерфейсный шрифт, который будут использовать в кнопках, разделах меню и других текстах после следующего обновления ОС. Вероятно, тогда гарнитура и станет доступной для скачивания.
Изображение: Paratype / Astra Linux
Villula — новая бренд-гарнитура «ВкусВилла» от Юрия Гордона. Вслед за Ozon и «Ситимобил» компания выбрала вариативный шрифт с возможностью сочетать узкие и широкие буквы в одном слове.
Изображение: «ВкусВилл» / Letterhead
Изображение: «ВкусВилл» / LINII Group
Segoe UI Variable — ещё один вариативный шрифт, вышедший в свет в 2021-м. Правда для креативного брендинга использовать не планируют: в Microsoft им заменят Segoe UI, а вариативность понадобилась, чтобы улучшить читаемость в мелком и крупном размере. Обновлённая типографика появилась в Windows 11.
Изображение: Microsoft
Font Family Includes
- Helvetica Pro Light
- Helvetica Pro Light Oblique
- Helvetica Pro Roman
- Helvetica Pro Oblique
- Helvetica Pro Bold
- Helvetica Pro Bold Oblique
- Helvetica Pro Black
- Helvetica Pro Black Oblique
- Helvetica Pro Light Condensed
- Helvetica Pro Light Condensed Oblique
- Helvetica Pro Condensed
- Helvetica Pro Condensed Oblique
- Helvetica Pro Bold Condensed
- Helvetica Pro Bold Condensed Oblique
- Helvetica Pro Black Condensed
- Helvetica Pro Black Condensed Oblique
- Helvetica Pro Narrow Roman
- Helvetica Pro Narrow Roman Oblique
- Helvetica Pro Narrow Bold
- Helvetica Pro Narrow Bold Oblique
- Helvetica Pro Compressed
- Helvetica Pro Extra Compressed
- Helvetica Pro Ultra Compressed
- Helvetica Pro Inserat Roman
- Helvetica Pro Rounded Bold
- Helvetica Pro Rounded Bold Oblique
- Helvetica Pro Rounded Black
- Helvetica Pro Rounded Black Oblique
- Helvetica Pro Rounded Bold Condensed
- Helvetica Pro Rounded Bold Condensed Oblique
- Helvetica Pro Textbook Roman
- Helvetica Pro Textbook Oblique
- Helvetica Pro Textbook Bold
- Helvetica Pro Textbook Bold Oblique
- Helvetica Std Fractions
- Helvetica Std Fractions Bold
Гротески
Neue Machina. Бесплатный вариативный гротеск с кириллицей, выпущенный Pangram Pangram. Презентацию оформил Васьен Катро aka Baugasm
Обратите внимание — ловушки для чернил (inktraps) вошли в моду
PT Root UI. Новый бесплатный шрифт компании Паратайп. Предназначен специально для интерфейсов, содержит 4 начертания.
Inter. Бесплатный гротеск с кириллицей в 8 начертаниях. Сделал дизайнер из команды Figma. Открытые исходники.
Greenwich. Современный гротеск с кириллицей по мотивам английских шрифтов начала 20 века. Цена за каждое отдельное начертание от 35 $. Два начертания доступны бесплатно.
Closer. Семейство гуманистических гротесков с кириллицей от Mint Type. Низкий контраст и очень закрытая апертура. 18 начертаний (9 прямых + италики), 7 наборов стилистических альтернатив. Два начертания раздают бесплатно, остальные от 35 $.
Closer Text. Семейство закрытых гуманистических гротесков для набора. Начертания Text Light и Text Light Italic бесплатные, остальные 16 стоят от 35 $ по отдельности и от 159 $ вместе.
FE Hero. Ультра-узкий гротеск с кириллицей. Идеально подходит для киноафиш и технических надписей. Можно использовать бесплатно в персональных проектах, коммерческая лицензия обойдётся всего в 299 ₽.
Vocal. Семейство гротесков с кириллицей. В гарнитуре 28 шрифтов толщиной от волосяного до хэви. Все вместе от 260 $, отдельные начертания от 35 $, начертание Light бесплатное.
Noah. 4 начертания этого семейства гротесков Fontfabric можно скачать бесплатно. Остальные 78 стоят от 299 $.
Mozer. Гарнитура Fontfabric с кириллицей. Полуузкий неогротеск, 16 начертаний. Начертание Semi Bold бесплатное. Остальные от 29 $. Вся семья от 169 $.
Kardinal. Гуманистический гротеск в 16 начертаниях (8 прямых + 8 италиков) с кириллицей. Два начертания бесплатные, остальные от 30 $, вся семья от 180 $.
Lil Stuart. Пара бесплатных шрифтов с латиницей: гротеск и скрипт. Повторяется в разделе с рукописными шрифтами.
San Francisco Text
San Francisco Text is a neo-grotesque sans-serif typeface made by Apple Inc. It was first released to developers on November 18, 2014. It is the first new typeface designed at Apple in nearly 20 years and has been inspired by Helvetica and DIN.
The San Francisco Text typeface has three main variants: SF for macOS, iOS, and iPadOS; SF Compact for watchOS; and SF Mono for the Terminal, Console, and Xcode applications. Several other variants exist for internal use by Apple.
San Francisco Text was first introduced in watchOS only. The next year at WWDC, Apple released the watchOS font as SF Compact and at the same time introduced SF UI (generally called SF) for OS X El Capitan and iOS 9. In macOS High Sierra and iOS 11, SF UI was succeeded by SF Pro.
Download
Search Fonts
История Arial
С Arial совсем другая история. Примерно в то же время, когда Adobe занималась разработкой PostScript, компания Monotype выиграла контракт на поставку шрифтов для первых крупных лазерно-ксерографических принтеров IBM. Это привело к тому что в 1982 году Робином Николасом и Патрисией Сондерс для Monotype Typography был создан новый шрифт Arial. Несколько лет спустя лицензия на использование шрифта была получена Microsoft и впоследствии он входил в пакет со всеми версиями операционной системы Windows, что привело к его невероятно широкому использованию и популярности, особенно в Интернете.
Arial изначально создавался как конкурент Helvetica, но при этом имел собственный дизайн с уникальными деталями, более подходящими для технологий печати с низким разрешением того времени, включая лазерный принтер IBM. Его корни лежат в Monotype Grotesque, шрифте, нарисованном в 1926 году.
Спустя десять лет, в 1992 году, Microsoft лицензировала Arial и семейство было расширено, теперь оно включает 28 насыщенностей и начертаний.
Most Frequently Asked Questions!
What type of font is Helvetica Neue Font?
It is a sans-serif typeface and one of the variants of Helvetica typeface. It originated in the early 1980s and since then it made a center of attention in many places. The font family has additional variants and it comprises more than 50 fonts.
Is Helvetica Neue Free font to use?
No, you can use its free version only for personal use however if you want to use it for commercial purposes, you need to buy the license from its foundry where it originated.
Is Helvetica Neue worth using typeface?
Helvetica Neue is a better and improved version of Helvetica typeface with many changes. It is a perfect typeface to be used in your work projects and it can be considered for many platforms. You can clearly consider this font for different reasons without any second thought.
What is Helvetica Neue Generator?
It is a free online tool used for different reasons. The tool allows the users to design different Helvetica fonts without downloading the font in your system. It also makes the font compatible with different browsers.
Where Helvetica Neue can be used?
You can clearly use the font in different platforms including Headings, Websites, Designs, Logos, Posters, Banners, Advertisements, etc. It enlarges the readability score and makes the context prominent and understandable.
Equitan Sans
Part of the Equitan super family, Equitan Sans and Equitan Slab are ready for branding projects and packaging design. They serve up industrial-era letterforms, refreshed for a new century. Each of the seven weights has an upright and a italic variant, with 418 glyphs per font. The default numeral style in all 14 fonts are proportional oldstyle figures.
Thanks to OpenType features, tabular versions are also available, as well as lining figures. Equitan Sans, with its closed apertures and arched shapes, resembles nineteenth century grotesques without becoming sterile, like so many mid-twentieth century neogrotesks. Wherever possible, counterforms are rounded, such as in b, d, p, q, 6, or 9 – even the bottom counter of the two-storey ‘g’ is round.
Download
Search Fonts
Aileron
Aileron is a sans serif font which adds my own interpretation with reference to a typeface classified as Neo-Grotesque including Helvetica.
In order to make it easy to distinguish it from the capital letter “I”, we made the letter of the lower case letter “l” curved at the end portion as a slight adjustment for the text for the text.
In addition, the dot part of, such as “i” and “j” or period in a circle, the curved portion clothoid curve By performing the process was conscious, was to get an overall soft impression. It is close to Helvetica in terms of design, but rather conceptually it is closer to Univers.
Download
Search Fonts
А если без кириллицы?
Для англоязычных текстов вышеприведенные таблицы имеют несколько другой вид.
| Windows | Mac OS | Unix/Linux | Родовое семейство |
|---|---|---|---|
| Arial Black | Gadget | Nimbus Sans L | Sans-serif |
| Arial | Helvetica | Nimbus Sans L | Sans-serif |
| Comic Sans MS | Monaco | TSCu_Comic | cursive |
| Courier New | Courier | Nimbus Mono L | Monospace |
| Georgia | * (см. ниже) | Century Schoolbook L | Serif |
| Impact | Charcoal | Rekha | Sans-serif |
| Times New Roman | Times | Nimbus Roman No9 L | Serif |
| Trebuchet MS | Helvetica | Garuda | Sans-serif |
| Verdana | Geneva | DejaVu Sans | Sans-serif |
Для шрифтов Arial, Courier New и Times New Roman при составлении линеек лучше указывать сначала шрифт для Unix/Linux, а затем для Mac OS. Это связанно с некоторой кривостью набора Linux шрифтов X11 core fonts set.
Шрифты, которые не входят в перечень «безопасных», но могут использоваться на макетах, лучше определять шрифтовыми CSS стеками на основе этой таблицы.
| Windows | Mac OS | Unix/Linux | Родовое семейство |
|---|---|---|---|
| Lucida Console | Monaco | — | Monospace |
| Lucida Sans Unicode | Lucida Grande | Garuda | Sans-serif |
| Palatino Linotype | Palatino | Garuda** | Sans-serif |
| Tahoma | Geneva | Kalimati | Sans-serif |
Прочерк в графе Unix/Linux обозначает, что пользователи этих ОС скорее всего увидят на странице шрифт, установленный для отображения страниц по умолчанию.
** В данной линейке шрифт Garuda имеет смысл ставить перед Palatino (см. пояснение выше).
А если без кириллицы?
Для англоязычных текстов вышеприведенные таблицы имеют несколько другой вид.
| Windows | Mac OS | Unix/Linux | Родовое семейство |
|---|---|---|---|
| Arial Black | Gadget | Nimbus Sans L | Sans-serif |
| Arial | Helvetica | Nimbus Sans L | Sans-serif |
| Comic Sans MS | Monaco | TSCu_Comic | cursive |
| Courier New | Courier | Nimbus Mono L | Monospace |
| Georgia | * (см. ниже) | Century Schoolbook L | Serif |
| Impact | Charcoal | Rekha | Sans-serif |
| Times New Roman | Times | Nimbus Roman No9 L | Serif |
| Trebuchet MS | Helvetica | Garuda | Sans-serif |
| Verdana | Geneva | DejaVu Sans | Sans-serif |
Для шрифтов Arial, Courier New и Times New Roman при составлении линеек лучше указывать сначала шрифт для Unix/Linux, а затем для Mac OS. Это связанно с некоторой кривостью набора Linux шрифтов X11 core fonts set.
Шрифты, которые не входят в перечень «безопасных», но могут использоваться на макетах, лучше определять шрифтовыми CSS стеками на основе этой таблицы.
| Windows | Mac OS | Unix/Linux | Родовое семейство |
|---|---|---|---|
| Lucida Console | Monaco | — | Monospace |
| Lucida Sans Unicode | Lucida Grande | Garuda | Sans-serif |
| Palatino Linotype | Palatino | Garuda** | Sans-serif |
| Tahoma | Geneva | Kalimati | Sans-serif |
Прочерк в графе Unix/Linux обозначает, что пользователи этих ОС скорее всего увидят на странице шрифт, установленный для отображения страниц по умолчанию.
** В данной линейке шрифт Garuda имеет смысл ставить перед Palatino (см. пояснение выше).
Стек стандартных шрифтов
Выбор стандартного шрифта , используемого конкретной операционной системой, может улучшить производительность. Это относится к любому « безопасному для интернета » шрифту. Польза « системных » шрифтов заключается в том, что они совпадают с теми, которые уже использует операционная система, поэтому пользователю будет комфортно читать текст.
Классификация системных шрифтов :
| ОС | Версия | Системный шрифт |
| Mac OS X | El Capitan | San Francisco |
| Mac OS X | Yosemite | Helvetica Neue |
| Mac OS X | Mavericks | Lucida Grande |
| Windows | Vista | Segoe UI |
| Windows | XP | Tahoma |
| Windows | 3.1 до ME | Microsoft Sans Serif |
| Android | Ice Cream Sandwich (4.0)+ | Roboto |
| Android | Cupcake (1.5) до Honeycomb (3.2.6) | Droid Sans |
| Ubuntu | Все версии |
Акцидентные
Le Murmure Cyrillic. Александр Слобженинов выпустил кириллизацию бесплатного акцидентного кириллического шрифта.
Monterchi. Гарнитура, включающая четыре подсемейства: Monterchi, Text, Sans, Serif. Все шрифты с кириллицей и богатым набором лигатур. Всего 50 начертаний, 8 из которых бесплатные. Цена на остальные от 29 $ за начертание, от 229 $ за все.
Handjet. Бесплатная декоративная гарнитура с кириллицей студии Rosetta. У шрифта 22 варианта рисунка, каждый вариант в 9 начертаниях. Всего получается 198 шрифтов. Плюс один вариативный, в который упакованы все. Немало опентайп фич.
Concrete. Бесплатный гротеск с кириллицей в одном начертании. Подойдёт для акциденции.
SK Primo. Бесплатный акцидентный гротеск с кириллицей, созданный Тихоном Резцовым из Москвы.
Palace of Sports. Акцидентный гуманистический гротеск с кириллицей, вдохновлённый шрифтом с фасада петербургского спортивного комплекса «Юбилейный» (нет, в разрушено другое здание — СКК). Бесплатен для некоммерческих проектов.
Postertoaster. Бесплатный акцидентный моноширинный шрифт с кириллицей. У каждого глифа несколько альтернатив. Сделал Всеволод Абрамов из Москвы.
Pitcrew. Акцидентный шрифт с кириллицей Антона Попова. Бесплатный для персональных проектов, цена коммерческой лицензии по запросу.
Обновился Marvin Visions, акцидентный шрифт с кириллицей — теперь он вариативный в двух вариантах оптического веса. Шрифт бесплатный для личного использования, коммерческая лицензия стоит от 19 £ за начертание и от 38 £ за набор начертаний (есть три опции).
BROZAS. Бесплатный вариативный акцидентный шрифт с кириллицей. Сделал Виктор Песоцкий из Санкт-Петербурга.
FE Fire Font. Бесплатный акцидентный шрифт с кириллицей в одном начертании. Все формы вдохновлены языками пламени.
SWAMPY. Бесплатный акцидентный «болотный» шрифт с кириллицей.
Помидорко. Бесплатный акцидентный шрифт с русским и украинским языками. Одно начертание.
Шрифты, похожие на «Helvetica Cyrillic Oblique»
Cyrvetica-Narrow Oblique
- Семейство: Cyrvetica-Narrow
- Начертание: Oblique
- Насыщенность: 400
- Версия: 1.0 Thu Nov 04 14:37:33 1993
Cyrvetica Oblique
- Семейство: Cyrvetica
- Начертание: Oblique
- Насыщенность: 400
- Версия: 1.0 Tue Oct 19 11:46:57 1993
AGHelveticaCyr Oblique
- Семейство: AGHelveticaCyr
- Начертание: Oblique
- Насыщенность: 400
- Версия: 001.000
AGOpusHighResolution Oblique
- Семейство: AGOpusHighResolution
- Начертание: Oblique
- Насыщенность: 400
- Версия: 1.0 Thu Mar 24 20:27:37 1994
CourierMCY Oblique
- Семейство: CourierMCY
- Начертание: Oblique
- Насыщенность: 400
- Версия: Version 001.005
Верстальщику о шрифтах. Безопасные шрифты.
Начиная верстать макет, необходимо в частности указать в CSS используемые на странице шрифты. Зачастую различными шрифтами дизайнер набирает не только основной текст страницы, но и разнообразные заголовки, логотипы, вензеля.
Хороший дизайнер, как и хороший верстальщик, знает, что браузер может использовать для отображения страницы только те шрифты, которые установлены на компьютере у пользователя. То есть шрифты можно условно разделить на две категории:
- Шрифты, которые без проблем отобразятся у подавляющего большинства пользователей.
- Шрифты, которые у достаточно большой группы пользователей отсутствуют.
Если дизайнер использовал шрифты второй категории для создания, наример, логотипа или крупных статичных заголовков, можно не колеблясь использовать прием замены текста картинкой. Недостаток применения этого приема — негибкость. В случае изменений в тексте придется переделывать картинку и менять CSS (например, если размеры новой картинки не совпадут со старой).
Можно сказать, что опасность применения приема напрямую зависит от вероятности смены текста. Поэтому делать, например, общий текст страницы нестандартными шрифтами нельзя! Грамотный дизайнер так никогда не поступит. А если дизайнер попался зеленый, хороший верстальщик просто обязан исправить его ошибку — в верстке подменить данный шрифт максимально похожим стандартным.
Но как же отличить шрифты первой группы от второй? Ясно что на набор шрифтов, установленный непосредственно на твоем компьютере опираться нельзя! Давайте разбираться.
Шрифты поддерживающие кириллицу
Специфической особенностью рунета является проблема с кодировками страниц и поддержкой кириллицы в шрифтах. Чтобы не возникало проблем с разнообразными кодировками символов, умные люди придумали Unicode, который позволяет сочетать в одном шрифте символы нескольких языков. Таким образом для русскоязычных страниц нужно использовать только Unicode шрифты поддерживающие кириллицу.
Ниже приведена таблица соответствий шрифтов.
| Windows | Mac OS | Unix/Linux | Родовое семейство |
|---|---|---|---|
| Arial Black | Helvetica CY | Nimbus Sans L | Sans-serif |
| Arial | Helvetica CY | Nimbus Sans L | Sans-serif |
| Comic Sans MS | Monaco CY | * (см. ниже) | cursive |
| Courier New | * (см. ниже) | Nimbus Mono L | Monospace |
| Georgia | * (см. ниже) | Century Schoolbook L | Serif |
| Impact | Charcoal CY | * (см. ниже) | Sans-serif |
| Times New Roman | Times CY | Nimbus Roman No9 L | Serif |
| Trebuchet MS | Helvetica CY | * (см. ниже) | Sans-serif |
| Verdana | Geneva CY | DejaVu Sans | Sans-serif |
* в колонке напротив шрифта означает, что родных кириллических эквивалентов Windows шрифта у операционной системы не имеется. Но в то же время есть большая вероятность, что в операционной системе установлен непосредственно сам этот шрифт.
Например, если основным текстом макета является Arial, находим в табличке этот шрифт и в CSS пишем соответствующую ему строчку:
body {
font-family: Arial, «Helvetica CY», «Nimbus Sans L», sans-serif;
}
|
1 |
body{ font-familyArial,»Helvetica CY»,»Nimbus Sans L»,sans-serif; } |
Эта запись означает, что если у пользователя есть шрифт Arial (а он есть у всех пользователей Windows и всех пользователи Mac OS X), то страница отобразися этим шрифтом. Если же у пользователя нет этого шрифта, то страничка русскоязычного пользователя Mac OS 9 точно отобразится стандартным системным шрифтом Helvetica CY, а у пользователя Unix/Linux отобразися шрифтом Nimbus Sans L который установлен у 90% пользователей Unix/Linux. Если же пользователь Unix/Linux принадлежит в тем 10%, у которых нет этого шрифта, то страница отобразится тем шрифтом с засечками, который установлен для просмотра Web-страниц по умолчанию.
Кроме того, что в таблице учитываются шрифты Unix/Linux, там еще после обычного Helvetica идет какой-то странный значок CY. Давайте разбираться, что же это такое!
До выхода Mac OS X эта линейка имела следующее значение: для пользователей Windows отображаем страницу Arial, для пользователей Mac OS 9 — стандартным шрифтом Helvetica, а остальные видят страницу с системным шрифтом без засечек, настроенным по умолчанию в браузере. Но опять же немаловажный нюанс! У стандартного Mac OS 9 шрифта Helvetica нет кириллицы! Для русскоязычной страницы это означало следующее: для пользователей Windows отображаем страницу Arial, для пользователей Mac OS 9 — стандартным шрифтом Helvetica, который выводит нечитаемую информацию, а остальные видят страницу с системным шрифтом без засечек, настроенным по умолчанию в браузере.
Для правильного отображения этого набора у пользователей Mac OS 9 вместо некириллизированной Helvetica, имеет смысл указывать такой же стандартный для Mac OS 9 шрифт Helvetica CY, содержащий кириллицу.
Прочтение линеек после выхода Mac OS X изменилось. Теперь для Windows/Mac OS X указывается один общий стандартный шрифт. А если мы хотим, чтобы замысел дизайнера смогли увидеть пользователи Mac OS 9, для них нужно в линейке шрифтов прописать шрифт содержащий кириллицу.
Таким образом хотя и не существует безопасных шрифтов, существуют безопасные линейки шрифтов. Их еще называют шрифтовыми CSS стеками. В эти линейки помимо стандартных шрифтов Windows/Mac OS X можно включать также эквивалентные шрифты из стандартного набора Mac OS 9 (которая не содержит по умолчанию «безопасных» шрифтов) и распространенных шрифтов Unix/Linux.
Любой верстальщик рано или поздно сталкивается с моментом, когда дизайнер использует в макете шрифт, не входящий в перечень «безопасных»;. Но это еще не повод бить тревогу! Например, дизайнеры очень часто используют на макетах шрифт Tahoma, который не входит в этот перечень. Правильно построенная линейка шрифтов открывает возможность использовать не только Tahoma, но и другие шрифты. Все большее количество дизайнеров пользуются этой возможностью и грамотный верстальщик должен об этом знать.
Ниже приведена дополнительная таблица шрифтов, которые не входят в перечень «безопасных», но могут использоваться на макетах.
| Windows | Mac OS | Родовое семейство |
|---|---|---|
| Lucida Console | Monaco | Monospace |
| Lucida Sans Unicode | Lucida Grande | Sans-serif |
| Tahoma | Geneva CY | Sans-serif |
Правила использования креативных шрифтов
О роли выбора шрифтов в дизайне можно писать бесконечно. Шрифты добавляют эмоциональный окрас тексту и не только. Надпись, выполненная креативным шрифтом, может стать полноценной альтернативой изображению. Давайте вспомним правила использования креативного шрифта в дизайне.
- Креативный шрифт используется для оформления заголовков и надписей, играющих центральную роль в дизайне макета.
- В проекте лучше использовать один креативный шрифт. Если нужны какие-то пояснительные надписи, лучше выбрать классический шрифт. Подробно я писала об этом в статье «Как выбрать шрифт для проекта, если ты новичок«
- Текст, написанный креативным шрифтом должен быть читабельным. Иначе зачем вообще нужен текст.
- Дизайн креативного шрифта должен соотсветствовать дизайну всего продукта. Например, неуместным будет использовать гламурный шрифт для написания текста на постере в стиле ретро.
Полиграфию вообще невозможно представить без креативных шрифтов. Плакаты, постеры, реклама, открытки, приглашения. Их дизайн должен быть ярким и запоминающимся.И здорово, что есть дизайнеры, которые готовы делиться своими креативными шрифтами совершенно бесплатно для этих целей.
Как вы могли убедиться, авторы этих креативных шрифтов вдохновляются всем, что их окружает — природой, фольклором, сиянием звезд на небосклоне, творчеством других людей. Каждый день мы соприкасается с силой созидания природы и человека, силой, которая способна генерировать множество идей в умах людей. Но иногда, за ежедневными заботами, нам тяжело замечать источники данной силы. Вот почему дизайнерам, творческим людям постоянно нужны ресурсы для вдохновения.
Источником таких ресурсов может стать блог «Дизайн в жизни»
|
Подписывайтесь на обновления блога «Дизайн в жизни» и мы обязательно опубликуем для вас еще больше полезных бесплатных ресурсов! |
В поисках Web-безопасных шрифтов
В интернете исторически сложилось такое понятие как «безопасные» Web-шрифты. Безопасным шрифтом можно назвать такой шрифт, который является стандартным для всех операционных систем. Поскольку о таком положении дел остается только мечтать, то абсолютно безопасных шрифтов не существует!
Отдельные шрифты можно назвать безопасными с некоторыми оговорками.
Основой для определения «безопасных» шрифтов послужили шрифты наиболее распространенной операционной системы Windows, которые кроме того используются в других ОС. Примером такого использования служит уже упоминавшийся пакет шрифтов Core fonts for the Web, который, согласно статистике, скачало множество пользователей Unix/Linux.
В это пакет входят следующие шрифты: Andale Mono, Arial Black, Arial, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS, Verdana, Webdings
Все они поддерживают кириллицу, что немаловажно для рунета
В набор шрифтов входящих в стандартную поставку Mac OS X (эта ОС имеет наибольшее распространение среди пользователей Mac OS) входят все шрифты набора Core fonts for the Web.
Таким образом на основе шрифтов Windows, использующихся в других ОС сформировался следующий список так называемых «безопасных» Web-шрифтов:
- Arial
- Arial Black
- Comic Sans MS
- Courier New
- Georgia
- Impact
- Times New Roman
- Trebuchet MS
- Verdana
Шрифт Webdings содержит набор пиктограмм, поэтому не может использоваться для контента. Andale Mono не получает широкого применения, поскольку плохо годится для повседневного чтения текста с экрана и есть не у всех пользователей Windows.
Все эти шрифты есть у каждого пользователя Windows, Mac OS X и у подавляющего большинства пользователей Unix/Linux (т.е. у тех, которые установили у себя пакет Core fonts for the Web).
А как же быть с остальными? Ведь хочется, чтобы замысел дизайнера увидело как можно большее число пользователей!
