Свіжі ресурси для веб-дизайнерів і розробників (лютий 2016 р.)

2015 рік був чудовим для Інтернету: веб-технології були прийнятих у багатьох формах поза для створення веб-сайту або веб-програми. Багато мобільних і настільних додатків тепер створюються за допомогою HTML, CSS і JavaScript. Це стало можливим завдяки портативності веб-технологій і бібліотек, таких як React.js, Angular і Node.js.

Таким чином, у сьогоднішній частині цієї серії ми зібрали кілька бібліотек JavaScript і CSS.

Натисніть "Більше ресурсів"

Знайдіть всю нашу колекцію рекомендованих ресурсів і найкращі доступні інструменти веб-дизайну та розробки.

Плоский слайдер

JQuery UI поставляється з колекцією загального веб-інтерфейсу, включаючи слайдер - інтерфейс, який дозволяє користувачеві вибирати діапазон числових значень. The Плоский слайдер - це веб-інструмент, який робить налаштування стилю інтерфейсу jQUery, який колись було дуже складним завданням, набагато простішим.

Утиліта Open-type

Утиліта Open-type - це колекція класів, у яких випадає застосовувати розширені типографічні можливості CSS такі лігатури шрифтів, невелика велика літера і багато іншого. Вони в основному дають найкращі можливості для читання користувачам у деталях. Вона слабшає у старих, непідтримуваних браузерах.

ResponsifyJS

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

ResponsifyJS це полегшена бібліотека JavaScript, до якої ви можете скористатися встановіть координати, щоб підтримувати фокус зображення під час зміни розміру.

Лінійний

Лінійний це додаток для лінійки для Mac. Ви можете використовувати лінійку для вимірювання веб-сторінок, з'ясувати розмір елемента без необхідності відкривати DevTools або з'ясувати, якщо елемент ідеально центрований. Ви можете мати декілька лінійок і переключити пристрій з PX на EM.

StickyStack

StickyStack це додаток jQuery для створення досвіду прокручування стека, коли панель досягає верхньої частини вікна перегляду, вона прилипає до нього, а подальша прокрутка піднімає наступну панель. Це легкий плагін з декількома варіантами налаштування контейнера сторінок, секції стека, а також тіні стеків. Перевірте демо.

Перегляд

Перегляд є JQuery плагін для зображення lightbox - фантастичний популярний спосіб збільшення зображень в Інтернеті. Плагін постачається з переважними опціями, які дозволяють вам налаштувати кожен біт лайтбокс інтерфейс.

Плагін також надає набір API і спеціальні події для повного контролю над лайтбокс реакція і поведінка. Більше того, він працює в Internet Explorer 8.

DeviceMock

DeviceMock - це бібліотека JavaScript, яка дозволяє створювати кадри пристроїв або макети такі як телефон, планшет і робочий стіл. Аналогічно, бібліотека надає опції для встановлення кольору теми кадру, розміру, а також орієнтації кадру.

Це може бути гарною альтернативою для демонстрації веб-сторінок і додатків замість використання Photoshop.

Clrs

Clrs це ініціатива перевизначити веб-кольори за промовчанням у більш сучасний кольоровий тон. Крім того, він виступає за набір кольорових комбінацій для кращої доступності. Ці кольори можна розгортати за допомогою зразків кольорів NPM, Gem (Ruby), Photoshop та Illustrator.

Colorify

Colorify - це суперлегка бібліотека JavaScript (до 3kb) витягують домінуючі кольори із зображення з багато API для маніпулювання кольорами. Витягнутий колір можна використовувати як заповнювач під час очікування повністю завантаження зображення, генерування градієнтного фону або налаштування сусіднього інтерфейсу відповідно до кольору зображення.

BookBlock

BookBlock додатком jQuery створити буклет з ефектом перегортання сторінок. Це прекрасна альтернатива для відображення декількох зображень на вашому веб-сайті, особливо якщо існує послідовність або потік, який ви хочете продемонструвати.

Ви можете перевірити демо тут, щоб отримати уявлення про те, як працює BookBlock.