Как стать автором
Обновить
4.28

Типографика *

Играем с шрифтами

Сначала показывать
Порог рейтинга
Уровень сложности

Веб-типографика сегодня. Часть V

Время на прочтение12 мин
Количество просмотров28K
Часть IЧасть IIЧасть IIIЧасть IVЧасть V — Часть VI

Часть V



Очевидно, что в сфере высоких технологий развитие зачастую происходит быстро и бурно. Так произошло и со средствами отображения информации. В течении каких-то двух-трёх лет обычные ЭЛТ-мониторы почти целиком и полностью были вытеснены стремительно дешевеющими ЖК-собратьями. Что позволило существенно улучшить как геометрию отображения, так и цветопередачу, а также снизить утомляемость глаз за счёт отсутствия вредного мерцания. И если несколько лет назад подобное утверждение в пользу TFT-панелей можно было бы оспорить, то теперь этот факт не вызывает ни у кого сомнений: ЖК-дисплеи намного лучше для повседневной работы рядового пользователя. В связи с этим фактором возникла необходимость поиска качественно новых алгоритмов отображения шрифтов. Одно из таких решений пусть не сразу, но всё же получило определённое признание в среде пользователей, и на сегодняшний день является чуть ли не самым популярным на современных платформах. Речь, конечно же, о технологии рендеринга ClearType, которая послужила причиной разработки новых веб-ориентированных шрифтов…

Читать дальше →
Всего голосов 2: ↑2 и ↓0+2
Комментарии121

Церковники воссоздали шрифт Ostrog

Время на прочтение1 мин
Количество просмотров2K
Сообщество славянской типографики создало и выложило в свободный доступ церковнославянский шрифт Ostrog. Его можно скачать в вариантах TrueType (TTF), «дольний» TrueType (TTF), Type1 и «дольний» Type1.



Шрифт разработан на основе старопечатных изданий г. Вильно и Острога второй половины XVI века. Создателем шрифта предположительно является Пётр Мстиславец, белорусский типограф, который приехал в Москву и помог российскому первопечатнику Ивану Фёдорову напечатать его первую книгу. Затем Мстиславец вернулся в Беларусь (ВКЛ) и соорудил там свою типографию. В Беларуси книгопечатание было известно за полвека до этого, так что типография стала далеко не первой.

Как сообщают церковники-типографы, шрифт Ostrog доступен для свободного бесплатного использования, за исключением контекстов, принципиально несовместимых с православием или серьёзно противоречащих нормам христианской нравственности.
Всего голосов 1: ↑1 и ↓0+1
Комментарии70

Краудсорсинг шрифтов

Время на прочтение1 мин
Количество просмотров3.3K
Краудсорсинг проникает в разные немыслимые области. Взять, к примеру, разработку шрифтов. Раньше этим занимались специализированные компании или вынужденно переквалифицированные дизайнеры, вроде сотрудников студии Лебедева. В результате мы получаем или закрытый продукт, недоступный для сообщества дизайнеров, или непомерно дорогой. Типичная стоимость коммерческого шрифта колеблется в районе $30-40.

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

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


Читать дальше →
Всего голосов 36: ↑33 и ↓3+30
Комментарии26

Публичная порка он-лайн типографов (часть 1)

Время на прочтение1 мин
Количество просмотров1.7K
Последний раз подобное мероприятие проводилось очень давно, и к сожалению в порке участвовали далеко не все кандидаты.
Читать дальше →
Всего голосов 41: ↑34 и ↓7+27
Комментарии55

Истории

Web-типографика — четыре золотых совета

Время на прочтение3 мин
Количество просмотров4.2K
Основы web-типографики пришли к нам из далекого 1991 года, еще от небезызвестного Tim Berners-Lee :)

Если оглянуться назад, в страшные времена царствования IE 1.0, то web-типографика (я не говорю о web-дизайне) находилась в зачаточном состоянии. На данный момент, ситуация иная. Мы имеем достаточно средств, для грамотного оформления текста на web-странице.

Cуть web-типографики заключаться не просто в выборе нужного шрифта и умение отличить начертание одного шрифта от другого.


Рис. 1: Как показали последние опыты, 90% тренированных обезьян правильно отличают шрифт Helvetica.

Мы поговорим о web-типографике как о рецепте, содержащем четыре основных компонента. Если вы когда-нибудь пытались приготовить суфле, то скорее всего, смогли ощутить насколько важен рецепт его приготовления.
Читать дальше →
Всего голосов 66: ↑47 и ↓19+28
Комментарии64

Удобочитаемость текста — сбор статистики

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

Линда Фэйн собирает статистику по предпочтениям внешнего вида текстового блока на специальной страничке «Text Prefs».

Внешний вид страницы

На странице нужно повыбирать шрифт и понажимать на кнопки увеличения/уменьшения кегля шрифта, межстрочного расстояния и ширины колонки, создав наиболее удобочитаемый для вас на данном мониторе блок текста. Чем сильнее мы пропиарим эту страничку Линды, тем полнее будет статистика (пусть и англоязычную, но это уже будет хоть что-то; может быть, кто-то надумает сделать кириллическую?).

После того, как статистика будет опубликована, обязуюсь доложиться в этом блоге. Ссылка была обнаружена через блог I Love Typography, за что спасибо Джону Бордли.
Всего голосов 53: ↑48 и ↓5+43
Комментарии23

Хочется надеяться, что последний раз про многоточия

Время на прочтение3 мин
Количество просмотров3.5K
Сегодня Дизайнер Всея Руси совершил типографический наброс на вентилятор в своём личном блоге в Livejournal.
Так вот, ребята. Знак многоточия состоит из трех точек. «Тук, тук, тук», — именно такие звуки должна издать ваша клавиатура. Ни в коем случае нельзя пользоваться символом, называемым многоточием (…). Этот символ один содержит все три точки в себе. Придуман он для моноширинного набора и экономии байтов, однако пользоваться им для верстки книг, а также газет и журналов — нельзя.
Собственно, половина леммингов начала радостно принимать распоряжение Дизайнера Всея Руси.
А что думает об этом Брингхёрст?
Всего голосов 70: ↑57 и ↓13+44
Комментарии70

Веб-типографика сегодня. Часть IV

Время на прочтение13 мин
Количество просмотров43K
Часть IЧасть IIЧасть IIIЧасть IVЧасть V — Часть VI

Часть IV



Итак, настала пора выяснить, какие шрифты и с какой долей вероятности могут оказаться установленными в тех или иных операционных системах либо в результате каких-то особых ситуаций (например, при установке пакетов Microsoft Office, Adobe Creative Suite или CorelDRAW! Suite), либо в «девственно чистых» ОС (что, несомненно, наиболее приемлемый вариант). А также узнать, какие из этих шрифтов пригодны для использования и в каких конкретно случаях.

Читать дальше →
Всего голосов 94: ↑89 и ↓5+84
Комментарии105

«Большая» типографика как часть дизайна

Время на прочтение2 мин
Количество просмотров6.5K
Традиционно, в Web, типографика не является основой дизайна. Но, она может
доминировать, преобладать и быть повсюду! Весьма смело…

Читать дальше →
Всего голосов 58: ↑45 и ↓13+32
Комментарии27

Веб-типографика сегодня. Часть III

Время на прочтение3 мин
Количество просмотров23K
Часть IЧасть IIЧасть IIIЧасть IVЧасть V — Часть VI

Часть III



Оказалось, что аж ещё со времён Windows 98 в стандартный комплект включается шрифт под названием Lucida Sans Unicode, который особо нигде не используется. Попробуем заменить им эппловский Lucida Grande.
Читать дальше →
Всего голосов 72: ↑67 и ↓5+62
Комментарии62

Подгружаемые шрифты в HTML — мечта или реальность?

Время на прочтение2 мин
Количество просмотров3.9K
Многие согласятся, что стандартных Arial, Times, Verdana и т.д. зачастую не хватает.
Тут на помощь вроде как должен прийти css правило @font-face, которое позволяет использовать свой шрифт. Но к сожалению нормальной поддержки браузерами нет. В качестве теста можно использовать http://www.alistapart.com/d/cssatten/stef.html.
Реалии поддержки @font-face и возможные альтернативы
Всего голосов 15: ↑10 и ↓5+5
Комментарии19

Веб-типографика сегодня. Часть II

Время на прочтение8 мин
Количество просмотров6.7K
Часть IЧасть IIЧасть IIIЧасть IVЧасть V — Часть VI

Часть II



Во-первых, увеличились размеры экранов, улучшилась чёткость отображения и качество передачи цветов. В наше время всё реже используются старые ЭЛТ-дисплеи с небольшим разрешением, выпуклым экраном, мерцанием или ограниченной цветопередачей (помните CGA/EGA/VGA?). Фактически, количеством таких мониторов по сравнению с современными плоскими ЖК-дисплеями уже сегодня можно смело пренебречь. Изменились и негласные стандарты de facto и для разрешения: если в самом начале сайты создавались под размер экрана в 640х480 пикселей, потом для 800х600, то сегодня используется стандарт 1024х768. С появлением широкоэкранных (wide) мониторов начал было маячить новый стандарт 1280х960, но большую популярность в последнее время приобрели компактные устройства вроде Asus eeePC или Apple iPhone, так что не исключён факт возвращения в качестве стандарта разрешения меньшего, чем 1024х768. Впрочем, в данном случае это не столь важно, поскольку в любом случае на сегодняшний день разрешение экрана напрямую зависит от его физического размера, а величина одной отображаемой точки достаточно мала по сравнению с пикселями десятилетней давности, что позволяет на любых современных устройствах отображать шрифты одинаково качественно. Это, кстати, приводит и ко второму фактору.

Читать дальше →
Всего голосов 89: ↑82 и ↓7+75
Комментарии55

Веб-типографика сегодня. Часть I

Время на прочтение7 мин
Количество просмотров27K
Часть IЧасть IIЧасть IIIЧасть IVЧасть V — Часть VI

Часть I



Как-то ко мне обратился знакомый дизайнер с просьбой разобраться в странной по его мнению ситуации. Клиент просил «сделать так же, как у Apple», но с использованием собственных способов расположения блоков, изображений, цветовой гаммы и текста. В общем, дизайн в итоге получался совершенно непохожий на apple.com, но этого, собственно, и добивался клиент. И вроде бы у дизайнера получилось, но… Клиенту по-прежнему не нравилось, он всё равно требовал переделать макет. По его ощущения «что-то было ну совсем не так». А что именно — тот объяснить был не в силах. Вот и возник вопрос у моего коллеги по поводу того, как угодить капризам клиента и понять его чаяния. Оказалось всё не так просто, но вполне объяснимо. Я и раньше сталкивался с данной проблемой. Поэтому решил попробовать изложить свои мысли по этому поводу.

Итак, какова ситуация в области современной веб-типографики и какими способами следует решать возникающие проблемы?
Читать дальше →
Всего голосов 128: ↑120 и ↓8+112
Комментарии41

Ближайшие события

19 сентября
CDI Conf 2024
Москва
24 сентября
Конференция Fin.Bot 2024
МоскваОнлайн
30 сентября – 1 октября
Конференция фронтенд-разработчиков FrontendConf 2024
МоскваОнлайн

15 примеров отличной типографики

Время на прочтение2 мин
Количество просмотров11K
Британский сайт I Love Typography, посвящённый типографике, опубликовал список с примерами отличной типографики. Этот список составлен по итогам II кв. 2008 года. Предыдущие «хит-парады» можно найти здесь и здесь.

Каждый пример сопровождается кратким комментарием, а нажатие на скриншот ведёт на оригинальный сайт.

Seed Conference


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


Читать дальше →
Всего голосов 66: ↑58 и ↓8+50
Комментарии36

Штрихи, штришки и штришочки

Время на прочтение6 мин
Количество просмотров96K
Практика показывает, что если тире или кавычки — это первое, что изучают при появлении интереса к «типографике» (а на самом деле — к грамотному набору текста), то правильное употребление апостро́фа, знаков минут и секунд, знака ударения вызывает почему-то бо́льшие затруднения. На самом деле, всё очень просто, и статья будет довольно короткой. Всё, о чём будет сказано ниже, относится к современной русской традиции типографики.
Поехали!
Всего голосов 89: ↑80 и ↓9+71
Комментарии94

Шрифтовое юзабилити для верстальщиков

Время на прочтение1 мин
Количество просмотров1.2K
Иногда, работая в текстовом редакторе с моим любимым моноширинным шрифтом Lucida Console, я сталкиваюсь с тем, что не могу отличить неразрывный пробел от обычного или длинное тире от дефисо-минуса. И мне пришла в голову идея изменить шрифт таким образом, чтобы можно было видеть различия между символами.

Читать дальше →
Всего голосов 5: ↑5 и ↓0+5
Комментарии7

abcTajpu для FireFox

Время на прочтение3 мин
Количество просмотров1K
Уже после публикации заметки о раскладках клавиатуры наткнулся ещё на один перл, мощнейшее дополнение к FireFox с названием abcTajpu (пока что работает только в версиях 1.5 — 3.0b3).

После установки дополнение фактически заменяет клавишу Compose при работе в FireFox. С помощью abcTajpu можно легко набирать всякие хитрые символы (å℃≈Łķē¾Æ) без шаманских плясок с раскладками, а также задавать любые пользовательские замены (например, два пробела заменять на  ).

Прочие статьи о «типографских» раскладках на Хабре:
Читать дальше →
Всего голосов 32: ↑30 и ↓2+28
Комментарии38

RE: всё ли так просто с многоточием?

Время на прочтение3 мин
Количество просмотров3.6K
Читая вчерашнюю статью о многоточии, я поймал себя на мысли, что с одним пунктом в той статье я очень не согласен. Первоначально я хотел опубликовать эту свою мысль, как комментарий в том же топике, но по мере более подробного чтения у меня возникало всё больше этих самых мыслей, так что я всё-таки решил написать отдельную заметку по этому поводу.

Для начала, я сразу оговорю две вещи: во-первых, ни в коем случае не думайте, что я собираюсь «наехать» на rumkin’а — автора статьи. Статья очень хорошая, качественная, и я был бы рад, если б на Хабре статей такого уровня было как можно больше. Просто у меня возникли некоторые разногласия с автором, и я хотел бы поделиться ими с вами.
Во-вторых, я не профессиональный дизайнер/верстальщик, и на звание оного претендовать не хочу. Тем не менее, у меня есть интерес,, и вкус.
Можно сказать, что я просто ценитель и любитель этих искусств, по этому всё, что я буду писать дальше, основано на моих личных вкусах и пониманиях, нежели на богатом профессиональном опыте.

Теперь, когда вышесказанное вам известно,
перейдём к делу
Всего голосов 66: ↑50 и ↓16+34
Комментарии77

OOoLaTeX или OpenOffice и математические формулы.

Время на прочтение2 мин
Количество просмотров7.1K
Полиграфисты относят математические работы к каторжным...
Д.Э.Кнут. Математическая типография.


Больше года назад, когда я решил, что перейду на полностью лицензионный софт, выбор покупать Microsoft Office или перейти на OpenOffice сильно не стоял — студенту очень сложно найти лишние деньги. Счастье от того, что OO выполняет почти все что от него требуется закончилось довольно быстро в момент, когда я открыл встроенный редактор формул OO.Math. Сказать, что он плох — это ничего не сказать. Было понятно, что нужно искать другой инструмент.

Первоначально выбор пал на Design Science MathType, который позволял работать почти в том же редакторе, что и MSO (MS Equation ничто иное как урезанный MathType), но работа с OLE объектами была утомительна и так и не поддавалась автоматизации. К тому же, меня тяготела мысль о том, что при переходе на Linux систему, я опять потеряю возможность работы с формулами.
Перебор других средств расширяющих функционал или заменяющих ОО.Math не дали ничего кроме разочарования. Все проекты были очень сырыми или недостаточно функциональными.
Я продолжил поиск и был вознагражден: я нашел OOoLaTeX.

Читать дальше →
Всего голосов 22: ↑21 и ↓1+20
Комментарии55

«Типографские» раскладки клавиатуры

Время на прочтение6 мин
Количество просмотров29K
По просьбам трудящихся коснёмся темы «типографских» раскладок клавиатуры. То есть, как системных средств Windows, так и сторонних программ, позволяющих вводить различные специальные символы с помощью клавиатуры (обычно, правой клавиши Alt, она же AltGr).

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

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

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

Читать дальше →
Всего голосов 49: ↑44 и ↓5+39
Комментарии84

Вклад авторов