Web design
Raiting:
2

7 Useful Tools for Web Developer and Designer


imageHere are seven tools that can significantly simplify the life of a web developer, coder or designer.






1. Wordmark.it

image

This is a tool for selecting fonts. Wordmark.it allows you to see how a sentence looks like with all the fonts installed on the computer. It downloads quickly and has convenient filters. Unfortunately, there is no way to set the background color and letters.


2. Spritebox

image

Spritebox is a tool that helps the web designers create CSS classes and IDs from the sprite image. It uses the background-position property to align some areas of a sprite image into block elements of the web page. This tool was created with the combination of JQuery, CSS3 and HTML5.

3. CSS3 Generator

image

CSS3 Generator helps efficiently to use CSS3 features: it displays a list of available CSS3 styles, generates a cross-browser code for them, and notifies what browsers support these styles.

4. ProCSSor

image

ProCSSor is a powerful tool for checking / formatting css-styles. It empowers to turn CSS into something more compelling with a minimum of effort. You just load your styles.css, choose the formatting settings and get a nice valid css-code.

5. Super Conversion Button

image

Super Conversion Button is a tool that helps quickly to create design buttons. You just need to choose the styles, colors, text labels, etc.

6. Frame Box

image

Frame Box is a tool that helps quickly to create the so-called sharing wireframes. It is very useful thing for new web designs or web interfaces.

7. jsFiddle

image

jsFiddle is a kind of playground for the web developers. This tool might be used in many different ways, such as an online editor for snippets that is built from HTML, CSS and JavaScript. The code can then be shared with others, embedded on a blog, etc.

I hope this article will be useful!
Killer 3 september 2012, 12:25
Vote for this post
Bring it to the Main Page
 

Comments

0 Debich April 19, 2013, 17:53
One more tool, to help with eye tiredness
http://eyepitstop.com

Leave a Reply

B
I
U
S
Help
Avaible tags
  • <b>...</b>highlighting important text on the page in bold
  • <i>..</i>highlighting important text on the page in italic
  • <u>...</u>allocated with tag <u> text shownas underlined
  • <s>...</s>allocated with tag <s> text shown as strikethrough
  • <sup>...</sup>, <sub>...</sub>text in the tag <sup> appears as a superscript, <sub> - subscript
  • <blockquote>...</blockquote>For  highlight citation, use the tag <blockquote>
  • <code lang="lang">...</code>highlighting the program code (supported by bash, cpp, cs, css, xml, html, java, javascript, lisp, lua, php, perl, python, ruby, sql, scala, text)
  • <a href="http://...">...</a>link, specify the desired Internet address in the href attribute
  • <img src="http://..." alt="text" />specify the full path of image in the src attribute