02:29 Typeplate: Starter Kit для создания красивых веб-шрифтов | |
Сегодня мы с радостью хотим представить вам Typeplate – бесплатный open source набор новичка для работы с типографикой, который, мы надеемся, поможет вам в деле с созданием красивых и полноценных веб-сайтов. На самом деле, интернет на 95% состоит из текста, и учитывая то, насколько стремительно мы продвигаемся в будущее, нам кажется, что есть еще многое, что нам нужно будет изучить. Typeplate – это результат таких же исследований. [img]/uploads/posts/2013-03/1364296386_typeplate-logo-450px.png[/img] «Еще одна среда разработки?» Typeplate был разработан потому, что его разработчики не были довольны существующими веб-платформами. Проблема большинства среда разработки заключается в том, что они предлагают нам слишком много способов сделать то или это. Это, возможно, и хорошо, но зачастую разработчикам приходится создавать собственный код или искать другую платформу. Часто библиотеки паттернов бывают полезными, но иногда они разделяют структуру от эстетики, и это ведет к тому, что проект не выглядит слаженным до тех пор, пока вы полностью не передумаете все паттерны. Мы ведь создаем сайты в 2013 году! Нет причин к тому, чтобы жертвовать кастомизацией и модульностью для достижения красивых и полноценных результатов. [img]/uploads/posts/2013-03/1364296349_typeplate-press-500.png[/img] С помощью Typeplate вы можете комбинировать отличные шрифты из прошлого с гибкими стилями настоящего времени Как это работает Так что же на самом деле делает Typeplate? Будучи набором для новичков, эта библиотека не дает вам каких-либо предложений относительно того, как следует писать код. Мы вернулись к основам, вдохновились Гарри Робертсом (Harry Roberts) и его inuit.css, а также другими OOCSS-проектами. Typeplate позволяет вам выставлять прочную базу стилей, и включить туда конвенционные свойства шрифтов (другими словами, оформлять цитирование или использовать буквицу), основанные на отличной разметке и гибких стилях. Typeplate – это не очередной Bootstrap или Foundation, так как разработчики создавали его как набор инструментов для веб-шрифтов, который способен расширяться и подвергаться настройкам. Помните, нет причин к тому, чтобы жертвовать кастомизацией и модульностью для достижения красивых и полноценных результатов. Typeplate основан при помощи Sass, и многое позаимствовал из техник объектно-ориентированного CSS. Ключевое свойство в том, что Typeplate 100% основан на предложении вариантов: он отнимет у вас всего 3кб со всего проекта, но вы можете выбирать только необходимые вам проекты, и избавиться от всего остального. Существует версия на чистом CSS-коде (которая постоянно улучшается), но если вы хотите извлечь полноценное преимущество, то наверняка вам захочется поработать с Sass: Typeplate генерирует css со множеством переменных и функций, что позволяет вам сосредоточиться на использовании свойств, а не написании кода для них. Например, цикл Typographic Scale генерирует 53 строки кода для создания полноценного заголовка в две строки при помощи всего 3 переменных и размера шрифта. Демо и ссылки на скачивание * Живое демо * Примеры и документация * Скачать исходные файлы (и в Sass и в CSS, 3гб в сжатом виде, 17кб – в исходном) * GitHub * Также доступно на Bower (только версия Sass; если у вас установлен Bower, то просто запустите установку typeplate при помощи терминала). Как использовать Очень просто. Чтобы использовать typeplate, просто @import "_typeplate.scss" в основной css-файл вашего проекта, желательно после сброса. По умолчанию, Typeplate устанавливает базовые стили для html, body, h1–h6, pre, code и abbr. Возможно, вам захочется изменить эти стили до того, как начать добавлять новые. Не забудьте, что вы всегда можно удалить эти разделы и использовать миксины в ваших таблицах стилей. [img]/uploads/posts/2013-03/1364296447_typeplate-kit-450px.png[/img] Так как проект пока только развивается, страница проекта часто обновляется, а в интернете можно видеть соответствующие новости по этому поводу, а также новые примеры реализации и дополнительную документацию. Если вам понравится данный проект, то не забывайте следить за обновлениями! | |
|
Всего комментариев: 0 | |