Adactio: Links

Microjs: Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit!

I really like this trend of small standalone scripts rather than plug-ins that require the presence of a library.

JS Hotline: (877) 300-2187

I love this! A volunteer-run hotline for answering JavaScript questions (set up by the awesome Garann Means, who literally wrote the book on Node.js).

I think I might volunteer my services.

Springload: OnMediaQuery - Responsive Javascript

This is nice: the solution I blogged about for conditional CSS (reading media queries from JavaScript) all wrapped up in a nice small reusable bundle.

tubalmartin/riloadr

This responsive image technique has a lot of moving parts but it seems pretty solid.

Creating a Mobile-First Responsive Web Design - HTML5 Rocks

A great step-by-step tutorial from Brad on developing a responsive site with a Content First mindset.

Mobile Battery Performance

This is my short explanation of Remy’s explanation of a BBC news article which is an explanation of an academic paper about battery performance of mobile devices when accessing websites.

Breakpoint Checking in Javascript with CSS User Values | Sparkbox

A smart response to the little conundrum I posted on my blog yesterday about detecting media-query quarantined CSS properties from JavaScript.

CreativeJS for non-coders on Vimeo

A fantastic taste of what you can expect in Seb’s Creative Coding workshop.

Paperfold CSS | Demo Studio | Mozilla Developer Network

In amongst all the shiny demos on this site, this one could actually be useful.

An Ajax-Include Pattern for Modular Content | Filament Group, Inc., Boston, MA

Scott walks through the code and thinking behind the conditional loading pattern on The Boston Globe site. This is such a useful and valuable pattern!

Stop solving problems you don’t yet have | this is rachelandrew.co.uk

I completely agree with everything Rachel says here. I see far too many projects that start out with pre-emptive conditional comments, JavaScript libraries and polyfills, without knowing whether or not they’re actually going to be needed.

Kicksend/mailcheck · GitHub

A handy little script that attempts to check email inputs for misspelled domain names. I’m pretty sure it doesn’t need to be written as a jQuery pug-in, though: anyone want to fork it and create a non-jQuery version too?

Excessive Enhancement - SXSW2012 // Speaker Deck

The slides from Phil’s excellent South by Southwest presentation on URLs, JavaScript, and progressive enhancement.

Progressive enhancement is a barrier to progress | Opinion | .net magazine

I can’t remember the last time I read something I disagreed with so fundamentally. This sums up the tone of the article:

Accessibility is not a right; it’s a feature.

I do not agree. I do not agree at all.

(Also, the pre-emtive labelling of anyone who may disagree with your point of view as defending a “sacred cow” is as tired and misguided as labelling anyone who disagrees with your viewpoint as a “fanboy”.)

How I’m implementing Responsive Web Design – JeffCroft.com

Jeff documents some of the techniques he’s using to tackle responsive design, with some tips specifically for SASS.

nathanford/pngy - GitHub

A script that attempts to detect connection speed (by requesting a test file three times in a row) in order to determine whether hi-res images should be requested or not.

Koalas to the Max dot Com

Pretty!

HTML5 Please

This looks like a handy resource with a shitty, shitty name. Count the number of items that are in HTML (or JavaScript or APIs). Now count the number of items that are in CSS.

» 21 January 2012, baked by Ben Ward @ The Pastry Box Project

Some valuable musings from Ben on how browsers could be better — and I don’t mean the usual moaning about performance or device APIs.

Wat — Destroy All Software Talks

This cracked me up. There are two possibilities: either this is really is very funny or I am very nerdy.

A Fix for the iOS Orientationchange Zoom Bug | Filament Group, Inc., Boston, MA

That Scott is one smart cookie. He has come up with a workaround (using the accelerometer) for that annoying Mobile Safari orientation/zoom bug that I blogged about recently.

I still want Apple to fix this bug as soon as possible—the fact that such smart people are spending so much effort on ingenious hacks shows just how much of a pain-point this is.

Vanilla JavaScript FTW

I’ve found myself using jQuery less and less recently. Partly to avoid the extra download and file size but also—as shown here—when it comes to DOM manipulation, there’s a lot you can do straight out of the box.

A plea for progressive enhancement | Stephanie Rieger

Yes! Yes! Yes!!!

Progressive enhancement is the only sane approach to today’s massively divergent landscape of devices. It can’t be repeated often enough.

impress.js | presentation tool based on the power of CSS3 transforms and transitions in modern browsers | by Bartek Szopka @bartaz

A competitor to Prezi built with HTML, CCS and JavaScript.

Polyfilling The HTML5 Gaps With JavaScript

An in-depth look at browser polyfills: what they are, how they work, and how you can make your own.

The Mobile Case for Progressive Enhancement | Brad Frost Web

A great, great reminder from Brad on the importance of progressive enhancement especially on mobile. There seems to be a real mindset amongst developers working on mobile sites that JavaScript is a requirement for building anything (and there’s a corresponding frustration with the wildly-varying levels of JavaScript support). It ain’t necessarily so!

That “JavaScript not available” case | Christian Heilmann

A great reminder from Christian that making JavaScript a requirement for using a website just doesn’t make much sense.

InstaCSS | Instant CSS Documentation Search

A fantastically useful resource! Don’t let the name fool you: this provides instant access to documentation for CSS and HTML and JavaScript!

Put this one on speed dial.

Redesigning the Country Selector - Baymard Institute

This looks like a nice progressive enhancement pattern: convert a select element into an auto-completing input element (a country selector in this case).

Cream of tag soup - Ramblings about frontend stuff

Jake Archibald has a blog now. Subscribed.

Responsive IMGs Part 2 — In-depth Look at Techniques « Cloud Four

Jason continues his look at responsive images techniques by diving into the nitty-gritty of the various options out there.

Responsive design and JavaScript - QuirksBlog

Unfortunately this article from PPK is flawed from the start: his first point (upon which all the subsequent points are based) is fundamentally flawed:

Right now responsive design is graceful degradation: design something for desktop and tablet, and remove stuff for mobile.

That’s not the way I’m doing responsive design. Responsible responsive design marries it with a mobile first approach (or more accurately, content first).

Creating responsive images using the noscript tag | Head

Now this is intriguing: putting your default images inside a noscript element, then do your viewport measuring and image-swapping before removing the noscript tags. But when I tried this a while back, I couldn’t get access to the noscript elements with JavaScript (which makes sense, when you think about it).

I wonder if it’s the use of class names or jQuery that allows it to work here?

Responsive HTML images

If you’re trying to retrofit an existing desktop-centric site for small screens, this server-side image-resizing technique might be useful but is definitely not the right tool for a content-out, small-screen-first approach.

spin.js

An ingenious loading indicator that uses JavaScript instead of an animated .gif.

davidnewton.ca | The Current State of Hyphenation on the Web

A valiant attempt to polyfill support for hyphenation in browsers other than the latest Safari and Firefox.

HTML5 Rocks - How Browsers Work: Behind the Scenes of Modern Web Browsers

Insanely in-depth look at how browsers work, right down to the nitty gritty. You’d think there’d be a lot of engineering talk, but actually a lot of it is more about linguistics and language parsing.

OLO

This is a thoroughly enjoyable, frustratingly addictive two-player game for the iPad.

Oh, and it just happens to be made with HTML, CSS and JavaScript.

Web Typography for the Lonely

A collection of experiments in typography using canvas, SVG, JavaScript and whatever else it takes.

mySociety » Blog Archive » Mobile operators altering (and breaking) web content

In an attempt to “optimise” performance, T-Mobile and Orange are actually breaking jQuery.

CreativeJS | The very best of creative JavaScript and HTML5

This is your one-stop shop for envelope-pushing in the browser:

The very best of creative JavaScript and HTML5.

New Mobile Safari stuff in iOS5: position:fixed, overflow:scroll, new input type support, web workers, ECMAScript 5 | David B. Calhoun – Developer Blog

A look at some of the new HTML5/JavaScript additions coming in the next version of Mobile Safari.

resizeMyBrowser

A handy little tool for testing responsive designs by automatically changing your browser viewport size.

danwebb.net - It’s About The Hashbangs

A superb post by Dan on the bigger picture of what’s wrong with hashbang URLs. Well written and well reasoned.

Annoying.js: How to be an asshole • Javascript • Kilian Valkhof

All of the most irritating uses of JavaScript gathered together into one library.

The Story of the HTML5 Shiv « Paul Irish

This dovetails nicely with my recent post about the spirit of distributed collaboration. Here’s a great little bit of near-history spelunking from Paul, all about styling new HTML5 elements in pesky older versions of Internet Explorer.

Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement — Easy Readers

Buy. This. Book.

I mean it.

Modern JavaScript - rmurphey

Rebecca Murphey on the continuing evolution and maturity of the JavaScript world.

Client-side routing, the teenage years // James Aylett’s diary

James follows up on his previous excellent post on hashbangs by diving into the situations where client-side routing is desirable. Watch this space for a follow-up post on performance.

Qwery - The Tiny Selector Engine

A handy little JavaScript selector—IDs, classes and attribute selectors are supported—for those situations when all of jQuery or Sizzle would be overkill.

Page Speed Online

A supremely useful tool from Google for measuring performance.

Announcing Typo.js: Client-side JavaScript Spellchecking

This could be a handy: a client-side spellchecker. The dictionary files are a bit big of course—maybe local storage could help.

HTTP Archive

This is wonderful stuff: a long-term project to track the performance of high-traffic sites over time: oodles of lovely data and some quite shocking stats.

this, is boomerang

This code could be useful in determining a user’s bandwidth.

yepnope.js | A Conditional Loader For Your Polyfills!

A nice’n’small lazy loader that should make life easier when it comes to pollyfilling browser support for nifty HTML5 or CSS3 features.

ongoing by Tim Bray · Broken Links

Tim Bray calmly explains why hash-bang URLs are a very bad idea.

This is what we call “tight coupling” and I thought that anyone with a Computer Science degree ought to have been taught to avoid it.

isolani - Javascript: Breaking the Web with hash-bangs

Excellent, excellent analysis of how URLs based on fragment identifier (a la Twitter/Gawker/Lifehawker) expose an unstable tottering edifice that crumbles at the first JavaScript error.

So why use a hash-bang if it’s an artificial URL, and a URL that needs to be reformatted before it points to a proper URL that actually returns content?

Out of all the reasons, the strongest one is “Because it’s cool”. I said strongest not strong.

Beautiful Element Creation with jQuery — Article — The Nerdary

Good advice for generating markup with jQuery. As usual, there’s more than one way to do it.

accessifyhtml5.js at master from yatil’s accessifyhtml5.js - GitHub

A great little jQuery script to automatically assign ARIA roles to HTML5 elements with the corresponding semantics.

Selectivizr - CSS3 pseudo-class and attribute selectors for IE 6-8

Adding CSS3 support to legacy versions of Internet Explorer using JavaScript. I like the fact that, although it requires a JavaScript library, it works with multiple libraries.

CssUserAgent (cssua.js)

This script adds user-agent information in class names to the document’s root element so that those user agents can be targeted with CSS. It could be useful, but only in direst need.

audio.js

A handy shim for audio: it uses the native implementation where possible and Flash as a fallback.

filamentgroup/Responsive-Images - GitHub

Some very smart ideas here for responsively enhancing image requests.

You Must Learn JavaScript — Article — The Nerdary

Kenny Meyers on the ubiquity of JavaScript.

Microformat Shiv

Handy! A JavaScript API for accessing microformats in a document, based on Mozilla's implementation for extensions.

Create a new Fiddle - jsFiddle - Online Editor for the Web (JavaScript, MooTools, jQuery, Prototype, YUI, Glow and Dojo, HTML, CSS)

This looks like it could be a handy little tool for creating test cases with HTML, CSS and JavaScript.

Tags: javascript

More information

About this site

Customise

Search

Subscribe