/>
X

10 CSS resources for busy web designers

Ryan Boudreaux compiled a list of time-saving online CSS resources for busy web designers.
zd-defaultauthor-ryan-boudreaux.jpg
By Ryan Boudreaux on
1 of 10 Ryan Boudreaux/ZDNet

CSS Tricks is a web design community created by Chris Coyier. This resource includes forums, videos, downloads, code snippets, and articles on all things regarding styling, coding, and CSS.

 

2 of 10 Ryan Boudreaux/ZDNet

The Noupe Design Blog will satisfy your curiosity for what’s new and better; this site includes 29 articles on CSS in addition to articles on Ajax, general web design, Photoshop, tutorials on a variety of subjects, and a variety of articles on WordPress. Inspiring recent articles include: “Typographical Inspiration for the Weekend,” “Sexy Drop Down Menu w/ jQuery & CSS,” and recent CSS articles: “50 Free CSS/(X)HTML Templates,” and “15 CSS Habits to Develop for Frustration-Free Coding.

3 of 10 Ryan Boudreaux/ZDNet

While it is a part of their legacy site now, the New York Public Library still offers up the NYPL Online Style Guide, a basic set of its site's guidelines to set you straight on the basics of XHTML and CSS.

4 of 10 Ryan Boudreaux/ZDNet

The W3C CSS2 Specification (W3C Cascading Style Sheets Level 2 Revision 1, CSS 2.1) is a great resource for searching the defined standards for CSS.

5 of 10 Ryan Boudreaux/ZDNet

CSS Discuss: So you think you can just read some articles or books and be okay? Well, we all know that web development is about code that doesn't work at 1:00 AM while the rest of your team is fast asleep. You're going to need to talk to someone while scratching your head and finishing up that second pot of midnight coffee, so take your questions here, and answer someone else's question while you're waiting for your answer. The online CSS community has public and private forums, a wiki, and the free subscription gives you access to all their resources.

6 of 10 Ryan Boudreaux/ZDNet

For people who make websites, A List Apart CSS topic list includes many articles on the subject of separating presentation from structure and behavior. There are many tips and tricks on CSS drop-down menus, layouts, pull outs, print design, and style switching. This site offers even more topics than just CSS resources.

7 of 10 Ryan Boudreaux/ZDNet

CSS Zen Garden demonstrates the beauty of CSS web design. Known as the road to enlightenment, this website is a demonstration of what can be accomplished visually through CSS based web design. New submissions are still being accepted by the Zen Garden, and any graphic designer is welcome to participate in the project; however, new submissions to the site are added and updated on a sporadic basis. The site offers inspiration with the ability to view the designs that others have created with their own CSS implementations while keeping the content consistent. Here is one of the popular CSS design submissions, “A Walk in the Garden,” by Simon Van Hauwermeiren.

8 of 10 Ryan Boudreaux/ZDNet

As simple a tool as this may seem, the CSS Cheat Sheet V2 on the Added Bytes website is very a useful tool. The handy cheat sheet is available in PDF or PNG file formats and can be downloaded for free; however, the author Dave Child does ask that folks donate to his Amazon.com wish list! Included in the cheat sheet are selectors, pseudo-selectors, units, box model, and properties list. The site also offers the cheat sheet in Spanish, Portuguese, and Russian language versions, and in Apple dashboard widget and iPod content formats.

Dave also offers cheat sheets on other web development topics such as Python, Subversion, mod_rewrite, PHP, SQL Server, HTML, and others.

9 of 10 Ryan Boudreaux/ZDNet

Deploy* is a free open-source web application that allows designers to select the name of a project, and through a series of radio buttons, you can select the Doctype, whether you want a CSS reset or jQuery integration, and it creates a zipped, ready-to-use package with all specified files and folders. Deploy* saves time and organizes your code's parent folders and more.

10 of 10 Ryan Boudreaux/ZDNet

Blueprint is a CSS framework that uses a grid-like system including pre-defined typography, and includes a set of plug-ins, form styles, print styles, templates, and much more. The site offers great support including live demos, a Wiki, forums and discussion groups, a repository, and bug tracker. The zip file download is just under 4MB. However, it is not a silver bullet, and it's best suited for websites where each page may require its own design. Take a look at existing blueprint pages before deciding if the framework is right for you. You may also check out the test files in the tests directory, which demonstrates most of the features in Blueprint.

Related Galleries

Developer trends, zero-day risks, 5G speeds, and more: Tech research roundup
Person seated at a booth in a cafe looks at their phone and laptop.

Related Galleries

Developer trends, zero-day risks, 5G speeds, and more: Tech research roundup

10 Photos
Linux turns 30: The biggest events in its history so far
05-debian.jpg

Related Galleries

Linux turns 30: The biggest events in its history so far

31 Photos
Programming languages, 5G connections, remote-working strategies, tech spending, and more: ZDNet's research round-up
tiobejune20.jpg

Related Galleries

Programming languages, 5G connections, remote-working strategies, tech spending, and more: ZDNet's research round-up

10 Photos
Programming languages, IT spending, security incidents, and more: ZDNet's research round-up
picture2.png

Related Galleries

Programming languages, IT spending, security incidents, and more: ZDNet's research round-up

12 Photos
Top programming languages, 5G worries, cloud computing, and more: Research round-up
gsa-status-of-5g-by-country-end-2019.jpg

Related Galleries

Top programming languages, 5G worries, cloud computing, and more: Research round-up

12 Photos
Python skills boom, in-demand jobs, self-driving cars, and more: Tech research round-up
Younger employees won't stop tweeting at work according to new research zdnet

Related Galleries

Python skills boom, in-demand jobs, self-driving cars, and more: Tech research round-up

12 Photos
Julia programming language, cloud computing, cybersecurity worries: Research round-up
industrycloud-infographic.jpg

Related Galleries

Julia programming language, cloud computing, cybersecurity worries: Research round-up

12 Photos