Товаров: 0 (0р.)

Шрифт угловатый: Шрифты без засечек | Шрифты онлайн

Содержание

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

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

Содержание статьи

Придерживайтесь стиля вашего бренда

У вашего бренда еще нет фирменного стиля и шрифта?

1. Учитывайте целевую аудиторию
2. Выбирайте шрифт, который будет подчеркивать ваш продукт

Что такое веб-безопасные шрифты?

Как комбинировать разные шрифты при создании сайта

Как разные типы шрифтов влияют на ваш дизайн

Заключение

Придерживайтесь стиля вашего бренда

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

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

В гайдлайнах обычно указывается вся иерархия шрифтов, которые используются при создании фирменного стиля бренда. Эти правила можно сразу же интегрировать в свой дизайн. Если другой бренд использует какой-либо неизвестный вам шрифт, можно воспользоваться инструментом «WhatTheFont» на сайте Myfonts.com. Это поможет вам его идентифицировать.

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

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

Читайте также: Вы кое-что забыли! или Как неудачные шрифты могут убить конверсию лендинга

У вашего бренда еще нет фирменного стиля и шрифта?

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

1. Учитывайте целевую аудиторию

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

Разные аудитории — разный дизайн, в том числе и шрифт

Как только вы ответите на вопрос об аудитории, у вас будет понимание стиля. Основываясь на этой информации, вы сможете правильно подобрать шрифт для своего лендинга.

2. Выбирайте шрифт, который будет подчеркивать ваш продукт

Скажем, вы — владелец винтажного магазина одежды с приятной и современной атмосферой. Вы можете выбрать традиционный шрифт для заголовков и классический шрифт без засечек для основного текста. К примеру, для заголовков можно взять шрифт вроде Arvo, а для основного текста — Open Sans, известный своей читабельностью. Это придаст всему сайту сбалансированный внешний вид. Кроме того, он будет выглядеть вневременно, что будет отлично сочетаться с вашей компанией в стиле ретро: 

Или, скажем, у вас юридическая фирма или бренд элитной косметики, и вы хотите, чтобы внешний вид сайта подчеркивал ваш профессионализм и вызывал доверие потенциальных клиентов. Тогда лучше будет использовать классический и одновременно элегантный шрифт вроде Frank Ruhl Libre или Playfair Display. В глазах потенциальных клиентов это лишний раз подчеркнет вашу надежность и первоклассный уровень сервиса. 

Chanel использует уникальный брендовый шрифт на своем сайте

Независимо от того, какой шрифт вы в итоге выбрали, убедитесь в том, что он является веб-безопасным. О том, какие шрифты относятся к «безопасным», вы узнаете, прочитав информацию ниже.

Читайте также: 15 красивых, актуальных и бесплатных шрифтов

Что такое веб-безопасные шрифты?

Использование веб-безопасного шрифта означает, что пользователям не нужно устанавливать какой-либо дополнительный шрифт на компьютер, чтобы текст правильно отображался в их браузере. 10 лет назад было всего 13 семейств шрифтов, которые дизайнеры могли использовать при создании сайтов. В настоящее время золотым стандартом для любого дизайнера является Google Fonts. Эти шрифты корректно отображаются в любых браузерах.

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

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

Как комбинировать разные шрифты при создании сайта

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

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

Вот, как это выглядит на практике:

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

2. Затем нужно выбрать дополнительный шрифт, который будет использоваться для основного текста. Он должен быть легко читаемым даже на небольших экранах. Таким, к примеру, является шрифт Noto Sans.

3. И, наконец, ваш третий шрифт должен привлекать внимание. Его можно использовать на кнопках целевого действия или выделять с его помощью некоторые части текста. Для этого прекрасно подойдет шрифт вроде Montserrat.

Читайте также: 4 способа улучшить восприятие бренда с помощью шрифтов на посадочной странице

Как разные типы шрифтов влияют на ваш дизайн

Только грамотная комбинация шрифтов может оказать существенное влияние на внешний вид вашего лендинга. 

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

Выше можно увидеть еще два примера грамотного использования шрифтов. Первый лендинг принадлежит кэшбэк сервису. Там используется четкий, но слегка угловатый шрифт Open Sans. Благодаря этому сайт приобретает современный внешний вид. Второй пример — магазин чая и подарков. На его страницах используется более редкий шрифт Bebas Neue Regular, также без засечек, но за счет «вытянутости» по вертикали он выглядит более оригинально. В обоих этих примерах шрифт прекрасно сочетается с остальными элементами дизайна и прекрасно передает ценности бренда. В этом и заключается сила влияния шрифта.

Читайте также: Как типографика влияет на конверсию лендинг пейдж?

Заключение

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

Высоких вам конверсий!

По материалам: 99designs.com

24-08-2018

Была, осталась, видоизменилась…

9 — 2008

Владимир Чуфаровский

История с продолжением

Не сглаживая углов…

Сглаживая углы…

Смежные темы

Вместо заключения

История с продолжением

В иллюстративных примерах, которые были выбраны для предыдущей публикации (см. КомпьюАрт № 8’2008), фигурировал не вполне обычный, по меркам нынешней российской рекламной практики, ненасыщенный акцидентный шрифтовой материал. Необходимо отметить, что в рассматриваемом временном интервале в акцидентных задачах зачастую использовались и совсем иные функционалистские типографические конструкции, большинство из которых вошло в типографический обиход, начав не с наборных, а с титульных применений. Следуя линии, которая уже проводилась, до того как будет, по обыкновению, привлечен материал реминисцентного характера, попытаемся актуализировать сам предмет рассмотрения, а потому вначале уточним, о каком типографическом материале должна пойти речь. Для этого приведем последовательно пять чисто шрифтовых иллюстраций (рис. 1-5).

 

 

Первый пример (см. рис. 1) заслуживает того, чтобы его подробно прокомментировать, и вовсе не потому, что репродуцированные в нем шрифты разработал П.Реннер — один из признанных мэтров шрифтового искусства прошлого века. Приведенный здесь в двух верхних строках малоконтрастный функционалистский шрифт характерного угловатого рисунка цитируется во всех серьезных справочниках как одно из начертаний его знаменитой гарнитуры Футура. В зарубежных источниках он фигурирует как Futura Display, что в переводе означает «акцидентная, демонстрационная Футура». По стечению обстоятельств в тех отечественных публикациях, где писалось об этом шрифте, никто не задался вопросом, как так случилось, что сам Пауль Реннер включил в свои гарнитуры даже не одно, а два начертания, стилистически кардинально отличающихся от всех других. Кстати, второй из упомянутых шрифтов практически всем хорошо известен — это Futura Black. Но данный шрифт будет процитирован немного позже.

Возможно, самое удивительное состоит в том, что для того, чтобы убедиться в этих стилевых различиях, не надо заниматься поиском комментариев даже самых маститых зарубежных аналитиков — достаточно здравого смысла и той подготовки, которую получают, например, студенты младших курсов в том же «Полиграфе». Для облегчения такого сопоставления в двух нижних строках примера процитировано близкое по насыщенности начертание Futura Bold. Отметим кратко, что, комплектуя свою гарнитуру, Реннер пытался создать своего рода универсальный набор шрифтоначертаний, который в будущем мог быть использован, по представлениям того времени, где угодно. Естественно, что он при этом не только базировался на своих знаниях, но и творчески обработал тот реальный графический материал, который к тому времени был накоплен в практике европейской рекламы. К сожалению, случилось так, что Futura Display в России пока не локализован. Это тем более досадно, поскольку акцидентные достоинства графики, которая реализована в этом шрифте, достаточно очевидны. Это вполне подтверждают не только исторические примеры, но и современная практика наших коллег из стран Запада.

В следующей иллюстрации (см. рис. 2) приводятся два из четырех начертаний шрифта в названии, которого вновь фигурирует слово Futura. Создателем этой завершенной в 1955 году разработки, в которую входят также еще два курсивных начертания, является все тот же П.Реннер, который и дал ей тогда название Futura Steile.

В данном случае П.Реннер фактически обобщил те идеи, которые он воплотил вначале в шрифте Futura Display, сохранив при этом прежнюю угловатую стилистику. Вряд ли имеет смысл комментировать совершенно очевидные графические и прикладные достоинства этой гарнитуры. Стоит лишь упомянуть, что Реннер, фигурально выражаясь, стандартизировал этой своей разработкой 1956 года альтернативные варианты начертаний таких букв, как А, E, K, M, N и W, которые ранее использовались другими художниками от случая к случаю, главным образом в рекламных плакатах. Свидетельством популярности этих альтернативных начертаний могут быть многие образцы шрифтов, созданные в период своеобразного второго пришествия арт деко, которое, начавшись в конце 1950-х годов, активно продолжалось почти десять лет.

В третьей иллюстрации (см. рис. 3) представлен хорошо всем знакомый шрифт. На всякий случай напомним, что в этом примере фигурируют четыре из семи вариантов шрифтоначертаний гарнитуры Eurostyle, которую известный итальянский дизайнер А.Новарезе создал в 1962 году. Рисунок знаков этой гарнитуры во многом обобщает опыт многих плакатных работ, создававшихся в 1920-30-е годы, с той разницей, что тогда в них преобладало использование прописных букв. Обратим внимание на то, что в этой гарнитуре, наряду с двумя шрифтами нормальной ширины, присутствуют расширенные, суженные и даже компактные начертания. Этот шрифт хорошо известен у нас во многом потому, что вот уже почти полтора десятка лет неизменно фигурирует в составе популярного пакета CorelDRAW. К сожалению, в последнее время шрифты такого типа почему-то редко употребляются в отечественной рекламе, несмотря на то что остаются популярными в Европе и Северной Америке. Более того, шрифтовые дизайнеры, работающие в странах Запада, в последние годы создали немало достаточно широко востребованных в нынешней акцидентной практике геометризованных шрифтов, где в рисунке букв преобладают штрихи, идущие в вертикальном и горизонтальном направлении, причем для практики важно, что многие из этих разработок тяготеют к популярной стилистике хай-тек.

Уже в 90-х годах были созданы шрифты, выбранные для четвертой иллюстрации (см. рис. 4). В приведенном примере процитированы оба начертания гарнитуры Stenberg, которая была создана одним из известных отечественных дизайнеров шрифта Т.Сафаевым и которая вместе с другой его аналогичной разработкой с 1997 года присутствует в каталогах компании «ПараТайп». Многим известно, что шрифты подобного рисунка часто использовали в своих плакатах такие художники русского послереволюционного авангарда, как братья Стенберги и А.Родченко. Более того, в их работах применялись также шрифты, рисунок которых близок к прописным буквам ранее процитированной нами гарнитуры Eurostyle. Эти жестко геометризованные шрифты у нас до сих пор продолжают использоваться, причем это едва ли не единственная чисто российская шрифтовая разработка, которую почти сразу после ее создания лицензировала и ввела в свои каталоги такая известная шрифтовая фирма, как International Typeface Company (ITC).

В последней иллюстрации заявленной серии (см. рис. 5) показана гарнитура Simpler, которая была разработана автором статьи в том же 1997 году для шрифтового авторского проекта «ТРИ-О-ГРАФ», входившего в состав пакета «Русский Офис». Так вышло, что из-за отсутствия государственной поддержки главный инвестор данного проекта — компания «Ай-Ти» работы над этим пакетом в самом начале 2000-х годов прекратила, однако его шрифтовой комплект до сих пор фигурирует среди широкодоступных ресурсов Интернета и продолжает использоваться в дизайнерской практике.

Применительно к последнему рисунку заявленной серии необходимо отметить, что основным в нем является первый недекорированный алфавитный фрагмент, в то время как второй просто является попыткой автора, памятуя о знаменитом логотипе фирмы IBM, ввести в современное пользовательское обращение один из популярных в 1930-х годах вариантов отделки. Строго говоря, данный шрифт не может быть непосредственно соотнесен с неконтрастными функционалистскими шрифтами точно так же, как, например, упоминавшаяся классическая разработка П.Реннера Futura Black, процитированная в этом рисунке в двух нижних строках. Впрочем, в нашем случае определяющим классификационным признаком является отчетливо выраженный геометризм рисунка этих шрифтов. Как тут не напомнить о том, что никакой классификационный ригоризм ничуть не помешал использовать подобные шрифты в акцидентной практике первой трети прошлого века как в Западной Европе, так и в США! Именно поэтому подобного рода разновидности шрифтов ныне часто рассматриваются в категории смежных графических тем, причем такой прагматический подход достаточно широко использовался уже в первой трети прошлого века.

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

Нетрудно выявить сходство в рисунке букв рекламного фрагмента, полученного из общедоступных интернет-источников, с графикой, использовавшейся в приведенных примерах (см. рис. 1-2). Данный факт, конечно, не может рассматриваться как повод для служебного дознания на предмет того, какой именно шрифт применили в этом случае дизайнеры. Здесь важно именно сходство рисунка букв, а не полная их идентичность с какой-то реальной гарнитурой. К рекламным разработкам, обеспечивавшим выход на экраны снятого российским режиссером американского фильма «WANTED» (в российском прокате фильм идет под названием «Особо опасен») с бюджетом порядка 70 млн долл., безусловно, были привлечены подготовленные и опытные профессионалы. Именно поэтому тут нет и не может быть поводов для того, чтобы препарировать эту графику, стараясь скрупулезно выискивать реальные или мнимые недочеты в работе дизайнеров.

Вот еще три иллюстрации (см. рис. 7-9), также основанные на материалах, полученных из общедоступных ресурсов Интернета.

В этом примере надписи первых двух фрагментов (см. рис. 7) имеют очевидное сходство с рисунком букв гарнитуры Eurostyle, процитированных на рис. 3. Рисунок букв в тексте третьего фрагмента, будучи тематически также связан с насыщенным компактным начертанием гарнитуры Eurostyle, является в данном случае просто современной «аутлайн»-вариацией этой графической темы.

Еще более жесткий угловатый рисунок имеют буквы тех шрифтов, что использовали американские дизайнеры при разработке рекламы двух других хорошо известных у нас фильмов. Их фрагменты рекламы выбраны для второго примера (см. рис. 8).

Не будем искать прямых аналогов, сопоставляя графику этих рекламных текстов с начертаниями букв разработанных Т.Сафаевым гарнитур Rodchenko и Stenberg (см. рис. 4). Этого делать не нужно, поскольку в данном случае этот пример важен в первую очередь как современный образец развития тех авангардистских графических новаций, которые дал современной акциденции русский авангард начала 1920-х годов.

Следующая иллюстрация (см. рис. 9) также не нуждается в подборе аналогов из архивных материалов 1920-30-х годов, поскольку, подобно предыдущему примеру, демонстрирует образцы современной обработки угловатой и жесткой шрифтовой графики, которая вошла в художественную практику в первой трети прошлого века.

Приведем еще одну иллюстрацию (см. рис. 10), для которой специально был выбран материал, который, без преувеличения, можно считать обиходным. Эта графика, возможно, смотрится не столь эффектно, как большинство рекламных фрагментов, подобранных для предыдущих примеров. Однако в методическом отношении она не менее важна, поскольку может служить доказательством того, что заглавие этого раздела выбрано неслучайно, поскольку данный пример демонстрирует развитие графических идей 1920-30-х годов прошлого века применительно к современной ситуации.

Рис. 11, завершающий этот раздел, может служить дополнительным подтверждением высказанной мысли применительно к архитектуре, которая является, как известно, прародительницей дизайна как такового. Конечно, в приведенном примере невозможно усмотреть ничего такого, что напрямую связывало бы его с типографической акциденцией. Вместе с тем он, будучи непосредственно связан с функционалистскими эстетическими открытиями первой трети прошлого века, имеет прямое отношение к теме статьи не только потому, что на левой фотографии — здание «Баухауса» в Дессау. Правая фотография (хайтековское Fuji Building) демонстрирует не только жизнеспособность функционалистских эстетических открытий прошлого века, но и дает пример того, что они продолжают свою жизнь в новое время, в том числе и в новом качестве.

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

Не сглаживая углов…

Трудно найти публикации по довоенному арт деко, в которых бы не воздавалось должного тем идейным и тематическим прорывам, которые связаны с советским послереволюционным авангардом. Ведущие западные аналитики, говоря о достижениях «Баухауса» и характеризуя ту питательную среду, на которой взрастали его эстетические новации, неизменно указывают как на деятельность группы De Stijl, так и на русских конструктивистов. Патриция Кэри, один из самых авторитетных современных западных аналитиков, в своем фундаментальном исследовании, посвященном графическому наследию арт деко предвоенной поры, дает для этой ситуации оригинальную образную иллюстрацию, говоря, что «Баухаус» своей художественной практикой кристаллизовал лучшие графические идеи его предшественников. Это дает все основания начать раздел с нескольких иллюстраций, основанных именно на российском материале. Стараясь выдержать последовательный подход, для первого из этих примеров мы выбрали два советских плаката (рис. 12).

При их внимательном рассмотрении можно выявить между ними очевидные технологические различия. В первом случае мы имеем дело с плакатом, который разработчики занумеровали как Окно РОСТа № 744; общеизвестно, что для удобства ручного размножения плакатов в 1921 году художники широко использовали тогда трафаретную технику. Второй представленный плакат, как известно, является уже тиражным изданием.

Следующая иллюстрация (рис. 13) в стилистическом отношении является более однородной, тем более что в данном случае мы имеем дело с образцами уже чисто полиграфической продукции. Оба ее фрагмента созданы в 1923 году, причем в первом случае это обложка журнала «ЛЕФ», а в качестве второго фрагмента вновь использован плакат А.Родченко с текстом В.Маяковского, который посвящен рекламе часов фирмы «Мозер».

В обоих последних примерах следует обратить особое внимание на их рекламные фрагменты. Анализировавшие эти плакаты Родченко многочисленные комментаторы (не только отечественные, но и зарубежные) по стечению обстоятельств почему-то не предприняли усилий для пунктуального стилистического анализа этих работ. В том случае, если бы такой анализ был сделан, пришлось бы признать стилевую неоднородность воспроизведенных там текстов. Так, в плакате, где говорится об уникальных достоинствах советских сосок, в буквах, из которых составлен текст «РЕЗИНОТРЕСТ», можно легко заметить характерные скругления в местах соединения вертикальных и горизонтальных штрихов. Напротив, в верхней строке рисунок букв жесткий, то есть такой, что в местах соединения штрихов рисунок никоим образом не сглаживался и, таким образом, скругления были фактически исключены. Аналогичный стилевой феномен имел место и в другом рекламном плакате, в котором художник счел возможным выбрать скругленный рисунок для букв З и Р у расположенного в самой середине плаката слова «Мозера», и это при том, что в слове «Мозер», стоящем в следующей строке, буква «Р» вновь имеет несглаженный, жесткий рисунок. Воздержимся здесь от домыслов на предмет того, почему Родченко не стал применять для буквы «З» то концептуализированное жесткое начертание, пример которого здесь ранее приводилось (см. рис. 4) и которое он использовал в других работах.

В качестве дополнительного свидетельства популярности нескругленных, аскетично лаконичных, жестких шрифтовых конструкций в искусстве России начала 1920-х годов может быть использована еще одна иллюстрация (рис. 14), где представлены репродукции книжных обложек. Несмотря на то что в данном примере более сдержанно и концептуально выглядит левый фрагмент, достаточно показательной является и его правая часть, где преобладают уже контрастные шрифтовые конструкции.

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

Проведем параллели с использованием угловатых неконтрастных графических конструкций в европейской практике того времени. Обратимся к авторитетной практике голландского дизайна первой половины 1920-х годов (рис. 15).

Левый фрагмент рис. 15 в особых комментариях не нуждается — это одна из обложек выпускавшегося группой De Stijl журнала, который издавался в Голландии группой художников и дизайнеров еще до большевистского переворота в России. Известно, что среди лидеров этой группы были такие значимые фигуры того времени, как Тео ван Дуйсбург и Питер Мондриан. Графика книжного знака, использованного во втором фрагменте (1925, художник Барт ван дер Лек), интересна не только тем, что ее автор примыкал к движению De Stijl, но и тем, что использованные геометричные неконтрастные шрифтовые конструкции в какой-то степени предвосхитили хайтековские типографические разработки нашего времени.

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

Вот еще одна иллюстрация на голландском материале (рис. 17). Автором обоих ее фрагментов, датируемых 1929 годом, является тоже входивший в группу De Stijl известный голландский художник В.Хузар (в другом варианте транскрипции — Гузар). В левой части рисунка репродуцирован его выставочный плакат, а в правой — оформленная им обложка художественного журнала Wendingen. Геометричные, состоящие исключительно из вертикальных и горизонтальных линий шрифтовые конструкции и созданные из них графические композиции, примененные в этой обложке, строго говоря, нельзя назвать неконтрастными, однако эстетическая близость обеих работ этого художника совершенно очевидна.

К 1930-му и 1932 году относятся рекламные работы итальянских художников Наззоли и Марчеси, вошедшие в состав следующей иллюстрации (рис. 18). В стилистическом отношении оба эти фрагмента существенно отличаются от предыдущих — в первую очередь тем, что здесь использованы те возможности, которые дает имитация третьего измерения. Особенно эффектен такой подход в первом случае, поскольку экономными средствами он придает динамичность всей картинке, при этом основной рекламный текст здесь оказывается уложен на дорожное полотно. По-своему более лапидарным является второй фрагмент, где рекламируется продукция фирмы Lazzaroni. В этом случае художник просто и вместе с тем броско выделил предмет рекламы — миндальные пирожные, противопоставив как бы вываливающиеся из плоскости листа объемные буквы плоскому, подчеркнуто статичному тексту, помещенному в нижнюю часть плаката. Данный пример демонстрирует возможность сочетания стилистически весьма разных текстовых композиций.

Оба фрагмента другой, тоже скомпонованной на базе итальянского материала иллюстрации (рис. 19) также имеют экспрессивный характер. На первом из них — обложка журнала Gioventa Fascista (1932, художник Ч.Гоббо), который был посвящен одному из юбилейных мероприятий режима Муссолини, а на втором — реклама с обложки блокнота (1934, художник не установлен). Как и в предыдущем рисунке, авторы здесь вновь постарались уйти от чисто плоскостных композиций. В первом случае использованы оригинальные шрифты, которые пока не встречались в статье, однако второй фрагмент представляет ничуть не меньший интерес. Пристально вглядевшись в волнообразную надпись, легко убедиться в том, что в данном случае криволинейный рисунок букв Q, O и S не только не диссонирует c жестким начертанием большинства других знаков, но и создает добавочные акцидентные эффекты за счет своеобразной графической аритмии, и можно только подосадовать, что этот шрифт пока не оцифрован, а потому не фигурирует ни в одном каталоге.

Последняя иллюстрация раздела сформирована на японском материале (рис. 20). На левом фрагменте — рекламный плакат японской государственной сети железных дорог (1937, художник М.Сатоми). Другой плакат также имеет рекламный характер и посвящен одной из проводившихся в Токио международных выставок (1940, автор не установлен). Сопоставление обоих фрагментов этого примера отчетливо показывает, что японские художники, находясь за много тысяч километров от Европы, еще в довоенное время, когда все виды межконтинентальных коммуникаций были совсем не те, что сейчас, были в курсе всех эстетических новинок. Более того, они свободно создавали свои собственные жесткие типографические интерпретации функционалистского типа даже для иероглифических структур.

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

Сглаживая углы…

В качестве начальной иллюстрации (рис. 21) приведем комбинированный пример, в который включены репродукции двух созданных почти единовременно хорошо известных плакатов, оповещающих о проведении выставок, или, приняв во внимание один из вариантов перевода немецкого слова ausstellung, показа школы «Баухаус». Трудно говорить о каких-либо существенных графических различиях в скругленных буквах, о которых уже упоминалось в комментариях к плакатам Родченко (см. рис. 12-13), и в текстах, которые фигурируют в обоих фрагментах рассматриваемого примера. Вместе с тем эстетические различия этих работ совершенно очевидны.

В данном случае не имеет смысла обращаться к монографическим источникам, поскольку оба «торговых» плаката Родченко, если отвлечься от шрифтовой графики, скомпонованы вполне традиционным образом. Даже при беглом взгляде на эти плакаты, можно увидеть и сильно заполненное пространство листа, и самым отчетливым образом выраженную симметричную композицию. Именно поэтому в данном случае есть все основания считать, что конструктивистские подходы в большей степени отражены в приведенных плакатных фрагментах, созданных в «Баухаусе». Данная ситуация на самом деле не содержит парадоксальных противоречий, поскольку в то же самое шальное коммерческое нэповское время Родченко создал немало других, не относящихся к теме данной статьи работ. Кто же, в конце концов, первым в рекламной практике применил угловатые текстовые конструкции — «Баухаус» или наши конструктивисты? Будем считать этот вопрос риторическим, поскольку прямой ответ на него можно найти, например, в следующей иллюстрации. На рис. 22 представлен созданный фактически по канонам рекламы викторианской эпохи плакат, который в 1916 году для судоходной компании BATAVIER LUN изготовил голландский художник Барт ван дер Лек. Подчеркнем, что этот постер был создан и до того, как сформировалось объединение De Stijl, и до большевистского переворота. Вместе с тем данный пример никоим образом не способен девальвировать творческое наследие ни российских конструктивистов, ни «Баухауcа», поскольку все они действовали вне прежнего эстетического базиса, местами прямо противопоставляя свои работы тому искусству, которое они считали буржуазным. Отмеченное обстоятельство тем более важно, что в социально-экономических условиях 1920-х годов эти эстетические новации были более созвучны общественному сознанию, чем манифестальные эскапады футуристов начала прошлого века.

В сравнительном контексте стоит привести скомпонованные на советском плакатном материале две комбинированные иллюстрации (рис. 23-24).

Второй фрагмент первого из этих примеров (см. рис. 23) хорошо известен многим, поскольку все без исключения исследователи относят его к золотому фонду советского конструктивизма. Этот плакат художник М.Семенов-Менес создал в 1929 году для документального фильма «Турксиб» режиссера Дзиги-Вертова.

Первый фрагмент несколько менее известен (1927, художник Г.Клуцис), поскольку данную агитационную работу можно рассматривать не столько как эстетическое достижение, сколько как памятник эпохе. В этом плакате использованы пропорциональные и моноширинные шрифтовые конструкции, причем модульные особенности нижнего фрагмента интересно сопоставить с приведенной в начальной части статьи шрифтовой разработкой Sturm, выполненной в «Баухаусе» Х.Байером в 1926 году. Естественно, что в обоих фрагментах фигурируют жестко геометризованные шрифты, в которых имеют место незначительные закругления в местах соединения вертикальных и горизонтальных штрихов.

Плакаты, приведенные в следующем примере (см. рис. 24), также причисляются к классике конструктивизма. Слева представлен выставочный рекламный плакат Эль Лисицкого, который он создал в 1929 году. В том же году братья Стенберги создали свою знаменитую киноафишу для фильма Дзиги-Вертова «Человек с киноаппаратом». Стоит обратить внимание на угловатый рисунок букв, похожих на суженное начертание гарнитуры Eurostylе, о разработке которой, впрочем, в то времени еще никто не помышлял.

Отдав должное творчеству конструктивистов, обратимся к рассмотрению вполне обиходных работ голландских художников созданных почти тремя годами ранее (рис. 25).

Приведенная иллюстрация, по обыкновению, составлена из двух плакатов, первый из которых (1925, художник Л.Найт) рекламирует портвейн, а второй — сигареты (1926, художник В.Хузар). Хузар в своем плакате реализовал более авангардное цветовое оформлении, чем его коллега. Не будем углубляться в комментарии, касающиеся особенностей цветового оформления, поскольку в первую очередь основной интерес в данном случае представляет шрифтовая графика. Рисунок букв в первом случае весьма похож на компактный вариант шрифта Eurostyle, в то время как начертания почти всех знаков во втором фрагменте, за вычетом лигатур, имеют определенное сходство с теми угловатыми шрифтами П.Реннера, которые ранее уже приводились на рис. 1-2.

Шрифтовые конструкции, рисунок которых схож с насыщенным компактным начертанием гарнитуры Eurostyle, использовались также германскими художниками, о чем, в частности, свидетельствует рис. 26, фрагменты которого были созданы в 1925-м и 1935 году. Первый — это рекламный постер стирального порошка Persil, а второй — обложка упоминавшегося в статье немецкого дизайнерского издания   — журнала Gebrauchsgraphik. Автор обоих фрагментов — весьма известный в то время немецкий художник Й.Биндер. В первом случае рисунок букв у текста Persil отчетливо геометричен, а скругления в буквах здесь едва просматриваются. Характерно, что разработчик применяет здесь популярную до сих пор субтрактивную методику, накладывая на логотип диагональный сугубо бытовой «бельевой» образ. Во втором фрагменте мы имеем дело со шрифтом, рисунок которого мало отличается от компактного гротеска, хотя сама разработка в целом смотрится вполне концептуализированно и жестко.

Как высокоуровневые, так и чисто обиходные применения жестких типографических конструкций на рубеже 1920-30-х годов были широко распространены не только в континентальной Европе. Подтверждением этого может служить такой сугубо бытовой пример (рис. 27), как пивной товарный знак, созданный в то время в Великобритании (1930 год, художник неизвестен).

Угловатые и жесткие типографические конструкции широко применялись в 1930 годы и в Испании. Это иллюстрирует рис. 28, для которого были выбраны два плаката, относящиеся соответственно к 1935-му и 1937 году. В первом случае это афиша благотворительного концерта (художник Вегил), а правый фрагмент — это один из агитационных плакатов периода Гражданской войны (художник Паррилла).

Так же как и в предыдущем разделе, уделим более пристальное внимание итальянским графическим работам. Для этого скомпонуем две комбинированные иллюстрации, первая из которых (рис. 29) составлена из чисто рекламных материалов. Для левого фрагмента первого из этих рисунков использована рекламная афиша к выставке спортинвентаря (1934, художник Латис), а на втором представлен плакат с рекламой шляп (1935, художник Д.Боккасилле). Оба приведенных образца итальянской графической акциденции были выбраны для того, чтобы продемонстрировать образцы шрифтового оформления текстов. В первом фрагменте использован оригинальный рисунок букв. Несмотря на то что шрифтовые конструкции, примененные во втором фрагменте, на первый взгляд смотрятся достаточно консервативно, его пластическое оформление весьма элегантно, особенно если учесть, что программой Adobe Photoshop художники тогда не имели возможности пользоваться.

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

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

Смежные темы

Приведенные в первом разделе примеры (см. рис. 8-10) свидетельствуют о том, что жесткие минималистские типографические новации, вошедшие в художественную практику в начале прошлого века, отнюдь не утратили своей актуальности, а просто продолжают свое существование в новом качестве и в наше двадцать первое столетие. За прошедшее время естественным образом изменились и общественное сознание, и соответственно эстетические пристрастия. Всё это самым непосредственным образом коснулось и того круга явлений художественной жизни, которые причисляются к графическому искусству. Ныне во многих странах мира дизайн стал одной из весьма распространенных профессий, и очень многие работы делаются сейчас фактически по индустриальным методикам. Роль дизайнера при этом часто сводится к формированию фоновой композиции, подбору шрифта для выданной текстовки, фотошоп-отделке с последующим коллажным комбинированием всего полученного таким образом графического материала. Тем не менее все это ни в коем случае не снизило роли индивидуального, творческого начала, значение которого продолжает высоко цениться во всем мире и, разумеется, в нашей стране, тем более что в 90-е годы выдвинулась целая плеяда дизайнеров, которые сейчас в большинстве своем обзавелись собственными командами. Более того, в нашем дизайнерском сообществе отчетливо наметилась тенденция к повышению квалификационного уровня с тем, чтобы подтянуться к уровню лидеров. Поэтому такие продвинутые учебные заведения, как БВШД и АШГД, не испытывают недостатка в желающих там учиться.

Известно, что авангард 20-х годов прошлого века часто использовал художественный опыт примитивизма. Собственно говоря, именно в примитивистской практике во многом укоренены многие упомянутые здесь шрифтовые конструкции. Составной частью наследия той поры стали работы, в которых примитивистские влияния могут трактоваться в более широком контексте, поскольку являются основой всего графического решения. Сказанное лучше всего сопроводить примерами такой связи и таких влияний, относящихся в первую очередь к рассматривавшемуся здесь временному периоду (рис. 31-32).

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

Вторая из упомянутых иллюстраций (см. рис. 32) стилистически близка к предыдущему примеру. Это обложка выходившего в 1920-х годах в Великобритании журнала The Enemy, в котором публиковались также и материалы социально-критической направленности (1927, художник В.Льюис).

Эту подборку можно было бы пополнить материалами того же времени, однако, по-видимому, более полезно привести те примеры, которые позволят проиллюстрировать идею о примитивистских истоках процитированных работ.

На рис. 33 представлена работа все того же Льюиса, созданная им в 1915 году, то есть в самый разгар Первой мировой войны. Не будем углубляться здесь в анализ экспрессионистских и примитивистских начал в творчестве этого художника, поскольку нами эта его работа была использована и как иллюстрация того генезиса, который претерпело его творчество к 1927 году.

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

Для первого фрагмента использована цитата из немецкого журнала Das Plakat (художник В.Кампман), а во втором фигурирует один из вариантов обложки этого издания (художник В.Шмакенберг). Интерес в данном случае представляют состоящие фактически из прямых линий геометризованные готические стилизации и вся композиция первого фрагмента, вместе с тем стоит обратить внимание на фигурирующие в правой части рисунка образцы жесткой, экспрессивной текстовой графики.

В графическом отношении наиболее выигрышным является первый фрагмент второго из заявленных примеров (рис. 35). На нем представлена оформленная русским художником М.Ларионовым обложка журнала «Жар-птица», выходившего в 20-е годы в Париже. Правый фрагмент рисунка, несмотря на примитивистскую стилистику задника, оформлен более традиционно, о чем может свидетельствовать центрированный, симметрично расположенный текст с его жестко геометризованным готическим рисунком.

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

Оба этих созданных в 1928 году примера в методическом отношении весьма значимы, а их отчетливая примитивистская рукотворность придает данным рекламным плакатам характер креативного эксклюзива. Более того, обе эти рекламные работы могут служить даже в качестве тематических пособий, которые могут быть привлечены для решения конкретных дизайнерских задач и в нынешнее время. Именно поэтому, несмотря на их очевидное стилистическое сходство, они не объединялись в одну иллюстрацию. К сожалению, в нынешней российской дизайнерской практике такие методики применяются редко.

Вместо заключения

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

КомпьюАрт 9’2008

Готический шрифт — это… Что такое Готический шрифт?

Готический шрифт

Латинская Библия, 1407, Англия

Готи́ческое письмо́ — семейство почерков латинского письма эпохи средневековья. Возникло в XI веке, придя на смену каролингскому унциальному письму.

С начала книгопечатания появились наборные готические шрифты — знаменитая Библия Гутенберга была набрана вариантом текстуры.

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

С XVI века готическое письмо постепенно вытеснялось шрифтами на основе антиквы, близкими к современным; дольше всего (до 1918 и отчасти до 1945) готический шрифт сохранялся в Германии и в Латвии (латышский язык официально был переведён с готического шрифта на антикву в 1926 году, а немецкие издания в Латвии и Эстонии продолжали печататься готическим шрифтом и после этого). Сейчас готические шрифты используются в декоративных целях, а также для некоторых математических обозначений.

Общий вид готических символов определяется использованием в качестве пишущих приборов гусиных перьев, обрезанных по диагонали. Пишущая кромка в большинстве случае располагается под углом 45° к базовой линии строки. Буквы расположены очень плотно, и ширина штрихов близка к ширине межштриховых промежутков — это объясняется необходимостью экономии дорогостоящего пергамента (отсюда английское название готического письма — Blackletter). Широко используются лигатуры и сокращения.

Готические шрифты

Основные разновидности готического письма:

  1. Текстура (нем. Textur, лат. Textualis) — острое письмо;
  2. Фрактура (нем. Fraktur) — острое письмо с ломаными очертаниями;
  3. Швабахер (нем. Schwabacher), или бастарда — ломаное письмо с округлёнными очертаниями некоторых букв;
  4. Ротунда или круглоготическое (итал. Rotunda, нем. Rundgotisch) — переходный вид письма от готического к антикве.

Ссылки

Wikimedia Foundation. 2010.

  • Готический стиль
  • Готландский диалект

Смотреть что такое «Готический шрифт» в других словарях:

  • ГОТИЧЕСКИЙ ШРИФТ — буквы, похожие своим рисунком на вычурный почерк средних веков; немецкий остроконечный шрифт. Полный словарь иностранных слов, вошедших в употребление в русском языке. Попов М., 1907. готический шрифт типографский латинский угловатый шрифт, в… …   Словарь иностранных слов русского языка

  • Готический шрифт — (от фр. gothique название германского племени готтов) старинный шрифт с угловатыми остроконечными очертаниями, ранее применявшийся в странах Западной Европы, особенно широко распространенный в Германии и вытесненный впоследствии антиквой.… …   Реклама и полиграфия

  • Готический шрифт — один из шрифтов на латинской графической основе с угловатыми ломаными контурами. Его разновидностью является фрактура. Употребленные в мат. формулах и тексте в качестве символов буквы Г. ш. в изд. оригинале требуется либо вписать синими чернилами …   Издательский словарь-справочник

  • готический — I. шрифт немецкий угловатый шрифт, в отличие от антиквы – латинского округлого шрифта (см. также фрактура 2) II. стиль [Словарь иностранных слов русского языка

  • ГОТИЧЕСКИЙ — ГОТИЧЕСКИЙ, готическая, готическое (иск.). прил. к готика; в стиле готики. Готическое искусство. Готический храм. ❖ Готический шрифт особый шрифт, отличающийся угловатостью букв, применяемый в Германии и в некоторых других странах. Толковый… …   Толковый словарь Ушакова

  • Готический — собор в Кутансе, Франция Готика  период в развитии средневекового искусства, охватывавший почти все области материальной культуры и развивавшийся на территории Западной, Центральной и отчасти Восточной Европы с XII по XV век. Готика пришла на… …   Википедия

  • Готический стиль — Готический собор в Кутансе, Франция Готика  период в развитии средневекового искусства, охватывавший почти все области материальной культуры и развивавшийся на территории Западной, Центральной и отчасти Восточной Европы с XII по XV век. Готика… …   Википедия

  • Готический стиль (архитектура) — Готический собор в Кутансе, Франция Готика  период в развитии средневекового искусства, охватывавший почти все области материальной культуры и развивавшийся на территории Западной, Центральной и отчасти Восточной Европы с XII по XV век. Готика… …   Википедия

  • Готический стиль в архитектуре — Готический собор в Кутансе, Франция Готика  период в развитии средневекового искусства, охватывавший почти все области материальной культуры и развивавшийся на территории Западной, Центральной и отчасти Восточной Европы с XII по XV век. Готика… …   Википедия

  • ГОТИЧЕСКИЙ СТИЛЬ — (по им. древне германского народа готов). Своеобразный архитектурный стиль, отличием которого являются стрельчатые своды и остроконечные, легкие, резные, смело уходящие вверх башни; возник во Франции, но готическим презрительно назвали его… …   Словарь иностранных слов русского языка

Шрифт Футура

Автор рисунка гарнитуры «Футура» — немецкий художник Пауль Реннер. Мода тех лет стремилась к геометризму, пропорциональности, отказу от декоративных деталей. Художников того времени интересовал шрифт сугубо футуристический, сильно геометризованный, «угловатый», конструктивисткая гарнитура, характерная для стиля 30-х годов. Пауль Реннер создавал шрифт Футура с помощью циркуля и линейки. Однако, успех этого шрифта во многом обусловлен тем, что идея геометрического построения символов не доведена в ней до нонсенса. Обычно конструкция букв включает в себя однотипные повторяющиеся элементы: перекладины, засечки, каплевидные, пламевидные элементы, овалы, полуовалы. Характерное очертание этих элементов позволяет выделить конкретный шрифт из ряда похожих. У Футуры эти элементы были максимально приближены к своим геометрическим прообразам — буква «о» близка к правильной окружности. Современники отмечали в Футуре сочетание абстрактной геометрической жесткости с благородным классическим изяществом, «внеисторическое конструктивное решение, которое производит впечатление необыкновенной чистоты и благородства» (Вилли Хаас). С течением времени Футуры ее геометричность еще более смягчилась в пользу привычного, традиционного рисунка. Пробные варианты нового шрифта появилисьосенью 1925 года: ими печатались пригласительные билеты, они демонстрировались в школе искусств Франкфурта-на-Майне. Многие буквы, особенно строчные, еще имели тогда нарочитый, неестественный вид. В целом шрифт вышел кричащим, рекламным, в текстовом наборе раздражал глаз. К моменту первого выхода Футуры на шрифтовой рынок в 1927 году Реннер создал альтернативные варианты спорных букв, близкие к тем, которые входят в современные шрифты семейства Футура. В 1927 году Футура в значительно доработанном виде была опубликована в каталоге фирмы Бауэр. Вначале гарнитура имела 6 начертаний разной степени насыщенности и 3 узких. Затем количество начертаний было увеличено: появились наклонные и новые декоративные варианты. С 1928 по 1956 год Футура подвергалась изменениям. Необходимо отметить, что Реннер до последних дней жизни развивал свой шрифт. Шрифты Реннера: Плак (1928 г.) — гротеск. Баллада (1937 г.) — готический шрифт. Реннер-Антиква (1939 г.) — оригинальная небезуспешная попытка создать антиквенный шрифт в стиле готического. Страница, набранная Реннер-антиквой, выглядит совсем как страница, выполненная шрифтом средневековых книг — текстурой. По-разному складывались судьбы геометрических шрифтов — современников Футуры. Более сдержанный, не столь радикальный в своих формах, Эрбар представляет собой отличный шрифт для набора текстов, тогда как Футура находится где-то на грани между текстовыми и акцидентными шрифтами. Геометрические гротески пользовались бешеной популярностью вплоть до 60-х годов XX столетия. В конце 20-х и в 30-е годы они трактовались как выражение современности и индустриальной культуры. Только в 60-х их заметно потеснили так называемые новые гротески, такие, как Хельветика и Универс. Но сегодня Футура снова любима графическими дизайнерами за ее суровую геометрию и простоту формы. Как и все геометрические гротески, Футура в своих начертаниях не имеет контраста. Число элементов, составляющих рисунок каждой литеры, сведено к минимуму. Почти очевидно, что буква o в геометрическом шрифте должна представлять собой просто окружность, если, конечно, за основу шрифта не взят квадрат. Конструирование других знаков, например, строчных а или g, ставит несколько более сложную художественную задачу. Для Футуры строчные символы а, b, d, p, q нарисованы путем элементарного прибавления прямой вертикальной стойки к окружности. Буква t составлена из двух перпендикулярных стоек, а нижний выносной элемент j не имеет закругления. У прописной G нет нижнего вертикального штриха, а Q является правильной окружностью, пересеченной диагональным штрихом. Однако самом деле Футура не содержит ни одной безупречной окружности, и ее штрихи далеко не всегда имеют равную толщину, иначе шрифт был бы совершенно нечитаемым. Вертикальные штрихи несколько толще горизонтальных именно затем, чтобы выглядеть равной с ними толщины; тот же эффект учтен в контурах буквы о и других окружностей. Стоит обратить внимание на способы соединения элементов, компенсирующие нежелательные визуальные эффекты и делающие шрифт более ровным по цвету. Здесь нет этих ужасных угловатых краев, которые есть в Кабеле, и которые делают край полосы набора рваным и очень неприятным на вид. В отличие от Реннера автор Кабеля Кох широко известен и как мастер каллиграфии: в рисунках Кабеля просматривается глубокое понимание законов построения рукописного шрифта и — совершенно сознательный отход от этих законов. Он сделал броский, отталкивающий шрифт, который вряд ли с чем-то будет сочетаться на полосе любого издания. Это своеобразный инструмент пытки читателя, созданный в чисто немецком стиле. Некоторые исследователи видят в оригинальной Футуре особенности, указывающие на ее немецкое происхождение. То обстоятельство, что верхние выносные элементы строчных символов спроектированы выше прописных, приближает Футуру к старостильным антиквам и улучшает вид текста на любом языке. С другой стороны, это особенно важно для немецкого, изобилующего прописными буквами. У шрифта вертикально обрезанные концы буквы с — это связано с тем, что в немецких словах после с чаще всего следуют h или k. Названные черты сохранились и в кириллических версиях Футуры. Правами собственности на рисунок и название шрифта Футура обладает фирма Fundicion Tipografica Neufville (Барселона) — правопреемник уже не существующей фирмы Бауэр. В 1995 году по лицензии законного владельца Владимиром Ефимовым были разработаны цифровые кириллические версии Футуры в 8 начертаниях — NV Футура. Ранее тем же автором была создана гарнитура Футурис, также близкая по рисунку к Футуре. Безусловно, Футура является одним из самых популярных и самых «избитых» шрифтов современности, чем обязана своей кажущейся простоте и геометричности.

Как исправить размытые шрифты Windows 10

&nbsp windows

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

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

Примечание: если шрифты стали размытыми после недавнего изменения параметров масштабирования (125%, 150%) в параметрах экрана (пункт «Изменение размера текста, приложения, и других элементов»), попробуйте для начала просто перезагрузить компьютер (даже если до этого уже не раз его выключали-включали, так как выключение в 10-ке не то же самое, что перезагрузка).

Автоматическое устранение размытия шрифтов в Windows 10 1803

В Windows 10 1803 April Update появилась дополнительная опция, позволяющая исправить размытые шрифты для приложений, которые не поддерживают масштабирование (или делают это неправильно). Найти параметр можно, зайдя в Параметры — Система — Дисплей — Дополнительные параметры масштабирования, пункт «Разрешить Windows исправлять размытость в приложениях».

Если окажется, что параметр включен, а проблема сохраняется, попробуйте, наоборот, отключить его.

Проверка разрешения экрана

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

Итак, современные мониторы имеют такой параметр, как физическое разрешение, представляющее собой количество точек по горизонтали и вертикали на матрице экрана, например, 1920×1080. Причем, если в системе у вас установлено любое разрешение, не кратно отличающееся от физического, вы увидите искажения и размытость шрифтов.

Поэтому: если вы не уверены, убедитесь, что выставленное в Windows 10 разрешение экрана соответствует действительному разрешению экрана (при этом в некоторых случаях это может привести к тому, что шрифт вам покажется слишком мелким, но это можно будет исправить параметрами масштабирования).

  • Чтобы узнать физическое разрешение экрана — можете просто поискать технические характеристики в Интернете, введя марку и модель вашего монитора.
  • Чтобы установить разрешение экрана в Windows 10, кликните в любом пустом месте рабочего стола правой кнопкой мыши и выберите пункт «Параметры экрана», после этого нажмите по пункту «Дополнительные параметры экрана» (внизу справа) и установите нужное разрешение. Если в списке отсутствует нужное разрешение, то вероятно вам требуется установить официальные драйвера вашей видеокарты, пример см. Установка драйверов NVIDIA в Windows 10 (для AMD и Intel будет то же самое). 

Подробнее на тему: Как изменить разрешение экрана в Windows 10.

Примечание: если вы используете несколько мониторов (или монитор + ТВ) и изображение на них дублируется, то Windows при дублировании использует одинаковое разрешение на обоих экранах, при этом для какого-то из них оно может быть «не родное». Решение тут лишь одно — изменить режим работы двух мониторов на «Расширить экраны» (нажав клавиши Win+P) и установить для каждого из мониторов правильное разрешение.

Устранение размытости текста при масштабировании

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

  1. Нажмите клавиши Win+R и введите dpiscaling (или зайдите в панель управления — экран).
  2. Нажмите по пункту «Установить настраиваемый уровень масштабирования». 
  3. Убедитесь, что в нем установлено 100%. Если нет — измените на 100, примените, и перезагрузите компьютер. 

И второй вариант этого же способа:

  1. Кликните правой кнопкой мыши по рабочему столу — параметры экрана.
  2. Верните масштабирование на 100%. 
  3. Зайдите в Панель управления — Экран, нажмите «Установить настраиваемый уровень масштабирования», и задайте требуемое масштабирование Windows 10.

После применения настроек, вас попросят выйти из системы, а после входа вы должны будете увидеть измененные размеры шрифтов и элементов, но уже без размытия (при использовании данной опции применяется иное масштабирование, чем в параметрах экрана Windows 10).

Как исправить размытые шрифты в программах

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

В этом случае вы можете исправить проблему следующим образом:

  1. Кликните правой кнопкой мыши по ярлыку или исполняемому файлу программы и выберите пункт «Свойства».
  2. На вкладке «Совместимость» установите отметку в пункте «Отключить масштабирование изображения при высоком разрешении экрана» и примените настройки. В новых версиях Windows 10 нажмите «Изменить параметры высокого DPI», а затем отметьте пункт «Переопределите режим масштабирования» и выберите «Приложение».

При следующих запусках программы, проблема с размытыми шрифтами проявляться не должна (однако, они могут оказаться мелкими на экранах с высоким разрешением).

ClearType

В некоторых случаях (например, из-за неправильной работы драйверов видеокарты), проблему с размытым текстом может вызывать неправильная работа функции сглаживания шрифтов ClearType, которая включена по умолчанию в Windows 10 для ЖК экранов.

Попробуйте отключить или настроить эту функцию и проверить была ли решена проблема. Для того, чтобы это сделать, введите в поиск на панели задач ClearType и запустите «Настройка текста ClearType».

После этого попробуйте как вариант с настройкой работы функции, так и вариант с её отключением. Подробнее: Настройка ClearType в Windows 10.

Дополнительная информация

В Интернете также имеется программа Windows 10 DPI Blurry Fix, призванная решать проблему с размытыми шрифтами. Программа, насколько я понял, использует второй способ из этой статьи, когда вместо масштабирования Windows 10 используется «старое» масштабирование.

Для использования достаточно установить в программе «Use Windows 8.1 DPI scaling» и настроить желаемый уровень масштабирования.

Скачать программу можно с сайта разработчика windows10_dpi_blurry_fix.xpexplorer.com — только не забывайте проверить ее на VirusTotal.com (на текущий момент она чистая, но есть негативные отзывы, так что будьте внимательны). Также учитывайте, что запуск программы требуется при каждой перезагрузке (она сама себя добавить в автозагрузку.

И, наконец, если ничто не помогает, еще раз перепроверьте, установлены ли у вас оригинальные последние драйверы для видеокарты, не путем нажатия «обновить» в диспетчере устройств, а путем ручной загрузки с соответствующих официальных сайтов (или с помощью утилит NVIDIA и AMD).

А вдруг и это будет интересно:

Журнал «Шрифт» • Лучшие шрифты с кириллицей 2014 года по мнению журнала

27 февраля 2015

В этом го­ду мы ещё раз убе­ди­лись, на­сколь­ко вос­тре­бо­ва­нны се­го­дня в Рос­сии зна­ния в об­ла­сти ти­по­гра­фи­ки. Со­всем не­мно­го пре­уве­ли­чив, это мож­но бы­ло бы на­звать ажи­о­та­жем. С боль­шим ус­пе­хом в прошлом году состоялись фе­сти­валь «Ти­по­ма­ния» и кон­фе­рен­ция «Се­ре­бро на­бо­ра», ста­биль­но ра­бо­та­ют су­ще­ству­ю­щие шко­лы шриф­та, и да­же от­кры­ва­ют­ся но­вые. В ре­зуль­та­те при­бав­ля­ет­ся чис­ло тех, кто по­лу­ча­ет пред­став­ле­ние о про­фес­сии ди­зай­не­ра шриф­та, и тех, кто про­бу­ет свои си­лы в этой об­ла­сти. Ещё один от­рад­ный факт: по­чти каж­дый год на од­но­го вы­пуск­ни­ка кур­са Type and Media у нас ста­но­вит­ся боль­ше. Однако во­пре­ки пе­ре­чис­лен­ным про­цес­сам пред­ло­же­ние на рын­ке рас­ши­ря­ет­ся ед­ва за­мет­но при впол­не пред­ска­зу­е­мом ка­че­стве шриф­то­вых про­ек­тов. Всё, что по­яв­ля­ет­ся в ме­дий­ном про­стран­стве и вы­зы­ва­ет ин­те­рес, оста­ёт­ся недо­ступ­ным для поль­зо­ва­те­ля либо в виду экс­клю­зив­но­сти про­ек­тов, либо из-за неготовности авторов выходить к массовому пользователю.

По­про­бу­ем дать про­гноз. Оче­вид­но, что за­ру­беж­ные про­из­во­ди­те­ли бу­дут ак­тив­нее пред­ла­гать шриф­ты с ка­че­ствен­ной ки­рил­ли­цей, спро­ек­ти­ро­ван­ной са­мо­сто­я­тель­но или в сотрудничестве с про­филь­ными спе­ци­а­ли­стами. Тех­ни­че­ский уро­вень та­ких про­ек­тов бу­дет весь­ма вы­со­ким: раз­во­ра­чи­ва­ет­ся борь­ба за экра­ны, что пред­став­ля­ет­ся нам до­ста­точ­но ём­ким рын­ком. Сто­ит от­ме­тить, что в ушед­шем го­ду на­бра­ли си­лы не­боль­шие оте­че­ствен­ные сло­во­лит­ни и да­же по­яви­лись но­вые. Мы ждём све­жих проектов от рос­сий­ских ком­па­ний и сту­дий Brownfox, Letterhead, «Па­ра­Тайп», «Сту­дии Ле­бе­де­ва», но­во­яв­лен­ных Contrast Type Foundry и CSTM Fonts на­ря­ду с про­ек­та­ми не­за­ви­си­мых ди­зай­не­ров. На этом фо­не будет расти спрос не только на дизайнеров шрифта, но и на таких редких специалистов, как шрифтовые технологи.

И на­ко­нец, ва­ше­му вни­ма­нию — луч­шие шриф­ты 2014 го­да. Усло­вия, по ко­то­рым шриф­ты по­па­ли в рей­тинг, с про­шло­го го­да не из­ме­ни­лись: шрифт дол­жен быть до­сту­пен лю­бо­му же­ла­ю­ще­му для приобретения, обя­за­тель­ное тре­бо­ва­ние — на­ли­чие в зна­ко­вом со­ста­ве ки­рил­ли­цы, а год вы­пус­ка дол­жен быть да­ти­ро­ван 2014-м. На этот раз в лонг-лист по­па­ли 37 пре­тен­ден­тов (sic! в про­шлом го­ду бы­ло 36) из 14 стран. Ред­кол­ле­гия и ре­дак­ция вы­бра­ли 10 про­ек­тов путём го­ло­со­ва­ния. Все шриф­ты да­ны в ал­фа­вит­ном по­ряд­ке.

20 копеек

«20 копеек» — многоликий шрифт. Благодаря остроумной работе с альтернативными знаками он позволяет одним переключением кнопки Stylistic Alternates поменять ощущение от набора. Загляните в состав глифов любого из 14 начертаний (от Thin до Black), и вы обнаружите по два варианта букв K, Ж, Я, R — в основном сете они кудрявы на манер «Акциденц-гротеска», а в альтернативном имеют прямые ветви. Побочная (или же главная?) история разворачивается и в курсивах, где в дополнительном стилистическом сете спрятаны наклонные версии букв. Образ набора зависит от действий дизайнера, который может сделать его и старомодным, и прагматичным, сослаться и на конец XIX века, и на середину XX-го. Для любителей классификаций, впрочем, карты перепутаны и любые намеки на конкретные исторические гротески являются не более чем иронией (посмотрите на латинские буквы f, g, r, y). Чи­та­те­ли бло­га Юрия Гор­до­на по­мнят ис­то­рию со­зда­ния ан­ти­к­вы «21 Цент», вдохновлённой со­би­ра­тель­ным об­разом шриф­тов кон­ца XIX — на­ча­ла XX ве­ка (на­при­мер, гар­ни­тур се­рии Century и осо­бен­но Century Schoolbook). Гро­теск «20 ко­пе­ек» явился сыгранным партнёром упомянутой антикве, бла­го­да­ря че­му сло­жи­лась су­пер­гар­ни­ту­ра. И ан­ти­квен­ные «цен­ты», и гро­те­с­ко­вые «ко­пей­ки» со­гла­со­ва­ны по на­сы­щен­но­сти, про­пор­ци­ям и раз­ме­рам и, по за­мыс­лу ав­то­ра, рас­счи­та­ны на сов­мест­ное при­ме­не­ние. «Копейки» укомплектованы капителью, минускульными и маюскульными цифрами в прямых начертаниях и поддерживают широкий спектр языков.

Bouquet

Яркий образец рукописного шрифта с лёгкой отсылкой к готическому письму, с применением широкой кисти. Набранную этим шрифтом надпись можно принять за леттеринг — большое количество альтернативных знаков с росчерками убедительно этому способствует. Вообще, готика в кириллице зачастую выглядит довольно странно и надуманно, но в курсивных конструкциях она обретает не искусственную (как бывает зачастую в прямой фрактуре), а естественную динамику. Заслуживает внимания контроль дизайнера над чёрным и белым и контуром в целом. Bouquet примечателен плотной тёмной тканью набора в среднем кегле и дополнительными украшениями вроде росчерков, если вы набираете крупный заголовок. Как правило, появление подобного шрифта на рынке стремительно превращает его в завсегдатая вывесок и упаковок благодаря выразительности набранных им названий, которые сразу становятся логотипами. Интересно сравнить его с другим примером переосмысления каллиграфии в виде наборного шрифта — гарнитурой Веры Евстафьевой Amalta. Их сходство — в графической основе, то есть в письме широкой кистью, а их главное отличие — текстовый потенциал при дальнейшем развитии. В «Амальте» он теоретически возможен при уменьшении насыщенности и дополнительной корректировке знаков. Отсутствие такового, конечно, не является недостатком гарнитуры Bouquet, которая сама по себе — художественное высказывание. Это лишь наблюдение над «скелетом» шрифта и теми возможностями, которые он таит.

Formular

Шрифт Formular — неогротеск, созданный под влиянием эстетики новой швейцарской волны, где типографика выполняет мощную роль остранения, создавая на своём графическом уровне напряжение между формой и содержанием. Активно разделяя их, Лоренц Бруннер, Симона Коллер, Ронни Юнгер и многие другие «швейцарцы» парадоксально добиваются внимания к содержанию, а в переживший постмодернизм век это, пожалуй, и есть задача номер один для графического дизайнера. Шрифты, которые мы видим в проектах этой эстетики, интересны с точки зрения тонких «сбоев» ритма — то на уровне увеличенного межбуквенного расстояния, то на уровне формы отдельных букв. С точки зрения качества новая гарнитура «Браунфоксов» безупречна — сбалансированна по контуру, ритму и оптике. От своих собратьев она отличается изобретательными формами некоторых букв, например M и W. (Всего-то на полтона ниже, а ритм и «звучание» становятся уникальными.) Ещё один важный момент в строении этого шрифта — его пропорции. Formular удобен в работе с различными конструкциями: он может быть лёгким во флаговом наборе, а может стать и «кирпичом» в блочной текстуре. Его подчёркнуто чистые по геометрии знаки (стремящиеся к квадрату и кругу) делают строку крепко сбитой, а предельно короткие выносные элементы позволяют мостить абзацы максимально плотно, не теряя воздуха и ритма внутри. Это делает его универсальным инструментом, например, в интерфейсах и на веб-страницах (большим преимуществом гарнитуры является наличие экранной версии). Он решает задачи заголовков, сносок, элементов меню, вводных абзацев, врезов в одинаковой степени убедительно. Один из заметных примеров использования шрифта — свежий образовательный проект Arzamas, где контрапунктом «Формуляру» служит гарнитура Lava. Отметим, что Formular снабжён минускульными и табличными цифрами, знаками препинания для прописных (так называемая «пунктуация, чувствительная к регистру»), дробями, знаками верхнего и нижнего индекса и стилистическими альтернативами для ряда букв.

Gerbera

Новый гро­теск Gerbera на пер­вый взгляд от­сы­ла­ет к работам Эд­вар­да Джон­сто­на, Эри­ка Гил­ла, Па­у­ля Рен­не­ра и Ар­но Дре­ше­ра, к со­вре­мен­ным шрифтам вро­де Euclid (SwissTypefaces) или Brown (Lineto). Срав­ни­вать мож­но дол­го и с увле­че­ни­ем, но нам ви­дит­ся в «Гер­бе­ре» не гео­мет­рия «Фу­ту­ры» и не гиб­кость форм из эпо­хи дви­же­ния ис­кусств и ре­месёл, а тень Ро­же Эк­ско­ффо­на и его гро­те­ска Antique Olive (по­че­му-то се­го­дня не столь по­пу­ляр­но­го, как пе­ре­чис­лен­ные вы­ше шриф­ты). Впро­чем, это мо­жет быть и об­ма­ном зре­ния из-за од­ной лишь тон­кой де­та­ли, а имен­но не­боль­шо­го обрат­но­го кон­трас­та в зна­ках, ко­то­рому «Гер­бе­ра» обязана осо­бым ритмом. И в це­лом в эту гар­ни­ту­ру «Бра­ун­фок­сов» сто­ит вгля­ды­вать­ся вни­ма­тель­но: пре­уве­ли­чен­но раз­но­ши­рин­ные про­пис­ные в на­бо­ре вы­гля­дят тор­же­ствен­но и книж­но, обрат­ный кон­траст решён фи­ли­гран­но, а не­обя­за­тель­ные сти­ли­сти­че­ские за­ме­ны (строчная а, прописная Q) неожиданно ме­ня­ют об­раз на­бран­но­го сло­ва, если вос­поль­зо­вать­ся ими. Правда, хочется спросить, почему в гротеске, явно приближенном к группе гуманистических, нет двучастной g хотя бы на уровне альтернативной формы, но, с другой стороны, такая непоследовательность придаёт «Гербере» определённый шарм.

Glober

Гарнитура Glober на пер­вый взгляд не ка­жет­ся ис­клю­че­ни­ем из ряда открытых узких гротесков, а при­ла­жен­ные к окон­ча­ни­ям штри­хов ра­ди­у­сы скруг­ле­ний ме­ста­ми вы­гля­дят даже немного наигранно. Но по­том в по­ле зре­ния по­па­да­ют ова­лы и по­луова­лы: они вы­пол­не­ны ис­кус­но и формируют характер шрифта — имен­но это ме­ня­ет на­ше впе­чат­ле­ние от об­ли­ка гар­ни­ту­ры. Ова­лы «тё­плые», не ме­ха­ни­че­ские: фор­мы букв о, e най­де­ны точ­но и за­став­ля­ют рав­нять­ся на се­бя все осталь­ные зна­ки, со­зда­вая гам­му пла­сти­че­ских пе­ре­жи­ва­ний в, ка­за­лось бы, ста­тич­ной и бес­хит­рост­ной мо­де­ли шриф­та. Это сба­лан­си­ро­ван­ное шриф­то­вое се­мей­ство при­ме­ча­тель­но 18 на­чер­та­ни­я­ми — от тон­ко­го до сверх­жир­но­го, вклю­чая на­клон­ные. И, что не­ма­ло­важ­но, су­ще­ству­ют экран­ные вер­сии «Гло­бе­ра» — это ещё и уни­вер­саль­ный ин­стру­мент для раз­ра­бот­чи­ка мо­биль­ных при­ло­же­ний и веб-ди­зай­не­ра. Гар­ни­ту­ра — по­бе­ди­тель кон­кур­са «Со­вре­мен­ная ки­рил­ли­ца 2014» в но­ми­на­ции «Тек­сто­вые шриф­ты».

Identitet

Шрифтовые проекты Николы Джурека часто связаны с экспериментом, будь то эксперимент технологический или лингвистический. Identitet обернулся новым смелым исследованием и опытом объединения в одной шрифтовой системе нескольких письменностей, которые исторически использовались (и используются) на Балканах. Это очень высокая планка, поскольку избранные письменности решительно отличаются графическим образом знаков. Глаголица (в трёх начертаниях — от аккуратной исторической реконструкции древнейшей «угловатой» глаголицы до более современной круглой), боснийская кириллица, русская кириллица, arebica (вариант арабского алфавита для боснийского языка) и латиница в семье Identitet обладают единой толщиной штрихов, одинаковой высотой строчных и прописных знаков, и так далее во всех деталях, позволяющих достичь единства внутри системы. Identitet — проект знаковый для современного мира, охваченного глобализацией с возможностью мгновенного доступа к любой информации, которая, в свою очередь, требует перевода и графического отображения на биллионах мобильных устройств. Никола Джурек провёл серьёзную исследовательскую и художественную работу — чего стоит, скажем, создание автором новых графем в версии «круглой» глаголицы для обслуживания звуков в современном сербском языке, которых не существовало в древности.

Input

Шрифтовая семья с гигантским количеством моноширинных начертаний специально для написания программного кода. Возникает резонный вопрос, действительно ли это функционально оправданно, но пусть он остаётся риторическим. Эстетика моноширинных шрифтов эпохи ранних компьютеров и текстовых редакторов давно пользуется успехом у графических дизайнеров. Дэвид Джонатан Росс вдохновлялся процессом создания экранного шрифта Verdana Мэтью Картера и изначально рисовал Input как пиксельный шрифт. Когда базовые пропорции букв были выбраны, Дэвид приступил к отрисовке контуров поверх 11-пиксельной сетки. В результате Input может с успехом работать в типографике кода, в наборе табличных данных, а также в обычных текстах (например, технической документации). Любопытно, что автор шрифта предлагает использовать в коде (помимо синтаксической подсветки) различные начертания — от гротеска до брускового. Input бесплатен для персонального использования, а его сайт — не только промоинструмент, но и прекрасное поле для тестирования и генерирования шрифта с заданными стилистическими особенностями и знаковым составом. Input — победитель конкурса «Современная кириллица 2014» в номинации «Текстовые шрифты». Гаянэ Багдасарян, член жюри конкурса, прокомментировала проект так: «Несмотря на то что некоторые кириллические знаки можно было бы слегка подкорректировать в соответствии с традициями, общая структура текстового набора выделяет Input из многих кириллических шрифтов своим точным попаданием в нерв времени. Моноширинный набор тоже сохраняет своё очарование в кириллице, что само по себе большая редкость».

Journal Sans New

«Журнальная рубленая» (её текстовая версия, а ещё существовало начертание для крупнокегельного набора, см. «Каталог ручных и машинных шрифтов», М., 1966) была спроектирована Анатолием Щукиным и его коллегами из Отдела наборных шрифтов Института полиграфического машиностроения в 1940–1956 году. Ревизия первой цифровой версии «Журнальной рубленой», созданной ещё на заре существования фирмы ParaGraph, выявила ряд проблем в контурах, межбуквенном расстоянии, кернинге. Все они усилиями дизайнеров Марии Селезеневой, Александры Корольковой, Олексы Волочая были устранены, но главное не в этом. Известно, что в основе Журнальной рубленой лежит шрифт Erbar-Grotesk (Jakob Erbar, Ludwig & Mayer, 1929) — его пропорции, геометрический склад и состав начертаний схожи. Обновление «Журнальной рубленой» заключается в существенной переработке и уточнении знаков, существовавших в советское время «в металле», многие формы букв упростились, а их первоначальные варианты (например, кж) спрятаны в «альтернативы». Именно эти действия вновь сблизили «Эрбар-гротеск» и «Журнальную рубленую». Кроме того, был расширен состав начертаний: появился настоящий курсив (а не наклонное начертание) и два своеобразных заголовочных начертания. Кажется, «Журнальная рубленая» больше не напоминает о подшивках журнала «Наука и жизнь» за полированной коричневой дверцей шкафа и является полноценным инструментом для работы. А впрочем, если вы всё-таки захотите немного предаться ностальгии, всегда можно воспользваться альтернативными треугольными формами л и д — и набор сменит свой «возраст».

Stem

О кириллическом «Готэме» грезили многие дизайнеры, и Stem можно назвать серьёзной попыткой эту мечту исполнить. Но что существенно отличает этот шрифт, кроме самих пластических особенностей, так это курсив. Если прямое начертание ещё пытается держать осанку, тянуть носок, сохранять определённую жёсткость, то вместе с курсивом образ заметно смягчается и становится приветливее и покладистее. Двенадцать начертаний — от сверхтонкого до жирного, включая курсивы, капитель, различные стилистические наборы для цифр, альтернативные формы знаков (а, кж), и это только первая часть проекта, предназначенная для крупнокегельного акцидентного набора. По сообщениям авторов, ожидается выпуск новых начертаний для текстового набора, в том числе мелкокегельного (caption).

Woodkit

Деревянные литеры для акцидентного набора как эстетический объект обрели новую жизнь в этом проекте Ондрея. По словам автора, работа с «Вудкитом» напоминает игру в кубики. В вашем распоряжении три семейства (Solid, Print и Reprint, визуально отличающиеся эффектами «непропечатки»), в каждом из них по шесть начертаний различной стилистики с орнаментами. При включённых функциях OpenType можно добиваться весёлой вариативности и использовать Woodkit на полную катушку — на все 10 000+ глифов. Этот впечатляющий проект акцидентного шрифта стал одним из победителей конкурса «Современная кириллица 2014». Шрифт был отмечен Юрием Гордоном, членом жюри конкурса: «Woodkit — замечательный по замыслу и блестящий по исполнению шрифтовой проект в жанре новой типографики — набор на грани шрифта и политипажа. Шрифтовая система, состоящая из чрезвычайно разнообразных, но отлично подогнанных друг к другу глифов-кубиков, позволяет выстраивать необыкновенные дома-надписи-картины, где каждая буква задерживает глаз, а простой набор становится готовым постером. Но это ещё и читается! В Woodkit можно играть, как в детский конструктор, собирая то слова, то абстрактные композиции из входящих в систему орнаментов. Для меня этот комплект — привет и из прошлого с деревянными литерами, и из будущего с динамической типографикой, с самоценными типографическими играми, не привязанными, как до сих пор, к утилитарным целям. Возможно, это первый в мире комплект для игры в бисер».

Бук­ви­ца — Ма­рия До­ре­ули

Красивые бесплатные русские детские шрифты. Красивые бесплатные русские детские шрифты Мультяшные шрифты русские

Помощь сайту

Понравился сайт? Уроки оказались полезными? Вы можете поддержать проект, просто если скачаете и установите приложение «Фонарик» для Андроид. Приложение написал автор сайта и рассчитывает в дальнейшем публиковать свои приложения. Фонарик управляет светодиодом вспышки фотокамеры телефона, а также включает подсветку экраном на полной яркости.

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

Если приложение наберёт популярность, это даст стимул автору на создание новых приложений с учётом пожеланий посетителей сайта.

Заранее благодарен, Дмитрий.

QR-код для установки:

Если Вам понравился материал, скажите свое «спасибо», поделитесь ссылками с друзьями в социальных сетях! Спасибо!

Здравствуйте, дорогие друзья. Давненько я не выкладывал шрифты, которые пользовались большой популярностью у меня сайте. И тут столкнулся с поиском мультяшного шрифта для одного лого и решил сделать сборку из 15-и веселых мультяшных кириллических шрифтов. Некоторые шрифты из этой сборки встречаются в предыдущих моих постах, но я все равно выложил, чтобы было из чего выбрать. Тут есть шрифт из Disney, Ледникового периода, Незнайки на Луне. Каждый шрифт вы сможете скачать отдельно прямо с моего сервера без помощи каких-либо файлообменников и, самое главное, совершенно бесплатно. Поехали:

Рисованный мультяшный кириллический шрифт

Скачать

Классный веселый русский шрифт

Скачать

Кириллический шрифт Disney

Скачать

Жирный кириллический шрифт из мультика

Скачать

Стильный рисованный мультяшный шрифт

Скачать

Веселый жирный шрифт для титров мультика

Скачать

Контурный мультяшный русский шрифт

Скачать

Классный веселый кириллический шрифт

Скачать

Контурный моноширинный мультяшный шрифт

Скачать

Моноширинный мультяшный кириллический шрифт

Скачать

Шрифт для титров в мультике

Скачать

«Безалаберный» мультяшный кириллический шрифт

Скачать

Русский шрифт из «Незнайка на луне»

Скачать

Строгий, но веселый шрифт в кириллической раскладке

Скачать

Тонкий мультяшный шрифт

Скачать

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

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

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

2. Если переводить название этого шрифта, получится что-то типа “куриная задница”. Я не знаю почему так. Мне этот шрифт приглянулся необычной формой и . Думаю вполне уместен в каких-то мультипликационных заголовках и всяком таком. Имеет как прописные, так и строчные символы.

3. Брутально угловатый, резкий, жирный шрифт. Тоже видал где-то в комиксах. Смотрится четко и гармонично особенно в окружении экшена. Традиционно для комиксовских шрифтов отсутствуют строчные символы.


4. Этот мне напоминает шрифт из старых мультиков, типа “Ну, погоди!”. Ну там когда авторов перечисляют в титрах. Похож очень по-моему. В общем для стенгазет, новых годов и прочих подобных детских тем. Подойдет идеально.


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


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


7. Утонченный, резковатый, слегка разнузданный. Не знаю где я его видел, то ли в комиксах, то ли в мультиках?


8. Каменно – треснутый шрифт. Подойдет, естественно, для легенд о . Ну или для заголовков о чем-нибудь каменно-толстом например. Присутствует в 2-х вариантах – залитый и контурный с тенью.

угловых шрифтов | FontSpace

Загрузить
  • Темный режим
  • Помощь Войти
Присоединиться бесплатно
  • Шрифты
  • Стили
  • Коллекции
  • Генератор шрифтов
  • (͡ ° ͜ʖ ͡ °)
  • Дизайнеры
  • Разные4

5

Связанные стили

  • Cool
  • Gothic
  • Sans Serif
  • Serif
  • Bold
  • Retro
  • Modern
  • 1 Логотип
  • 1
  • Декоративный
  • Тонкий
  • Угловой
  • Sci-Fi
  • Techno
  • Квадратный
  • Футуристический
  • 0
    Будущее

    Будущее
  • Пространство
  • Геометрическое изображение
  • Блочное
  • Sharp
  • Робот
  • Угол
  • Блок
  • Чужой
  • Heavy
  • igital
  • Заостренный
  • Название
  • Android
  • Дисплей
  • Заостренный
  • Музыка
  • Действия
  • Неандерталец
  • Planet
  • Приключения

Коммерческое использование

Сортировать по

  • Популярные
  • В тренде
  • Новейший
  • Имя

Для личного пользования Бесплатно

157.9k загрузок

Для личного пользования Бесплатно

Eternal Logo

6604 загрузок

Для личного пользования Бесплатно

71492 загрузок

Для личного пользования Бесплатно

165 загрузок

Для личного пользования Бесплатно

Обычные

29563 загрузки

Для личного пользования Бесплатно

Курсив

3556 загрузок

Для личного пользования Бесплатно

Курсив Обычный

3655 загрузок

Для личного пользования Бесплатно

28224 загрузки

Для личного пользования Бесплатно

8088 загрузок

Для личного пользования Бесплатно

Обычные

4721 загрузки

Для личного пользования Бесплатно

Обычный

10141 загрузок

Для личного пользования Бесплатно

Обычный

2507 загрузок

Для личного пользования Бесплатно

Обычный

2451 загрузок

Для личного пользования Бесплатно

Курсив Курсив

2680 загрузок

Для личного пользования Бесплатно

Обычные

12820 скачиваний

От 1 до 15 из 514 Результаты

  • 1
  • 2
  • 3
  • 4
  • Далее

Еще больше стилей

    78000 + бесплатные шрифты 16000 + коммерческие шрифты 3000 + Дизайнеры
    • Популярные шрифты
    • Коммерческие шрифты
    • Классные шрифты
    • Курсивные шрифты
    • Блог
    • Справка
    • Контакты
    • Бренд
    • Конфиденциальность
    • Условия
    • DMCA
    • Fonts

      угловых шрифтов | Fontspring

      Угловые шрифты | Fontspring

      Отображение 1-50 из 318 результатов

      Скидка 50% до 9 мая!

      Не беспокойся! Конденсированные квадраты ТТ Тип

      10 стилей от 29 долларов.00

      Скидка 50% до 30 апреля!

      Скидка 30% до 24 апреля!

      18 стилей от 20 долларов.00 (6 БЕСПЛАТНО)

      32 стиля от 29 долларов.00 (2 БЕСПЛАТНО)

      80 стилей от 25 долларов.00 (10 БЕСПЛАТНО)

      FortAwesome / angular-fontawesome: официальный компонент Angular для Font Awesome 5

      Официальный компонент Angular для Font Awesome 5

      Установка

      Используя нг, добавьте :

        # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ ng add @ fortawesome / angular-fontawesome @ <версия>
        

      Использование пряжи

        $ yarn add @ fortawesome / fontawesome-svg-core
      $ пряжа добавить @ fortawesome / free-solid-svg-icons
      # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ yarn add @ fortawesome / angular-fontawesome @ <версия>
        

      Использование NPM

        $ npm install @ fortawesome / fontawesome-svg-core
      $ npm install @ fortawesome / free-solid-svg-icons
      # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ npm install @ fortawesome / angular-fontawesome @ <версия>
        

      Таблица совместимости

      @ fortawesome / angular-fontawesome Угловой нг-добавить
      0.1.x 5.x не поддерживается
      0,2.x 6.x не поддерживается
      0,3.x 6.x && 7.x не поддерживается
      0,4.x, 0,5.x 8.x не поддерживается
      0,6.x 9.x поддерживается
      0,7.x 10.x поддерживается
      0,8.x 11.х поддерживается

      Использование

      Чтобы начать использовать Font Awesome с Angular, выполните следующие действия:

      1. Добавить FontAwesomeModule в импортирует в src / app / app.module.ts :

         импортировать {BrowserModule} из '@ angular / platform-browser';
        импортировать {NgModule} из '@ angular / core';
        
        импортировать {AppComponent} из './app.component';
        импортировать {FontAwesomeModule} из '@ fortawesome / angular-fontawesome';
        
        @NgModule ({
          импорт: [
            BrowserModule,
            FontAwesomeModule
          ],
          объявления: [AppComponent],
          бутстрап: [AppComponent]
        })
        экспортный класс AppModule {} 
      2. Привяжите значок к свойству в вашем компоненте SRC / приложение / приложение.component.ts :

         импортировать {Компонент} из '@ angular / core';
        импортировать {faCoffee} из '@ fortawesome / free-solid-svg-icons';
        
        @Компонент({
          селектор: 'app-root',
          templateUrl: './app.component.html'
        })
        export class AppComponent {
          faCoffee = faCoffee;
        } 
      3. Используйте значок в шаблоне src / app / app.component.html :

           

      Документация

      Примеры

      Stackblitz

      Вот пример для начинающих StackBlitz о том, как отображать сплошные, обычные и фирменные значки с помощью библиотеки значков.

      Демо-приложение

      Вы можете найти примеры в каталоге projects / demo . Вы можете следовать документации, чтобы запустить демонстрационное приложение на своем компьютере.

      Содействие

      angular-fontawesome — продукт сообщества, вы можете взглянуть на документацию разработчика, чтобы узнать больше о том, как внести свой вклад в проект.

      Авторы

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

      Если мы кого-то пропустили (что весьма вероятно), отправьте нам запрос на вытягивание, и мы решим его.

      Команда The Font Awesome:

      @ fortawesome / angular-fontawesome — npm

      Официальный компонент Angular для Font Awesome 5

      Установка

      Используя нг, добавьте :

        # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ ng add @ fortawesome / angular-fontawesome @ <версия>
        

      Использование пряжи

        $ yarn add @ fortawesome / fontawesome-svg-core
      $ пряжа добавить @ fortawesome / free-solid-svg-icons
      # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ yarn add @ fortawesome / angular-fontawesome @ <версия>
        

      Использование NPM

        $ npm install @ fortawesome / fontawesome-svg-core
      $ npm install @ fortawesome / free-solid-svg-icons
      # См. Таблицу совместимости ниже, чтобы выбрать правильную версию
      $ npm install @ fortawesome / angular-fontawesome @ <версия>
        

      Таблица совместимости

      @ fortawesome / angular-fontawesome Угловой нг-добавить
      0.1.x 5.x не поддерживается
      0,2.x 6.x не поддерживается
      0,3.x 6.x && 7.x не поддерживается
      0,4.x, 0,5.x 8.x не поддерживается
      0,6.x 9.x поддерживается
      0,7.x 10.x поддерживается
      0,8.x 11.х поддерживается

      Использование

      Чтобы начать использовать Font Awesome с Angular, выполните следующие действия:

      1. Добавить FontAwesomeModule в импортирует в src / app / app.module.ts :

         импортировать {BrowserModule} из '@ angular / platform-browser';
        импортировать {NgModule} из '@ angular / core';
        
        импортировать {AppComponent} из './app.component';
        импортировать {FontAwesomeModule} из '@ fortawesome / angular-fontawesome';
        
        @NgModule ({
          импорт: [
            BrowserModule,
            FontAwesomeModule
          ],
          объявления: [AppComponent],
          бутстрап: [AppComponent]
        })
        экспортный класс AppModule {} 
      2. Привяжите значок к свойству в вашем компоненте SRC / приложение / приложение.component.ts :

         импортировать {Компонент} из '@ angular / core';
        импортировать {faCoffee} из '@ fortawesome / free-solid-svg-icons';
        
        @Компонент({
          селектор: 'app-root',
          templateUrl: './app.component.html'
        })
        export class AppComponent {
          faCoffee = faCoffee;
        } 
      3. Используйте значок в шаблоне src / app / app.component.html :

           

      Документация

      Примеры

      Stackblitz

      Вот пример для начинающих StackBlitz о том, как отображать сплошные, обычные и фирменные значки с помощью библиотеки значков.

      Демо-приложение

      Вы можете найти примеры в каталоге projects / demo . Вы можете следовать документации, чтобы запустить демонстрационное приложение на своем компьютере.

      Вклад

      angular-fontawesome — продукт сообщества, вы можете взглянуть на документацию разработчика, чтобы узнать больше о том, как внести свой вклад в проект.

      Авторы

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

      Если мы кого-то пропустили (что весьма вероятно), отправьте нам запрос на вытягивание, и мы решим его.

      Команда The Font Awesome:

      Styling & Themes — Icons

      Styling & Themes / Icons /

      Пакет Kendo UI для Angular предоставляет более 400 встроенных значков шрифтов для своих компонентов.

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

      Использование шрифтов значков в пользовательском интерфейсе естественным образом заменяет устаревшую технику спрайтов значков.

      Значки шрифтов демонстрируют значительные преимущества, такие как:

      • Улучшенная масштабируемость — в то время как спрайты значков представляют собой растровые растровые изображения и плохо масштабируются, шрифты значков используют векторную графику, идеально выглядят на дисплеях Retina и делают масштабирование таким же простым, как установка параметр конфигурации font-size .
      • Улучшенные возможности дизайна. Вы можете легко применять эффекты CSS «на лету», задав цвет текста, тень или другие параметры для различных состояний взаимодействия. Например, на : hover .
      • Улучшенная поддержка браузера. Значки шрифтов не зависят от браузера и поддерживаются всеми современными браузерами.
      • Уменьшенное количество HTTP-запросов. Чтобы загрузить шрифт значка, вам потребуется максимум несколько HTTP-запросов.
      • Уменьшенный размер файла — файл размером 100 КБ содержит примерно 500 векторных значков.

      Чтобы использовать значки шрифтов Kendo UI:

      1. Загрузите тему Kendo UI в свой проект.
      2. Назначьте класс CSS k-icon , за которым следует предопределенный класс из списка значков шрифтов тегу HTML, например элемент , как в .

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

       Копировать код   
      
      <стиль>
          .my-custom-icon-class: before {
              content: «e13a»;
          }
        

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

       Копировать код  @Component ({
        селектор: 'мое-приложение',
        стили: [`
           .k-icon.my-custom-icon-class: before {
              content: "\ e13a";
           }
          `],
        шаблон: `
           
        `
      })
      class AppComponent {
      }  

      Вы можете изменить каждый значок, используя:

      Размеры

      Чтобы установить размер значка, используйте свойство font-size CSS.Значки шрифтов Kendo UI созданы на основе сетки 16 пикселей. Чтобы добиться идеального отображения значков, увеличивайте масштаб, сохраняя размер в 16 единиц (32, 48, 64 и т. Д.).

       Копировать код   
       
       
       
      
      <стиль>
          .k-icon-32 {
              размер шрифта: 32 пикселя;
          }
      
          .k-icon-48 {
              размер шрифта: 48 пикселей;
          }
      
          .k-icon-64 {
              размер шрифта: 64 пикселей;
          }
        

      Цвета

      Чтобы установить цвет значка, используйте CSS-свойство color .

       Копировать код   
       
      
      <стиль>
          .colored-icon {
              цвет: зеленый;
          }
        

      Переворачивание

      Чтобы лучше разместить значок в вашем приложении, переверните его с помощью предопределенных классов CSS k-flip-h и k-flip-v .

       Копировать код   
       
       
         

      Чтобы отобразить индикатор загрузки для вашего компонента во время его загрузки, вы можете использовать:

      В следующем примере показано, как использовать класс CSS k-i-loading .Вы можете настроить размер и цвет индикатора загрузки так же, как и другие значки.

       Копировать код   
       
         

      Действия

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Предупреждения и уведомления

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Редактирование

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Файлы и папки

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Изображения

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Макет и навигация

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Сопоставление

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Медиа

      Пример

      Просмотреть исходный код

      Изменить тему: тема по умолчанию

      Социальный обмен

      Пример

      Просмотреть исходный код

      Изменить тему: по умолчанию тема

      Переключить

      Пример

      Просмотреть исходный код

      Изменить тему: по умолчанию e

      Пакетные файлы шрифтов в NPM для использования в Angular

      Во время работы над системой общих компонентов моей компании я получил запрос от нашей группы разработчиков.Они хотели, чтобы наш бренд соответствовал внутренним документам и другим активам. Поэтому они попросили нас использовать шрифт под названием «Stirling Foundry».

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

      Однако у нас есть несколько команд, которые полагаются на нашу общую систему компонентов, и мы не хотим копировать + вставлять соответствующие определения или файлы шрифтов @ font-face .Какое было наше решение? Отправьте второй пакет npm (во внутреннем реестре npm ), который содержит все наши личные ресурсы, включая файлы шрифтов.

      Давайте рассмотрим, как мы это сделали.

      Поскольку мы хотим отправлять наши пакеты отдельно, мы выбрали два репозитория Git для системы компонентов и частных активов. В новом репозитории у меня есть следующее для пакета package.json :

        {
        "name": "ecp-private-assets",
        "версия": "1.9.0.0 "
        },
        "хаски": {
          "крючки": {
            "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
          }
        },
        "commitlint": {
          "расширяется": [
            "@ commitlint / config-angular"
          ]
        }
      }  

      Хотя этот пакет не будет поддерживать код, я все же считаю важным поддерживать семвер для пакета. Если путь пакета изменится, семвер сообщит об этом потребителям вашего пакета вместе с подменышем. Таким образом, этот пакет package.json использует стандартную фиксацию и commitlint для автоматического создания журналов изменений и ведения истории версий.

      Добавить файлы шрифтов

      Шрифт Foundry Stirling, который я отправляю, представляет собой комбинацию из 7 файлов .otf . Я начинаю с создания каталога шрифтов . Внутри этого каталога я помещаю файлов .otf в каталог fonts .

      После завершения репозиторий вашего проекта должен выглядеть примерно так:

       .
      ├── CHANGELOG.md
      ├── README.md
      ├── шрифты
      │ ├── foundry_sterling_bold.otf
      │ ├── foundry_sterling_book.otf
      │ ├── foundry_sterling_book_italic.otf
      │ ├── foundry_sterling_demi.otf
      │ ├── foundry_sterling_extra_bold.otf
      │ ├── foundry_sterling_light.otf
      │ └── foundry_sterling_medium.otf
      ├── index.js
      ├── package-lock.json
      └── package.json  

      @ font-face Определение CSS

      Теперь, когда у нас есть шрифты на своих местах, нам нужно создать общий файл foundry_stirling.css для доступа к этим шрифтам из CSS.

      Поскольку мы планируем использовать Angular CLI, мы хотим установить для свойства src префикс / assets / , поскольку именно туда Angular отправляет свои активы.

       
      
      @ font-face {
          семейство шрифтов: 'Foundry Sterling';
          стиль шрифта: нормальный;
          
          font-weight: 300;
          src: local ('Foundry Sterling Light'), локальный ('FoundrySterling-light'), формат URL ("/ assets / foundry_sterling_light.otf") ('opentype')
      }
      
      
      
      @ font-face {
          семейство шрифтов: 'Foundry Sterling';
          стиль шрифта: нормальный;
          
          font-weight: 800;
          src: локальный ('Foundry Sterling Extra Bold'), локальный ('FoundrySterling-extra-bold'), формат URL ("/ assets / foundry_sterling_extra_bold.otf") ('opentype')
      }  

      Пока мы используем CSS, если вы хотите установить src в другое место для не-Angular проектов, вы можете использовать SCSS @mixin для определения объявлений @ font-face с настраиваемым $ base_path .

        @mixin foundry_sterling ($ base_path) {
      @ font-face {
       семейство шрифтов: 'Foundry Sterling';
       стиль шрифта: нормальный;
       
       font-weight: 800;
       src: url ("# {$ base_path} /foundry_sterling_extra_bold.otf") формат ('opentype')
      }
      
      
      }  

      Затем, используя пакет в своем клиентском приложении, вы захотите использовать что-то вроде этого:

        @include foundry_sterling ("/ assets")  

      Сопоставление значений имени шрифта

      Поскольку у нашего шрифта было несколько файлов для объявления различных весов значений CSS, нам пришлось объявить @ font-face для каждого из файлов шрифтов.Это отображение, которое мы использовали:

      Значение Общее название массы Связанный файл
      100 Тонкие / линия роста волос НЕТ
      200 Сверхлегкий / Сверхлегкий НЕТ
      300 Свет foundry_sterling_light.otf
      400 Обычный / Обычный foundry_sterling_book.otf
      500 Средний foundry_sterling_medium.otf
      600 Полужирный / Полужирный foundry_sterling_demi.otf
      700 Полужирный foundry_sterling_bold.otf
      800 Экстра-жирный / Ультра-жирный foundry_sterling_extra_bold.otf
      900 Черный / тяжелый НЕТ

      Теперь, когда у нас настроен наш пакет npm для использования, мы начнем подготовку к использованию этого пакета, установив его в пакет нашего приложения.json :

      Помните, ecp-private-assets — это имя нашего внутреннего пакета. Вам нужно будет заменить эту команду npm i своим собственным именем пакета

      angular.json модификация

      После этого необходимо выполнить два шага. Сначала добавьте следующее к свойству assets angular.json . Это скопирует файлы из ecp-private-assets в / assets после настройки сборки.

        {
        "glob": "** / *",
        "вход": "./node_modules/ecp-private-assets/fonts",
        "вывод": "./assets/"
      }  

      Таким образом, когда мы используем URL-адрес CSS ('/ assets /') , он будет указывать на наши недавно назначенные шрифтов файлов. После добавления ваш angular.json должен выглядеть так:

        {
        "архитектор": {
          "строить": {
            "builder": "@ angular-builders / custom-webpack: browser",
            "опции": {
              "customWebpackConfig": {
                "путь": "./webpack.config.js "
              },
              "outputPath": "www",
              "index": "src / index.html",
              "main": "src / main.ts",
              "polyfills": "src / polyfills.ts",
              «tsConfig»: «tsconfig.app.json»,
              "aot": правда,
              "ресурсы": [
                "источник / активы",
                {
                  "glob": "** / *",
                  "вход": "./node_modules/ecp-private-assets/fonts",
                  "вывод": "./assets/"
                }
              ],
              "стили": [
                "src / main.scss"
              ],
              "скрипты": []
            }
          }
        }
      }  

      Импорт CSS

      Теперь, когда у нас есть ресурсы, нам нужно импортировать файл CSS в наше приложение.

      Если ваше приложение использует postcss плагин import или если вы используете ванильный CSS, добавьте следующую строку в файл main.scss :

        @import "ecp-private-assets / fonts / foundry_sterling.css";  

      Не забудьте сохранить @import s в верхней части файла, иначе вы получите сообщение об ошибке.

      Однако, если вы не используете postcss и у вас установлен SCSS, вы можете использовать следующее:

        @import '~ ecp-private-assets / fonts / foundry_sterling.css ';  

      После того, как вы добавили файл в свой импорт CSS и angular.json , вы должны увидеть, как ваш шрифт загружается должным образом. Поскольку вы настроили свои шрифты на использование npm для их распространения, теперь вы можете повторно использовать свои шрифты в нескольких приложениях.

      Если вы хотите узнать больше или у вас есть вопросы об этой настройке, не стесняйтесь оставлять комментарии ниже или присоединяться к нашему Discord и задавать вопросы там!

      Angular Font Awesome — Как установить отличный шрифт в Angular 9/8?


      Hi Dev,

      Сегодня я хотел показать вам, как использовать иконки font awesome в angular 9/8.Я хочу дать вам простой пример угловых значков 9/8 install font awesome с помощью команды npm. мы установим потрясающую библиотеку шрифтов для иконок.

      Иконки — основное требование каждого проекта. значки указывают на большее, писать для него ярлык не нужно. иконки также делают красивый макет нашего приложения. Если вы думаете использовать значки в своем приложении, вы всегда предпочтете использовать значки с отличным шрифтом. font-awesome предоставляет множество значков, и вы можете очень легко им пользоваться.

      Итак, я думаю, что на примере я научусь шаг за шагом устанавливать значки font awesome в приложении angular 8.это очень просто, но для нового разработчика, который понимает, как это можно сделать.

      Давайте посмотрим на шаги ниже:

      Шаг 1: Создание нового приложения

      Вы можете легко создать свое угловое приложение, используя следующую команду:

       

      ng new my-new-app

      Шаг 2: Установка font-awesome

      На этом этапе вам нужно просто установить font-awesome на свой angular 8 и импортировать файл css в файл style.css. это только для импорта css.так что вы можете запустить команду ниже:

       

      npm install font-awesome --save

      Читайте также: Как динамически установить стиль в Angular 8?

      Шаг 3: Импорт CSS

      После успешной установки font-awesome нам нужно импортировать файлы css в файл angular.json. так что давайте добавим к нему следующие строки.

      angular.json

       

      "$ schema": "./node_modules/@angular/cli/lib/config/schema.json",

      "version": 1,

      "newProjectRoot": "projects",

      «проекты»: {

      «appFont»: {

      ....

      "активы": [

      "src / favicon.ico",

      "src / assets"

      ],

      "стили": [

      "node_modules / font-awesome / css / font -awesome.css ",

      " src / styles.css "

      ],

      ......

      ИЛИ вы также можете указать путь таким образом, если указанное выше не работает:

      "$ схема": ".

alexxlab

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *