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
-
Does using keywords in the top level domain make any difference to SEO rankingsq
i am setting up a new company and I need to register a domain name, is there any advantage to using the full name of the company in the domain name? I know it used to be important but does it still make a difference? If possible I would like to just use say the first letter of each of the 3 words instead what will amount to 23 letters but of it makes a difference then 23 letters it will have to be. Thanks
On-Page Optimization | | Ast98581 -
Keyword density or No. of Time keyword used
Now, I know that there is no set figure to be used here, whichever metric you are using and it will depend on the article and what is natural. However, lets suppose for a minute that we are taking a keyword in isolation, and I have a 2000 word article using the keyword 17 times and rank no. 3 in Google SERPS. The no. 1 slot uses the keyword 8 times but only has a 800 word article and only a B grade on the onpage ranker. Of course, there are off page factors as well, but just wondering what your thoughts are on whether you look at density or total keyword usage. It is easy to just write without think about keyword density or usage, but occasionally you end up using the keyword about 50 times, and it is then I have to actually think about it. Other articles I barely use the keyword because the article just writes itself and it works out fine, but these are generally shorter. With longer articles on my best converting pages, I can't help but think about it more and it ends up a little hit and miss.
On-Page Optimization | | TheWebMastercom1 -
Should stop words be used in titles? I'm aiming for natural title structure.
I have fully optimized on-page SEO for the following keyword (not really the one I use, but it can serve as an example): -personal driver in los angeles Even though "in" is a stop word, I prefer to have a natural (non-robotic) structure for the title - I do this by including "in". I believe that "personal driver los angeles" is too spammy and too robotic. Is this a good or a bad thing?
On-Page Optimization | | zorsto0 -
How to use canonical with mobile site to main site
I am pretty sure that the mobile version of the main site needs to be the same canonical link from what I understand. I am trying to find good docuementation that supports this. Even better if its from Google or Matt Cutts. I have a main domain like http://www.mydomain.com the mobile version of this is http://www.mydomain.com/m/ Should my canonical be rel="canonical" href="http://www.mydomain.com"/> for both these pages?
On-Page Optimization | | cbielich0 -
Why does Google no longer like our site?
Hey guys, I'm trying to figure out why the traffic and rankings have been plummeting on www.readprint.com. It's a collection of both public domain books and books on Amazon's store. If anyone can offer any pointers as to if it's duplicate content or ??? It used to get 300K visits/mo but has slowly been dropping over the last year. I appreciate anyone's expertise!
On-Page Optimization | | CoBraJones0 -
Problem with Plugin: Wordpress SEO by Yoast
Hi Hi, I'm using the Plugin "Wordpress SEO by Yoast". Unfortunatelly, this plugin generates a sourcecode looking like this: name='description' content='XXXXXX.'/> Seomoz can't read this and tells me, that my pages have no description. Google doesn't matter and reads it correct. Is there anything I can do about this? Many greetings André
On-Page Optimization | | waynestock0 -
Lots of links on homepage to internal pages with keyword rich anchor text - problem?
Hi, All! We have a new potential client, that when looking at his site with a tool, we noticed that the previous SEO company they worked with filled the homepage copy with lots of keyword-rich anchor text links pointing to different pages on the site - many links going to the same page, just with different keywords. These links are not indistinguishable in format from the other text, which is why we only noticed it with a tool. I certainly wouldn't recommend doing that to start with, but once all these links are there, would you recommend taking them down? Is there any conceivable chance it could help the site? Is there a significant reason to think it will harm the site? Or will it just be pretty neutral? In all that's been written (much by SEOMoz) about only the first link's anchor text counting, do subsequent links work like a no-follow in the sense that they are a waste of the link-juice of the page, or is it as if they aren't there at all? (And is "only the first link counts" still the most widely held theory, or have there been new developments since?) Thanks, All!
On-Page Optimization | | debi_zyx0 -
Are xml sitemaps still in use today?
Hi, Are you still using XML sitemaps today? If yes, does it bring any benefit to your website like faster indexing of webpages or better rankings? Are you using special features like video sitemaps or sitemap index files? Best regards, Tobias
On-Page Optimization | | Tobiask-1215731