Skip to navigation Skip to content

Results for “CSS”

Updated for her pleasure

As part of the policy of constantly updating the site, we have updated the site.

  • We have completely rewritten the site’s JavaScript. For the less tech-oriented out there, JavaScript is the code that among other things controls the performance-sapping, battery-draining, processor hogging animations we have gratuitously sprinkled throughout the site to surprise and delight our readers. The code is much better from a purely academic best-practices standpoint, and it’s more efficient.
  • We once again rewrote the site headers and navigation so that the animations will be smoother, and as a side benefit, the HTML code at... More

Steal this site

Some time this week, some items changed in a database that controls Internet domains and this site quietly made a major technical shift.

It all went well enough that probably no one really noticed a difference. I did take the opportunity to make a few design tweaks here and there that some might notice. But the change to the site is all on the back end.

I’m calling this version Snow Leopard.

For about the last 10 years, my site has been published using Movable Type. It did its job quietly and competently, but as a technology it... More

Ship of fools

It was supposed to just be a tech revision, a release I’d dubbed Snow Leopard.

But my penchant for tinkering has once again outrun my good sense. So this site also has a visual refresh, too. In fact, has been visually refreshed more times than Katherine Helmond in Brazil. it’s more of ship of Theseus in that it isn’t the same site any more.

Here was what it looked like when I launched it last fall. Since then a bunch of it has been rewritten to take advantage of modern browser technologies.1 I’ve changed... More

Setting aspect ratios on responsive objects

Responsive design not only caused designers and developers to rethink their entire design process, it caused numerous little head-scratchers along the way.

One problem is how to maintain an an exact aspect ratio on a DOM object on page resize. It’s easy if it contains a presized object, hard if it does not. Adjusting top or bottom padding was always a favorite technique.

Recently I needed a square figure wrapper to contain an image of undetermined size and aspect ratio. The image could be either tall or wide. Despite this, the image would need to center and fill out... More

That PostCSS. It’s so hot right now

Web developers suffer from the worst kind of imposter syndrome.

My theory is that it’s because devs are faced with a constant barrage of the new hotness. Generally it goes something like this:

  • 9 a.m. “OMG! They just released Widget.js this morning and it’s amazeballs awesome! Everyone is using it! I’m moving all my projects to it!
  • 5 p.m. “What? Are you still using Widget.js? LOL! Dingus.js just came out this afternoon and it’s amazeballs awesome!

CSS preprocessors have been on this new hotness treadmill for a few years. We have Sass that supplanted LESS... More

Flipping the script

I have a particular methodology that I use to write all my JavaScript.

First, I decide to add some sort of gratuitous, showy, processor-hogging, performance sapping JavaScript animation to my site. Then I spend two weeks writing code that is a horrible disorganized mess that is about 90 percent functional but completely breaks every time I try to fix it.

Then throw it out and rewrite it all in about three hours.

Which brings me to the latest addition to this site. I’ve added a scroll progress meter to the top menu bar. I even consulted for several months with... More

Toward a better underline

One of the first things I noticed about iOS8 was that the default underscore style for anchor tags is a proper typographical underline.

Safari in Yosemite has also adopted this method.

These are nice touches that draw the traditions of print typography and the type of sanding-the-bottoms-of-the drawers attention to detail that websites need.

But the state of default browser underlines remains fairly lousy across the board. In an era when more refined web type is common, it’s particularly bothersome for typographical pedants.

When building, I adopted the Medium design team’s method of creating bespoke underlines.... More

That is why you fail

I’ve been writing about my efforts to make my site load faster. Read Part 1 here.

But like that young Jedi so long ago, I was not always able to levitate the ship out of the swamp. Probably because I didn’t believe enough.

Either, way, here are some methods that I tried and ended up not using.

###What was a wash

  • Lazy loading or concatenating my javascript and didn’t make much of a difference. Likely because my concatenated scripts are only 18K.
  • Paying extra for CDN web hosting. My time to first byte varies widely, from as... More

Making load fast: Part 1

A few years ago, I made a key lime pie for a party. One of my friends was raving about it. “Oh my God. You have to give me the recipe.”

“Well,” I said. “There’s no secret. It’s the recipe on the key lime juice bottle.”

This is sort of how I feel about my web optimization efforts. Smart people at Filament Group and Google and elsewhere have already figured it out. Just follow the recipe.

If it was that easy, we’d all be Gordon Ramsay. Err, maybe not.

But, like with pie, experience has taught... More

The code war

I’ve been to several design conferences in the past couple years, and typically within the first few hours some sort of discussion will break out – usually on Twitter – over “should designers code”.

A lot of pixels and a some vitriol have been also spilled on the subject. But it’s really nothing but a bunfight. Opinions get tossed around but no one actually gets hurt.

My position has always been of course designers should code. Why would you not? It’s the fundamental technology of the web.

But “designers should code” sounds a little bossypants.... More

Kick the tires and light the fires

We’re live. Finally. It still has that new website smell.

I’ve been working on a new pretty regularly since early October. It’s not so much done as kicked out the door. Please be patient as I still clean up some of the messes that I made.

This replaces an older jQuery-based site that I built over a three-day weekend because I needed a portfolio site to apply for a job. This redesign is about the fourth guise for a domain that I’ve owned for 14 years now, probably to the dismay of other David Putneys who have... More