Useful Development Tools

Hi webdevs

Over my time I've picked up some really useful tips, tools and tricks when it comes to many areas of web development, design and implementation. The web has been an invaluable resource for me over the years when learning and finding answers to problems. So I figured Digital Point looks like a great place for me to share some of my knowledge and tools with people just looking to get into it all.

I hope the following links and resources may be of some great use to you all and please, if you have some ideas or personal favorites, it'd be great to hear about them.
I'm looking forward to having a fresh up to date list of resources that we can all benefit from.

*It should also be noted that there's no harm in running competitors websites through these tools, you can learn a lot about many aspects of 'their industry' before even starting to build or write copies. Seeing a competing sites backlinks and keyword density have been a tremendous help. Plus who knows, maybe I'm just a little bit cheeky, though I do love giving clients a report of how the website I build for them compare with the results of many of these tools below.

Building/Testing Phase:

Responsive Design Checkers:
http://responsivedesignchecker.com/
http://responsive.is/typecast.com

HTML/Markup Validation:
http://validator.w3.org/

CSS Validation:
http://jigsaw.w3.org/css-validator/

Speed Checkers:
When it comes to speed, generally speaking, the higher your results and numbers then the better you're doing. However website speed is a lot like cooking. Not all recipes have the same ingredients and before one bakes a deluxe cake they should have the basics, like cracking an egg and whipping cream, down pat. So these tools should be used in a similar way to a recipe; strict guidelines that ideally will give you consistent results.
http://gtmetrix.com/
https://developers.google.com/speed/pagespeed/insights/​

Research/Competior Overview:

Keyword Density:
http://www.webconfs.com/keyword-density-checker.php

Website General Stats & Value:
http://mcjonline.com/
http://www.alexa.com/​

Tools/Resources To Help Build:

Website Resouces:
Image re-sizing ratio converter - super helpful for video aspect ratio too
http://andrew.hedges.name/experiments/aspect_ratio/

Background Gradients Creator - many options and loads quicker than background images in most cases.
http://ie.microsoft.com/testdrive/graphics/cssgradientbackgroundmaker/default.html

Easy on the eye background images - Breaks up boring plain color background just enough
http://subtlepatterns.com/

Quick Buttons - I've personally moved away from text related button images recently, in favor of importing fonts directly, still this site gives some good css effects to play around/visualize/see code though.
http://dabuttonfactory.com/

CSS Text Shadow Effects - very useful quick reference guide to text shadows
http://www.w3.org/Style/Examples/007/text-shadow.en.html

Favicon - The first thing I do on all new projects now, who doesn't love seeing a 100% hit status in their web stats? ;p
http://catalyst.net.nz/tutorial/creating-a-multi-resolution-favicon​

There are no doubt some links and tools I forgot to mention, however there are also some tools you might expect me to have included that I in fact just never use, like WireFrames.
So please feel free to share and add to this list of great resources we can all hopefully benefit from.
Also if you have any question, please ask away

 

Wow. So much better than the other gradient generator I had bookmarked. Also, looks like it may be IE compatible

 

I personally think the following website is one of the best tools you can use. It's meant to be funny, but read through the whole thing, what it says it very true. Please excuse the profanity in the url:

 

Yeah, when I found this one I unbookmarked my other long serving one. Blew me away too that it was just sitting there on a MS page. I think right when I realised that my face did this O.O
hahahaha.

Hahaha. Wow. Got to admit, was a little hesitant to click it, but so glad I did. Very funny and very true. I love how it was written. Definitely adding this to my list. Thanks for sharing, if I could like that post I would

Reminds me of a bit of what Kickstarter are doing with their emails, back to text. I love it but would love to see them play with the font size/effects/style/decoration though.

Even more than that though, it reminds me of a similar one I saved from the oatmeal about restaurant websites. Not quite as much profanity, but still pretty funny.
theoatmeal.com/comics/restaurant_website

I actually use this one eveytime I build a restaurant website as a reminder to not be a douche. I can see myself doing the same with link you shared, only everytime I start a project. So thanks

 

Thanks, I appreciate the positive feedback.

 

So you guys got any more websites or tools to contribute?

 

motherfuckingwebsite.com
Excellent site... sounds like one of Deathshadows posts on here!

 

Woow this post is very important and informative for me. I like your information you share here width us. There are more tools you share i have no
knowledge about this. Now i learn it and appreciated your work . Keep sharing your information with us.

 

ha ha ha! In point! Site name is the best! Immediately obvious that this is the most useful site.