많은 css 파일과 그에 대한 질문에 이미 많은 질문이 있습니다. 솔루션은 적은 HTTP 요청으로 인해 하나를 사용하는 것입니다. 그건 내가 뭘 요구하는지 아니야 : P응답 속도가 빠른 디자인을위한 단일 CSS 또는 복수 - CSS 속도
나는 일반적으로 두 개의 CSS 파일을 사용합니다. 하나는 전체 사이트에 대한 것이고 다른 하나는 특정 페이지에 대한 덮어 쓰기입니다.
내 생각으로는 페이지의 모든 요소에 대해 평가해야하는 CSS 선택기가 많지 않으므로 CSS 속도를 높일 수 있습니다.
클라이언트가 하나 이상의 캐시 가능한 CSS 파일을 다운로드하도록 요구하면 브라우저 렌더링 속도가 빨라지는 것처럼 보입니다. 특히 큰 사이트 또는 각 페이지에 대해 많은 맞춤 CSS를 필요로하는 사이트의 경우.
한편 페이지 파일에는 추가 미디어 쿼리가 있습니다.
최상의 솔루션은 무엇이라고 생각하십니까?
기술적으로 정답은 서버의 성능, 방문자의 행동 및 디자인하려는 사이트의 종류에 대한 내부 정보가 필요하지만 하나 또는 여러 개의 CSS 문서를 사용하는 기본적인 이유를 설명하고자합니다.
모든 기본 웹 사이트에서 CSS 문서 하나를 고수 하겠지만 질문은 필요하지 않습니다. 그러나 사이트가 복잡 해지면 더 많은 문서를 사용하는 것이 합리적 일 수 있습니다.
사이트에 매우 다른 CSS 및/또는 마크 업이있는 여러 페이지 또는 캠페인 방문 페이지와 같은 일회용 페이지 또는 포럼이나 블로그 또는 이와 유사한 매우 다양한 유형의 콘텐츠가있는 사이트가있는 경우, 많은 문서에서 스타일 시트를 분리하는 것이 합리적이라고 생각합니다.
상기 스타일 시트의 구조는 다시 설계하는 사이트의 유형에 따라 달라집니다. 페이지 특정 규칙을 다른 규칙에 유지하면서 CSS, 일반 구조 및 미디어 쿼리 정규화/재설정과 같은 전역 규칙이 하나의 문서에있을 수 있습니다.
방문객이 실제 페이지를 방문 할 때까지 블로그 또는 캠페인 페이지에 필요한 모든 CSS를 다운로드하지 않고도 모든 페이지에 사용할 기본 구조를 캐시 할 수 있기 때문에 이는 의미가 있습니다.
다른 종류의 페이지가있는 큰 사이트가 있으면 다른 파일로 CSS를 분할해야한다는 것에 동의합니다. 그러나 나는 이것이 페이지를 기반으로해서는 안된다고 생각한다. 그것은 구성 요소에 만들어야합니다. CSS를 디자인 할 때 페이지를 모듈로 분할해야합니다. 모듈은 스타일과 미디어 쿼리를 포함해야합니다. 미디어 쿼리를 다른 파일에 저장하면 개발 속도가 느려집니다. CSS 생성자와 같은 것으로 끝날 수도 있습니다. 나는. 특정 모듈을 선택하고이를 파일과 서버로 결합하는 도구. 여전히 하나의 파일 만 있지만 내용이 다릅니다.
CSS 최적화를 위해이 도구를 확인하십시오. http://bem.info/tools/csso/
CSS 엔진이 빠릅니다. 끔찍한 퇴보 선택기를 사용하지 않는 한 그것에 대해 걱정하지 마십시오. 배포 성능 (적은 요청, 쓸모없는 선택기 제거, 압축)을 위해 CSS 파일을 자동으로 결합하는 도구가 있으므로 개발 목적으로 하나의 파일을 만들 필요가 없습니다 (하나의 파일이 악몽이기 때문에). – user2246674
저는 개인적으로는 적게 사용하지만 직장에서는 허용되지 않습니다. 우리는 css를 축소하지 않습니다 (그래서 클라이언트는 내가 추측 할 수있는 것을 수정할 수 있습니다). CSS 파일이 결합되어 3k 줄이 될 수 있습니다! 많은 페이지가 하나의 특정 페이지에 대해 CSS의 200-300 행을 갖습니다. 내가 한 다른 사이트에 비해 응답 속도가 느려 보입니다. 쓸모없는 선택기 제거? 자세한 내용을 알려 주실 수 있습니까? – Yamiko
나는 항상 CSS를 최소화하고, 클라이언트는 개발 버전에서 CSS를 수정할 수 있으며, 다음으로 제품 버전을 축소하고 밀어 넣는다. 클라이언트가 techie가 아닐 가능성이있다 [cssminifier] (http://cssminifier.com/) 최고 & 안전하게 귀하의 CSS를 minifies. – VenomVendor