Выбор редакции:

PR-трюк, который принес миллионные охваты бренду

Ещё и модельеры! Как бэкграунд дизайнера помог нам создать новый стиль для премиум-отеля «Акрон»

263

Правила регистрации блогеров с аудиторией от 10 000 человек: кому, когда и что передавать

155

В 2024 году в России онлайн-торговля заняла 42% от общей выручки розничных сетей

160

Создатель Pokémon Go разработает ИИ-модель на основе данных игроков

167

Новости СМИ2

21 Августа 2013

Fontstorage 787 6 В избр. Сохранено

Немного статистики по шрифтам в проектах на Spark.

Нравится

Send

Мнение автора может не совпадать с мнением редакции

В субботу для себя собирали статистику по используемым шрифтам в проектах на Спарке, и решили дать посмотреть ее и вам.

В статистике учитывались сайты, которые открылись хотя бы с третьего раза.

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

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

А для того, чтобы быть в курсе тенденций дизайна и типографики в частности, посещайте: Behance.net, Dribbble.com, Smashingmagazine.com, A List Apart. Кроме того, периодическое посещение этих ресурсов развивает то самое чувство прекрасного.

Спасибо за внимание.

В избр. Сохранено

Нравится

Комментарии

VJ-X

Модульная система управления предприятием для малого бизнеса

Ян 38

21 авг 2013

Интересно и полезно )

Ответить

Fontstorage

Самый удобный сайт со шрифтами.

Александр 960

21 авг 2013

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

Ответить

IlovePRG

Лучший путеводитель по Праге

GuideSites 1451

22 авг 2013

Можете сказать, нормальный шрифт у нас (http://iloveprg.ru/muzej-alximikov-i-magov-staroj-pragi/)?

Ответить

Fontstorage

Самый удобный сайт со шрифтами.

Александр 960

22 авг 2013

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

Заметил только "замыленность" вот тут http://clip2net.com/s/5BQ2Dr.
Если сильно хочется тень у текста, то можно наоборот, сделать контрастней: http://clip2net.com/s/5BQ4nU (заменил цвет тени с #fff на rgba(0,0,0,.3);)

Еще один момент - использование шрифтов Droid Sans и Droid Serif, которые вы тянете с Гугла. У них нет кириллицы, поэтому ваши заголовки рисуются шрифтом Georgia. Если хотите использовать Droid'ы, скачайте их у нас. Мы буквально в понедельник выложили эксклюзив в виде кириллицы.

Ответить

IlovePRG

Лучший путеводитель по Праге

GuideSites 1451

22 авг 2013

Спасибо. С плагином "Похожие статьи" не могу никак разобраться, точнее с CSS, потому что ничего в нем не понимаю.

#crp_related ul {
list-style: none;
float: left;
margin: 0;
}
#crp_related li, #crp_related a {
float: left;
overflow: hidden;
position: relative;
text-align: center;
}
#crp_related li {
margin: .9em;
border: 1px solid #ddd;
padding: 6px;
}
#crp_related li:hover {
background: #eee;
border-color: #bbb;
}
#crp_related a {
width: 150px;
height: 150px;
}
#crp_related a:hover {
text-decoration: none;
}
#crp_related img {
max-width: 150px;
margin: auto;
}
#crp_related .crp_title {
position: absolute;
height: inherit;
bottom: 6px;
left: 6px;
padding: 3px;
width: 144px; /* = 150px - (3px * 2) */
color: #fff;
font-size: .9em;
text-shadow: #fff .1em .1em .2em;
background: rgb( 0, 0, 0.3);
background: rgba( 255, 0, 0, 0.5);
}
#crp_related li:hover .crp_title {
background: rgb( 255, 0, 0);
background: rgba( 255, 0, 0, 0.5);
}

Сам цвет ссылки берется от основного CSS. Как изменить цвет ссылки только для похожих статей - не знаю.

Да, действительно - шрифт Droid является стандартным для моей темы. Как добавить ваш шрифт в Wordpress?

Ответить

Fontstorage

Самый удобный сайт со шрифтами.

Александр 960

22 авг 2013

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

Ответить