Mobile app version of vmapp.org
Login or Join
Courtney195

: Yes and no. It's not recommended, but not for the reason you might think. Google and visitors like fast websites. If you have a lot of css, that means your download is slower, which in

@Courtney195

Yes and no. It's not recommended, but not for the reason you might think.

Google and visitors like fast websites. If you have a lot of css, that means your download is slower, which in turn makes your website slower, which in turn makes the experience of your site a little less smooth.

Also, the more selectors your use, the more complex you make your css, the more time the browser spends parsing the CSS creating the webpage -> slower -> less smooth experience.

Yes, it is a problem when you're sloppy with your css and use in-effective selectors.
No, it is not a problem when you're actually using the stylesheet in a normal way, as intended. Sometimes you simple need a lot of styling.



How to improve your css?

Optimize for your visitors, not for bots. Stick to that, and you fine long term plan.
Try to reuse as much as possible. This is why grid systems are popular, you can re-use the widths of those columns. Rely on the C of Css, being Cascading.
Do not inline style, because a browser can download and parse the css file which it's going through your DOM. Inline style blocks inverts this. Also, inline styling can't be cached, which you do want.
Improve your selectors, e.g. using #idForAnUniqueElement instead of .classForItemYouUseOnce. If not possible, try to limit it, if you e.g. have to use p{}, try #paragrapWrapElement p{} as selector.
Split your css in two. Provide a stylesheet in the head with CSS required on load (e.g. your root navigation items) so it can build a page quickly. The 2nd stylesheet near the end of your body so it can fill in the rest (e.g. subnavigation, because that becomes visible on hover, so you can parse later).

10% popularity Vote Up Vote Down


Login to follow query

More posts by @Courtney195

0 Comments

Sorted by latest first Latest Oldest Best

Back to top | Use Dark Theme