You Are Here: Home » Posts tagged "Grid"

Build a Dribbble Portfolio Grid With Flexboxgrid and Jribbble

Building with a grid has become an everyday requirement for front-end developers. Not only do grids provide a sense of rhythm and consistency in design, but when a well-known grid structure is used it provides a simple collective design language for cross–team work. Flexboxgrid is a new framework which allows you to combine the predictability and common language structure of a grid system with the flexibili ...

Read more

Tag & Search Your Chrome Bookmarks with Dewey

Advertise here via BSA Dewey is a Chrome app for tagging, searching and sorting your Chrome bookmarks . With Dewey you can add custom tags, generate screenshots of your bookmarks, search and sort in a much smarter and faster way. Dewey organizes your bookmarks into a grid that continues to load as you scroll down. The layout is also fully responsive, so it still works well even if you need to use a narrow b ...

Read more

Building the Responsive Timeline Portfolio Page

What You'll Be Creating During this tutorial we will be building the fantastic Timeline Portfolio as seen in an earlier tutorial by Tomas Laurinavicius. We will be using some responsive techniques as well as CSS3 animations, Sass and a little bit of jQuery. File and Directory Structure OK, the first step is to create the files and folders we need. The image below shows our root structure. As you can see, we ...

Read more

How They Did It: Typekit’s New Homepage

Typekit recently redesigned their homepage with some new services in mind. When Typekit joined Adobe, they set out to bring us a new way to handle fonts on the web. Not only did they create a fairly simple way to embed fonts on the web, but they have now officially launched a desktop sync option , which allows Creative Cloud subscribers to sync fonts to their computer directly from Typekit. This has been in ...

Read more

Building a Complete Website With the Gumby Framework

In this, our final video tutorial on Gumby, we’re going to put all we’ve learned into practice. We’re going to build a complete website using Gumby’s semantic grid, parallax effects, toggles and switches, covering workflow best practices as we go. There’s plenty to cover, so let’s get started! The Complete Gumby Site Build Alternatively, download the video , or subscribe to Webdesigntuts+ screencasts via Yo ...

Read more

Reducing the Bloat

Complexity in our designs is often unavoidable. Sometimes, it’s also necessary. When working for any client there is always going to be a level of complexity that we will try to reduce, whether this is through the amount of navigation items they want, the amount of content that they have, or anything else that seems overly convoluted or difficult to follow. Our job as a designer or developer (or both) is al ...

Read more

Build a Freshly Squeezed Responsive Grid System

I’d like to talk to you about Lemonade . Not the refreshing citrus drink, but a grid system I created. Lemonade is a grid system that was built in order to give designers and developers the confidence to make fully responsive websites, eliminating the frustration of flicking between browsers looking for bugs and errors. Let’s look at how it’s put together and how you can build your very own responsive grid ...

Read more

Dynamic-Column & Gap-Free Grids: Mason.js

There are various JavaScript-powered solutions for creating dynamic-column grid layouts (like Pinterest) . Although most of them are great, sometimes, the grids contain gaps or ragged edges. Mason.js is a jQuery plugin that aims to perfect such grids by filling those gaps smartly. One the grid is created, the plugin calculates where those gaps exist and fills them with either predefined elements or by dupli ...

Read more

© 2011 Powered By Wordpress, Goodnews Theme By Momizat Team

Wordpress SEO Plugin by SEOPressor
Scroll to top