Sugar: A Javascript library for working with native objects

Sugar is a Javascript library that extends native objects with helpful methods. It is designed to be intuitive, unobtrusive, and let you do more with less code.

Craftyslide – A tiny jQuery slideshow plugin

Craftyslide is a tiny (just 2kb) slideshow built on jQuery. Craftyslide aims to be different, by providing a simple, no-frills method of displaying images; packaged into a small, clean and efficient plugin.

SpriteMapper: CSS Spritemap Generator

Spritemapper is an application that merges multiple images into one and generates CSS positioning for the corresponding slices.

Improve loading times. Only 10% of a webpage’s loading time is due to the actual page—the other 90% is spent downloading styles, scripts and images. By reducing the amount of images and better utilizing the connection, CSS spritemapping can reduce your website’s loading time.

read more

JSZip: JavaScript zip class

JSZip

Create .zip files using Javascript. Provides a simple API to place any content generated by Javascript into a .zip file for your users.

read more

Slider.js : Slideshow with jQuery, CSS Transitions and Canvas

Slider.js is an easy-to-use customizable Javascript library to create image slideshows.

Slider.js relies on latest web technologies: the power of CSS Transitions to perform awesome and efficient effects and the HTML5 Canvas to perform some non trivial transitions.

Basic features

• Each slide displays the image, but can also have a text caption and a link.
• Slides navigation (pages, next, previous)
• Load images before starting the slider.
• Load the slider photos with a JSON object (distant or local).

List.js – Add search, sort and flexibility to plain HTML list

Do you want a 7 KB cross-browser native JavaScript that makes your plain HTML lists super flexible, searchable, sortable and filterable? Yeah!
Do you also want the possibility to add, edit and remove items by dead simple templating? Hell yeah!

Slidorion, A jQuery Plugin | jQuery Image Slider and jQuery Accordion

A combination of an image slider and an accordion, the slidorion displays beautiful images along with a variable length description. With images linked to each tab, and accompanied by a large array of effects, the slidorion is a great alternative to the traditional jQuery slider.

MobiScroll – Wheel scroller/Date and Time picker jQuery plugin for touch devices

A wheel scroller user control optimized for touchscreens to easily enter date and/or time. The control can easily be customized to support any custom values and can even be used as an intuitive alternative to the native select control (dropdown list). It is designed to be used on touch devices as an alternative to the jQuery UI date picker.

The control is themable. You can easily change the appearance of if in CSS. It also comes with pre-defined, nice looking color schemes.

By default the control renders for intuitive and easy usage, but you can also customize it’s parameters (width, height,…). For more info see the wiki.

See demo here: http://demo.mobiscroll.com

Demo, Details & Download: http://code.google.com/p/mobiscroll/

DropKick.js – Painless custom dropdowns

Creating custom dropdowns is usually a tedious process that requires a ton of extra setup time. Oftentimes lacking conveniences that native dropdowns have such as keyboard navigation. DropKick removes the tedium and lets you focus on making s@#t look good.

G5 Framework – HTML5 Front End Development Framework

Search Engine Optimization

• robots.txt / robots meta for the search engines
• canonical tag + 301 via htaccess to ensure all content is indexed under one domain
• hidden CSS class – the SEO friendly way (negative margin instead of display none)
• GZip for faster page load (speed affects rankings)

CSS

• Prevent CSS caching
• Cross browser border radius, box shadow, and opacity classes
• Shorthand CSS / some basic reusable classes
• Sticky footer (footer always stays on bottom of page – read: section.content must have a bottom padding equal or greater than the height of the footer)

CSS // Via Reset

• Eric Meyer’s Reset Reloaded + HTML5 Baseline
• Font normalisation
• Webkit font smoothing
• Force scrollbar
• Formatting quoted code
• Aligning Labels
• Clickable inputs
• Screenreader access
• IE7 image resizing
• Print styles

X(HTML) / Content

• Clean code structure
• 940px total content width
• Initial design based on a F Layout
• Remove image toolbar from old versions of IE
• Always force latest IE rendering engine (even in intranet) & Chrome Frame

jQuery

• jQuery 1.5.2 with fall-back (1.4.4 also included if needed)
• Smooth scroll to top
• HTML5 placeholder fallback
• Navigation – remove margin from last item
• Remove bottom padding from last paragraph

PHP

• Add active class to navigation item based on page
• GZip page (optional alternative to htaccess)