CSS Flow

Unicodes and Footnotes

2005-07-25T17:55:00.000-05:00

Some recent articles on footnoting in webpages have sparked interest in the CSS community. John Gruber at Daring Fireball posted this article about the footnoting system on his site. The Brand Spanking New website has posted a method involving Javascript and CSS, and Dave Shea over at Mezzoblue published a great article on Unicode Glyphs and including them in your webpages, which ties in nicely with the Daring Fireball method.

Unicode.Org has a set of downloadable PDF's for referencing the extensive lists of Unicode Characters.

You may also wish to bookmark this amazingly useful article at Evolt.Org which contains a Simple Character Entitiy Chart. Better yet, download it and take it home.

The CSS Playground

2005-07-12T17:43:00.000-05:00

In case you haven't noticed, Stu Nicholls has redesigned the CSS Playground and added some new CSS demos to the site. The guy continues to amaze me with his creativity and meticulous, clean designs. Personally I can't choose which demo is the most useful, though I am partial to the "drop-cap", which beats trying to work with the first-letter property.

Minitab Mania

2005-06-21T16:47:00.000-05:00

There's been a lot of articles and demos on minitabs recently. Minitabs are a subtle and easy to modify type of navigation list that can either be floated or centered based on your design needs. Web graphics has a great article on Inline Minitabs and a follow up titled Float Minitabs. each article is linked to demo pages for easy reference.

The origin of the mini-tab dates from 2003 and a post by Dan Cedarholm at Simple Bits. Here's a link to his original post and an additional article detailing Mini-Tabs with Background Images.

One problem with the inline non-floated lists is that IE 5 won't show the bottom borders on your links. One possible solution to that is to give your links a height of 1em, though this moves them outside the UL element. I suppose it's possible (or inevitable!) that there are other complications as well...

A more complex example is the Flyout Minitabs from Aplus Moments. Pretty sweet.

Return of Design

2005-05-03T14:08:00.000-05:00

I first discovered Return of Design a few weeks ago when I was browsing the CSS Help Pile. Since then the site has expanded a bit and become a showcase of neat CSS design, as well as a resource for the latest CSS design links, articles, and color schemes. The site has also been included in the 9rules Network. This site is highly recommended.

Elastic Design: 456 Berea Street

2005-04-22T10:50:00.000-05:00

Re-visiting the old debate of fixed width vs. fluid layouts, Roger Johansson talks about elastic layouts:

"Just in the last few days the old debate about fixed vs. fluid width in website layouts has surfaced again for some reason. I don't think we will ever come to a consensus on the issue, so there isn't much use in sharing my point of view. But a bit of debating can be fun, so I'll do it anyway."

Picture This: A visual guide to image replacement techniques.

CSS Reboot: Official site of the May 2005 CSS Redesign project.

Image Replacement: Again: Revisiting the pros and cons of the various image replacement techniques available for the CSS designer.

Protagonist: CSS/XHTML web design resources. Categories include free templates, articles, and resources for designers.

WASP announces Acid2

2005-04-14T16:47:00.000-05:00

The Wasp officially released The Acid2 Test yesterday on their website. Simply put, the Acid2 test is "a test designed to expose flaws in the implementation of mature Web standards such as HTML, CSS, and PNG." Take a look at how the test page is rendered in different browsers and poke around in the code.

Today's CSS Links:

More Nifty Corners: An update on the no-images rounded corner technique.

Definite Solution to Image Replacement: Uses negative letter-spacing I believe. Interesting, but the site is currently offline.

Doctype Declarations and Content-type Headers: A useful article for those struggling with the differences between XHTML and HTML, and beginners who need a clear explanation of the whole Doctype Zeitgeist.

The Future: HTML or XHTML Is a good follow-up to the above link.

Eric Meyer response to Acid2

2005-03-23T14:55:00.000-05:00

Eric Meyer has just posted a critical response to the Acid2 Challenge. Should IE7 be the sole focus of the challenge? Scoble throws in his two cents...

John Oxten talks about the redesign of Joshuaink. Very attractive design in my opinion. I've been waiting for this one for a while now. Make ya feel good...

The Acid2 Challenge

2005-03-16T15:28:00.000-05:00

Hakon Wium Lie, Opera's Big Boy and The Father of CSS, challenges Microsoft to get the lead out on IE7 and take Web Standards seriously. Read the CNET article and watch this page closely. Link via The Web Standards Project.

Nifty Corners: No Images!

2005-03-16T15:16:00.000-05:00

Raging across the web today, and being linked furiously at del.icio.us is Nifty Corners which looks like it might be a worthy replacement to previous techniques. Download a zip file to play with here.

CSS Hodge Podge

2005-03-16T09:56:00.000-05:00

Yes, this site is still a mess. I've been playing around with different designs to replace this bare bones of a site, but nothing looks good yet. Forgiveness please.

The CSS Vault has launched a new venture that looks like it might develop into a valuable resource for beginners and mid-level CSS enthusiasts. It's called The CSS Library and it will host articles and tutorials on CSS. Staple this URL to your wall, people.

Presentations at the annual SXSW utilizing the increasingly popular Eric Meyers S5 Slideshow:

Scott Zeldman's Last Blogger Out

Tantek Celik's The Elements of Meaningful XHTML

Eric Meyers' Emergent Semantics

Andy Budd's How to Bluff Your Way in CSS

Gina Trapani's DIY (or someone else will)

Did I miss anything? Try these: SXSW del.icio.us links and the SXSW 2005 Web Award Winners.

Yahoo's Tenth Anniversary

2005-03-02T19:32:00.000-05:00

A few links to celebrate Yahoo's Tenth Anniversary on the web: First, an old article about Yahoo from 1996.

We've all noticed the recent redesign of the front page with CSS styling. Here's the source style in a text file.

The Yahoo front page circa 1995. A slightly newer version via The Wayback Machine.

From Wired comes a short history, analysis, and retrospective titled The UnGoogle (Yes, Yahoo!)

Looks somewhat familiar...The Yahoo Netrospective.

Recent Articles

2005-02-28T08:50:00.000-05:00

Zeldman on protecting your site from Google's new toolbar.

Boing Boing on why you should love the new toolbar.

Scobleizer responds to the Boing Boing article with a different take.

A great article on configuring bulleted lists from the always ingenious A List Apart.

Who Created CSS? An extensive article on the beginnings of style sheets via The CSS Weblog.

Float Layouts

2005-02-28T08:43:00.000-05:00

A topic that can be very frustrating for beginning and experienced designers alike. A nice article from The Autistic Cuckoo explores the subject in depth.

Lucida Fax

2005-02-16T09:40:00.000-05:00

A recent article on the Lucida Fax font caught my attention so I made a demo page. There's a link to the article at the bottom of the demo. In addition, here's a link to a website that uses the Lucida Fax font.

Zeldman Destroyed!

2005-02-15T12:47:00.000-05:00

Recent Articles

2005-02-12T14:04:00.000-05:00

Defining Importance by Nesting Elements
A response by Anne to the recent Joe Clark post about Technorati Tags.

Big, Stark & Chunky
Making websites accessible to users with impaired vision. From A List Apart.

Clarification Regarding IE5 Win
"It's not impossible to bend IE5/Win into the same designs that more standards-compliant browsers render, but it can't hurt to take a look at your site's statistics, getting a handle on what your audience is. It could help in deciding how much bending you want to do."

Introduction to Browser-Specific CSS Hacks
An overview of which hacks to use in browsers that won't render CSS correctly.

Inheritance vs. Cascade
A straightforward explanation of Inheritance and Cascade in CSS from the Autistic Cuckoo.

Heading Elements, Semantics, and the Spec
"Many people have taken to using the h1 element to describe the site a particular page belongs to. This usually involves wrapping a h1 tag around the site name, hiding the containing text from browsers using CSS and possibly swapping in the site logo using an image replacement method."

Template Galleries

2005-02-11T09:32:00.000-05:00

Template:CSS
"Template:css collects many css formatted page templates, developed and distributed by different designers. Our aim is to provide an easy to use, comprehensive repository where people can find what they need."

Microsoft CSS
A very old page at Microsoft with many templates featuring examples of typography with Microsoft fonts.

The Nemesis Project
Several pages of links to CSS-based templates from different authors. Each links opens in a seperate window.

Little Boxes
Advanced style sheet templates from Owen Briggs. These examples are a bit dated but still extremely useful for designers already familiar with the power of CSS.

Resources Update: A few more links.

CSS Tutorials
Big list of links to CSS tutorials around the web. The list is categorized and extensive. I am very impressed with this page...

CSS FAQ link page
From the Html Writers Guild comes this user-friendly FAQ page on style sheets.

Etc. Design Resources
New to me, this page contains links to CSS/Web Design resources; some were new and interesting like Tanfa.

CSS Resources

2005-02-09T20:16:00.000-05:00

Incredibly useful pages with long lists of CSS resources, divided by category:

Dezwozhere
Is a previously posted link. Big page of CSS links, updated fairly often.

Bobby Vandersluis
Another large list page of interest to those designing with style sheets and XHTML.

Blue Vertigo
While not strictly a CSS resource, this page has extensive visual design, photography, and font links that should keep you busy for awhile.

The Fixor
A big list of CSS resources. I haven't really taken a look at this page yet.

CSS Creator
The CSS Creator's CSS links page, with descriptions.

CSS Pointers
Another site I've never heard of before. They have a very long list of resources, some internal, some external.

Roderick Howards CSS Directory
Fairly new as far as I know, this page is well divided into precise categories for easy reference. One of the better link pages.

Web Standards Group
They have their own link page and it's a pretty good one. Lots of links to example sites.

CSS Discuss
The front page of the discuss-wiki site is actually an excellent CSS resource links page. If you haven't already joined the list, you should.

Veerle's CSS Collection
Veerle put together this file for download. One of the best collections of critical CSS resources, articles, and examples on the web.

The Cutting Edge

2005-02-07T13:27:00.000-05:00

S5 Slideshow
Latest Beta release of the Eric Meyer CSS/Javascript slideshow.

Cast of Shadows
Nice use of style sheets for two column text presentation in this novel excerpt. Also a stunning "triple header" effect using absolute positioning and the Georgia font.

Fixed Div in IE
A fixed div layout in IE 6 that validates. One of many advanced designs produced by Stu Nicholls.

The Sidewinder
Scrolling things horizontally with CSS. The original website that featured this layout is gone but the CSS remains...

CSS Showcase

2005-02-04T14:46:00.000-05:00

CSS Zen Garden
Dave Shea's cutting-edge CSS design site dedicated to pushing the Style Sheet envelope. Updated regularly.

CSS Beauty
A growing database of designer websites from around the world presented in stunning CSS. The site is expertly designed with CSS as well.

CSS Drive
I just found this site and I assume it's fairly new. It's similar in content to the other showcase sites and is worth spending some time at.

CSS Vault
A showcase site so successful that it was just sold by its owner and creator, Paul Scrivens, for a lot of money.

Web Standards Awards
"The Web Standards Awards aims to promote web site design using W3C standards by seeking out and highlighting the finest standards-compliant sites on the Internet."

Update: 2/11/05

Unmatched Style
Another showcase site I missed on my original post: "The idea stemmed from CSS Vault and CSS Beauty. Dusty and I were looking for a project to take on together and this became it."

Stylegala
"Stylegala is an online resource and inspiration guide for web agencies, designers and developers who take interest in websites that combine the powers of design, web standards and CSS."

CSS Wiki

2005-02-02T10:45:00.000-05:00

John Oxton is putting together a Web Standards Wiki. It seems some work has already been done on logo designs for the proposed site.

Free site templates available at OSWD.

A web design links page from DIGG. A similar page at del.icio.us

I regularly visit the best of the free fonts sites around the web. DaFont has the nicest collection of quality free fonts I've seen. Organized into categories for your convenience.

Some interesting dropshadow tests based on this classic article at ALA.

Usable Type

2005-01-31T14:40:00.000-05:00

Usable Type is a new weblog focusing on web typography and CSS. Many articles on the different font properties and a stylish site design.

The Rounded-box Generator is an online tool for generating the images and code to render a rounded box in any color.

I ran across this CSS Weblog while cruising the del.icio.us main page: "The CSS Weblog covers everything from simple tips and tricks for your website layout to workaround alternatives to many, much more elaborate, web development techniques."

A huge list of CSS links can be found at dezwozhere.