Now days I am in the process of learning CSS (Cascading Style Sheets) almost all web sites are using this technology. I have read few books now and I still believe that I am slightly lost when it comes time to applying what I know from scratch.
Over the past several months, I am working as a freelancer and keeping a list for myself of potentially amazing tools and applications (most web based – all of them free) to make my CSS web design experience a snap. I purposely cut out over 30 options from this list, because these are the most user friendly and simplest to use. Enjoy and I hope you learn and benefit from the following list…
Best CSS Tools and Resource
1. Em Calculator
2. CSS Text wrapper
The CSS Text Wrapper allows you to easily make HTML text wrap in shapes other than just a rectangle. You can make text wrap around curves, zig-zags, or whatever you want.
JotForm is a great Web based WYSIWYG form builder. You can select a form type(Contact Us, Satisfaction Survey, Job Application, Suggest Website , Membership Registration, Party RSVP , Wedding Attendance, Reservation, Submit Product, and others). Your new form will be created with the default fields on the selected form.
Typetester is an online application for comparison of the fonts for the screen. It
5. CSS Tab Designer
CSS Tab Designer is a unique and easy to use software to help you design CSS-based lists and tabs visually and without any programming knowledge required. With the CSS Tab Designer, you can quickly design your list visually, choose from a variety of styles/colors (60+ different designs/colors supported), generate strict XHTML compliant code.
List-O-Matic generates CSS-styled navigation menus based on list items.
List-O-Rama! allows you to generate nice CSS inline menus in seconds. Just walk through the wizard and insert the text of the links, choose the vertical or horizontal menu, pick the design and click on finish. The code is automatically generated and inserted in your page.
8. CSS Toolbox (Desktop – Windows)
Free CSS Toolbox includes a number of tools for fast-tracking and enhancing the development of style sheet code, such as an advanced CSS Formatter and CSS Validator.
9. HTML PHP CSS Website Template Maker
CSS template generator creates a two column layout with both a header and a footer.
10. Position is Everything
1-3 Columned Page Maker – Broken down into sections with all the necessary variables.
11. AHFB 2000: CSS Generator
Make simple cascading style sheets (everything but columns and layout).
12. Boxed CSS
Boxed CSS is a free website that offers you CSS grids : they are free to be downloaded and modified, without a linkback required.
13. Blue Print CSS
Blueprint is a CSS framework, which aims to cut down on your CSS development time. It gives you a solid CSS foundation to build your project on top of, with an easy-to-use grid, sensible typography, and even a stylesheet for printing.
14. CSS Layout Generator
This generator will create a fluid or fixed width floated column layout, with up to 3 columns and with header and footer. Values can be specified in either pixels, ems or percentages.
Simple layout options (Not that much options in my opinion).
16. YAML Building
A tool for layout development of YAML based CSS Layouts (YAML = Yet Another Muliti-Column Layout).
17. CSS Grid Calculator
Use the CSS Grid Calculator to quickly visualize page layout and draw grids in a variety of ways.
18. CSS Fly
CSSFly is a web 2.0 tool for easy editing websites direct and in real-time in your browser. Simply edit the (X)HTML-code and the external Style-Sheet files.
19. HTML Kit
Not exactly a CSS tool (though you can edit CSS with it) but I use it to edit the HTML pages that I design so I can check if my CSS are correct. This is also a Freeware.
Optimizer and Tweaking and Validators:
Powerful CSS optimizer and formatter. Basically, it takes your CSS code and makes it cleaner and more concise.
21. CSS Tidy (Download/Open Source)
CSSTidy is an open source CSS parser and optimizer.
22. CSS Optimizer and Tweaking
23. CSS Tweak! 1.0 mac free download
Simple, quick, and easy, CSS optimization with the drop of a file. CSS Tweak gives you a number of optimization options.
24. W3’s CSS Validator
Check Cascading Style Sheets (CSS) and (X)HTML documents with style sheets.
Additional Inputs and Options
25. Rounded Cornr
Generate HTML/CSS code and images for rounded corners.
26. Spiffy Corners
27. The Box Office
Lets you wrap/float/contour text around freeform images using CSS for usage in (X)HTML pages.
28. CSS Menu Maker
Making professional CSS menus simple, for the average webmaster.
29. CSS Scrollbar Color Changer
The CSS for the scrollbars that you create is displayed automatically below.
30. CSS Sprite Generator
Generate CSS Image Sprites.
Now its time to ready for a test and get Certification and Before taking the exam let have a look on CSS Examples – who can better teach you CSS than the W3C guys?
Take the test if you think you have the basic understanding of CSS
If you have your favorite CSS tool that’s not in the list? Drop it in comments.