Showoff is a service that allows a locally run server on any port to be accessible on the public Internet. It creates a public URL for a server on localhost that you can share with anyone. All requests to that URL are tunneled to your workstation.

Look up HTML5, CSS3, etc features, know if they are ready for use, and if so find out how you should use them – with polyfills, fallbacks or as they are.

When Can I Use tells you the browser support story, while Modernizr gives you the power of feature detection. HTML5 Please helps you out with recommendations for polyfills and implementation so you can decide if and how to put each of these features to use.

The recommendations below represent the collective knowledge of developers who have been deep in the HTML5 trenches. We hope they serve you well.

CSS Documentation Search

This project is a reference for developing a live, semantic style guide. You can see screengrabs of what it looks like under the screengrabs/ folder.

Daily routines are culled from books, newspapers, magazines, and Web sites.

Note: The Daily Routines blog is currently on hold. Stay tuned for the Daily Routines book in 2011.

Wkhtmltopdf is an open source project that uses the WebKit rendering engine to convert HTML to native PDF code. This is the muscle behind the PDFKit gem and other projects like WickedPdf. In this article I am only going to focus on PDFKit with Rails. But many topics will apply to both PDFKit and WickedPdf since they use wkhtmltopdf on the backside.

An exquisite jQuery plugin for magical layouts. Reveal & hide items with filtering, re–order items with sorting, dynamic, intelligent layouts, captivating animations, sort items by just about anything, powerful methods, simple syntax, progressively enhanced for CSS3 transforms & transitions.

We aren’t a big company, at least not yet, but we’ve already built up a good reputation for our work. When a piece of work doesn’t excite us, it isn’t good enough for anybody else.

So far as excitement goes, we resort to intuition just as often as we rely on experience.
Our technical staff gives birth to new concepts, while every day our graphic designers create new eye-catchers. Every project we take on has to be done with the same attention to detail as any project we'd do for ourselves.

Easy Skeezy Ruby Date/Time Formatting

HTML5 Boilerplate is the professional badass's base HTML/CSS/JS template for a fast, robust and future-proof site.
After more than two years in iterative development, you get the best of the best practices baked in: cross-browser normalization, performance optimizations, even optional features like cross-domain Ajax and Flash. A starter apache .htaccess config file hooks you the eff up with caching rules and preps your site to serve HTML5 video, use @font-face, and get your gzip zipple on.
Boilerplate is not a framework, nor does it prescribe any philosophy of development, it's just got some tricks to get your project off the ground quickly and right-footed.

The ie6-upgrade-warning is a little script (7.9kb) that displays a warning message politely informing the user to upgrade the browser to a newer version (links to newest IE, Firefox, Opera, Safari, Chrome are provided). The webpage is still visible behind a transparent background, but access to it is prevented. The idea is to force users to upgrade from IE6 and avoid the website from a bad reputation that website is not rendering correctly in IE6. The script is completely translatable in any language, very easy to set-up (one line of code in webpage and one parametter configuration).

An essential app for webmasters; crawls your site reporting broken links. If you've maintained a website for any length of time, you'll know that links very quickly become broken. We all move, delete or change pages, and when we do, it not only results in our own internal links breaking, but other people's links to our website becoming broken. Similarly, when other people alter their pages, our own external links become broken. A broken link on your site is a dead end for your visitors and will also be bad news for your search engine optimisation (SEO). Unless you enjoy clicking every single link on your site followed by the back button, then you'll need to use a website crawler like Integrity! Feed it your home page address (url) and Integrity will follow all of your internal links to find your pages, checking the server response code for all internal and external links found.

You may want to consider linking to this site, to educate any script-disabled users on how to enable JavaScript in five most commonly used browsers. You are free to use the code below and modify it according to your needs.

This appendix provides reference information for all HTML variables supported for use with Buy Now, Donation, Subscribe, Add to Cart, and View Cart buttons, as well as HTML variables supported the Cart Upload command.

Fake is a new browser for Mac OS X that makes web automation simple. Fake allows you to drag discrete browser Actions into a graphical Workflow that can be run again and again without human interaction. The Fake Workflows you create can be saved, reopened, and shared.

The table below shows the 104 elements currently in the HTML5 working draft and two proposed elements (marked with an asterisk).

Five Simple Steps is a publisher of books for web professionals. We follow a simple format, one that will become familiar to our readership: our books have five sections and each section has five chapters, allowing for well structured content and eclectic topics within each book. An important part of our brand is design and style. We pride ourselves on producing beautiful books that have an informal and chatty tone of voice that makes it easy to read and a useful tool for the reader.

Ruby developers can choose from a variety of tools to get their job done.

The Ruby Toolbox gives you an overview of these tools, sorted in categories and rated by the amount of watchers and forks in the corresponding source code repository on GitHub so you can find out easily what options you have and which are the most common ones in the Ruby community.

Bowline is a framework for making cross platform desktop applications in Ruby, HTML and JavaScript.

If you've ever wished creating a desktop application was as simple as creating a Rails website, Bowline's for you.

Bowline respects MVC, you can design your views in HTML5/CSS3 - then bind them to your Ruby models. There's no request/response cycle - any changes in models automatically get reflected in the view.

Compatibility tables for features in HTML5, CSS3, SVG and other upcoming web technologies.

Video for Everybody is simply a chunk of HTML code that embeds a video into a website using the HTML5 <video> element, falling back to QuickTime and Flash automatically, without the use of JavaScript or browser-sniffing. It therefore works in RSS readers (no JavaScript), on the iPhone / iPad (don’t support Flash) and on many, many browsers and platforms.

Google Browser Size is a visualization of browser window sizes for people who visit Google. For example, the "90%" contour means that 90% of people visiting Google have their browser window open to at least this size or larger.

This is useful for ensuring that important parts of a page's user interface are visible by a wide audience. On the example page that you see when you first visit this site, there is a "donate now" button which falls within the 80% contour, meaning that 20% of users cannot see this button when they first visit the page. 20% is a significant number; knowing this fact would encourage the designer to move the button much higher in the page so it can be seen without scrolling.

Now web designers and developers can join the iPhone app party without having to learn Cocoa's Objective-C programming language. It's true: You can write iPhone apps quickly and efficiently using your existing skills with HTML, CSS, and JavaScript. This book shows you how with lots of detailed examples, step-by-step instructions, and hands-on exercises.

Creating a proxy class in ruby can be a nice tool to have in your nerdy tool belt, and its actually really simple to do. Have you ever wondered how ActiveRecord is able to pull off its nifty tricks with associations?

It has always been easy to put a signup form onto a standard web page, just by copying and pasting the form code from your account. Now it is almost as easy to add the same signup form to your Facebook fan page, and let your Facebook friends join your list.

SlickMap CSS is a simple stylesheet for displaying finished sitemaps directly from HTML unordered list navigation. It’s suitable for most web sites – accommodating up to three levels of page navigation and additional utility links – and can easily be customized to meet your own individual needs, branding, or style preferences.

The general idea of SlickMap CSS is to streamline the web design process by automating the illustration of sitemaps while at the same time allowing for the predevelopment of functional HTML navigation.

There are many ways to make websites run faster. In this section, you can discover performance best practices that real web professionals employ in their everyday work. These practices have improved the user experience for millions of users and we hope they are useful for other web developers.

BWToolkit is an Interface Builder plugin that contains commonly used UI elements and other objects designed to simplify Mac development.

Instead of contributing to the mass of tutorials already written about the subject, I figured I would take the easy useful way out and compose a list of great tutorials on how to accomplish a migration to Git for those who are familiar with SVN. If you have more links, please comment away and I’ll add them in.

We thought it would be useful to the community to see what is currently being used by others developing Rails apps. We list only the most commonly used versions and plugins because a complete list is too long to post here and is probably not all that useful.

I've been developing jQuery plugins for quite a while now, and I've become rather comfortable with a particular style of plugin development for my scripts. This article is meant to share the pattern that I've found especially useful for plugin authoring.

Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. In case you want to create your own specific chart or image crop-n-rotate widget, you can simply achieve it with this library.
Raphaël uses SVG and VML as a base for graphics creation. Because of that every created object is a DOM object so you can attach JavaScript event handlers or modify objects later. Raphaël’s goal is to provide an adapter that will make drawing cross-browser and easy. Currently library supports Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.

iPhone development. Ruby on Rails web development.

Snipt is your collection of frequently used commands or code snippets.

Because even Subversion gurus forget the 'svn merge' syntax sometimes.

+63 is a collective blog dedicated to providing an online venue for Philippine creatives. The idea behind +63 is to create a rallying point for the industry by adapting and updating the international country code for the Philippines into a recognizable trademark for Filipino culture, design, and art. 

The site features articles and entries on industry trends and provides a base for interaction among Filipino artists by allowing user participation. The goal is to provide a source for updates on developments in the field and a venue for relevant discussion.

PinoyLancer (PL) is your only gig, project, and freelance hub.

Why'd we make it? Because we want to make it easier for likeminded developers and designers to meet and collaborate with one another. In other words, we want to help folks actually build the lovely projects they're thinking about.

Cross-browser compatibility is one of the most time consuming tasks for any web designer. We’ve seen many different articles over the net describing common problems and fixes. I’ve collated all the information I could find to create some coding conventions for ensuring that your site will work first time in every browser. There are some things you should consider for Safari and Firefox also, and IE isn’t always the culprit for your CSS woes.

Google Doctype is an open encyclopedia and reference library. Written by web developers, for web developers. It includes articles on web security, JavaScript DOM manipulation, CSS tips and tricks, and more. The reference section includes a growing library of test cases for checking cross-browser and cross-platform compatibility.

I had been asked by Paul to talk about the nitty gritty end of design – taking a design through to launch, which I was concerned would be teaching people to suck eggs. After all, this would be the bread and butter of everyones everyday work.

The recommended viewing format of this cheat sheet is as a PDF rather than the traditional blog post (I found the blog posts inconvenient to print).

Expat Software is a small consulting and development house, staffed by a number of expatriate Americans.

Where exactly are we located? A good place to look would be a nice beach with cheap bungalows to rent and a fast internet connection.

BDD starts at the outside by identifying business outcomes, and then drills down into the feature set that will achieve those outcomes. Each feature is captured as a “story”, which defines the scope of the feature along with its acceptance criteria.

Every now and then I stumble across a blog post that triggers something in me. Lately, this was the case for an article I read over at RubyFleebie about a Rails programmer having trouble with the very basics when it comes to databases.

From a two-person company with roots in print design, we’ve grown quickly, but thoughtfully. We’ve taken on clients who share our passion for complete solutions and our pursuit to think bigger, even on the smallest projects.

Wireframes serve as a key tool in communicating the content and layout of each web page for internal and client reviews as well serving as a blueprint for graphic designers to produce designs and for programmers develop functionality.

This tutorial explains how to import a new project into git, make changes to it, and share changes with other developers.

If you are instead primarily interested in using git to fetch a project, for example, to test the latest version, you may prefer to

Welcome to the Git version control system! Here we will briefly introduce you to Git usage based on your current Subversion knowledge. You will need the latest Git installed; There is also a potentially useful tutorial in the Git documentation.

Cells brings the benefits of component-oriented development to the Ruby on Rails web application platform, without the performance problems that had been associated with Rails' own, deprecated, component subsystem.

This tutorial explains how to design a pagination for search results or more in general to split a long list of records in more pages.

This form will allow you to encode your e-mail address through the use of Character Entities, transforming your ascii email address into its equivalent decimal entity.

For those scratching their heads wondering what Drupal is, it’s an open-source (i.e. free) content management system that’s flexible and feature-packed. This article showcases 31 websites that run on Drupal.

Welcome to the Yahoo! Design Pattern Library. We're thrilled to be sharing patterns and code with the web design and development community, hope it's useful, and look forward to your feedback.

Dive Into Python is a Python book for experienced programmers. You can buy a printed copy, read it online, or download it in a variety of formats. It is also available in multiple languages.

A print version was published by Apress in December 2007, but you can read it free here. We only ask that you post comments and suggestions so we can improve the book over time.

To the extent possible, this book covers Django 0.96 and higher.

This tutorial shows you how to create your first Cocoa app. It assumes no previous experience with programming or Xcode.

Below you’ll find a list of techniques we, as web-architects, really couldn’t live without. They are essential and they indeed make our life easier. Let’s take a look at 53 CSS-based techniques you should always have ready to hand if you develop web

Jelly is casual coworking. We invite people to work from our home for the day. We provide chairs and sofas, wireless internet, and interesting people to talk to, collaborate with, and bounce ideas off of.

A common stumbling block for Rails developers is learning the basics required to write plugins. The purpose of this article is to demystify writing plugins using examples of common patterns used by popular plugins.

ActionHead offers an affordable solution for companies and individuals seeking the best in professional website design.

Flot is a pure Javascript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side.

The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming.

A few months ago I really hated the idea of testing my code, I just didn't do it. Now I couldn't think of writing a line of code without the proper tests in place.

These pages are a brief overview of each of the patterns in P of EAA. They aren't intended to stand alone, but merely as a quick aide-memoire for those familiar with them, and a handy link if you want to refer to one online.

Estimation is a chronically thorny issue for software practitioners, but in our industry we don't do a great job of estimation. In this column I offer several safety tips as you prepare estimates for your project and for your individual work.

Uni-Form is an attempt to standardize form markup (xhtml) and css, "modularize" it, so even people with only basic knowledge of these technologies can get nice looking, well structured, highly customizable, semantic, accessible and usable forms.

jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.

A peak at some templates I use in my workflow to help on new web development projects. In addition to the XHTML templates, I’ll go over some CSS templates and some XHTML markup examples I’ve made to help me create style guides for various sites.

YSlow analyzes web pages and tells you why they're slow based on the rules for high performance web sites. YSlow is a Firefox add-on integrated with the popular Firebug web development tool.

Blueprint is a CSS framework, which aims to cut down on your CSS development time. It gives you a solid CSS foundation to build your project on top of, with an easy-to-use grid, sensible typography, and even a stylesheet for printing.

This script makes it easy to create a sliding carousel component. This script uses the Prototype javascript framework and the effects.js library from Scriptaculous.

The Year of the Script may have drawn attention away from CSS but building fluid, multi-column, cross-browser CSS layouts can still be as unpleasant as a lump of coal. Read on for a worry-free approach in three quick steps using YUI Grids CSS.

The YUI Grids Builder — a simple interface for Grids customization

Never before has there been a web-based Subversion browser that is as beautiful as it is simple. Imagine being able to quickly give users fine grain access to your repositories without the hassle of having to ssh into your server and run a bunch of comman

Controller code snippet for doing partial validations on Rails model objects

The foundational YUI Grids CSS file offers three preset page widths, seven core templates, and the ability to nest subdivided regions of one to four columns. All told, the file offers almost 200 preset layouts that work across all A-grade browsers.