Is it better to put all your CSS in 1 file or is it no problem to use 10 files or more like on most frameworks?
-
Is it better to put all your CSS in 1 file or is it no problem to use 10 files or more like on most frameworks?
-
Thanks a lot for this usefull info, it helped me understand this better.
-
Hi,
From a code management point of view - as Peter says it's very common practice to split your CSS into different files as they are then much easier to manage and maintain. You can use a tool like Yahoo's YUI compressor to minify - as Bradley says - and aggregate (merge) these files.
From a web performance point of view, less files does not always mean better performance. Web browsers used to only download up to 2 files per domain, but now it's pretty standard for them to support 6 or more. See a browser breakdown for Max Connections and Connections per hostname here: http://www.browserscope.org/?category=network&v=top. I wouldn't recommend trying to split across 6 files, but you might find that if you have one massive CSS file it will download quicker when split up.
There is another disadvantage to having a single, CSS file in that you're not making the most of web browser caching. Every time you change any CSS, all users will have to download the entire file again. Again this may not be a problem for you, but something to bear in mind.
My advice would be to point Google Pagespeed at your website's key pages and act on as much as the feedback as possible: https://developers.google.com/speed/pagespeed/. It is a fantastic resource and presents its findings very clearly.
George
@methodicalweb -
That's what I was thinking too.. Currently, most of my frameworks have 10 CSS files, which means you have 10 server requests. Page speed as in my eyes a very important factor, therefore this question...
-
You could split them up based on where they are needed but that would become complicated. The advantage of splitting CSS on a large site is really to better organise the functionality of the CSS, e.g. system.css.
Peter
-
For a production environment, I would suggest having one minified CSS file. This will reduce file size (minifying) and server requests (1 file as opposed to 10). This will help reduce page load time.
Of course, on your staging environment, or in an archive of the website, it would be best to have your stylesheets broken down into an easier to manage system. That might mean multiple CSS files, it might not - it's up to you to manage.
-
Thanks for your answer!
It makes sense, because on large sites you will need different styling on different type of pages? So when you would put it all in 1 file, al this CSS would be loaded on ALL pages, while it's only needed on some particular?
Or what's the advantage here?
-
It really depends on how big your site is and how complex your CSS. On a small site or if it has minimal CSS one is perfectly adequate. On a larger site with lots of pages and CSS it makes sense to break down the the CSS around their function.Peter
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
Is this blog running on the Genesis Framework?
Hi all, WordPress isn't my area of specialty in terms of themes and identifying what a blog might currently be using. Here's the link: http://www.pens.com/blog I've had one developer tell me this blog is on the Genesis framework and another one told me it is not. Can someone weigh in here and also give me some tips on how to know one way or the other? If it is not on the Genesis Framework, can you provide any helpful links/tutorials on how to get this blog onto the Genesis Framework? We want to be able to use Yoast SEO and apparently our current theme will not allow us to do so. Thanks in advance! Dana
On-Page Optimization | | danatanseo0 -
Using the Same Word in Every URL
Just looking to get some opinions on this. Some coupon sites use "coupon" in all of their URLs - this is a practice I would avoid, as to me it is a little spammy. For example:
On-Page Optimization | | vanessakohl
.com/amazon-coupons/
.com/ebay-coupons/
.com/walmart-coupons/
... and so on for thousands of other brands. I don't think this is necessary, as Google will understand from the content, backlinks and the domain name (including the word "coupon") that brand pages are coupon-focused. Any other thoughts on this?0 -
Robot.txt file issue on wordpress site.
I m facing the issue with robot.txt file on my blog. Two weeks ago i done some development work on my blog. I just added few pages in robot file. Now my complete site seems to be blocked. I have checked and update the file and still having issue. The search result shows that "A description for this result is not available because of this site's robots.txt – learn more." Any suggestion to over come with this issue
On-Page Optimization | | Mustansar0 -
Advantage of using LocalBusiness rich snippets?
I am working on a website that has company profile pages. What are the advantages of using LocalBusiness rich snippets for profiles?
On-Page Optimization | | calf0 -
Is it better to create more pages of content or expand on current pages of content?
I am assuming that one way of improving the rankings of current pages will be to create more content on the keywords used... should this be an expansion of the content on current pages I am optimising for a keyword or is it better to keep creating new pages and if we are creating new pages is it best to use an extension of the keyword on the new page – for example if we are optimising one page for ‘does voltage optimisation work’ would it then be worth creating a page optimised for ‘does voltage optimisation work in hotels’ for example and so on? I am guessing maybe both might help, this is just a question I have had from one of my clients.
On-Page Optimization | | TWSI1 -
To use or not to use: Keywords with locations
Hello there. I work for a marketing agency that manages SEO campaigns for a variety of small businesses in South Florida. Let's say we have a client that sells cheap shoes at their store location. Obviously, we want to show up in Google rankings for search terms like "cheap shoes south florida" or "cheap shoes miami." Now, my question is, when optimizing a website's content for various keywords, is it really necessary to include keywords with the location (which are often awkward for both reading and writing purposes)? Ideally, I'd prefer to have text that always reads as naturally as possible. Text like this is just an eyesore: Welcome to ExampleSite.com, home of the best cheap shoes Florida. We offer all kinds of cheap shoes Boca Raton. Your whole family doesn't have enough fingers and toes to count how many cheap shoes West Palm Beach we have in stock! Contact us to ask about our cheap shoes Miami discounts today! Olé!" What say you? Is there a way to work around ugly SEO text like this while still effectively ranking for GEO terms? Thanks!
On-Page Optimization | | BBEXNinja0 -
Page authority 1 for new URLs
Hi There Quite a beginner question. I have changed url structure last week and is already avaliable on google.What i find strange is that the PA reported by SEOMOZ is 1 and there's no google cache. If the page has to crawled yet, why it's avaliable on google index already? Dario
On-Page Optimization | | Mrlocicero0 -
Hyphenated keyword rich domains - is a hyphenated .co.uk better than a non-hyphenatedlesser TLD such as .org?
Hey there, Would anyone be kind enough to share their experience of using keyword rich hyphenated domains. Are they as effective at tanking as non hyphenated domains? i.e would it be better to get a lesser non-hyphenated TLD such as .org for example rather than a hyphenated co.uk?
On-Page Optimization | | Wallander0