Now that WordPress handles plugins a little bit better, I felt it was time to write my own plugin. This plugin is derived from many wasted hours trying to format the default wordpress tag cloud to make it look uniform or list style. So I quickly adapted some code to make an easy plugin for dynamic, flexible wordpress tags using the widgets. Documentation and changelog to follow, but for now check it out and help provide some feedback and code if you can.
Learning JavaScript
If you’re a beginner it can be a bit confusing separating information and learning the format and structure of Javascript. If you have NO programming experience I would recommend webteacher to get started with learning javascript. You can also skip the learning process and jump right into some powerful code by using a pre-built library such as jQuery, prototype or scriptaculous. I recommend one of these two JS libraries because they focus on making complex javascript programming make since to the average developer with little to no programming experience. Particle Tree can help you out with some great guides and tutorials for using the prototype library and Learning jQuery rocks for starting out.
Tagged javascript, jquery, prototype, Web Development
jQuery Snippets
I was going through my Coda clips today, and realized I have a lot of little one-off plugins and snippets I use often on projects and realized that others might enjoy clipping these as well.
As an aside from this, I’m curious.. what IDE do you use and do you take advantage of a built in snippet manager or do you use some web based service instead?
Tagged javascript, jquery
Web Designer Tools
Color Inspiration
Colour Lovers
Colour Lovers is a social resource to share and gather color trends and patterns. There are over a million color names, thousands of color palettes and patterns, comments and ratings as well as interviews and resources from topnotch designers.
Color Combos
Color Combos allows you to browse thousand of different colors combinations for getting inspired for your upcoming design. Color schemes can be browsed by individual colors. This is a great tool to store pallets as well as find colors to match ones you may already be working with.
Icon and Favicon Tools
Icon Finder
Iconfinder provides high quality icons for web designers and developers in an easy and efficient way. You simply type in a keyword into the search box and Iconfinder fetches beautiful icons which you can use royalty free.
ConvertIcon
Convert Icon is a free online service that allows you to upload an image and will return an .ico file which can be used for the little bookmark icons in your browsers address bar and folders. These icons are subtle, but very important and helpful in establishing brand and impression to your users. You can also use Dynamic Drive’s really simple FavIcon Generator.
Font Tools
Font Burner
Font Burner lets you search for fonts that you can embed in your site. You can embed the font you’ve chosen on your web pages by copying-and-pasting the code they provide (which uses sIFR).
My Fonts – What The Font?!
Ever wanted to find a font just like the one used by certain publications, corporations, or ad campaigns? Well now you can, using our WhatTheFont font recognition system. Upload a scanned image of the font and instantly find the closest matches in our database. If WhatTheFont can’t figure it out, you can submit your image to the WhatTheFont Forum where cloak-draped font enthusiasts around the world will help you out!
Font Struct
FontStruct is a free font-building tool brought to you by the world’s leading retailer of digital type, FontShop. FontStruct lets you quickly and easily create fonts constructed out of geometrical shapes, which are arranged in a grid pattern, like tiles or bricks. You create ‘FontStructions’ using the ‘FontStructor’ font editor. Once you’re done building, FontStruct generates high-quality TrueType fonts, ready to use in any Mac or Windows application. You can keep your creations to yourself, but we encourage users to share their “FontStructions”. Explore the Gallery of fonts made by other FontStruct users and download them or even copy them and make your own variations.
Typechart
Typechart lets you quickly evaluate an assortment of web typography. Once you’ve discovered the font you like, you can use the Get CSS button to obtain the style rules for it.
Typetester
The Typetester is an online application for comparison of the fonts for the screen. Its primary role is to make web designer’s life easier. As the new fonts are bundled into operating systems, the list of the common fonts will be updated. Typetester’s code structure is XHTML, styled with the finest CSS and driven by the JavaScript for manipulating DOM structures. Typetester will not work without JavaScript enabled.
Web Developer Tools
As a web developer it’s very important to have tools that will help you streamline your workflow and be as productive as possible.. all while saving precious RAM and coin by not having to purchase bulky application to help you do some of your daily tasks. Thanks to many communities and websites, we have online applications to lend us a hand. Here’s a list of great applications that will help you along:
Encode/Decode Tools
HTML Encoder / Decoder
This encoder makes quotes, ampersands, and other characters web friendly. With this encoder you can type or paste in the text you want to HTML encode, then press the button (or reverse the process with their decoder). Read a brief explanation of the process.
Text Encoder / Decoder
Base64 refers to a specific MIME content transfer encoding or as a generic term for similar encoding schemes that encode binary data translated into a base 64 representation. If you like this tool, you’ll also love the binary file to Base64 encoder which will help you embed files with markup: XHTML, CSS, XML and more.
Code Cleaners
Pretty Printer for PHP, Java, C++, C, Perl, JavaScript, CSS
Even advanced developers often needs to optimize their CSS code. CSS Tidy is a free, online application that will fix errors and optimize your CSS code. For example, it can automatically detect redundant styles, a very common problem of CSS codes.
Code Generation
webformfactory
Web Form Factory is an open source web form generator which automatically generates the necessary backend code to tie your form to a database. By generating the backend code for you, WFF saves you time… time you could spend doing more interesting stuff.
pForm
Create a php form in seconds with this free and easy to use tool. If you need a little more power you can check out its parent program MachForm or great alternatives wufoo and formspring (both of which offer limited free versions and paid premium versions).
Text Generators
We have all seen it and probably also used it… Lorem Ipsum text? This text is used by webdesigners worldwide to simulate the render of real text on a design. Lipsum.com allow you to create th desired number of paragraphs of Lorem Ipsum, quickly and simply.
LIpsum
HTML Ipsum
A useful little website created by Chris Coyier. It provides you with the standard Latin text already in HTML tags. Clicking on any of the blocks automatically copies the text to your clipboard!
blindtextgenerator
Browser Tests: Online-Services & Tools
Xenocode browsers
Tool for checking your website in different browsers. Xenocode Browsers allow you to lauch IE6, IE7, IE8, Firefox 2, Firefox 3, Google Chrome and Opera directly from the web. The only weak point: The service isn’t available for Macs and GNU/Linux powered PCs.
BrowserShots
BrowserShots is a free open source service that allows you to make screenshots of any web page available on the Internet (be aware that robots.txt can prevent this service). Most browser types (Firefox, Opera, IE and Safari, Dillo, Epiphany, Flock, Galeon, Konqueror, Seamonkey etc.) in relevant versions is available and you can also choose between the following Operating System: Linux, Windows, Mac OS and BSD.
You can adjust the width of the screen size (640 – 1600), color depth (8 – 32 bits per pixel) as well as the JavaScript-, Java- and Flash-support. BrowserShots rely on distributed computers that are run by volunteers and the most popular Browsers may be quite busy and it this means that getting your screenshot may take some time. As screenshots become ready they will be available for viewing individually or for download of the full package.
Crossbrowsertesting (free/commerical)
CrossBrowserTesting.com allows website designers to test the cross browser compatibility of their website across different browsers and operating systems. CrossBrowserTesting.com is a commercial service where users buy credits giveng 5 min usage each. Anyone can register and use the service for for free but the free service has a 5 min max length.
CrossBrowserTesting.com lets you log on to a remote session and take control of a operating system with a range of Browsers installed. This gives you the option to test your AJAX and Javascript as well as the layout.
Load Impact
Load Impact is a free tool which tests your site at different load levels and then displays your results in an easy to understand graph. Careful not to put your own site out of business!
Pingdom
Pingdom loads a complete HTML page including all objects (images, CSS, JavaScripts, RSS, Flash and frames/iframes). It mimics the way a page is loaded in a web browser and then displays how long each of those elements took to load using nice visual time bars. This can be very useful when you are trying to improve the efficiency of your site.
Test Everything
More than 100 online tools on one page.
JSUnit
JSUnit is a unit testing framework for JavaScript. Testing JavaScript manually is time-consuming and prone to errors, but JSUnit provides the developer a simpler, automated way of doing unit tests to ensure thorough testing at a fraction of the time it would take to test manually. JSUnit allows for the execution of automated tests for multiple browsers and operating systems. Test online
W3C Link Checker
Really handy tool for checking if all links on you web pages are valid.
Markup Validation Service
Markup that is not well formed may give your site serious presentation issues in some Browsers while they are barely visible on others. It is always recommended to validate your site with the W3C Markup Validator and fix all the errors it reports.
CSS Validation Service
Check Cascading Style Sheets (CSS) and (X)HTML documents with style sheets
Character Lookup
HTML Entity Character Lookup
Need to know how to display the trademark symbol on one of your pages, this tool if just for you. The HTML Entity Lookup searches the html entities for matches to the searched character based on how the character looks. For instance, the letter “c” would match © and ¢ entity, because of the way they look. This is really a tool that you need to try to understand how useful it is (also available as a dashboard widget for you Mac users).
Domain Tools
Domainr
There are plenty of tools available that tell you whether a domain is taken or not. What sets Domainr apart is that it takes your query and then tries to create a more memorable name. Domainr helps you explore the entire domain name space beyond the ubiquitous and crowded .com, .net and .org.
Firefox addons
Firebug
Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. This is probably one of the most widely used web developer tools out there. If you don’t have it, get it now!
Web Developer Toolbar
An extremely useful Firefox plugin which provides many tools which web developers use on a daily basis. Great for quickly validating your XHTML or inspecting HTTP header information.
Tagged Web Development
Our Stream
-
thinkclay:
Wondering if now is a good time to invest in some property in Boulder County.. with the #boulderfire and all.
2 hours ago -
nick_rivera:
i really hate when projects i care about turn into design by committee...a camel is a horse designed by committee. #trustyourdesigner
1 day ago -
justinnowak:
Looking for #Magento or #Wordpress developers, preferably in #Boulder #Denver #Lansing or #Calgary. Tweet me if interested (please RT too)
1 week ago -
zackperdue:
@matt_gavenda unfortunately yes, i see that all too much. Get with the times people!
1 week ago -
bychosen:
[wp-pro] » Theme Programmer » Long term WP Developer http://t.co/yTus8q2 thanks @wp_pro_ws for the recommendation and site!
1 week ago