highlight.js
12 weeks ago
"Highlight.js highlights syntax in code examples on blogs, forums and in fact on any web pages. It's very easy to use because it works automatically: finds blocks of code, detects a language, highlights it."
JS
Code
12 weeks ago
Stop the cascade · Deep Thoughts by Mark Otto
12 weeks ago
Mark Otto: "Find ways to isolate components and make them more durable by limiting the scope of their CSS. You’ll discover that components can be more easily rearranged without causing adverse effects and the amount of code necessary will likely decrease."
CSS
Well-Formedness
12 weeks ago
On using h1 for all heading levels in HTML5 | 456 Berea Street
12 weeks ago
Roger Johansson: "You can keep using h1-h6 in HTML5, but you can also choose to use only h1 elements for all headings and rely on the HTML5 outline algorithm to sort out the heading hierarchy. If you do this, however, you should be aware that currently there is very little support for the HTML5 outline in web browsers, screen readers and developer tools."
HTML
HTML5
Markup
WDBP
12 weeks ago
Gridset
march 2012
"Gridset is a tool for making grids. It lets you create whatever type of grid you want: columnar, asymmetrical, ratio, compound, fixed, fluid, responsive and more. It serves multiple grids to your site based on breakpoints for different devices. Using it is as simple as embedding a link."
Type
CSS
RWD
Layout
Grids
march 2012
Jules Vernacular
february 2012
Indra Kupferschmid: "A fantastic blog about French lettering."
Type
Inspiration
february 2012
CSS Column Breaks | Trent Walton
february 2012
"Rather than using a more traditional HTML & CSS column/grid approach, I opted for column-count to keep everything extra efficient & scalable. The trouble is, sometimes content gets split across columns awkwardly."
CSS
Layout
Type
february 2012
Remote-Tilt - emulate motion events
february 2012
By including a single line of JavaScript you can emulate device motion events in your test page which can either be a regular browser or even a mobile emulator.
Mobile
Motion
Testing
february 2012
LukeW | An Event Apart: Detail in Web Typography
january 2012
Luke Wroblewski: "In his presentation at An Event Apart in Minneapolis MN, Richard Rutter walked through a preview of the detailed typographic control CSS3 will offer in the future. Here's my notes from his talk."
Type
CSS3
CSS
Richard-Rutter
OpenType
january 2012
Selling Design
january 2012
Part of Jeffrey Zeldman's MFA course curriculum: "For our opening get-acquainted session, we’ll focus on texts that explore the some of the most basic, traditional (and rarely taught) aspects of design professionalism from the worlds of web, interaction, and print design."
Design
Jeffrey-Zeldman
january 2012
DirectWrite Text Rendering in Firefox 6
january 2012
John Daggett: "In Firefox 6 we’ve added the ability to alter prefs that affect the underlying ClearType subpixel anti-aliasing that is used. [...] Because of the large differences between GDI and DirectWrite renderings for some fonts at small text sizes, for Firefox 7 we’ve implemented a pref that specifies a list of fonts for which GDI rendering will be used at sizes below 16px. By default the list contains fonts such as Arial, Tahoma, Verdana, Trebuchet MS, Segoe UI and Consolas. Downloadable fonts will always use DirectWrite."
Rendering
DirectWrite
Firefox
Type
january 2012
DWrite rendering in Firefox | Typophile
january 2012
John Hudson: "When Firefox 4.0 arrived, I was surprised to find that DWrite rendering was not active by default, and that I had to manually set some config flags in order to activate it (not something I'd be comfortable recommending to the average browser user). This week I wrote to John Daggett at Mozilla, and asked him to comment on this and whether there is any change in Firefox 5.0."
Rendering
DirectWrite
Firefox
Type
january 2012
5 Tips to Optimize & Speed Up Safari 5 | Printed By Erik
november 2011
Erik Shultz: "I have recently noticed a slowing factor when it comes to using Safari 5. I decided to look for some hack solutions to see if I could improve the usability of Safari from the point of view, page load speed."
Safari
Mac
Speed
Tips
november 2011
How to deploy your code from GitHub automatically
october 2011
Mark Christian: "I love GitHub. The more I use it, the more wonderful features I discover. I'd like to share one I just came across today, Service Hooks, and tell you how you can leverage them to have your production web site update to the latest code automatically, whenever you push a new version."
Git
GitHub
Development
Workflow
october 2011
QBN Typecase: Recommended Fonts - a set on Flickr
october 2011
Stephen Coles: "The QBN Typecase, a feature I created in 2005 for trendy design portal Newstoday. I am no longer editor of the column, but it was a good gig while it lasted. It entailed two of my favorite jobs: designing typeface specimens, and pushing fonts on the youths."
Type
october 2011
iScroll 4
october 2011
Matteo Spinelli: "iScroll 4 is a complete rewrite of the original iScroll code. The script development began because mobile webkit (on iPhone, iPad, Android) does not provide a native way to scroll content inside a fixed width/height element."
iOS
Scrolling
JS
october 2011
Subtle Patterns | Free textures for your next web project
october 2011
"Subtle Patterns is a collection of 88 high quality design patterns for you to use freely. New patterns added weekly. A project by Atle Mo."
Patterns
october 2011
Minimum Viable Personality
september 2011
Fake Grimlock for A VC: "MOST IMPORTANT STEP FOR BUILD PRODUCT IS BUILD PRODUCT. SECOND MOST IMPORTANT IS BUILD PERSONALITY FOR PRODUCT. [...] PERSONALITY IS API FOR LOYALTY."
Philosophy
Design
Community
september 2011
umbrUI - CSS3 Shadow DOM styling
september 2011
"Basically this demo is about selecting those special [Shadow DOM] pseudo elements and style them with CSS. And to make this Shadow-DOMing game even more fun, more rules: No images, no extra markup and no JavaScript (the browser already adds the functionality)."
Shadow-DOM
CSS
Forms
september 2011
What the Heck is Shadow DOM?
september 2011
Dimitri Glazkov: "[Browser developers] created a boundary between what you, the Web developer can reach and what’s considered implementation details, thus inaccessible to you."
Shadow-DOM
DOM
Web-Standards
september 2011
How Do Browsers Render the Different CSS Border Style Values?
september 2011
Louis Lazaris: "Just like form elements, you’ll never get these looking exactly the same cross-browser, and neither should you want to. But if nothing else, it’s interesting seeing how the different browser makers interpret these different values."
CSS
Browsers
Borders
september 2011
Sassy Mother Effing Text Shadow
september 2011
"There shouldn’t be more. I’d like to tell you that a masked gunman made me make a Lorenz Attractor in Sass. But the truth is that it was just bad judgement. For the love of all that is good don’t use this anywhere. The CSS is just out of control. View source at your peril."
CSS
text-shadow
Sass
september 2011
Radio Buttons with 2-Way Exclusivity | CSS-Tricks
september 2011
"Let's say you were tasked with creating a UI in which users can rate three candy bars from their most to least favorite. A grid of radio buttons isn't a terrible way to go about this."
HTML
JS
jQuery
Forms
september 2011
Masonry CSS
july 2011
Radu Chelariu: "CSS columns. Granted, their purpose is to display text in columns like a newspaper, but their display mode is exactly what’s needed to recreate the Masonry effect."
css
layout
july 2011
Calligraphy Qalam
july 2011
"A variety of interactive tools and information to help you learn more about calligraphy in the Arab, Ottoman and Persian traditions."
Lettering
july 2011
WhatFont Bookmarklet
april 2011
Hover on text, see the font being used. From Chengyin Liu.
Bookmarklets
Utilities
april 2011
Point Size and the Em Square: Not What People Think
march 2011
Thomas Phinney: "The challenging question is, what part of a 12-point font is 12 points high? For digital type, the short answer is 'none.'"
Type
Measurement
march 2011
A Richer Canvas
march 2011
Mark Boulton: "If [...] layouts are based on a system that defines its ratios from the content, then there is connectedness on two levels: connectedness to the device, and connectedness to the content."
Type
Measurement
Responsiveness
march 2011
Using web fonts in desktop design apps
march 2011
Elliot Jay Stocks muses on easy desktop versions of web fonts. My guess is that all of the solutions he proposes will come to be, and designers will prefer the easiest one.
Type
Web-Design
march 2011
Humans TXT: We Are People, Not Machines.
february 2011
"It's an initiative for knowing the people behind a website. It's a TXT file that contains information about the different people who have contributed to building the website."
Web
Culture
february 2011
WordPress › Relevanssi - A Better Search « WordPress Plugins
february 2011
"Relevanssi replaces the standard WordPress search with a better search engine, with lots of features and configurable options. You'll get better results, better presentation of results - your users will thank you."
WordPress
february 2011
TrueType Hinting and Font Rendering
february 2011
Tom Rickner for FontsLive: "It is a significant challenge to produce a font which renders the same pixels in multiple environments."
Type
Rendering
february 2011
Web Fonts First Look
february 2011
Lynda.com web fonts tutorial/introduction by James Williamson. Haven't watched it, but the TOC looks good.
Type
february 2011
Exquisite Tweets
february 2011
Collect lists of tweets to show Twitter conversations.
Twitter
History
Discussion
february 2011
Watch Your Language
february 2011
Chris Cashdollar: "Our industry needs to promote the idea of constructive criticism regarding visual design."
Design
Critique
february 2011
Controlling Web Typography
february 2011
Trent Walton: "Lettering.js is a solution, but perhaps it’s not the ultimate solution. […] Here’s a brief timeline recounting what’s already been discussed."
Type
JS
CSS
february 2011
New Bulletproof Font-Face Syntax
february 2011
Ethan Dunham: "The hack that makes this work is the '#' following the EOT filename. Seriously."
CSS
Type
@font-face
february 2011
FontFriend 2.5
january 2011
Matt Wiebe's very useful bookmarklet for testing type now has support for custom Font Family lists, including web fonts.
Type
JS
jQuery
Utilities
january 2011
BigText Makes Text Big
january 2011
"At its simplest, the BigText jQuery plugin takes a single element and sizes the text inside of its child DIVs to fit the width of the parent element."
jQuery
JS
Type
january 2011
jQuery Backstretch by Scott Robbin
january 2011
"Backstretch is a simple jQuery plugin that allows you to add a dynamically-resized background image to any page. The image will stretch to fit the page, and will automatically resize as the window size changes."
jQuery
JS
Design
january 2011
iKern: autospacing and autokerning for type designers
january 2011
Igino Marini: "iKern is a mathematical model that describes the white space between the letters [and] is also a tool that uses the model to perform letterfitting."
Type
Type-Design
january 2011
Font Remix Tools
january 2011
A set of plugins by Tim Ahrens that help type designers harmonize glyph shapes, tune letters, and create different versions of glyphs for condenseds, extendeds, small caps, etc.
Type
Type-Design
january 2011
Moving Highlight
january 2011
Chris Coyier uses radial gradients and jQuery to produce a subtle highlight that follows a user's mouse.
CSS
jQuery
JS
january 2011
Remove unused CSS - CSS Optimizer
january 2011
"Our tool explores the pages of your site automatically, find the unused CSS selectors and creates new clean CSS files you can download."
CSS
january 2011
The non-typographer’s guide to practical typeface selection
january 2011
Like it says, by Cameron Moll. From 2005, but the advice is timeless. Shame about all of the link rot.
Type
january 2011
CssUserAgent (cssua.js)
january 2011
Script that adds UA-specific CSS classes to the <html> tag.
CSS
JS
Browsers
january 2011
Some New Dimension for Fortune
december 2010
David Jonathan Ross for Font Bureau: "Inspiration for the final logo came from a dollar bill I found in my wallet. Some of the lettering on the bill had not one, but two layers of shading behind them."
Type
Color
Dimension
december 2010
CSS formatting
december 2010
"Been thinking about formalizing a style guide for CSS as CSS3 includes some especially complex syntax."
CSS
december 2010
A web standards holiday card from Typekit
december 2010
Sean McBride explains the snowy CSS3 and JS details that went into this effort of his, Mandy Brown's, and Jason Santa Maria's.
CSS3
Typekit
Type
JS
december 2010
Controlling text size in iOS Safari
december 2010
Roger Johansson on viewport width settings and text zooming.
Type
CSS
HTML
iOS
december 2010
TEFF Ruse designed by Gerrit Noordzij
december 2010
Side-scrolling to view the character set is surprisingly nice.
Type
december 2010
Mule Design Studio’s Blog: Giving Better Design Feedback
december 2010
"Feedback comes from people paying a designer to solve business problems—people who may not be suitably impressed that you implemented a 16 column grid across a golden mean."
Design
december 2010
Hardboiled Web Design
december 2010
Video of Andy Clark's talk at DIBI 2010.
HTML
CSS
Web-Standards
Design
december 2010
I wrote you a short letter / from a working library
december 2010
Mandy Brown: "I believe our growing preference towards short form is not only the result of our famously declining attention spans, but also of our increasing desire to read: the longer the reading list, the more impatient I am with writing that doesn't get to the point."
Books
december 2010
A closer look at TrueType hinting
december 2010
Tim Ahrens for Typekit: "TrueType hinting [...] bends the contour of the letter into a slightly different shape before it is rasterized."
Type
Rendering
#wbfntdy
wbfntdy
from twitter_favs
december 2010
Sass - Syntactically Awesome Stylesheets
december 2010
"Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin."
CSS
december 2010
LukeW | Touch-based App Design for Toddlers
december 2010
"Kids are an enthusiastic bunch. If they see something they like, one tap won't do. Tap, tap, and tap again is often the norm."
Kids
Design
december 2010
24 ways: My CSS Wish List
december 2010
What Inayaili de León would like to see made real. Lots of thoughtful typographic stuff here. Great list.
Type
CSS
december 2010
Pro Git by Scott Chacon
december 2010
"Here you can find the full content of the book, a blog with tips and updates about Git and the book and open source projects related to Git or referenced in the book."
Git
december 2010
A successful Git branching model
december 2010
Vincent Driessen: "In this post I present the development model that I’ve introduced for all of my projects (both at work and private) about a year ago, and which has turned out to be very successful."
Git
december 2010
ALA: Get Started with Git
december 2010
Al Shaw: "Though it may seem cryptic at first, this version control system could change the way you work with text, whether you’re writing code, or a novel."
Git
december 2010
#wbfntdy
24-Ways
@font-face
AEA
Animation
Antialiasing
Apps
Art
ASCII
Backups
Beverages
Bookmarklets
Books
Borders
Browsers
Calendar
Canvas
CFF
Chrome
Classification
ClearType
Clothing
CMS
Code
Color
Comics
Commerce
Community
Cooking
Critique
CSS
css3
Culture
Data
Dave-Shea
Design
Development
Dimension
DirectWrite
Discussion
DOM
Drawing
Education
Email
epub
Ethan-Dunham
Family
Firefox
Fishing
Font-Squirrel
Fonts
Forms
Foundry
FOUT
GDI
Git
GitHub
Grids
Hinting
History
House
HTML
HTML5
IE
Illustrator
Images
Inspiration
Internet
iOS
iPad
iPhone
Javascript
Jeffrey-Zeldman
JeffVeen
jQuery
JS
Keynote
Kids
Language
Layers
Layout
Lettering
Letterpress
Mac
Management
Mark-Boulton
Marketing
Markup
Math
Measurement
Michael-Bierut
Mobile
Motion
Naomi-Atkinson
OpenType
Opera
Organization
Patterns
PDF
Peter-Bilak
Philosophy
Photography
Photoshop
Pixel-Density
Presentations
Print
Productivity
Publishing
Redirect
Rendering
Responsiveness
Richard-Rutter
Ruby
RWD
Safari
San-Francisco
Sass
Scale
Scrolling
Search
Shadow-DOM
Slideshow
Software
Speed
SVG
Taxonomy
Testing
Text
text-shadow
Texture
Theming
Thomas-Phinney
tim_brown
TimeSuck
Timezones
Tips
Touch
TTF
Tumblr
Tutorial
Tutorials
Twitter
Type
Type-Design
Type-Sellers
Type-Specimens
Typefaces
Typekit
Typesetting
Typography
UI
Unicode
URLs
Utilities
Vassar
via-Dan-Cederholm
via-Jon-Tan
Video
W3C
wbfntdy
WDBP
Web
Web-Design
Web-Fonts
Web-Standards
Web-Typography
web_standards
web_type
Webkit
Well-Formedness
Windows
Wireframes
WOFF
Wood
Wordpress
Workflow
World-Cup
Writing
Zoom