Особенности указания шрифтов при верстке

@polnyj0 · Регистрация: 06.06.2013

Author24 — интернет-сервис помощи студентам

Здравствуйте. Хотел бы получить Ваших разъяснений по особенностям указания шрифтов при верстке. К примеру, я верстаю макет где меню прописано шрифтом Allerta Medium, у меня такого шрифта нет, соответственно, с большой вероятностью, у многих посетителей сайта, его, также, не будет. Фотошоп предлагает замену и меняет шрифт на Mariad Pro, но и это не очень распространенный шрифт и у ряда пользователей может не быть и его.
Соответственно, хотел бы узнать, как правильно поступать в этом случае? Правильно ли я понимаю, что изначально, нужно установить тот шрифт, что указан в макете, т.к. верстать необходимо в полном соответствии с предоставленным макетом? Но как быть дальше, какие шрифты указывать в стилях? Т.е. первым указываю Allerta Medium, а затем? Где можно узнать (возможно, есть какой то сайт) на какие шрифты будут заменены отсутствующие у пользователя. Может ли случиться так, что придется указывать отдельные стили для шрифта (увеличивать размер, font-weight), который выберет браузер в отсутствие указанного в свойствах?
Как вы решаете такого рода проблем?

Приветствуются ссылки на статьи по теме. Заранее благодарю за ответы.

@Beer-Sheva · 11.10.2013, 22:48

Можно с гугля шрифты подгружать http://www.google.com/fonts
Или заливать нужные шрифты на свой сайт.

@Nike4000 · 11.10.2013, 23:28

пишите в css

CSS

@font-face {
    font-family: Nike; /* Гарнитура шрифта */
    src: url(fonts/Nike.ttf); /* Путь к файлу со шрифтом */
}

и подключаете, где надо, например

CSS

.post_zagolovok h1 span{
   font: bold 20px Nike; /*тут пишите свое назв-е*/
   color: #b988ad;
}

хорошо, если помогла)

@Web-ulyanov · 11.10.2013, 23:41

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

@DelphiXE3 · 12.10.2013, 09:52

используй сразу несколько

@polnyj0 · 12.10.2013, 12:34 **[ТС]**

Спасибо ответившим. Как я понимаю, загрузка дополнительных шрифтов с Google Font несколько замедлит загрузку страницы? А в каких случаях, все таки допустимо указание стандартных шрифтов/семейств?
А если не грузить шрифт со стороннего ресурса, а добавить файл шрифта .ttf на сервер вместе с остальными файлами сайта (возможно сказал глупость, еще не доводилось загружать сайт на веб-сервер)?

@Beer-Sheva · 12.10.2013, 12:55

Сообщение от polnyj0

А если не грузить шрифт со стороннего ресурса, а добавить файл шрифта .ttf на сервер вместе с остальными файлами сайта (возможно сказал глупость, еще не доводилось загружать сайт на веб-сервер)?

Так тебе же это уже предлагали, лучше прочитай здесь http://htmlbook.ru/css/font-face

Добавлено через 10 минут
А шрифт с Google Fonts можно даже сохранить у себя на компе, а потом уже залить его на сайт!

@polnyj0 2 / 2 / 0 Регистрация: 06.06.2013 Сообщений: 73
		1
	Особенности указания шрифтов при верстке 11.10.2013, 22:27. Показов 3667. Ответов 6 Метки нет (Все метки) Здравствуйте. Хотел бы получить Ваших разъяснений по особенностям указания шрифтов при верстке. К примеру, я верстаю макет где меню прописано шрифтом Allerta Medium, у меня такого шрифта нет, соответственно, с большой вероятностью, у многих посетителей сайта, его, также, не будет. Фотошоп предлагает замену и меняет шрифт на Mariad Pro, но и это не очень распространенный шрифт и у ряда пользователей может не быть и его. Соответственно, хотел бы узнать, как правильно поступать в этом случае? Правильно ли я понимаю, что изначально, нужно установить тот шрифт, что указан в макете, т.к. верстать необходимо в полном соответствии с предоставленным макетом? Но как быть дальше, какие шрифты указывать в стилях? Т.е. первым указываю Allerta Medium, а затем? Где можно узнать (возможно, есть какой то сайт) на какие шрифты будут заменены отсутствующие у пользователя. Может ли случиться так, что придется указывать отдельные стили для шрифта (увеличивать размер, font-weight), который выберет браузер в отсутствие указанного в свойствах? Как вы решаете такого рода проблем? Приветствуются ссылки на статьи по теме. Заранее благодарю за ответы. 1

@Beer-Sheva 6 / 6 / 0 Регистрация: 09.10.2013 Сообщений: 251
	11.10.2013, 22:48	2
	Можно с гугля шрифты подгружать http://www.google.com/fonts Или заливать нужные шрифты на свой сайт. 1

@Web-ulyanov 55 / 54 / 24 Регистрация: 07.10.2013 Сообщений: 200
	11.10.2013, 23:41	4
	polnyj0, Обычно прошу дизайнера прислать шрифты ведь у него они есть, а мне искать нужно, хотя ситуации конечно разные бывают, иногда быстрей найдешь и сверстаешь пока дизайнер пошевелит свои конечности.А вообще желательно соответствовать макету, чтобы потом менять не пришлось. Ну а по подключению вам показали, как это делается. 0

@DelphiXE3 22 / 22 / 6 Регистрация: 24.03.2013 Сообщений: 119
	12.10.2013, 09:52	5
	используй сразу несколько 0

@polnyj0 2 / 2 / 0 Регистрация: 06.06.2013 Сообщений: 73
	12.10.2013, 12:34 [ТС]	6
	Спасибо ответившим. Как я понимаю, загрузка дополнительных шрифтов с Google Font несколько замедлит загрузку страницы? А в каких случаях, все таки допустимо указание стандартных шрифтов/семейств? А если не грузить шрифт со стороннего ресурса, а добавить файл шрифта .ttf на сервер вместе с остальными файлами сайта (возможно сказал глупость, еще не доводилось загружать сайт на веб-сервер)? 0

@Beer-Sheva 6 / 6 / 0 Регистрация: 09.10.2013 Сообщений: 251
	12.10.2013, 12:55	7
	Сообщение от polnyj0 А если не грузить шрифт со стороннего ресурса, а добавить файл шрифта .ttf на сервер вместе с остальными файлами сайта (возможно сказал глупость, еще не доводилось загружать сайт на веб-сервер)? Так тебе же это уже предлагали, лучше прочитай здесь http://htmlbook.ru/css/font-face Добавлено через 10 минут А шрифт с Google Fonts можно даже сохранить у себя на компе, а потом уже залить его на сайт! 0