Начална » Уеб дизайн » Фондация 6 - 10 невероятни нови функции

    Фондация 6 - 10 невероятни нови функции

    Разработчиците на фронт-фрейм фреймворда на фондацията не са просто седнали на лаврите си, докато екипът на Bootstrap работи по впечатляващото си ново издание. Миналата година те отидоха на страхотно World Tour, за да споделят своите знания със своите потребители и да ги питат как използват фондацията в реалната им работа..

    След като се върнаха на бюрата си, те обобщиха нуждите и желанията на своите потребители и започнаха да планират новото голямо издание на рамката: Foundation 6.

    Все още се развива, но плановете са много обещаващи. Предстоящите функции се фокусират върху три основни области: производителност, персонализация и достъпност. Нека сега разгледаме 10 от тези функции.

    1. Оптимизиран работен процес

    Въз основа на опита на своите потребители екипът на Фондацията разработи нов лозунг, а именно: “Прототип за производство”, за Фондация 6. Това означава нов, рационализиран работен процес, който ще позволи на дизайнерите и разработчиците да отиват направо от прототип към производство.

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

    2. Опростен процес на инсталиране за версията на Sass

    Едно от най-страхотните неща в рамката на Фондацията е, че е изградено с езика за стилове на Sass, като по този начин е възможно да бързо персонализирате правилата на стила по подразбиране спрямо нашите действителни нужди.

    Процесът на настройка на Sass беше доста смущаващ за много потребители, така че новата основна версия ще бъде получите опростен процес на настройка за версията на Sass. Това означава, че настройката на Sass ще бъде изискват много по-малко зависимости отколкото преди. Разбира се, ако предпочитате ванилната CSS версия, все още можете да изберете това.

    3. Нов стак за настройка на максималисти

    Освен обикновената версия на Sass, Фондация 6 ще дойде и със супа Sass версия, която ще предостави на разработчиците мощни опции за персонализиране.

    ZURB, създателят на Фондацията ще отвори своя собствен стак за развитие на обществото, включително и на собствените си статичен генератор на сайта, сървър за презареждане на живо и множество вътрешни техники за оптимизация включително интегриране на UnCSS за премахване на неизползвани стилове и UglifyJS за компресиране на JavaScript.

    Така че основно ще ни бъде позволено да работим в същата среда за разработка, която ZURB използва вътрешно.

    4. Намалено време за зареждане на страницата

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

    ИМИДЖ: Freepik.com

    Интересно е да се отбележи, че те се опитват да се разграничат от Bootstrap, като посочат "Фондацията не е рамка, която ще има стилистични класове марж и подложка или кръг и радиус(За справка вижте новите помощни класове на Bootstrap 4 в предишната ни публикация).

    5. Основни стилове, действащи като Wireframes

    Другата част от усилията за подобряване на изпълнението е да създайте основен стил, който действа като тел картон вместо краен дизайн. Това основно води до по-лека тема, но също така има и друго голямо предимство. Тъй като повече стилови правила ще бъдат преместени в отделни компоненти, разработчиците ще имат възможност да го направят по-лесно стил техния дизайн.

    ИМИДЖ: Freepik.com

    Надяваме се, че това означава, че сайтовете, базирани на Фондацията, ще имат по-малко подобен, стандартизиран вид, и дизайнерите ще имат повече пространство за expс красив и уникален разтворйони, които ще опровергаят последните притеснения за скучна изглеждаща мрежа.

    6. Улеснен селективен внос

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

    ИЗОБРАЖЕНИЕ: Zurb.com

    По този начин _settings.scss ще бъде a наистина универсален конфигурационен файл, тъй като не само ще можем да персонализираме функции като ширина на реда или шрифтове по подразбиране с негова помощ, но и лесно изключване на компонентите, от които не се нуждаем. Ако го направим, можем да постигнем по-нататъшно подобрение на производителността.

    7. По-стегнати и чисти Sass

    В процеса на редизайн екипът на Фондацията преосмисли всеки аспект на рамката, така че и те промениха начина, по който са използвали стиловия език на Sass. Открили са, че в някои случаи са използвали Sass, което води до ненужно свръхсложване на изхода на CSS. С цел да се създаде по-чиста и по-чиста кодова база в съзнанието им, те също така рационализираха своята структура Sass.

    ИЗОБРАЖЕНИЕ: Zurb.com

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

    Ако обичате миксините, не се притеснявайте, всеки компонент ще ги има, просто ще бъдат преработени, за да бъдат по-ефективни и полезни, отколкото в момента..

    8. Подобрени Grid Mixins

    Докато съкращавате компонентните миксини, Фондация 6 ще дойде подобрени мрежови смеси това ще ни позволи създайте по-персонализирана мрежа.

    ИЗОБРАЖЕНИЕ: Foundation.zurb.com

    Zurb обещава, че ние ще можем да лесно се изгражда като сложна мрежа както искаме, включително по-сложни потребителски редове и вложени мрежи, и възможността за конвертиране на класовете по подразбиране в семантична маркировка. Подобрените мрежови миксини ще направят тока създаването на мрежата е още по-интуитивно, гъвкаво и по-бързо.

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

    Фондация 5 в момента има много компоненти на JavaScript, като готини модални диалогови прозорци, подсказки, лепкава навигационна лента, лайтбоксове и много други, от които се нуждае съвременният уебсайт, но предстоящото голямо издание ще ни позволи напишете нашите приставки за JavaScript възползвайки се от ядрото на фондацията. Това е огромна крачка напред и в двете удобство и производителност.

    ИЗОБРАЖЕНИЕ: Foundation.zurb.com

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

    10. Пълна достъпност

    Вероятно най-удивителната черта на новата Фондация 6 е, че тя ще бъде напълно достъпна. Всеки компонент и кодов фрагмент ще идват с подходящите WAI-ARIA атрибути и роли. Освен това разработчиците дори ще бъдат предоставено с ръководство за потребителя относно как да се използват a11y уеб стандартите.

    ИЗОБРАЖЕНИЕ: Отдел на труда в САЩ

    Така че, ако искаме да предоставим на нашия клиент напълно достъпен уебсайт, не е необходимо да правим нищо друго, освен да изграждаме дизайна си с Фондация 6. Моля, имайте предвид, че все още ще трябва да добавете подходящите правила за ARIA в нашите HTML страници сами, въпреки че предстоящото потребителско ръководство на Zurb със сигурност ще улесни процеса на обучение.