A Mega Guide to Learning and Referencing CSS for WordPress: 150+ Resources

CSS Resources

If you’re new to CSS, it may seem like an overwhelming language to learn, but once you get into it, it’s quite manageable and pretty easy.

For the seasoned pro, it can be handy to have a list of all the selectors and properties since there are so many to remember and especially since CSS is a large part of Bootstrap and web design in general.

If you want to start learning about CSS or you want to brush up on your existing skills, here are some great resources:

For those who are fans of learning by doing, these are for you:

If you learn best in a structured environment, here are some free and premium courses:

There are many great reads out there that are a great and affordable way to learn just about everything you need to know. If you grab one or more of the books on this list, they also double as a quick reference at arm’s length.

Video tutorials can be helpful since you’re guided by an expert step-by-step. Sometimes it’s just easier to have visuals. Here are some great video tutorials and courses on YouTube worth exploring:

If you’re looking for sites you can quickly reference when you’re stuck, here are some favorites:

SASS Resources

Simplifying your CSS with SASS means you can style your site faster. Here’s several guides to help you get there:

Here are some tutorials to practice what you learn:

Seeing an expert show you the ropes through video is the next best thing to having them right in the room with you. Here’s some of the best SASS video tutorials and courses on YouTube:

Guides and tutorials are fantastic, but if you need more information and guidance, a course may be more your speed:

LESS Resources

SASS is generally more popular, but there are lots of diehard LESS fans out there.

These helpful guides and tutorials should provide you with all the info you need to learn LESS from scratch or brush up on your skills. Either way, you should be able to decide which side of the fence you’re on.

Bootstrap Resources

There may not be many guides and tutorials in this list, but don’t let size fool you because these resources are worth their weight, er, file size in gold.

They include everything you need to know to start creating responsive sites with Bootstrap:

If you need a detailed guide that’s close by at all times, these books are great choices:

If you find learning through articles and books isn’t as helpful as having a teacher guide you through the material, here are some courses you may find helpful:

Here are some great video tutorials and courses on Bootstrap created by talented people on YouTube:

People of Note

There are so many wonderful web developers out there, it’s difficult to pick just a handful. That’s why I squeezed in a few more since following the right people on Twitter can bring you a constant stream of useful information.

  • Sara Soueidan – Front-end developer, writer and speaker. Author of the Codrops CSS Reference.
  • Ana Tudor – Developer and designer who also writes CSS posts for many sites such as CSS-Tricks.
  • Snook – Designer, developer, writer and speaker who also wrote SMACSS.
  • Codrops – Dedicated to providing useful tutorials, insightful articles, creative inspiration and free resources for web designers and developers.
  • CSS-Tricks – A curated web design community surrounding CSS.
  • Lea Verou – HCI researcher, author of CSS Secrets (listed here) and on staff at the W3C.
  • Harry Roberts – Speaker, author and consultant front-end architect for Google, UN, Etsy, Kickstarter, BBC and more.
  • Nicole Sullivan – Web developer, principal engineer and engineering manager.
  • Hakim El Hattab – JavaScript coder and CSS tweaker as well as the co-founder of @Slides.
  • Mathias Bynens – Web standards fanatic specializing in JavaScript, HTML, CSS, HTTP, performance, security, Bash, Unicode and OS X.
  • Peter-Paul Koch – Mobile platform strategist, consultant, writer, conference organizer and speaker, blogger,  trainer and browser compatibility expert.

Must-Have Resources

In the world of the Internet, things change so fast before you can blink twice. That’s why I’ve compiled a special list of sites for you to bookmark so you can stay up-to-date on the latest and greatest.

Where to Learn Even More

When you’re ready to learn more and take the next step, you have many choices. These sites are all fantastic places to enroll in affordable courses to advance your knowledge and maybe even your career.

  • Treehouse – Quality courses on web design and development for individuals and businesses that are trusted by top companies.
  • Lynda.com – The creator of LinkedIn founded this tech education site with courses ranging from photography and music to web development and business. Since top companies are already on board, it shouldn’t be difficult to find a job after completing courses here.
  • SitePoint – There are tons of great guides for CSS and beyond here. It’s practically a one stop shop and a great reference for code.
  • SitePoint Premium – Formerly called Learnable, this is the home of Sitepoint’s courses on web design and development. It’s a trusted source for learning everything you need to get started or advance in your career.
  • Complete Web Developer Course (Rob Percival) – A down to earth course on Udemy for beginners on web design and development. A former teacher, Rob Percival does an excellent job making programming easy to understand.
  • Codecademy HTML and CSS – This is a quality HTML and CSS course.. What sets Codecademy apart from other course sites is their courses are interactive and they consider themselves to be modern in approach in comparison to the traditional school system in the US.
  • Coursera – There are free web development and design courses available as well as affordable course bundles created by real universities such as Brown, Harvard, Standford and many more. For a fee, you can enroll in a course bundle and receive a certificate upon completion. While it’s not an equivalent to a degree, it still looks great on a resume since your education would be from a highly trusted and recognized source.
  • Udacity – Google created this education site that provides both free and premium courses. You can also enroll for their nanodegree programs in web development and programming that are almost as good as a degree since it’s enough to qualify for a high-paying job at top tech companies around the world including Google.
  • CodePen – A community for front-end developers to showcase their work, get feedback and build a test case for bug testing. There are also so many really cool examples of what CSS can do, it’s downright inspirational.

Need Help?

“Pobody’s Nerfect.” Sometimes you may find you need an extra hand when some code doesn’t work out the way you had hoped.

Luckily, there are a couple excellent sites you can go to for peer advice and help for free:

And if you’re a WPMU DEV, don’t forget you can always ask our awesome support team for help with any CSS conundrums.

Source:  Jenni McKinnon, wpmudev  A Mega Guide to Learning and Referencing CSS for WordPress: 150+ Resources – WPMU DEV (http://premium.wpmudev.org/blog/css-mega-guide/)


%d bloggers like this: