Regarding: 'CSS'

New JavaScript based text justification library looks promising. The default HTML/CSS text justification built into every browser has always sucked, due mostly to lack of word hyphenation.

One of the places I’d really like to have good justification is in Ronn’s HTML based man pages. It uses text-align: justify currently, but I’ve been considering making it non-justified because it’s so horribly bad. Compare it to the proper justified / hyphenated text generated by groff when viewing manpages in a terminal. It’s night and day.

carlos.bueno.org 14:34

28 Feb 2010

CDN Catalog —

We should be doing more of this:

If you’re building a modern website then you’ll be needing some javascript libraries and css.

Rather than hosting these common libraries on your own server, you should Use a Content Delivery Network. Lucky for you Google, Microsoft and Yahoo host a range of popular javascript and css which you can directly link to for free. This saves your bandwidth and speeds up your website load time.

The great thing about the shared CDN approach is that the resources are cached once and reused across all sites, often without even making a validation request.

I’d seen the JavaScript libraries before but I’d never considered using this approach with CSS. The YUI CSS reset is a perfect example of where a shared CDN provides the most benefit. If every site that employed the basic CSS reset used this URL, it would effectively be baked into the browser with no overhead after the first request.

cdncatalog.com 18:23

05 Jan 2010

Optimizing Optimizing HTML —

Oh neat. You can drop the type='text/javascript' from your <script> tags, type='text/css' from your <style> (and/or <link rel='stylesheet'>) tags and the browsers won’t care. Also, in 2010, <b> and <i> are cooler than <strong> and <em>, and trailing slashes on self closing tags are lame.

Personally, I like these little tricks for making HTML more human readable but I can’t believe people are actually doing stuff like this in an attempt to compress HTML to gain network/browser efficiencies. I dare someone to actually benchmark those optimizations. Cutting your sucky EULA page in half and trimming away all that shit in your header/sidebar would be much more productive (but still barely worthwhile).

annevankesteren.nl 13:22

20 Aug 2009

Let's make the web faster —

Big giant list of articles, essays, tutorials, and tech talks on making the web faster. This is part of a larger Google Code project that asks, “what would be possible if browsing the web was as fast as turning the pages of a magazine?”

code.google.com 15:14

24 Apr 2009

Heroku Pricing —

I’ve been staring at this screen for two sleepless weeks now. Really glad to have it wrapped. James Lindenbaum (CEO/founder/bad-ass) did most of the conceptual design work. seaofclouds did the fucking amazing illustrations and took the design to completion. Pedro Belo did the HTML/JavaScript and server side stuff. Definitely one of the best teams I’ve worked on.

heroku.com 16:44

12 Apr 2009

8 Simple Ways to Improve Typography In Your Designs —

Measure, Leading, Quotes, Rhythm, Widows, Emphasis, Scale, and Rags. Great piece.

aisleone.net 17:56

17 Nov 2008

Showcase Of Clean And Minimalist Designs —

Smashing Magazine shows off a massive catalog of minimalist designs and then attempts to deconstruct them.

smashingmagazine.com 14:27

27 Oct 2008

Why Programmers Suck at CSS Design —

Stefano Mazzocchi: “I have a much simpler and humble goal here: give programmers some tricks and some advice in how to proceed to make their web pages look cleaner, more readable and, hopefully, more professional, elegant and original than before.”

betaversion.org 13:35

16 Oct 2008

Conditional classnames —

Using conditional comments to stick an “ie” classname on <body> so that you can target IE from a single CSS file instead of bringing in a separate stylesheet. Nice hack.

paulhammond.org 06:46

07 Oct 2008

"Air Budd Form Builder" meets "/admin Considered Harmful" —

Bill Burcham applies the technique of making form controls inherit style from their container in the Air Budd Form Builder Rails plugin. Cool.

youtube.com 19:56

05 Oct 2008

Google's undocumented favicon to png convertor —

I’m using this on all of my “linkings” index pages now (see here, for example). It works pretty well. I really like the idea of integrating a piece of the destination site’s visual identity instead of using a generic del.icio.us/bookmark icon. Some site’s with favicons don’t work properly, however, and I’d give anything to have another parameter that let me override the default globe icon (this one: ). It’d be nice if I could say, grab the favicon for this domain but if it doesn’t exist, give me the favicon for delicious.com ().

simonwillison.net 12:41

09 Aug 2008

Web Development for the iPhone —

“You can specify CSS based on viewport orientation which you determine via javascript and update the orient attribute of the body element. Target the browser with body[orient=‘landscape’] or body[orient=‘portrait’]”

evotech.net 00:16

13 Jul 2008

Minimalism —

if any – Another hella-great minimalist design.

ifany.org 10:22

14 May 2008

Google Doctype —

What Mark Pilgrim has been working on at Google for the past year or so: an encyclopedia of web development.

code.google.com 09:37

03 Apr 2008

What Is the Open Web and Why Is It Important? —

Brad Neuberg (Google Gears): “Our historical closeness to the web creates a kind of myopia, where we can’t see how amazing it is. It’s a billion Library of Alexandria’s dropped into our laps.”

codinginparadise.org 07:46

13 Mar 2008

Presentational JavaScript to adjust text line-height in proportion to text column width. —

“If you can’t control the text width the next best thing you can do to compensate for an overly wide text measure is to increase the leading.” — I never considered that but it makes sense.

ollicle.com 08:35

08 Mar 2008

css_color.vim - CSS color preview : vim online —

Makes the background of hexadecimal color codes the respective color. So, background-color:#f00 will have a red background in the vim editing window. Nifty.

vim.org 23:49

14 Feb 2008

9 Practical Ways to Enhance your Web Development Using the Firefox Web Developer Extension —

From the comments: “the only things i find [useful] in Web Developer Extension is the shortcut to clear cache… for other things i use Firebug…” — Me too!

sixrevisions.com 08:31

03 Feb 2008

Printing a Book with CSS: Boom! —

Bert Bos and Håkon Wium Lie show off some of Prince’s more advanced CSS and HTML features, including styling page size, generating headers/footers, advanced use of the CSS content attribute, page numbering, cross-references, and table of contents.

alistapart.com 07:58

Håkon's Wium Lie —

Ahh, it turns out Håkon’s Wium Lie (Opera CTO and the guy who first proposed CSS) is on YesLogic’s board, makers of PrinceXML. I’m not sure how I missed that.

princexml.com 07:49

24 Jan 2008

What should Microsoft do instead? —

Holy crap, this is insane. Just let people run IE6 and IE7 as separate standalone browsers side-by-side with IE8. As James said in my previous post, they can even rebrand it as “Intranet Explorer” :)

dbaron.org 08:43

19 Jan 2008

The problem with pixels —

“… anybody who’s ever built out a relatively complex design using ems will agree that at some point they wondered if the benefit was really worth the effort.”

wilsonminer.com 07:21

05 Jan 2008

A pool for the W3C validators —

This is a good idea. The w3c hosted validators tend to perform on the bad side of horrible. I’ve run the validator locally but never thought to look for mirrors.

xhtml-css.com 01:39

16 Dec 2007

Prince XML: Generating High Quality PDFs from HTML + CSS —

Simple print typesetting using HTML/CSS. Targets the 80% of common print tasks w/ HTML/CSS. I’m going to be looking into mozilla’s cairo PDF output abilities within the next few weeks so it will be interesting to compare.

video.google.com 16:42

28 Nov 2007

Run Internet Explorer 5/6/7 Natively in OS X —

This trumps Leopard for most important Mac development this year as far as I’m concerned. Words cannot explain the hatred I’ve developed for booting up multiple Parallels VMs to get at IE.

macapper.com 22:42

22 Sep 2007

CSS 3: A Giant Serving Of FAIL —

“… CSS 3 is a joke. A sad, sick joke being perpetrated by people who clearly don’t build actual web apps…”

alex.dojotoolkit.org 08:01

08 Jun 2007

E-mail is not a platform for design [zeldman.com] —

“But when I say HTML mail still sucks, I don’t mean it sucks because support for design in e-mail today is like support for standards in web browsers in 1998. I mean it sucks because nobody needs it. It impedes rather than aids communication.”

zeldman.com 08:15

09 Apr 2007

Setting Type on the Web to a Baseline Grid —

Yes! I’ve been doing this for a few months now with the corp. assets and I won’t go back. You can really see the text snap into a vertical rhythm when you hit it.

alistapart.com 20:08

17 Feb 2007

Less sucky multiple-select lists —

Another interesting take on multi-select lists that uses checkboxes with labels and colors.

anseljh.wordpress.com 15:51

12 Feb 2007

Multi-Select Lists vs. Checkboxes —

I’m real close to hating multi-select list boxes right now. Using an overflowed UL of checkboxes has some interesting pros (and cons).

yourtotalsite.com 23:41

23 Jan 2007

53 CSS-Techniques You Couldn’t Live Without —

Very nice list of CSS techniques.

smashingmagazine.com 14:01

10 Dec 2006

kuler —

Handsome Flash based color mixing tool and color theme sharing site.

kuler.adobe.com 04:09

08 Dec 2006

Firebug 1.0 Beta Screencast —

Holy… This is big. Huge big.

soylentfoo.jnewland.com 12:37

05 Dec 2006

Web Pages That Suck presents the biggest web design mistakes in 2004 learn usability and good Web design by looking at bad Web design —

A perfect article.

webpagesthatsuck.com 19:14

04 Dec 2006

Most websites are crammed with small text that is a pain to read. Why? —

I’m sure I don’t know.

informationarchitects.jp 08:54

12 Nov 2006

CSS-Based Forms: Modern Solutions —

Big list of resources on CSS based forms.

smashingmagazine.com 21:20

10 Oct 2006

gotAPI.com —

The best attempt I’ve seen at splicing multiple API references together. This uses the external documentation but provides indexing and browsing features.

gotapi.com 08:31

05 Sep 2006

The Elements of Typographic Style Applied to the Web —

This site is really starting to come along now. The latest addition on how to manage vertical spacing in intervals is something I’ve been wondering about for a while now.

webtypography.net 08:58

22 Jan 2006

FireBug —

Firefox extension with some promising script debugging/spying features.

addons.mozilla.org 08:52

06 Oct 2005

CSS: Specificity Wars Diagram —

CSS specifity chart based on Sith power levels — to good to be true.

stuffandnonsense.co.uk 22:08

30 Sep 2005

Curing Float Drops and Wraps —

I run into these problems on a daily basis…

nemesis1.f2o.org 11:02

23 Sep 2005

CSS Import™ —

this site rocks

cssimport.com 00:48

09 Sep 2005

Color Scheme Generator 2 —

This is probably the nicest color picker for choosing compliments off of a base color.

wellstyled.com 20:35

28 Feb 2005

Web Building: Style Templates —

Big list of sites that provide CC licensed CSS layouts and tools for generating layouts.

toolkit.crispen.org 06:08

06 Jan 2005

CSS - Quirks mode and strict mode —

Information on quirks vs. strict mode for HTML/CSS rendering: how to trigger, what DOCTYPEs do what, etc.

quirksmode.org 14:46

30 Nov 2004

Cascading Style Cheatsheet —

Styled for landscape printing…

home.tampabay.rr.com 09:46

24 Nov 2004

Quotations and citations: quoting text —

Some information on using proper q and blockquote elements in HTML and then styling them with CSS to fix all the browser brokeness.

456bereastreet.com 09:59

03 Nov 2004

Full CSS Property Compatibility Chart —

red/green/yellow for specific css attribute support in major browsers.

corecss.com 23:07

28 Oct 2004

Bring on the tables —

a thorough look at how to use HTML tables correctly.

456bereastreet.com 06:11

16 Oct 2004

CSS Negotiation and a Sanity Saving Shortcuts —

Some tips I haven’t seen before for dealing with IE’s broken CSS support. Using conditional comments for ie specific css, setting manual defaults, etc.

leftjustified.net 14:35