기초 6 - 10 놀라운 새로운 기능
Bootstrap 팀이 인상적인 새 주요 릴리스 작업을 수행하는 동안 Foundation 프런트 엔드 프레임 워크 개발자는 자신의 월계관에 머물러 있지 않았습니다. 작년에 그들은 멋진 월드 투어를 통해 자신의 지식을 사용자들과 공유하고 그들이 실제 작업에서 재단을 어떻게 사용하고 있었는지 질문합니다.
그들의 책상으로 돌아온 후, 그들은 사용자들의 요구와 소망을 모으고 프레임 워크의 새로운 주요 릴리스 계획에 착수했습니다 : Foundation 6.
아직 개발 중이지만 계획은 매우 유망합니다. 다가올 기능은 3 가지 주요 영역에 중점을 둡니다. 성능, 사용자 정의 가능성 및 액세스 가능성. 이제이 기능 중 10 가지를 살펴 보겠습니다..
1. 간소화 된 워크 플로
재단 팀은 사용자의 경험을 바탕으로 새로운 슬로건 즉 “프로토 타입에서 생산까지”, Foundation 6을위한 것입니다. 이것은 디자이너와 개발자가 프로토 타입에서 생산으로 곧장 간다..
새로운 Foundation 6의 목적은 유연하고 쉽게 사용자 정의 할 수있는 프레임 워크를 제공하여 아주 처음부터 깨끗하고 의미있는 코드를 작성하십시오.. 현재 버전 인 Foundation 5는 빠른 프로토 타이핑도 가능하지만 추가 워크 플로우 최적화 기대 다음 릴리스에서.
2. Sass 버전의 설치 과정 간소화
Foundation 프레임 워크에 대한 가장 멋진 점 중 하나는 Sass 스타일 시트 언어로 제작되었으므로 실제 스타일에 맞게 기본 스타일 규칙을 신속하게 사용자 정의 할 수 있습니다..
Sass 설정 과정은 많은 사용자들에게 다소 위협적 이었으므로 새로운 주요 릴리즈는 Sass 버전을위한 간단한 설치 과정을 얻으십시오.. 이것은 Sass 설정이 의존성이 훨씬 적다. 전보다. 물론 바닐라 CSS 버전을 선호하는 경우에도 해당 버전을 선택할 수 있습니다..
3. Maximalists를위한 새로운, Upped 설치 스택
정규 Sass 버전 외에도 Foundation 6은 멋지게 나옵니다. 강력한 사용자 정의 옵션을 개발자에게 제공 할 Sass 버전.
ZURB, 재단 창립자는 자체 개발 스택을 공개합니다. 정적 사이트 생성기, 라이브 리로드 서버 과 많은 내부 최적화 기술 사용되지 않는 스타일을 제거하기위한 UnCSS의 통합 및 JavaScript 압축을위한 UglifyJS.
따라서 기본적으로 우리는 ZURB가 내부적으로 사용하는 동일한 개발 환경에서 작업 할 수있게 될 것입니다..
4. 페이지로드 시간 감소
Foundation 팀은 대부분의 Foundation 프로젝트에서 CSS 코드의 90 %가 사용되지 않는다고 주장하는 건설적인 비판에 직면해야했습니다. 이는 Foundation뿐만 아니라 Bootstrap 및 TopCoat와 같은 다른 주요 CSS 프레임 워크에서도 마찬가지였습니다. 답장의 일부로 Zurb은 약 40-50 %의 코드 축소를 구현하여 출력되는 CSS의 파일 크기를 크게 줄이기로 결정했습니다.
흥미로운 점은 부트 스트랩과 별개로 "기초는 문법 클래스의 여백과 안쪽 여백 또는 반경과 반지름을 갖는 프레임 워크가 아닙니다."(이전 게시물의 Bootstrap 4의 새로운 유틸리티 클래스 참조).
5. 와이어 프레임 역할을하는 기본 스타일
성과 개선 노력의 다른 부분은 최종 디자인 대신 와이어 프레임 역할을하는 기본 스타일 만들기. 이것은 주로 더 가벼운 주제로 이끌지 만 또 다른 큰 이점을 가지고 있습니다. 더 많은 스타일 규칙이 개별 구성 요소로 옮겨지면 개발자는 더 쉽게 스타일을 디자인 할 수 있습니다..
바라건대 재단을 기반으로 한 사이트가 비슷하고 표준화 된 외관이 적다., 디자이너는 더 많은 공간을 확보해야합니다.아름답고 독창적 인 솔트와의 eriment지루한 웹에 대한 최근의 걱정을 반박 할 이온.
6. 촉진 된 선택적 수입
Foundation 5는 개발자가 사용하려는 구성 요소 만 선택할 수있게 해줍니다. Foundation 6은 다음 단계로이 노력을 기울일 것입니다. 선택적 가져 오기 기능을 _settings.scss Sass 파일로 이동.
이렇게하면 _settings.scss는 진정한 보편적 인 설정 파일, 도움으로 행 너비 또는 기본 글꼴과 같은 기능을 사용자 지정할 수있을뿐만 아니라 쉽게 우리가 필요로하지 않는 구성 요소를 선택 해제. 그렇게하면 성능을 더 향상시킬 수 있습니다..
7. 더 깔끔하고 깨끗한 웅덩이
재 설계 과정에서 재단 팀은 프레임 워크의 모든 측면을 다시 고려하여 Sass 스타일 시트 언어를 사용한 방법을 바 꾸었습니다.. 그들은 어떤 경우에는 Sass를 지나치게 사용하여 CSS 출력의 불필요한 과장 사용. 마음 속에 희박하고 깨끗한 코드 기반을 목표로 Sass 구조를 합리화했습니다..
Foundation 6에서 우리는 중첩 및 특이성 감소, 능률적 인 미디어 쿼리 기대 (그들은 반복적 인 코드를 병합했다.) 축소 된 컴포넌트 믹스. 후자는 콤포넌트 믹스가 적어지고 나머지는 더 적은 매개 변수를 가지므로 더 간단하고 논리적 인 코드로 이어질 것임을 의미합니다
믹스 인을 좋아한다면 걱정하지 마십시오. 모든 구성 요소에는 여전히 구성 요소가 있습니다. 현재보다 더 효율적이고 유용하게 재 설계 될 것입니다..
8. 개선 된 그리드 믹스
구성 요소 믹스를 줄이는 동안 Foundation 6은 향상된 그리드 믹스 우리가 더 맞춤 설정된 표 만들기.
Zurb은 우리가 복잡한 그리드 시스템으로 쉽게 구축 우리가 원하는대로 보다 정교한 맞춤 행 과 중첩 된 격자, 기본 클래스를 의미 론적 마크 업으로 변환하는 기능. 개선 된 그리드 믹스는 현재 더욱 직관적이고 유연하며 빠른 그리드 생성.
9. 맞춤 자바 스크립트 플러그인의 완벽한 통합
Foundation 5에는 현재 멋진 모달 대화 상자, 툴팁, 끈적 거리는 탐색 모음, 라이트 박스 및 현대 웹 사이트에서 필요로하는 많은 JavaScript 구성 요소가 많이 포함되어 있지만 향후 주요 릴리스를 통해 맞춤 자바 스크립트 플러그인 작성 Foundation 코어를 활용합니다. 두 가지 모두에서 커다란 진보입니다. 사용자 편의 및 성능.
미래에 우리는 내장 된 초기화 메소드에 액세스, 트리거 토글 과 중단 점, Foundation의 전역 JavaScript의 다른 모든 기능을 활용할 수 있습니다..
10. 충분한 접근성
아마도 새로운 재단 6의 가장 놀라운 특징은 완전히 접근 할 수 있다는 것입니다. 모든 구성 요소 및 코드 스 니펫에는 적절한 WAI-ARIA 속성 및 랜드 마크 역할이 제공됩니다. 더욱이 개발자는 사용자 가이드와 함께 제공 약 a11y 웹 표준 사용 방법.
따라서 고객에게 완벽하게 액세스 할 수있는 웹 사이트를 제공하려는 경우 Foundation 6을 사용하여 디자인을 작성하는 것 외에는 다른 작업을 수행 할 필요가 없습니다. 우리 자신의 HTML 페이지에 적절한 ARIA 규칙을 추가하십시오., 비록 Zurb 's a11y 사용자 가이드가 반드시 학습 과정을 촉진 할 것이지만.
