Multi-Column Lists / A List Apart
september 2011 by jordi9
How to split an ul into columns
css
webdesign
september 2011 by jordi9
Google Web Fonts
august 2011 by jordi9
Hundreds of free, open-source fonts optimized for the web
Just 3 quick steps between you and a good lookin’ website
1. Choose:
Search or browse hundreds of font families, then add the ones you like to your Collection.
2. Review:
Compare and refine your Collection, even see the styles in a dynamic sample layout.
3. Use:
Grab the code we prepare and you’re ready to add the Collection to your website!
design
fonts
google
webdesign
Just 3 quick steps between you and a good lookin’ website
1. Choose:
Search or browse hundreds of font families, then add the ones you like to your Collection.
2. Review:
Compare and refine your Collection, even see the styles in a dynamic sample layout.
3. Use:
Grab the code we prepare and you’re ready to add the Collection to your website!
august 2011 by jordi9
Centering Block Element - CSS Discuss
july 2011 by jordi9
center an element using position absolute
css
webdesign
july 2011 by jordi9
The Team | LATERAL
february 2011 by jordi9
Lateral is “special” because of its people – the quality of the team is outstanding. We take great pride in our people, who are our most valued asset.
Lateral is a small company with a big ambition, focused on delivering innovation and results.
Design & Technology with passion. Work with fun!Lead us with carelessness and…Also, you can press keyboard keys “a”,”s”,”d” … “l” and “space”
design
inspiration
webdesign
fun
javascript
Lateral is a small company with a big ambition, focused on delivering innovation and results.
Design & Technology with passion. Work with fun!Lead us with carelessness and…Also, you can press keyboard keys “a”,”s”,”d” … “l” and “space”
february 2011 by jordi9
CSS Killswitch
january 2011 by jordi9
CSS (short for "Cascading Style Sheets") is the markup that makes the internet look the way it does.
CSS Killswitch works by creating a unique, inconspicuous, and innocuous stylesheet that you'll link the potentially problematic client's site to. Should negotiations go south and passwords get changed before you receive payment, that stylesheet can be activated to superficially black out the site, returning to you the upper hand. *
When relations return and you've received payment, the killswitch is easily deactivated and its traces removed.
Not convinced? Try a two second demo of what it could do to this page.
Oh, did I mention this is free? Because it's free.
css
webdesign
security
business
tricks
CSS Killswitch works by creating a unique, inconspicuous, and innocuous stylesheet that you'll link the potentially problematic client's site to. Should negotiations go south and passwords get changed before you receive payment, that stylesheet can be activated to superficially black out the site, returning to you the upper hand. *
When relations return and you've received payment, the killswitch is easily deactivated and its traces removed.
Not convinced? Try a two second demo of what it could do to this page.
Oh, did I mention this is free? Because it's free.
january 2011 by jordi9
45 Free eBooks for Developers and Designers | Speckyboy Design Magazine
january 2011 by jordi9
45 Free eBooks for Developers and Designers via @speckyboy
webdesign
ebook
development
free
design
january 2011 by jordi9
The Mad Ranter: Damn IE7 and inline-block
october 2010 by jordi9
Except IE7 doesn't understand inline-block properly.
It's to do with a hidden property called hasLayout the mention of which can cause seasoned web developers to tear their hair out, see you can't set it explicitly no such thing as hasLayout: on; it's set when other properties get applied and surprise surprise it's an IE only creation.
So to call this elusive hasLayout you need to set a property of "zoom:1;" to any element you want to work correctly. It doesn't do anything; if you set it to 2 it'll make things twice as large, but 1 nowt.
So that's that - nope, see if you set hasLayout as above for an element that is by default a block and then try to make it an inline-block IE7 still ignores it. So you need to add in one extra little snippet "*display: inline;" the star is important as every other correct browser will ignore that item, but dumb-old Internet Explorer won't and amusingly despite setting it to plain old inline it'll happily apply block properties to it too.
ie7
css
fix
hack
webdesign
inline-block
display
It's to do with a hidden property called hasLayout the mention of which can cause seasoned web developers to tear their hair out, see you can't set it explicitly no such thing as hasLayout: on; it's set when other properties get applied and surprise surprise it's an IE only creation.
So to call this elusive hasLayout you need to set a property of "zoom:1;" to any element you want to work correctly. It doesn't do anything; if you set it to 2 it'll make things twice as large, but 1 nowt.
So that's that - nope, see if you set hasLayout as above for an element that is by default a block and then try to make it an inline-block IE7 still ignores it. So you need to add in one extra little snippet "*display: inline;" the star is important as every other correct browser will ignore that item, but dumb-old Internet Explorer won't and amusingly despite setting it to plain old inline it'll happily apply block properties to it too.
october 2010 by jordi9
50 Fantastically Clever Logos | Design Shack
july 2010 by jordi9
50 Fantastically Clever Logos /via @jonpdx
logo
design
branding
creativity
webdesign
inspiration
july 2010 by jordi9
The LinkedIn Blog » Inside Look: Designing LinkedIn Faceted Search «
march 2010 by jordi9
Designing LinkedIn Faceted Search
linkedin
search
ux
webdesign
****
march 2010 by jordi9
Process of redesigning Janko At Warp Speed, explained
march 2010 by jordi9
how to redesign a website
ux
ui
webdesign
article
inspiration
march 2010 by jordi9
Ultimate guide to table UI patterns
march 2010 by jordi9
How to display a lot of data using tables or grids.
ux
tips
webdesign
*****
inspiration
march 2010 by jordi9
Mockingbird
december 2009 by jordi9
Mockingbird is an online tool that makes it easy for you to create, link together, preview, and share mockups of your website or application.
design
mockup
prototyping
webdesign
ux
ui
december 2009 by jordi9
Designing for Social Traction (slide deck) - Bokardo
september 2009 by jordi9
Here is the slide deck from a talk I gave last week at Delve, a two-day masterclass held in Brooklyn, NY.
The talk is in three parts, with each part focusing on a specific problem in software. Each problem is a major hurdle in what I call the usage lifecycle, or the stages people go through as they use and adopt software over time. These three hurdles come directly out of the work I do with clients…I’ve been focusing almost exclusively on these specific problems…I hope the slides help you focus on them as well.
The feedback from my talk has been great…lots of folks like to see these steps broken down…I think it helps make design challenges a little more manageable so you don’t feel overwhelmed with “so much is broken…what should I fix first?”. I would love any feedback you have as this new content will make its way into the 2nd edition of my book.
design
webdesign
social
socialmedia
ux
business
marketing
starred
presentation
The talk is in three parts, with each part focusing on a specific problem in software. Each problem is a major hurdle in what I call the usage lifecycle, or the stages people go through as they use and adopt software over time. These three hurdles come directly out of the work I do with clients…I’ve been focusing almost exclusively on these specific problems…I hope the slides help you focus on them as well.
The feedback from my talk has been great…lots of folks like to see these steps broken down…I think it helps make design challenges a little more manageable so you don’t feel overwhelmed with “so much is broken…what should I fix first?”. I would love any feedback you have as this new content will make its way into the 2nd edition of my book.
september 2009 by jordi9
border-radius and -moz-border-radius < CSS | The Art of Web
august 2009 by jordi9
One of the most keenly-anticipated CSS3 properties is border-radius. Web designers will no longer have to resort to complex table structures using custom-made corner graphics or including arcane JavaScript files in order to produce designs with rounded corners.
While Internet Explorer doesn't support many (or any) advanced CSS properties, you can get started using Firefox and any of the 'Mozilla' family of browsers. Apple's WebKit web browser engine also supports rounded corners making them available in the Safari and Chrome web browsers, the iPhone and other devices running WebKit.
css
webdesign
design
firefox
reference
css3
webkit
While Internet Explorer doesn't support many (or any) advanced CSS properties, you can get started using Firefox and any of the 'Mozilla' family of browsers. Apple's WebKit web browser engine also supports rounded corners making them available in the Safari and Chrome web browsers, the iPhone and other devices running WebKit.
august 2009 by jordi9
25 Classic Fonts That Will Last a Whole Design Career
august 2009 by jordi9
Eric Gill, Adrian Frutiger and Max Miedinger are names we associate with the classic typefaces designers use on a daily basis. Their font creations are timeless designs that look right at home no matter what century we’re in. This collection of 25 classic fonts is a round up of the best and most popular fonts every designer should own. You can be sure that they will last your whole design career.
fonts
design
list
inspiration
webdesign
august 2009 by jordi9
Pattern Tap : Organized Web Design Collection of User Interfaces for Inspiration and Ideas. The CSS Gallery Alternative - Pattern Tap
april 2009 by jordi9
# Browse the collections to find your favorite design elements.
# Use the User Sets like lightboxes to keep your favorites organized.
webdesign
design
inspiration
ui
interface
ux
# Use the User Sets like lightboxes to keep your favorites organized.
april 2009 by jordi9
The method still works (UI design) - 37signals
april 2009 by jordi9
While I might use some different language today, this technique I posted in 2004 (inspired by Alexander) is still a major help when I’m designing a UI with many elements to juggle. The reason I come back to it is that it helps me design with language first instead of empty templates. Too often a design starts top-down with empty content areas (maybe a main column and a sidebar) and then we fill those boxes in until its “done.” Filling in the boxes would work fine, except having a bunch of stuff on the page doesn’t mean we served the design goals.
design
ui
webdesign
37signals
inspiration
ux
april 2009 by jordi9
37signals: An Introduction to Using Patterns in Web Design
april 2009 by jordi9
The biggest challenge for web designers is the unthinkably huge number of possible ways to solve any given problem. We usually don't think of this because we have our habits and traditions to fall back on, but there are literally billions of possible pixel combinations for each page we make.
There is a better way to manage this vast complexity than by making big decisions up front and hoping for the best. To make better sites — sites that are functional, beautiful, and "usable" — we have to break our design problems up into small independent chunks based on the real issues within our requirements. Christopher Alexander, who came up with this stuff, calls these chunks patterns.
I'm going to show you how to sidestep your habits and assumptions and use patterns to make better design decisions. A lot of fancy stuff has been written about patterns. To be simple and clear in this introduction, I'll just call them chunks.
design
webdesign
ui
37signals
starred
ux
There is a better way to manage this vast complexity than by making big decisions up front and hoping for the best. To make better sites — sites that are functional, beautiful, and "usable" — we have to break our design problems up into small independent chunks based on the real issues within our requirements. Christopher Alexander, who came up with this stuff, calls these chunks patterns.
I'm going to show you how to sidestep your habits and assumptions and use patterns to make better design decisions. A lot of fancy stuff has been written about patterns. To be simple and clear in this introduction, I'll just call them chunks.
april 2009 by jordi9
Corporate Websites - 50 Excellent Corporate Website Designs | Webdesigner Depot
april 2009 by jordi9
Web design is all about conveying information to the users in the most direct, clean and usable manner.
A corporate website also needs to capture the feel of the company and its purpose, while remaining professional in order to attain a solid and lasting impression to its customers.
Graphics, layouts and color palettes are all essential in how the customers perceive a company when visiting their website. Dark color designs, for example, can be interpreted as serious, while blue hues give a feeling of trust.
Here are 50 corporate website designs that you can use for inspiration in your own corporate designs.
webdesign
design
inspiration
web
A corporate website also needs to capture the feel of the company and its purpose, while remaining professional in order to attain a solid and lasting impression to its customers.
Graphics, layouts and color palettes are all essential in how the customers perceive a company when visiting their website. Dark color designs, for example, can be interpreted as serious, while blue hues give a feeling of trust.
Here are 50 corporate website designs that you can use for inspiration in your own corporate designs.
april 2009 by jordi9
related tags
*** ⊕ **** ⊕ ***** ⊕ 37signals ⊕ aboutus ⊕ apple ⊕ article ⊕ bestpractices ⊕ book ⊕ branding ⊕ browser ⊕ business ⊕ button ⊕ buttons ⊕ checkout ⊕ code ⊕ creativity ⊕ css ⊕ css3 ⊕ cta ⊕ design ⊕ development ⊕ display ⊕ dropdown ⊕ ebook ⊕ editor ⊕ effects ⊕ examples ⊕ favicon ⊕ firebug ⊕ firefox ⊕ fix ⊕ fonts ⊕ free ⊕ fun ⊕ gallery ⊕ gender ⊕ generator ⊕ google ⊕ graphics ⊕ grid ⊕ gui ⊕ guide ⊕ hack ⊕ howto ⊕ html ⊕ html5 ⊕ icons ⊕ ie ⊕ ie7 ⊕ inline-block ⊕ inspiration ⊕ interface ⊕ javascript ⊕ js ⊕ leanstartup ⊕ linkedin ⊕ list ⊕ logo ⊕ loremipsum ⊕ marketing ⊕ menu ⊕ microsoft ⊕ mobile ⊕ mockup ⊕ mvp ⊕ optimization ⊕ placeholder ⊕ presentation ⊕ programming ⊕ prototype ⊕ prototyping ⊕ psd ⊕ reference ⊕ resources ⊕ screen ⊕ search ⊕ security ⊕ service ⊕ shopping ⊕ social ⊕ socialmedia ⊕ software ⊕ starred ⊕ startup ⊕ templates ⊕ test ⊕ themes ⊕ tips ⊕ tool ⊕ tools ⊕ tricks ⊕ tutorial ⊕ typography ⊕ ui ⊕ ux ⊕ video ⊕ web ⊕ webapp ⊕ webdesign ⊖ webdev ⊕ webkit ⊕ windows ⊕ wireframe ⊕ wordpress ⊕ xhtml ⊕ yahoo ⊕ yui ⊕Copy this bookmark: