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

Щомісяця існують десятки безкоштовних матеріалів, які розділяються дуже щедрими людьми в спільноті веб-дизайну та веб-розробки; майже неможливо не відставати від усіх цих нових речей. Тим не менш, ви не повинні хвилюватися; у цій публікації ми вибрали 10 корисних "речей", починаючи від фрагментів коду до інструментів, фреймів до плагінів полегшити роботу та життя як веб-дизайнерів та розробників.

Давайте перевіримо їх.

Перегляньте всі наші свіжі ресурси (відповідно до місяця):

Жовтень 2012 року
Листопад 2012 року
Грудень 2012 року

CSSS

CSSS що означає "CSS-система SlideShow" - це фреймворк, створений Леа Веру (відомий як гуру CSS). По суті, ця структура дозволяє створювати слайди презентацій за допомогою веб-стандартів HTML та CSS. Це слайд-шоу підтримує сполучення клавіш ←, →, ↓ і ↑ для переміщення по слайдах.

Якщо ви працюєте з CSS і HTML, ця структура, на мою думку, є (кращою) заміною дорогих програмних засобів, таких як MS PowerPoint.

BonsaiJS

Bonsai - це легка графічна бібліотека JavaScript з інтуїтивним API. Ми можемо використовувати цю бібліотеку для малювання простих форм, таких як прямокутник, трикутник, коло або графіка з глибокою складністю. Цю бібліотеку можна також використовувати для надання візуалізації масштабованого векторного графічного зображення (SVG) у непідтримуваних браузерах як резервна.

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

Чуйний візерунок

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

Набори інструментів Effin

Це, ймовірно, все, що вам потрібно, щоб допомогти розробити ваш сайт. Effin Toolsets - це колекція з десятка корисних інструментів для веб-розробників, упакованих все в одному місці.

Одним з інструментів цієї колекції, який я особисто знаходжу надзвичайно корисним, є Entifier, цей інструмент змінить ці символи, < і >, у свій HTML-код, щоб фрагмент коду відображався правильно всередині

тег.

Сусі

Susy є чуйною сіткою для компаса. Як і будь-який інший реагуючий сітчастий фреймворк, він складається з декількох попередньо визначених стилів, але оскільки він побудований з Sass і Compass, цей фреймворк є набагато більш налаштованим.

Susy дозволяє налаштовувати номер стовпця, ширину стовпця, жолоб і накладку сітки, роблячи це власною сіткою, яка відповідає вашому сайту. Susy зробить всю важку роботу: розрахунок. Якщо ви супер-майстер, який любить працювати з Sass і Compass, це розширення, безумовно, для вас.

Нескінченна навігація, що випадає

Випадаюче меню - це загальний компонент, який ми знайшли на веб-сайті. Тим не менш, створення спадного навігації не так легко, як це виглядає. Гаррі Робертс CSS Wizardry, на щастя, поділився своїм “магічний код” створити нескінченну спадну навігацію (яка є надзвичайною).

Бурбон акуратний

Neat - це гнучке середовище, яке допомагає легко запускати реагуючий веб-сайт. Він побудований на Sass і Bourbon, колекції корисних сумішей для Sass. Ця структура є gem Ruby, вона може бути встановлена через термінал або командний рядок за допомогою цього командного рядка gem встановити акуратно.

Типикони

Іконок не вистачить. Типи символів - це набір іконок шрифтів, які складаються з 88 символів. Ці піктограми можна додати @ font-face Правило і застосовувати їх до вашого сайту з псевдоелементами CSS або вставляти їх безпосередньо з їх символом HTML.

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

Анотатор

Ця бібліотека дозволяє додавати коментарі, теги та знижки до свого веб-вмісту, а разом з AnnotateIt можна зберігати свої анотації безкоштовно.

Аеропорт

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

Висновок

Це все за цей місяць. Ви пробували будь-яку з цих речей? Який ваш улюблений? Ви знайшли будь-які інші цікаві речі для веб-дизайнерів / розробників, які ми пропустили з цього списку?.

Ви можете поділитися ними в полі для коментарів нижче, і ми також хотіли б почути ваші думки.