blumenberg + webdesign 329
Responsive Design Test Bookmarklet
january 2012 by blumenberg
It lets you view any webpage in multiple screen sizes, simulating the viewport of different devices.
bookmarklet
css
webdesign
viewport
screen
size
device
:ce
:am
:nc
ui
ux
:sk
:st
responsive
january 2012 by blumenberg
lorempixel
january 2012 by blumenberg
placeholder images for every case
image
placeholder
tool
loremipsum
webdesign
creativecommons
:nc
:ce
:am
:mg
:sk
:st
january 2012 by blumenberg
The Heads-Up Grid
november 2011 by blumenberg
The Heads-Up Grid is an overlay grid for in-browser website development, built with HTML + CSS + JavaScript.
css
development
grid
layout
webdesign
javascript
:sk
:st
:nc
:am
:ce
:mg
responsive
november 2011 by blumenberg
Screenfly
october 2011 by blumenberg
Test Your Website at Different Screen Resolutions
development
test
usability
ux
webdesign
tool
screen
resolution
device
:sk
:st
:nc
:ce
:am
:mg
october 2011 by blumenberg
PNG Masking
october 2011 by blumenberg
… How to Dynamically Shape Any Image on Your Website
css
design
html
png
webdesign
howto
october 2011 by blumenberg
XRAY :: for web developers
october 2011 by blumenberg
… a bookmarklet for Internet Explorer 6+, and Webkit and Mozilla based browsers (including Safari, Firefox, Camino or Mozilla). Use it to see the box model for any element on any web page.
css
development
webdesign
bookmarklet
browser
ie6
webkit
gecko
:nc
:ce
:am
:st
:sk
october 2011 by blumenberg
The Semantic Grid System
september 2011 by blumenberg
Set column and gutter widths, choose the number of columns, and switch between pixels and percentages.
css
framework
semantic
grid
webdesign
:ce
:nc
:st
:sk
:am
september 2011 by blumenberg
Golden Grid System
august 2011 by blumenberg
A folding grid for responsive design.
css
design
framework
grid
webdesign
responsive
august 2011 by blumenberg
HTML5 Doctor, helping you implement HTML5 today
august 2011 by blumenberg
We will publish articles relating to HTML5, its semantics, and how to use it right now. We also invite questions via Ask the Doctor. We’ll post answers in future articles so that everyone can benefit.
html5
webdesign
development
:sk
:st
:nc
howto
reference
help
html5doctor
august 2011 by blumenberg
News Redux
august 2011 by blumenberg
«Digital news is broken. Actually, news itself is broken. Almost all news organizations have abandoned reporting in favor of editorial; have cultivated reader opinion in place of responsibility; and have traded ethical standards for misdirection and whatever consensus defines as forgivable. And this is before you even lay eyes on what passes for news design on a monitor or device screen these days. […]»
design
news
ux
ui
web
webdesign
article
:sk
:st
:nc
august 2011 by blumenberg
Fount
august 2011 by blumenberg
… will tell you which web font in your font-stack you are actually seeing – not just what is supposed to be seen. It’ll also tell you the font size, weight, and style.
bookmarklet
css
font
typography
webdesign
identify
:sk
:st
august 2011 by blumenberg
CUBE CMS
july 2011 by blumenberg
… das völlig neue Open Source Content Management System. Es bricht mit bisherigen Regeln, macht die Arbeit einfacher und die Entwicklung flexibler.
opensource
cms
webdesign
webdev
:sk
:st
july 2011 by blumenberg
Compass.app
july 2011 by blumenberg
compile Compass/Sass easily without resorting to command line interface — Compass.app helps designers compile stylesheets easily without resorting to command line interface. It is written in Java and works in Windows/Linux/Mac OS X.
css3
design
framework
sass
webdesign
opensource
:sk
:st
application
mac
osx
windows
linux
july 2011 by blumenberg
Baseline
june 2011 by blumenberg
… a designer framework built around the idea of a “real” baseline grid
css
framework
grid
typography
webdesign
template
creativecommons
:sk
:st
june 2011 by blumenberg
Fluid Images
june 2011 by blumenberg
A List Apart Article
article
!essential
fluid
image
webdesign
ui
ux
markup
:sk
:st
responsive
june 2011 by blumenberg
CSS3 files : CSS3 properties accurately explained
april 2011 by blumenberg
… meant to be a guide through all the CSS3 glory we already have and still get.
css3
reference
tips
webdesign
:sk
:st
april 2011 by blumenberg
Lettering.js
march 2011 by blumenberg
a jQuery plugin for radical web typography
css3
jquery
plugin
javascript
typography
webdesign
lettering
kerning
code
march 2011 by blumenberg
Google Font Directory
november 2010 by blumenberg
The Google Font Directory lets you browse all the fonts available via the Google Font API. All fonts in the directory are available for use on your website under an open source license and are served by Google servers.
@font-face
api
code
css
css3
design
development
embed
font
free
google
html
html5
javascript
opensource
resource
type
typography
web
webdesign
webdev
webfonts
:sk
:st
november 2010 by blumenberg
Style Sheet Switcher (v1.1)
may 2009 by blumenberg
… "plug & play" style sheet switcher that lets your visitors switch between a list of alternative style sheets to apply to your site. With a change of style sheet the entire look of your site can be transformed. Persistent cookies are used to store the user's selection and automatically recall that style sheet upon his return.
!important
css
style
switch
script
javascript
webdesign
presentation
try
:sk
may 2009 by blumenberg
related tags
!comment ⊕ !essential ⊕ !follow ⊕ !important ⊕ !note ⊕ !re-check ⊕ 9rules ⊕ 16x16 ⊕ :am ⊕ :ce ⊕ :ji ⊕ :mg ⊕ :nc ⊕ :sk ⊕ :st ⊕ @font-face ⊕ a/b-test ⊕ accessibility ⊕ add ⊕ agency ⊕ air ⊕ ajax ⊕ album ⊕ api ⊕ application ⊕ apps ⊕ arguments ⊕ art ⊕ article ⊕ artikel ⊕ artist ⊕ audiobook ⊕ authentication ⊕ balsamiq ⊕ bar ⊕ blog ⊕ boilerplate ⊕ book ⊕ bookmark ⊕ bookmarklet ⊕ browser ⊕ business ⊕ button ⊕ by:alistapart ⊕ by:method&craft ⊕ by:smashingmagazine ⊕ by:webdesignerdepot ⊕ calculator ⊕ cart ⊕ cc ⊕ chart ⊕ check ⊕ children ⊕ choose ⊕ cms ⊕ code ⊕ collection ⊕ color ⊕ column ⊕ commercial ⊕ community ⊕ compare ⊕ comparison ⊕ computer ⊕ contact ⊕ contract ⊕ contrast ⊕ conversion ⊕ convert ⊕ cost ⊕ creativecommons ⊕ creativity ⊕ css ⊕ css3 ⊕ data ⊕ design ⊕ desktop ⊕ deutsch ⊕ development ⊕ device ⊕ directadmin ⊕ download ⊕ dreamweaver ⊕ dropdown ⊕ dtr ⊕ dummy ⊕ ecommerce ⊕ editor ⊕ education ⊕ effect ⊕ email ⊕ embed ⊕ etiquette ⊕ examples ⊕ extension ⊕ extensions ⊕ firefox ⊕ fitts ⊕ flag ⊕ flash ⊕ fluid ⊕ font ⊕ form ⊕ fotografie ⊕ foundation ⊕ framework ⊕ free ⊕ freebies ⊕ freelance ⊕ freeware ⊕ gadgets ⊕ gallery ⊕ gecko ⊕ geek ⊕ generator ⊕ german ⊕ global ⊕ google ⊕ gpl ⊕ graphic ⊕ graphs ⊕ green ⊕ grid ⊕ growl ⊕ gui ⊕ guide ⊕ header ⊕ help ⊕ helper ⊕ hex ⊕ hosting ⊕ howto ⊕ html ⊕ html5 ⊕ html5doctor ⊕ icon ⊕ identify ⊕ IE ⊕ ie6 ⊕ illustration ⊕ illustrator ⊕ image ⊕ infographic ⊕ information ⊕ inspiration ⊕ interface ⊕ internet ⊕ ios ⊕ japan ⊕ japanese ⊕ javascript ⊕ journalism ⊕ jquery ⊕ js ⊕ kerning ⊕ kids ⊕ language ⊕ law ⊕ layout ⊕ lettering ⊕ letterpress ⊕ library ⊕ lightbox ⊕ link ⊕ linux ⊕ list ⊕ loader ⊕ logo ⊕ loremipsum ⊕ mac ⊕ magazine ⊕ magazines ⊕ manifest ⊕ manual ⊕ markup ⊕ media ⊕ media-queries ⊕ menu ⊕ mobile ⊕ mockup ⊕ moo.fx ⊕ mozilla ⊕ mp3 ⊕ multilingual ⊕ music ⊕ mysql ⊕ navigation ⊕ news ⊕ online ⊕ opensource ⊕ optimization ⊕ organization ⊕ oscommerce ⊕ osx ⊕ overlay ⊕ overview ⊕ page ⊕ pattern ⊕ pdf ⊕ perl ⊕ photo ⊕ photography ⊕ photos ⊕ photoshop ⊕ php ⊕ pixel ⊕ placeholder ⊕ plugin ⊕ png ⊕ podcast ⊕ portfolio ⊕ presentation ⊕ preview ⊕ price ⊕ print ⊕ productivity ⊕ programming ⊕ project ⊕ prototype ⊕ prototype.js ⊕ python ⊕ rails ⊕ read.on ⊕ readability ⊕ recht ⊕ recycle ⊕ redesign ⊕ reference ⊕ registration ⊕ relief ⊕ resize ⊕ resolution ⊕ resource ⊕ responsive ⊕ ruby ⊕ safari ⊕ sass ⊕ screen ⊕ script ⊕ scriptaculous ⊕ search ⊕ semantic ⊕ seo ⊕ server ⊕ service ⊕ shadow ⊕ share ⊕ shop ⊕ showcase ⊕ sifr ⊕ signup ⊕ siir ⊕ site ⊕ size ⊕ sketch ⊕ slideshow ⊕ social ⊕ software ⊕ source ⊕ spalten ⊕ sprites ⊕ standard ⊕ statistic ⊕ stock ⊕ stories ⊕ studio ⊕ study ⊕ style ⊕ support ⊕ swf ⊕ switch ⊕ t3n ⊕ tables ⊕ technology ⊕ teenager ⊕ template ⊕ test ⊕ testing ⊕ text ⊕ textmate ⊕ texture ⊕ theme ⊕ time ⊕ tip ⊕ tips ⊕ tool ⊕ tools ⊕ translation ⊕ try ⊕ tutorial ⊕ type ⊕ typekit ⊕ typo ⊕ typography ⊕ ui ⊕ upload ⊕ usability ⊕ utility ⊕ ux ⊕ vector ⊕ viewport ⊕ w3c ⊕ web ⊕ web2.0 ⊕ webdesign ⊖ webdev ⊕ webfonts ⊕ webkit ⊕ webkrauts ⊕ website ⊕ webstandard ⊕ widget ⊕ wikipedia ⊕ windows ⊕ wireframe ⊕ wordpress ⊕ wysiwyg ⊕ xhtml ⊕ xml ⊕ xpi ⊕ yahoo! ⊕ zurb ⊕Copy this bookmark: