• Tweet

• Tweet

Almost a month has passed since the last web design & web development resources article and it is time for a new one. This one doesn’t contain as many tools and plugins as the last one, but has a few really good and useful.

34 Responsive Grid System

34Grid is a Responsive Grid System based on “equally distributed columns” layout basis. In contrast to other great grid systems (@see bottom of page), 34Grid provides equally distributed columns for each row. (and also column complements for inequal distributions)

Makisu: CSS 3D DROPDOWN CONCEPT

Opal

Opal is a ruby to javascript compiler. It is source-to-source, making it fast as a runtime. Opal includes a compiler (which can be run in any browser), a corelib and runtime implementation. The corelib/runtime is also very small (10.8kb gzipped).

Sly

jQuery plugin for one-directional scrolling with item based navigation support

Orion: Open Source Platform For Cloud Based Development

Responsive design testing tool

Viewport resizer is a browser-based tool to test any website’s responsiveness. Just save the bookmarklet, go to the page you want to test, click on your created bookmarklet and check all kinds of screen resolutions of the page.

The smartest way to share your defined environment of devices and breakpoints directly with your team and client.

This bookmarklet should not replace a real device simulation. It rather helps you, your team and client testing statuses, transitions, text length etc. throughout different device types.

Emmet — the essential toolkit for web-developers

Emmet (previously known as Zen Coding) is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow.

Basically, most text editors out there allow you to store and re-use commonly used code chunks, called “snippets”. While snippets are a good way to boost your productivity, all implementations have common pitfalls: you have to define the snippet first and you can’t extend them in runtime.

Emmet takes the snippets idea to a whole new level: you can type CSS-like expressions that can be dynamically parsed, and produce output depending on what you type in the abbreviation. Emmet is developed and optimised for web-developers whose workflow depends on HTML/XML and CSS, but can be used with programming languages too.

Cedvel, an application for designing grid systems

Cedvel aims to ease the grid design process and help you explore more alternatives. It is still far from being finished but you can test the prototype and if you do so, please send in any feedback regarding your experience.

duri.me: a super simple dataURI tool

Jim Knopf: a small JavaScript library to create knobs using SVG

Cut&Slice me

Use Cut&Slice me to export your assets to different devices in seconds. Improve your workflow by just naming your layers.

Adobe Edge Inspect

Pods

Pods is a framework for WordPress that allows you to create, extend, manage, and deploy customized content types and fields.

Stripe

Stripe makes it easy to start accepting credit cards on the web today. You don’t need a merchant account or gateway. Stripe handles everything, including storing cards, subscriptions, and direct payouts to your bank account.

Stripe.js lets you build your own payment forms while still avoiding PCI requirements.

ReactiveUI: Reactive Programming for WPF, Silverlight, WinRT, and Windows Phone 7

Ratchet: Prototype iPhone apps with simple HTML, CSS and JS components.

Originally posted 2014-10-05 13:09:08.