Здравствуйте, %username%. Если вы попали на этот сайт, значит, скорее всего, разработчик сайта имеет претензии к вашему дизайну — одно или несколько правил вёрстки не удовлетворяются и он не хочет тратить время на объяснение этих принципов.
Давайте попробуем последовательно разобраться – ниже приведён список основных требований и рекомендаций (считайте это правилами хорошего тона) по подготовке макетов к вёрстке. Приступим?
Выбирая экзотический шрифт, убедитесь, что он содержит все необходифые глифы, которые могут использоваться на сайте (даже если они отсутствуют в макете). Также имейте в виду, что использование нестандартных шрифтов в разы замедляет отрисовку текста на сайте — вы гарантированно снижаете общее впечатление о продукте со стороны пользователя.
В зависимости от задачи обеспечить идентичность внешнего вида шрифтов в разных браузерах, имейте в виду, что некоторые браузеры поддерживают лишь конкретные форматы:
| Desktop-платформы | TTF | WOFF | WOFF2 |
|---|---|---|---|
| Google Chrome | . | . | . |
| Mozilla Firefox | . | . | . |
| Internet Explorer 9+ | . | . | . |
| Microsoft Edge | . | . | . |
| Opera | . | . | . |
| Safari | . | . | . |
| Mobile-платформы | |||
| iOS Safari | . | . | . |
| Chrome for Android | . | . | . |
| Android Browser | . | . | . |
| Opera Mini | . | . | . |
| BlackBerry Browser | . | . | . |
| Firefox for Andriod | . | . | . |
| BlackBerry Browser | . | . | . |
| UC Browser for Andriod | . | . | . |
| TTF | WOFF | WOFF2 |
Примечание: использование популярных сервисов для автоматической генерации отсутсвующих шрифтов имеет побочный эффект так называемого хинтинга – возникновения «артефактов» рендера сложносоставных глифов.
Не забудьте разместить файл лицензии на право использования предоставляемого вами шрифта в интернете в соответствующем каталоге.
https://medium.com/@danrschlosser/the-polish-checklist-for-web-developers-5b190b8b6851
Сайт, подразумевающий мобильную версию в рамках одного шаблона, называется адаптивным — блоки контента автоматически адаптируются под ширину устройства, меняя порядок, скрывая или отображая элементы, характерные для текущей области просмотра.
@TODO: включить этапы из статей http://tilda.education/how-to-build-website и http://www.cossa.ru/152/104890/