Free Ebooks for Designers & Developers

Whenever you are a newbie designer, or an advanced pro, the Web always has some interesting reading for you. Looking for a little experience in wiring SVG, building web apps or becoming a full-time freelancer? Well, there is no need to drown in hefty books. There are a lot of short, but useful ebooks which can help you become a pro in a particular subject. And the best part of these ebooks is that all of them are completely free to download!

So, scroll down and enjoy a showcase of 15 free ebooks for web designers and developers to take your skills to the next level. Some are available as PDF and other formats, while others can only be read online.

1. Pocket Guide to Writing SVG

In this guide, you’ll find a detailed introduction to writing SVG (Scalable Vector Graphics) and get an understanding on where to start. Using clear examples of fruit images and brief description of attributes, you’ll learn SVG step by step with this handy pocket guide. Also available in Portuguese.

Author: Joni Trythall

Available: Read Online

2. Speaking JavaScript

This ebook would be useful for both newbie Javascript programmers and for seasoned JavaScript programmers as it features the topic in-depth. The author continuousyly blog about Javascript and his other interests on his blog2ality.com

Author: Dr. Axel Rauschmayer

Available: Read Online

3. Adaptive Web Design

Learn the origins of progressive enhancement, its mechanism, philosophy, and a lot of practical ways which you can apply progressive enhancement principles using JavaScript, HTML, and CSS in this 6-chapter book.

Author: Aaron Gustafson

Available: Read Online

4. 27 Page Type Classification eBook

The 27 pages of this short ebook will walk you through the key classifications for typography. It covers a quick history for each classification and core characteristics of the style.

Author: Jacob Cass

Available: PDF

5. 11 Things to Do with Every New WordPress Install

This guide includes 11 awesome tips on how to build a great WordPress site. If you’re a newbie on this matter and who is just going to install WordPress, this ebook was written for you.

Author: iThemes Media

Available: PDF

6. Building Web Apps with Go

This is a 15-chapter ebook by Jeremy Saenz, which will teach you how to quickly build web applications using the Go programming language.

Author: Jeremy Saenz

Available: PDF | ePUB | Mobi | Read Online

7. Go Mobile With WordPress

It’s never too late to turn your site mobile. Learn what is responsive design, mobile sites and mobile apps, and the tips you need to turn a site mobile-friendly.

Author: iThemes Media

Available: PDF

8. HTML Canvas Deep Dive

It contains exercises, interactive examples and walkthrough lessons to get you started on building your canvas app. It is advised that you should know a bit Javascript and HTML before going into this book.

Author: Josh Marinacci

Available: Read Online

9. 10 Keys to Great Landing Pages

In this really short ebook you’ll get to know the key differences between landing pages and home pages, why they are so important, and how to build smart cool landing page, all in less than 20 pages.

Author: iThemes Media

Available: PDF

10. Book of Speed

The book of speed by Stoyan Stefanov is an online, free ebook about web performance. It begins by focusing on the business implications of web performance: why speed matters to the bottom line, and then moves on to changes that can make the performance better.

Author: Stoyan Stefanov

Available: Read Online

11. A Practical Guide to Designing for the Web

This ebook written by Five Simple Step’s founder Mark Boulton. The ebook covers 5 main chapters including topics like research and ideas, colors, typography, layout and what to expect if you are going into the world of web design.

Author: Mark Boulton

Available: PDF

12. PHP: The Right Way

There is so much outdated info on the Web that leads new PHP users astray. This ebook if here to stop that. PHP: The Right Way is an easy to read and understand ebook with PHP best practices and links to authoritative tutorials.

Author: Josh Lockhart

Available: Read Online

13. Essential Career Advice for Developers

This book was written by the founder and CEO of iThemes, specifically for developers. It will tell you how to build your portfolio, work with clients, develop good communication skills, and inspire you to keep learning and exploring.

Author: Cory J. Miller

Available: PDF

14. So You Want To Be A Freelancer?

Do you want to be a full-time freelance web designer, but have no idea where to start? This ebook will tell you all pros and cons of a freelance web designer career, along with some practical tips how to build a strong business in this field. You’ll learn how to make money, be more organized, find new clients, and more.

Author: iThemes Media

Available: PDF

15. Magic of CSS

There are six chapters encompassing the box model, layout, table layout, color, typography and CSS transitions. The book is easy to understand, well written and full of interactive examples to keep things interesting.

Author: Adam Schwartz

Available: Read Online

via hongkiat.com

Advertisement

Great examples of innovative navigation for inspiration

Could you imagine landing on a website with no navigation? It would be like trying to find your way in the ocean with no compass. It would be terrible.

Lucky for you, most sites have at least some kind of navigation, so you’re not completely lost. Recently, the Betterment blog featured a UX Flows post on navigation, where we discussed the importance and function of navigation in a web site. Navigation is critical — and it’s safe to say that some sites do it better than others. For this post, we’ve decided to take a look at some navigation that’s breaking the mold.

Take a look, and say “ahoy” with your thoughts in the comments!

Yar, Matey! Let’s Set Sail to 23 Web Destinations.

1. Disqus

Disqus offers simple and effective navigation. The streamlined header is highlighted in white, which stands out against the blue background, and a footer navigation also appears with more options after scrolling down.

2. Big Spaceship

With a different approach, Big Spaceship offers left sidebar navigation that expands from a menu icon that is similar to what you see on mobile sites. The nav is easy to find in the upper left hand corner of the main landing section, which displays a paint splash animation against a black background.

3. Dataveyes

Upon loading, the Dataveyes navigation is conspicuously displayed in the center of the header, but then shrinks to a mobile navigation icon, allowing you to easily access the information without intruding on the content.

4. Glossy ReyWith contrasting white text against a black background, the split navigation header is easy to locate and offers a really cool hover animation for each menu option.

5. Words Pictures Ideas

This single page, anti-navigation website is captivating and organized — users can still find their way around the site with ease.

6. Equus Design

Simple, clean, and minimalist, the navigation design for Eqqus Design pops against the page’s dark background.

7. Miss Julia Piep

When you land on Miss Julia Piep’s page, the company logo is centered with a row of five menu options below it, and when you select an option, the responsive navigation moves to the top of the page. Neat.

8. Teehan + Lax

Teehan + Lax’s mobile navigation icon flies out to offer six menu options that you can later close.

9. Danielle LaPorte

Danielle LaPorte’s nav is fancy, as the navigation responsively appears in both the header and the footer as you scroll. Best of both worlds!

10. Olympic Story

A mobile nav icon flies out to be a substantially sized sidebar menu that also can be closed. Boom — mobile can be anywhere and now it is.

11. Curad Mir

Users’ attention is drawn to the upper left hand navigation icon, and without even clicking — just hovering over the icon — a menu sprawls out along the top bar while a white frame outlines the page.

12. Weyland Industries

Neatly tucked under the company’s logo with an arrow that implores you to click, the mega- navigation flies out to offer three main categories of navigation with multiple options below it. For sites that have a ton of content, neatly organized mega-menus with flyouts are where it’s at (jussayin’).

13. Lexus

This navigation is different from most top bar menus. Lexus layers it up with a full navigation bar that flips out directly below the “MENU.” Layers of navigation = layers of fun. (Plus the option to use your keyboard!)

14. P’unk Avenue

P’unk Avenue’s navigation keeps it easy breezy for users with a horizontal grid-esque design at the top of the page that’s also numbered, titled, and provides a short, one-sentence description of what you’ll find.

15. SRG

It’s the circle of navigation! The pageless design is navigable by way of a responsive hero area circle navigation. I clicked to learn more — would you?

16. I Think I Might

Easy to use icon navigation in the upper right hand corner of the page makes navigating this site caveman-picture simple.

17. Zaarly’s Employee Handbook

Zaarly’s nav starts out as a boring mobile icon — then BOOM! Fun, full-screen navigation with color bar menu that cascades down and across the screen. I love it when designers realize the nav doesn’t have to be boring.

18. Editer

Speaking of top bar navigation menus, Editer provides us with just that, but the flyout feature enhances the experience and organizes the content, which is essential for mega-sites.

19. Firestorm

The Guardian’s completely interactive site is exploding with drool-worthy design aspects. The vertical navigation menu is easy to see but doesn’t take away from what’s going on visually — and it’s educational! Bonus!

20. Petersham Nurseries

Petersham Nurseries gives you two navigation menus: vertical navigation menu on the left, providing new users with information on the company, and a horizontal navigation menu on the top right for account holders.

21. NKI Studio

This site’s navigation commands attention from a different perspective in the bottom left of the page.

22. Cloud Nine

Cloud Nine has left side icon navigation in a blue colorblock bar, which nicely complements the responsive, pageless design.

23. Pervasive Light

Pervasive Light’s light bulb nav is exciting with an electric wiggle mouse over feature. The nav also smartly flies up and out of the way when users reach their destination.

via dtelepathy.com

BLOKK – a font for quick mock-ups and wireframing

BLOKK fontBLOKK is a font for quick mock-ups and wireframing for clients who do not understand latin.

Download font

Is Flat Design Already Passé?

MAYBE IT’S TIME TO GIVE SKEUOMORPHISM ANOTHER TRY?

Over the last few years, we’ve seen an upheaval in the way computer interfaces are designed. Skeuomorphism is out, and flat is in. But have we gone too far? Perhaps we’ve taken the skeuomorphic death hunts as far as they can go, and it’s high time we usher in a new era of post-flat digital design.

Ever since the original Macintosh redefined the way we interact with computers by creating a virtual desktop, computer interfaces have largely been skeuomorphic by mimicking the look of real-world objects. In the beginning, computer displays were limited in resolution and color, so the goal was to make computer interfaces look as realistic as possible. And since most computer users weren’t experienced yet, skeuomorphism became a valuable tool to help people understand digital interfaces.

But skeuomorphism didn’t make sense once photo-realistic computer displays became ubiquitous. Computers have no problem tricking us into thinking that we’re looking at something real so we don’t need to use tacky design tricks like fake stitching or Corinthian leather to fool us into thinking our displays are better than they are. In addition, most people have grown up in a world where digital interfaces are common. UI elements don’t haveto look like real world objects anymore for people to understand them.

This is why Jony Ive took over the design of Apple’s iOS and OS X operating systems and began a relentless purge of the numerous skeuomorphic design elements that his predecessor, skeuomaniac Scott Forstall, created. To quote our own John Pavlus, “skeuomorphism is a solution to a problem that iOS no longer has”… and that’s true of other operating systems and apps too. Google, Microsoft, Twitter, Facebook, Dropbox, even Samsung, they’re all embracing flat design, throwing out the textures and gradients that once defined their products, in favor of solid hues and typography-driven design.

This is, without a doubt, a good thing. Skeuomorphism led to some exceedingly one-dimensional designs, such as iOS 6’s execrable billiard-style Game Center design. But in an excellent post, Collective Ray designerWells Riley argues that things are going too far.

Flat design is essentially as far away from skeuomorphism as you can get. Compare iOS 7’s bold colors, unadorned icons, transparent overlays and typography-based design to its immediate precessor, iOS 6. Where once every app on iOS had fake reflections, quasi-realistic textures, drop shadows, and pseudo-3-D elements, iOS 7 uses pure colors, no gradients, no shadows, and embraces the 2-D nature of a modern smartphone display. But while flat design has made iOS 7 look remarkably consistent, it has also removed a lot of personality from the operating system. It’s like the Gropius house, when the old iOS 6 was a circus funhouse. Maybe it needs to get a little bit of that sense of madness back.

Here’s how Riley defines elements of a post-flat interface:

• Hierarchy defined using size and composition along with color.

• Affordant buttons, forms, and interactive elements.

• Skeuomorphs to represent 1:1 analogs to real-life objects (the curl of an e-book page, for example) in the name of user delight.

• Strong emphasis on content, not ornamentation.

• Beautiful, readable typography.

Riley’s argument is that flat design has allowed digital designers to brush the slate clean in terms of how they approach their work, but it has also hindered a sense of wonder and whimsy. Software should still strongly emphasizes content, color, and typography over ornamentation, but why is, say, the curl of a page when you’re reading an e-book such a crime, when it so clearly gives users delight?

“Without strict visual requirements associated with flat design, post flat offers designers tons of variety to explore new aesthetics—informed by the best qualities of skeuomorphic and flat design.” Riley writes. Dust off your drop shadows and gradients, and introduce them to your flat color buttons and icons. Do your absolute best work without feeling restricted to a single aesthetic. Bring variety, creativity, and delight back to your interfaces.”

Maybe Riley has a point. Why should mad ol’ Scott Forstall be allowed to ruin skeuomorphism for everyone? With the lightest of brush strokes, skeuomorphism can be used to bring back a sense of personality and joy to our apps. For those of us growing listless in the wake of countless nearly identical “flat” app designs, he makes a good point. It is time for the pendulum towards flat and away from skeuomorphism to swing back, if only a little bit.

via fastcodesign.com

28 Free Resource Websites for Designers and Developers

Whether you are a designer, developer, marketer, copywriter or otherwise, there is something in this list for you. Granted the number of tools online has been growing very quickly and it’s certainly not a complete collection. If you know of any helpful links which I’ve forgotten please share with us in the discussion area below.

Web Colour Data

CodePen

365psd

Gridulator

Font2Web

Source Canvas

WordPress Query Generator

Buttons

HTML Email Boilerplate

Google Web Designer

Screen Sizes

CSS Font Stack

PixelsDaily

Unheap

Colourcode

Pure CSS

Favigen

resizeMyBrowser

Responsive Elements

Forecast Font

Font Awesome

Prefixr

PXtoEM

Ajaxload

Iconza

DesignFloat

Subtle Patterns

PageSpeed

via designm.ag

Google launches Web Designer, and its free! (beta)

30 September Google launched a new advertising application in beta called Google Web Designer. The company says the tool is for creating “professional-quality design” HTML5 ads and campaigns accessible to everyone from the designer to the dabbler.

HTML5 is widely seen as the standard that everyone on the Web should adopt. In case you didn’t know, Google describes HTML5 as a “universal language for building beautiful, engaging content that can run across desktops, smartphones, and tablets.” It is thus the company’s hope that Google Web Designer will help make HTML5 accessible to people throughout the advertising industry, getting Web developers closer to the goal of “build once, run anywhere.”

Here’s the current feature list for Google Web Designer beta:

• Create animated HTML5 creative, with a robust, yet intuitive set of design tools.
• View and edit the code behind your designs and see your edits reflected back on the stage automatically.
• Build ad creatives seamlessly for DoubleClick and AdMob, or publish them to any generic environment you choose.
• Receive updates to the product automatically, without having to re-download the application.
• Access all of this entirely for free.

If you prefer the visual version, Google has provided multiple YouTube videos to show off the tool. Here’s one of them:

If this piques your interest you should read the getting started guide. Google is also asking for feedback, which you can provide on its user forum and Google+ page.

Again, this is just a beta, although Google does use the tag with little regard for its meaning. That being said, the company says it is “working hard over the next couple quarters to add new features and improvements.” We’ll let you know when its stable release is available.

via thenextweb

15 free ebooks for web designers

There’s plenty of free advice and tuition out there for web designers. Get your teeth into these great free ebooks.

Looking for a little expertise in HTML5, coding or going it alone? Well, to need to get bogged down in hefty hardbacks – there’s a huge range of digestible ebooks for you to get your teeth into. And most importantly, many of them are free. Here we list of 10 of the best.

01. Getting Real

Getting Real

Getting Real explains how to go about building a web application and covering everything from the basics to the more advanced. Written by leading agency 37Signals – who are well known for both their blunt, no-nonsense blogging and their gung-ho, “you can do it” attitude, this is very far from a dry, technical text. And best of all, you can download a PDF version for free!

02. The elements of typographic style applied to the web

The Elements of Typographic Style Applied to the Web

This very readable manual and reference on modern typography, explores the art and history of the field as well as technical details. The free online version includes a new chapter on digital typography, plus expanded information on typefaces and designers.

03. Just Ask: Integrating Accessibility Throughout Design

Just Ask: Integrating Accessibility Throughout Design

Written by Shaun Henry, Just Ask cover the basics of including accessibility in design projects, with shortcuts for involving people with disabilities in your project. There are tips for comfortable interaction with people with disabilities and details on accessibility in each phase of the user-centered design process.

04. Graphic Design for Non-profit Organisations

Graphic Design for Non-profit Organisations

The book focuses on design and best prac­tices for non-profit orga­ni­za­tions, but the con­tent is a great resource in gen­eral and the teach­ings can be applied pretty much any­where.

05. Scalable and Modular Architecture for CSS

Scalable and Modular Architecture for CSS

SMACSS (pronounced “smacks”) is more style guide than rigid framework. There is no library within here for you to download or install. SMACSS is a way to examine your design process and as a way to fit those rigid frameworks into a flexible thought process. And this great free book by top designer Jonathan Snook explains it all in easy-to-follow language.

06. Learning Web Design

Learning Web Design

A beginner’s guide to web design, this free ebook from Jennifer Niederst Robbins starts with the very basics of how web pages work, and goes on to take you through to CSS layouts and optimised graphic files.

07. HTML5 Quick Learning Guide

HTML5 Quick Learning Guide

Rather than trail through heavy texts on HTML5, this Quick Learning Guide provides a round up of everything you need to know in no time. The guide covers the main elements of HTML5 and focuses on the basics to help get you started, quickly.

08. How To Be Creative

How To Be Creative

Advertising executive and creative Hugh MacLeod provides 26 ‘tried-and-true tips’ to help guide your creative self through the business world. Famous for drawing cartoons on the back of business cards, each of his tips is brilliantly presented by a cartoon drawing with advice ranging from ‘ignore everybody’, ‘put the hours in’ and ‘keep your day job’.

09. Web Designer’s Success Guide

Web Designer’s Success Guide

A designer’s ebook staple, Keven Airgid’s ‘Web Designer’s Success Guide’ is a comprehensive narrative on how to set up as a freelancer, and profit. Covering topics such as making the transition to self-employment, marketing your design skills and knowing what to charge, this ebook has all the answers you’re looking for when choosing to go it alone.

10. Pixel Perfect Precision handbook

Pixel Perfect Precision handbook

The guys at London design studio ustwo love pixels. So much so that they induct all new designers into the school of pixels with their very own Pixel Perfect Precision™ (PPP™) handbook. The aim? To give pixels the care and attention they deserve, to make sure they get the simple things right before moving onto the detail.

The 165 page guide is available in iBook format for both desktop and iPad, and also a straightforward PDF. And best of all it’s still free!

11. Design Your Imagination

Design Your Imagination

Another for the rookie, ‘Design Your Imagination’ is a complete beginner’s guide to web design, although it includes great tips for old-timers, too. The book uses examples to guide the reader through its 28 chapters, ranging from the history of web design, to design principles, planning and so much more.

12. The Nature of Coding

The Nature of Coding

A professor of the Interactive Telecommunications Program at New York University, Daniel Shiffman’s ebook focuses on the programming strategies and techniques behind computer simulations of natural systems. However, bear in mind that ‘The Nature of Code’ is not one for beginners, and you’re likely to need a background in coding to understand it completely.

13. Web Design and Mobile Trends for 2013

Web Design and Mobile Trends 2013

A compilation of interviews with notable industry figures such as Jeffrey Zeldman (A List Apart), Karen McGrane, and Aarron Walter, and agencies like B-Reel, Unit9 and Ultranoir, this ebook outlines predictions for the future of web technologies and design for different devices. Also available to download and read on your iPad, Kindle and a wide range of devices and ereaders.

14. 50 Ways to Please Your Customers

50 Ways to Please Your Customers

Following mobile’s phenomenal growth in 2012, this ebook provides tips on how to build amazing websites for mobile devices. It spans problems to consider when designing the user experience, 50 strategic approaches to create multi-screen designs and 50+ best practices to streamline your mobile design skills.

15. The Woork Handbook

The Woork Handbook

The Woork Handbook is a collection of Antonio Lupetti’s blog posts,  after receiving requests by some of his four million website visitors in 2008 for a printable version. Topics cover CSS, HTML, Ajax, web programming, Mootools, Scriptaculous and other aspects about web design.

via creative bloq

Sia Aperitivos – Site of the Day

E aqui temos nós mais um prémio para Portugal. A Bürocratik empresa sediada em Coimbra foi autora no novo site da SIA Aperitivos que recebeu o prémio de “Site of the Day” pela prestigiada AWWWARDS.

Parabéns à Bürocratik pelo trabalho desenvolvido e à SIA Aperitivos por acreditar na criatividade das empresas nacionais.

website premiado

shit for making websites

1. Download IE Virtual Machines

   Test versions of IE using Virtual Machines that you download and manage in your own development environment.
   http://www.modern.ie/en-us/virtualization-tools#downloads

2. Screensiz.es

   A screen size chart for common devices. Sortable by Device name, OS, screen size, resolution, PPI, density and popularity.
   http://screensiz.es/

3. Duet – Professional Project Management

   Self-hosted project management, invoicing & payments.
   http://www.duetapp.com/home

4. Automate git pulls from GitHub

   Here’s a tutorial for having GitHub ping your server when a repo gets updated, which allows you to automate a pull using a 1-line bash script.
   http://net.tutsplus.com/tutorials/other/the-perfect-workflow-with-git-github-and-ssh/

5. Log – Console.log with Style

   easier writes to console.log that provides colors and formatting. I am deeply in love with this one.
   http://adamschwartz.co/log/

6. Flexbox

   true CSS layouts in some modern browsers, more coming.
   http://www.webmonkey.com/2013/04/the-future-of-css-flexbox-is-a-game-changer/

7. JavaScript Sequence Diagrams

   A JavaScript library for turning simple text into UML Sequence Diagrams.
   http://bramp.github.com/js-sequence-diagrams/#message

8. Live editing proof of concept in Firefox and Sublime

   Should be released soon.
   

9. Backbone.js

   Backbone’s been around awhile, but it hit 1.0 today. Definitely worth looking at as a framework for larger JS apps.
   http://backbonejs.org/

10. Superhero.js

    a treasure trove of articles surrounding JavaScript application development.
    http://superherojs.com/

11. Errplane

    Uptime, metrics
    https://errplane.com/

12. Sublimewebinspector

    A sublime text plugin that brings a lot of debugging/testing back to the editor itself (breakpoints, console etc).
    http://sokolovstas.github.com/SublimeWebInspector/

13. CSS Front-end Frameworks with comparison – By usabli.ca

    A comparison of more CSS Frameworks than you’ll ever care to use in practice. Compares more than 30 front-end frameworks by browser support, the use of less/sass, mobile and tablet support and finally, license.
    http://usablica.github.com/front-end-frameworks/compare.html?v=2.0

14. PouchDB, the JavaScript Database that Syncs

    PouchDB is a JavaScript library that allows you to store and query data for web applications that need to work offline, and sync with an online database when you are online.
    http://pouchdb.com/

15. LESS- The Dynamic Stylesheet language

    LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. Everything gets compiled back to CSS on the server side (typically using Node) or client-side JavaScript.
    http://lesscss.org/

16. bower – a package manager for web

    A simple command-line tool to download components (and their dependencies) for web projects (there are over 1,000 in their registry). Requires Node.
    http://twitter.github.com/bower/

17. Screenhero – Collaborative Screen Sharing

    2 cursors, 2 keyboards, one remote session. And it’s free.
    http://screenhero.com/

18. Hairball: for Really Complicated MailChimp Lists

    Hairball is an Air app that lets you get a little more granular when building out segmented lists. You download your list data to the app, build custom segments, and then push them back to mailchimp for use.
    http://blog.mailchimp.com/introducing-hairball-an-air-app-for-really-complicated-mailchimp-lists/

19. Gather Content

    Help organize and collaborate on content needs for your project and then send it on it’s way via their API.
    https://www.gathercontent.com/

20. Redacted

    A strange little typeface meant for use during the wireframing/prototyping phase of a project. Redacted is essentially a Lorem Ipsum replacement that renders solid blocks of grey or illegible scribbles instead of legible text.
    https://github.com/christiannaths/Redacted-Font

21. Handlebars.js: Minimal Templating on Steroids

    A JavaScript implementation of the mustache templating language.
    http://handlebarsjs.com/

22. Buffer App

    A holding bin for time-delayed posts to social networking sites.
    http://bufferapp.com/

23. Swiftype: Modern full-text search for websites and applications

    An embedded search app for websites that provides great analytics and allows you to easily customize search results for specific queries.
    https://swiftype.com/

24. Firebase – A scalable real-time backend for your website

    A real-time SaaS backend for apps, accessible entirely from front-end JavaScript
    https://www.firebase.com/

25. Starkers WordPress Theme

    A barebones WordPress theme from ViewPoint Industries
    https://github.com/viewportindustries/starkers

26. Moment.js – A lightweight javascript date library

    A 5.5kb javascript date library for parsing, validating, manipulating, and formatting dates.
    http://momentjs.com/

27. lenticular.js – tilt-controlled images

    sort of like tilt (or mouse) controlled animated gifs. fantastic for product demos, etc.
    http://lenticular.attasi.com/#

28. slabText – a jQuery plugin for creating big, bold & responsive headlines

    A typographic demo of Slab Text, which reworks headlines to fill available horizontal space.
    http://www.frequency-decoder.com/demo/slabText/#h12

29. Online JSON Editor

    A fantastic little JSON editor. Has a left pane for JSON and a right pane for a human-readable view of the data. You can edit either side and push changes back and forth, open from a url, or click save and download the edited file.
    http://jsoneditoronline.org/

30. Parsley.js – Forms Validation

    A client-side form validator (i.e. for users, not for servers) that let’s you use html data-attributes to trigger form validation, which is to say you don’t have to write any additional JavaScript to make it work.
    http://parsleyjs.org/

31. Bountify – Crowdsource Small Coding Tasks

    Post a problem and a cash bounty, get back code.
    https://bountify.co/

32. color.hailpixel.com

    A simple tool for creating color schemes… drag your mouse around to select a color / click to save it to the palette.
    http://color.hailpixel.com/

    via shitformakingwebsites.com

Design Responsive Websites Visually

With Webflow you build using our powerful and intuitive UI. Export production-ready HTML & CSS.

How it works?
Responsive design that’s faster & easier.
Webflow enables you to create responsive layouts and pixel-perfect designs directly in your browser, without writing a single line of code.

Design
Drag & drop elements on the page, and style them any way you want. If you’re familiar with Photoshop, you’ll love Webflow.

Export
Webflow generates beautiful, production-ready HTML and CSS. It’s the same code that a developer would write.

Launch
Your website works across all modern browsers and devices. Push the code to your own server or let us handle the hosting for you.

Try Webflow