Фонд 6 - 10 удивительных новых функций

Разработчики интерфейсной платформы Foundation не просто почивали на лаврах, пока команда Bootstrap работала над своим впечатляющим новым основным выпуском. В прошлом году они отправились в потрясающее мировое турне, чтобы поделиться своими знаниями со своими пользователями и спросить их о том, как они используют Foundation в своей реальной работе..

Вернувшись к своим рабочим столам, они объединили потребности и пожелания своих пользователей и приступили к планированию нового основного выпуска фреймворка: Foundation 6.

Он все еще находится в стадии разработки, но планы очень многообещающие. Предстоящие функции сосредоточены на 3 основных областях: производительность, настраиваемость и доступность. Давайте посмотрим на 10 из этих функций сейчас.

1. Упорядоченный рабочий процесс

Основываясь на опыте своих пользователей, команда Фонда разработала новый слоган, а именно “Прототип для производства”, для Foundation 6. Это означает новый, оптимизированный рабочий процесс, который позволит дизайнерам и разработчикам перейти прямо от прототипа к производству.

Целью нового Foundation 6 является предоставление гибкой и легко настраиваемой структуры, которая позволяет написать чистый и семантический код с самого начала. Текущая версия Foundation 5 также позволяет быстро создавать прототипы, но мы можем ожидать дальнейшей оптимизации рабочего процесса в следующем выпуске.

2. Упрощенный процесс установки для версии Sass

Одна из самых удивительных вещей в среде Foundation - это то, что она построена на языке таблиц стилей Sass, что позволяет быстро настроить правила стиля по умолчанию для наших реальных потребностей.

Процесс установки Sass был немного пугающим для многих пользователей, поэтому новый основной выпуск будет получить упрощенный процесс установки для версии Sass. Это означает, что настройка Sass будет требуют гораздо меньше зависимостей чем раньше. Конечно, если вы предпочитаете ванильную версию CSS, вы все равно можете выбрать.

3. Новый, улучшенный набор настроек для максималистов

Помимо обычной версии Sass, Foundation 6 выйдет с Sass версия, которая предоставит разработчикам мощные возможности настройки.

ZURB, создатель Foundation, откроет свой собственный стек разработки для публики, в том числе свой собственный генератор статических сайтов, сервер прямой перезагрузки а также множество внутренних методов оптимизации включая интеграцию UnCSS для удаления неиспользуемых стилей и UglifyJS для сжатия JavaScript.

Таким образом, в основном мы будем иметь возможность работать в той же среде разработки, что и ZURB для внутреннего использования..

4. Уменьшенное время загрузки страницы

Команда Фонда столкнулась с некоторой конструктивной критикой, которая утверждала, что в большинстве проектов Фонда около 90% кода CSS не используется. Это относится не только к Foundation, но и к другим основным CSS-фреймворкам, таким как Bootstrap и TopCoat. Как часть их ответа, Zurb решил значительно сократить размер файла выводимого CSS, реализовав сокращение кода примерно на 40-50%..

Интересно отметить, что они пытаются отличить себя от Bootstrap, заявив "Основа не является каркасом, который будет иметь стилистические классы полей и отступов или раунд и радиусMsgstr "(для справки смотрите новые классы утилит Bootstrap 4 в нашем предыдущем посте).

5. Базовые стили, действующие как каркасы

Другая часть усилий по улучшению производительности заключается в создать базовый стиль, который выступает в качестве каркаса вместо окончательного дизайна. Это в первую очередь приводит к более легкой теме, но также имеет еще одно большое преимущество. Поскольку больше правил стиля будут перемещены в отдельные компоненты, у разработчиков будет возможность легче оформить их дизайн.

Надеюсь, это означает, что сайты на базе Foundation будут иметь менее похожий, стандартизированный вид, и дизайнеры будут иметь больше места для опытаEriment с красивым и уникальным солютомионы, которые опровергнут недавние опасения насчет скучной паутины.

6. Облегченный выборочный импорт

Foundation 5 позволяет разработчикам выбирать только те компоненты, которые они хотят использовать. Фонд 6 перенесет это усилие на следующий уровень перемещение функции выборочного импорта в файл Sass _settings.scss.

Таким образом, _settings.scss будет действительно универсальный файл конфигурации, с его помощью мы не только сможем настраивать такие функции, как ширина строки или шрифты по умолчанию, но и легко отказ от компонентов, которые нам не нужны. Если мы сделаем это, мы сможем добиться дальнейшего улучшения производительности.

7. Leaner и чище Sass

В процессе редизайна команда Фонда переосмыслила каждый аспект структуры, поэтому они также изменил способ использования языка таблиц стилей Sass. Они обнаружили, что в некоторых случаях они злоупотребляли Sass, что приводит к ненужное чрезмерное усложнение вывода CSS. С целью более гибкой и понятной кодовой базы они рационализировали свою структуру Sass..

В Foundation 6 мы можем ожидать снижения вложенности и специфичности, упорядоченные медиа-запросы (они слили повторяющийся код), и уменьшенный компонентный миксин. Последнее означает, что будет меньше компонентов, а оставшиеся будут иметь меньше параметров, что приведет к более простому и большему количеству логического кода.

Если вы любите миксины, не волнуйтесь, они есть у каждого компонента, просто они будут переработаны, чтобы стать более эффективными и полезными, чем в настоящее время..

8. Улучшенная сетка Mixins

При сокращении компонентов компонента, Foundation 6 будет идти с улучшенная сетка миксинов что позволит нам создать более настроенную сетку.

Зурб обещает, что мы сможем легко построить как сложную систему сетки как мы хотим, в том числе более сложные пользовательские ряды а также вложенные сетки, и возможность преобразования классов по умолчанию в семантическую разметку. Улучшенная сетка mixins сделает текущий создание сетки еще более интуитивно, гибко и быстро.

9. Бесшовная интеграция пользовательских плагинов JavaScript

В Foundation 5 в настоящее время есть много компонентов JavaScript, таких как классные модальные диалоги, всплывающие подсказки, липкая панель навигации, лайтбоксы и многие другие, которые нужны современному веб-сайту, но предстоящий основной выпуск позволит нам напишите наши собственные плагины JavaScript пользуясь ядром Фонда. Это огромный шаг вперед в обоих удобство и производительность.

В будущем мы сможем получить доступ к встроенным методам инициализации, переключать триггеры а также контрольные точки, и использовать все другие функции глобального JavaScript Фонда.

10. Полная доступность

Вероятно, самая удивительная особенность нового Foundation 6 заключается в том, что он будет полностью доступен. Каждый компонент и фрагмент кода будут иметь соответствующие атрибуты WAI-ARIA и основные роли. Более того, разработчики даже будут предоставляется с руководством пользователя около как использовать веб-стандарты a11y.

Поэтому, если мы хотим предоставить нашему клиенту полностью доступный веб-сайт, нам не нужно ничего делать, кроме создания нашего дизайна с помощью Foundation 6. Обратите внимание, что нам все еще нужно добавить соответствующие правила ARIA к нашим HTML-страницам самостоятельно, хотя грядущее руководство пользователя Zurb a11y наверняка облегчит процесс обучения.