chrisdempsey
7/24/2012 - 12:17 AM
some useful reference links - in markdown
some useful reference links - in markdown
My Big List of Links
================================
**Q. Does this link belong in this list?**
1. Yes, if it is a regular source of reference
2. Yes, if it contains important knowledge I want to learn
3. Yes, if it sets the standards I aspire to work by
4. Yes, if its content will push my boundaries
5. Yes, if it provides inspiration
SECTIONS
--------
- [Reference](#reference)
- [Frameworks](#Frameworks)
- [Javascript](#Javascript)
- [Tools](#Tools)
- [Fonts](#Fonts)
- [MODX](#MODX)
- [Ideas to incorporate into projects](#Projectideas)
- [Mobile](#Mobile)
- [Inspiration](#Inspiration)
- [Design Theory](#DesignTheory)
- [Agencies & Designers](#Designers)
- [Process](#Process)
- [GIT](#GIT)
- [Email](#Email)
- [Video](#Video)
<a id="reference"></a>
Reference
-------------------------
###GENERAL
* [DOCHUB](http://dochub.io/) http://dochub.io/
* [HTTP Statuses](http://httpstatus.es/) http://httpstatus.es/
* [Can I Use?](http://caniuse.com/) http://caniuse.com/
###Javascript
* [JQAPI](http://jqapi.com) http://jqapi.com
* [MDN](https://developer.mozilla.org/en-US/) https://developer.mozilla.org/en-US/
* [JQ Fundamentals](http://jqfundamentals.com/) http://jqfundamentals.com/
* [JSLint](http://jslint.com/) http://jslint.com/
* [Javascript Garden](http://bonsaiden.github.com/JavaScript-Garden/) http://bonsaiden.github.com/JavaScript-Garden/
###CSS
* [Quirksmode CSS Support Tables](http://www.quirksmode.org/css) http://www.quirksmode.org/css
* [Snookca's SMACSS](http://smacss.com/) http://smacss.com/
* [LESS](http://lesscss.org/) http://lesscss.org/
* [CSSLint](http://csslint.net/) http://csslint.net/
* [CSS Browser Hacks](http://paulirish.com/2009/browser-specific-css-hacks/) http://paulirish.com/2009/browser-specific-css-hacks/
###HTML
* [HTML5 for developers](http://developers.whatwg.org/) http://developers.whatwg.org/
* [HTML5 Rocks](http://www.html5rocks.com/en/) http://www.html5rocks.com/en/
* [Can I Use?](http://caniuse.com) http://caniuse.com
* [HTML5 Periodic Table ](http://joshduck.com/periodic-table.html) http://joshduck.com/periodic-table.html
* [HTML5 Please](http://html5please.us)
* HTML5 Readiness <http://html5readiness.com/>
###VALIDATION & TESTING
* [W3C Validator](http://validator.w3.org/) http://validator.w3.org/
* W3CLove - entire site validation <http://w3clove.com/>
* Browserling <https://browserling.com/>
* Browserstack <http://www.browserstack.com/>
###FRONT END GUIDELINES
* Idiomatic CSS <https://github.com/necolas/idiomatic-css>
* Isobar <http://na.isobar.com/standards/>
*
<a id="Frameworks"></a>
FRAMEWORKS
-------------------------
* [html5boilerplate](http://html5boilerplate.com/) http://html5boilerplate.com/
* [html5reset](http://html5reset.org/) http://html5reset.org/
* [twitter bootstrap](http://twitter.github.com/bootstrap/) http://twitter.github.com/bootstrap/
###GRID
* [Semantic Grid ](http://semantic.gs) http://semantic.gs
* [Gridpak](http://gridpak.com/) http://gridpak.com/
* [Foundation](http://foundation.zurb.com/) http://foundation.zurb.com/
<a id="Javascript"></a>
JAVASCRIPT
-------------------------
* [modernizr](http://modernizr.com) http://modernizr.com
* [selectivizr](http://selectivizr.com/) http://selectivizr.com/
###JQUERY
* [Jquery](http://jquery.com) http://jquery.com
###APIs
* [Google Maps](http://code.google.com/apis/maps/documentation/javascript/basics.html) http://code.google.com/apis/maps/documentation/javascript/basics.html
###LIBRARIES
* [JSWiki](https://github.com/bebraw/jswiki/wiki) https://github.com/bebraw/jswiki/wiki
###INSPIRATION
* [Creative JS ](http://creativejs.com/) http://creativejs.com/
### TECHNIQUES
* [Object Literal Pattern](http://rmurphey.com/blog/2009/10/15/using-objects-to-organize-your-code/) http://rmurphey.com/blog/2009/10/15/using-objects-to-organize-your-code/
*
DUDES
-------------------------
- Paul Irish
- Chris Coyier
- Necolas Gallagher
- John Resig
- Addy Osmani
- Dmitry Baranovski
- ???
<a id="Tools"></a><a href="#top" style="display:block; background-color:#eee;text-align:right;">Back to Top</a>
TOOLS
-------------------------
* The Toolbox <http://www.thetoolbox.cc/>
* [CSS3 Tools by simurai](http://www.delicious.com/stacks/view/Ufzjuo) http://www.delicious.com/stacks/view/Ufzjuo
* [CSS Tricks SNIPPETS](http://css-tricks.com/snippets/) http://css-tricks.com/snippets/
###Performance
* [Google Page Speed](https://developers.google.com/pagespeed/) https://developers.google.com/pagespeed/
* [Yahoo Performance Rules](http://developer.yahoo.com/performance/rules.html) http://developer.yahoo.com/performance/rules.html
* [YSlow](http://developer.yahoo.com/yslow/) http://developer.yahoo.com/yslow/
* WebPageTest <http://www.webpagetest.org/>
###LINKS TO MORE REFERENCES/TOOLS
* [Move the web forward](http://movethewebforward.org/) http://movethewebforward.org/
* Spritepad <http://wearekiss.com/spritepad>
<a id="Fonts"></a>
FONTS
-------------------------
### Web font suppliers
* [Google Web Fonts](http://www.google.com/webfonts) http://www.google.com/webfonts
* [Typekit](https://typekit.com/) https://typekit.com/
* [FontSquirrel](http://www.fontsquirrel.com/) http://www.fontsquirrel.com/
* [FontDeck](http://fontdeck.com) http://fontdeck.com
* [FontShop](http://fontshop.com/fontlist/n/web_fontfonts) http://fontshop.com/fontlist/n/web_fontfonts
* [FontFont](https://www.fontfont.com/) https://www.fontfont.com/
* [FontSpring](http://fontspring.com) http://fontspring.com
* [League of Moveable Type](http://theleagueofmoveabletype.com) http://theleagueofmoveabletype.com
* [WebType](http://www.webtype.com/) http://www.webtype.com/
### Reference, inspiration
* [Lost Type](http://losttype.com/) http://losttype.com/
###Identifying fonts
* [Identifont](http://www.identifont.com/) http://www.identifont.com/
* [What the font](http://www.myfonts.com/WhatTheFont/) http://www.myfonts.com/WhatTheFont/
### Stacks
* [TypeStacks](http://typestacks.com/) http://typestacks.com/
* [Font Stacks](http://cssfontstack.com/) http://cssfontstack.com/
<a id="MODX"></a>
MODX
-------------------------
* Bob's guide to objects <http://bobsguides.com/revolution-objects.html>
* Modx Object cheatsheet <http://www.shawnwilkerson.com/modx-revolution/2012/03/04/modx-revolution-object-cheat-sheet-modresource/>
* Revolution Docs <http://rtfm.modx.com/display/revolution20/Home>
* Add On Docs <http://rtfm.modx.com/display/ADDON/Home>
<a id="Projectideas"></a>
SHIT TO USE IN A PROJECT
-------------------------
###WEB FONTS
font deck freebie
* [EXO SANS](http://www.ndiscovered.com/index.php/exo-font-family) http://www.ndiscovered.com/index.php/exo-font-family
* [icon fonts by simurai](http://www.delicious.com/stacks/view/SC3hpq) http://www.delicious.com/stacks/view/SC3hpq
* [PICTOS font](http://pictos.cc/) http://pictos.cc/
lettering.js by Trent Walton
###CSS techniques
* [rollovers ](http://www.netmagazine.com/tutorials/create-progressively-enhanced-3d-css-rollovers) http://www.netmagazine.com/tutorials/create-progressively-enhanced-3d-css-rollovers
* [Adobe arrow like headers](http://css-tricks.com/adobe-like-arrow-headers/) http://css-tricks.com/adobe-like-arrow-headers/
* [css tricks snippets](http://css-tricks.com/downloads/) http://css-tricks.com/downloads/
###Animation
[Animate CSS](http://daneden.me/animate/)
###BUTTON techniques
* [super cool numbered buttons](http://www.esecamalich.com/blog/before-&-after/) http://www.esecamalich.com/blog/before-&-after/
* [youtube buttons](http://css-tricks.com/youtube-popup-buttons/) http://css-tricks.com/youtube-popup-buttons/
* [ZURB super awesome buttons ](http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba) http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba
* [collection of button styles](http://houseofbuttons.tumblr.com/) http://houseofbuttons.tumblr.com/
* [Image Hover effects](http://tympanus.net/codrops/2011/11/02/original-hover-effects-with-css3/) http://tympanus.net/codrops/2011/11/02/original-hover-effects-with-css3/
* [ISOTOPE + Masonry](http://isotope.metafizzy.co/) http://isotope.metafizzy.co/
* [Method & Craft](http://www.methodandcraft.com/) http://www.methodandcraft.com/
* [CODROPS](http://tympanus.net/codrops/) http://tympanus.net/codrops/
* [Red Team Design](http://www.red-team-design.com/) http://www.red-team-design.com/
* [Web Designer Wall](http://webdesignerwall.com/) http://webdesignerwall.com/
* <http://www.onextrapixel.com/2012/06/15/20-essential-jquery-plugins-for-every-developers-toolkit/>
<a id="Mobile"></a>
Mobile
-------------------------
* [Mobile Web Best Practices](http://mobilewebbestpractices.com/)
* [Mobile Web Best Practices - Resources](http://mobilewebbestpractices.com/resources/)
* [Mobile HTML5](http://mobilehtml5.org/)
<a id="Inspiration"></a>
HIGHLY COOL SHIT FOR INSPIRATION
-------------------------
* [Dribble](http://www.dribbble.com/) http://www.dribbble.com/
* [Net Magazine top 20 CSS Sites](http://www.netmagazine.com/features/2011-review-20-css-sites-rocked) http://www.netmagazine.com/features/2011-review-20-css-sites-rocked
* [German Sites](http://www.designmadeingermany.de/sites-we-like/) http://www.designmadeingermany.de/sites-we-like/
* <http://designmodo.com/html5-css3-websites/>
REALLY CRAZY SHIT
-------------------------
* [MDN CSS3 DEMOS](https://developer.mozilla.org/en-US/demos/tag/tech:css3/) https://developer.mozilla.org/en-US/demos/tag/tech:css3/
<a id="DesignTheory"></a>
DESIGN THEORY
-------------------------
* [The Cicada Principal](http://designfestival.com/the-cicada-principle-and-why-it-matters-to-web-designers/) http://designfestival.com/the-cicada-principle-and-why-it-matters-to-web-designers/
* [Law of page harmony](http://retinart.net/graphic-design/secret-law-of-page-harmony/) http://retinart.net/graphic-design/secret-law-of-page-harmony/
* [Design Principles](http://principles.adactio.com/) http://principles.adactio.com/
* [UK GOV Design Principles](https://www.gov.uk/designprinciples) https://www.gov.uk/designprinciples
IE
-------------------------
* [CSS3 PIE](http://css3pie.com/) http://css3pie.com/
<a id="Designers"></a>
TOP AGENCIES
-------------------------
* [NCLUD](http://nclud.com/) http://nclud.com/
* [ZURB](http://www.zurb.com/) http://www.zurb.com/
* [HAPPY COG](http://happycog.com/) http://happycog.com/
* [METALAB ](http://metalabdesign.com/) http://metalabdesign.com/
TOP DESIGNERS
-------------------------
* [Trent Walton](http://trentwalton.com/) http://trentwalton.com/
* [Dave Gamache](http://davegamache.com/) http://davegamache.com/
Examples of great UX sites
-------------------------
* [etsy](http://www.etsy.com/) http://www.etsy.com/
* [bagcheck](https://bagcheck.com/) https://bagcheck.com/
*
UI Resources
-------------------------
* [Pattern Tap ](http://patterntap.com/) http://patterntap.com/
* [yahoo design pattern library](http://developer.yahoo.com/ypatterns/)
* quince
* dell ui design library
CLIENTS
-------------------------
###Teach your clients about the mysteries of the web
* [http://weenudge.com/](http://weenudge.com/)
* [http://thereisnofold.com/](http://thereisnofold.com/)
* [Which mobile approach?](http://www.lukew.com/ff/entry.asp?1509)
* [Mobile performance matters](http://www.webperformancetoday.com/2012/02/28/4-awesome-slides-showing-how-page-speed-correlates-to-business-metrics-at-walmart-com/)
###Client Relations
* [http://24ways.org/2007/10-ways-to-get-design-approval](http://24ways.org/2007/10-ways-to-get-design-approval)
* [http://supportdetails.com/](http://supportdetails.com/)
* <http://www.smashingmagazine.com/2011/05/06/how-to-get-sign-off-for-your-designs/>
SEO
--------------------------------------------------
* [Google SEO starter guide](http://static.googleusercontent.com/external_content/untrusted_dlcp/www.google.com/en//webmasters/docs/search-engine-optimization-starter-guide.pdf) PDF
* [SEOMoz](http://www.seomoz.org/) http://www.seomoz.org/
* quick analysis: http://www.business2community.com/online-marketing/the-15-minute-seo-audit-ammo-for-your-next-sales-meeting-0104694
* [Microformats](http://microformats.org/) http://microformats.org/
<a id="Process"></a>
PROCESS
--------------------------------------------------
Things to follow in the process
- Sitepoint web design business kit v3
* [Image Gallery preview](http://www.dropmocks.com/) http://www.dropmocks.com/
* [Influence - Zurb's Design Preview](http://www.influenceapp.com/home)
* [InVision](https://projects.invisionapp.com/) https://projects.invisionapp.com/
* [LaunchList](http://lite.launchlist.net/) http://lite.launchlist.net/
<a id="GIT"></a>
GIT
--------------------------------------------------
* [GIT - the simple guide](http://rogerdudler.github.com/git-guide/ ) http://rogerdudler.github.com/git-guide/
* [Pro GIT](http://progit.org/book/) http://progit.org/book/
* [GIT community book](http://book.git-scm.com/index.html) http://book.git-scm.com/index.html
###TUTORIALS
* [GIT for designers](http://thinkvitamin.com/design/git-for-designers-part-1/)
<a id="Email"></a>
HTML EMAIL
--------------------------------------------------
* [Emailology](http://www.emailology.org/) http://www.emailology.org/
* [Email Boilerplate](http://htmlemailboilerplate.com/) http://htmlemailboilerplate.com/
<a id="Video"></a>
VIDEO
--------------------------------------------------
[mediaelementjs.com](http://mediaelementjs.com/)