Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Nicole Tamminga
18,741 PointsIs there a site that proofreads code for quality?
I am practicing my new html and css skills with a web page project. Everything works fine. But I want to make sure I am using good code habits. Does anyone know of a site that I can upload my code to check for quality (i,e. organization, sequencing, proper indentation, etc.)?
5 Answers
James Barnett
39,199 PointsThere isn't one site however, I'd recommend 5 sites to run your CSS through before pushing it to production.
Quality Code
- Check your CSS is valid
- Check your CSS is accessible and well written
- Code Quality Check
- Check that your page is fast
- Fix your indentation
- Note 1 - Some CSS3 might be flagged as "invalid" because the CSS3 spec is in flux. Check the CSS3 examples section to make sure your rules are current valid CSS.
- Note 2 - Most prettifiers kinda suck with CSS3 this one actual works great straight out of the box (if you will)
If you want to learn more about CSS coding styles and organizing your CSS I'd recommend you check out this resources.
CSS not being a programming language per se has long suffered from conventions that are common in the programming world at large, so here are some thoughts some people have put together. I'd recommend you take Google's CSS coding style & the part about DRY as strong suggestions and everything else you read for some perspective.
Coding Standards
Proper Organization
- DRY Code and Grouping and Nesting Selectors
- Organized Style Sheet
- Create Maintainable Code with a CSS Styleguide
CSS3 examples
Stone Preston
42,016 Pointsthe quality you mentioned (organization, sequencing, proper indentation) is really just a matter of personal preference and would be hard to check (although something may exist). There are sites that will check your code for validity for you such as the W3 validator.
The best way to keep your code clean is to come up with some personal standards (indent 2 spaces, put 2 new lines between different sections of your site, etc) and adhere strictly to them to keep your code uniform and neat. There isnt really an industry wide standard of this is what your code needs to look like with this many spaces between each line, this many comments, this needs to come before that etc. Its up to you and whats easier for you to read and make sense of.
Nicole Tamminga
18,741 PointsThanks. I appreciate the feedback. Another question. Is there some best practice in css as to the order of your styles. Like, should you list all the styles sequentially in the order of use, or group styles (like all class selector styles in one chunk, all id's in another, headers in another)?
Stone Preston
42,016 Pointswell remember that the styles cascade so styles that come after another could potentially override one before it. On treehouse ive noticed most of the teachers keep general site wide styles/colors together, then keep styles for individual pages in groups as well.
Nicole Tamminga
18,741 PointsThat is good to know. Thank you for the tip!
Nicole Tamminga
18,741 PointsJames, thanks so much for the resources. I am adding them to my list. I appreciate your suggestions!
Nicole Tamminga
18,741 PointsNicole Tamminga
18,741 PointsThank you!