It probably doesn’t help that my friend was once a soloist in one of the top ballet companies in the world. She has been trained to achieve perfection, and can’t accept any less.

My recommendations to her were: 1) meditate for two lousy minutes 2) do it every day, and 3) give yourself permission to suck.

It’s natural to think of other things when you’re meditating – especially if you’re just starting. If you didn’t think of other things, something would be wrong with you. However, if you couldn’t meditate for two minutes, something else would be wrong with you. Of course you can meditate for two minutes.

The first couple of times you do it, you’re not going to be very good at it. Hey, you might not be very good at it for months, but if you make it a habit to try it, slowly, eventually, you’ll actually be good at it. You’ll even start to like it. “Two minutes isn’t enough!” you’ll say to yourself, and you’ll move to five minutes. Then ten minutes. Then fifteen.

But before you can get there, you have to give yourself permission to suck.

It’s okay to suck, it’s necessary to suck

Most people don’t give themselves permission to suck. They think that there are people who are great at things (and are notable for being great at those things), and then there is them: ordinary person – and all of the ordinary people around them.

If they start trying to do something, their ordinary person friends try to push them down “why are you doing that?” “What a waste of time!” “Why don’t you just watch sitcoms and scan Facebook with your free time, fellow ordinary person?”

Unfortunately, most people give in. They can’t stand to suck.

I sucked until I didn’t suck, but I still suck

Eight years ago, I sucked at writing. Shit, I didn’t even like writing. But for some unknown reason, I felt compelled to start a blog. My first blog post sucks. It’s one long, disjointed paragraph. It has no real point. It has a misspelling.

You know what? My second blog post sucks, too; and the third. In fact, I have tons of sucky blog posts. Even today, I have a pile of documents full of sucky writing that will never see the light of day, and I’ll be adding to it tomorrow with more half-baked suckery.

Eight years ago, I sucked at writing; and today I’m a published author, of a book that has done pretty well. Is my book perfect? No. It has way more misspellings than my first blog post does, but I’m not too humble to admit that I don’t think it sucks at all. Still, some people disagree, but that’s okay.

Maybe someday I’ll write another book, and it will be a little better than my first book. It probably won’t be a perfect book, but I’ll be happy with it. Some people will still say that it sucks.

Other people will put the fear of suck in you

When I first started my blog, I heard a lot of the same things that most people hear when they start something they suck at. They wanted to know “why” I was doing it. How was I going to make money doing this? Shouldn’t I be working on my full-time job instead of wasting my time with this blog? (If this sounds totally ridiculous to you, keep in mind that I lived in Nebraska – I don’t know if this is what you would hear in other places, but certainly not Silicon Valley.)

What they didn’t understand – what most people don’t understand, is that someone doesn’t wave a magic wand and make you successful or good at something. You don’t just head down to the career center at your community college and fill out an application to be a successful entrepreneur, or a famous musician, or a professional basketball player.

You have to give yourself permission to suck first.

Why you should suck, and be okay with it

There is nothing about sucking to fear, except sucking itself.

Think about something you want to try, but are afraid of sucking at. Why are you afraid of it? It’s probably because 1) it will make you feel crappy about yourself, 2) it will make you feel crappy about what other people think of you, and 3) that will make you feel crappy about yourself.

Those are valid fears (albeit without tangible consequences), but they are terrible reasons to not do something. Here’s why you should suck:

• Doing things you suck at can still be enjoyable. If you allow yourself to be okay with sucking, you can find bits of enjoyment in that activity. The crisp feeling of a well-struck golf shot, the satisfaction of a nailed yoga pose, or the feeling of dancing in time with a Salsa song for a moment can all be sensations that keep you coming back. Which leads me to the next reason.
• Doing things you enjoy, can often lead to not sucking at them. If you find enjoyment in the things you suck at, you’ll do those things more, then – someday – you won’t suck at them anymore. Find a way to enjoy going to the gym (not overtraining, or by bringing a friend), or set small goals for yourself (just get yourself to the gym), and eventually you won’t suck at working out anymore.
• One hone smooths another. It can be surprising what having varied interests – even ones that you suck at – can bring to your life. When I started taking dance lessons, I found that my typing got more accurate and fluid (seriously!). Doing yoga helped me discover that my brain works better when my muscles are stretched. It pays to nurture a Renaissance Mind.
• Life is long, sucking is temporary. Remember my friend who couldn’t meditate? My final word of wisdom for her was “you have 40 or 50 more years to not suck at meditating. Can you give yourself permission to suck for a couple of weeks?” This is the most important reason to not be afraid to suck. If you find a way to be okay with sucking for a short time, you’ll have a whole lifetime to enjoy not sucking at that thing.

Give yourself permission to suck: kadavy.net/blog/posts/per…

— David Kadavy (@kadavy) November 2, 2012

Productivity is less about time management than it is about mind management.

— David Kadavy (@kadavy) May 1, 2012

For example, when I was writing my book, I admittedly had a difficult time managing my mental energy. The project seemed to consist of 12 hours a day banging my head against the wall, only to get maybe 15 or 20 minutes of real “flow” – writing that really took a smooth path from my brain to my fingertips.

Imagine if I could have sat down for 15 or 20 minutes a day, did my writing, and then enjoyed the rest of my day. This seems unrealistic, but certainly I could have employed a strategy that could have made the process less agonizing.

Three Important Questions of Mind Management

Throughout the process of writing Design for Hackers, I did start to gain an intuitive sense of what was going on with my brain, and how to navigate my own mental landscape. I found myself consistently asking myself a few important questions:

1. What kind of work do I need to do right now? Is there anything extremely pressing, or can I let my mental state guide the work that I decide to do right now?
2. What kind of mental state am I in right now? Am I in the mood for draft writing, outlining, researching, exploring, or polishing? (Throughout the process, I began to codify the different types of work required to produce my writing.)
3. Is there something I can do to get myself into the right mental state? Over time, I realized there were different “hacks” or rituals that would help me switch mental states. Exercising, massages, different types of music, different types of teas, epsom salt baths, and neurotransmitter-supporting amino acids all eventually served their own purposes. I also had different venues to do different types of work: for example, a cafe in a skyscraper high above the city was better for higher-level brainstorming, while a dark, small room in the public library was better for polishing or research. (Which is consistent with academic findings.)

The goal of mind management is to align your mental state with work that needs to be done, while also allowing your mind to do the work that it wants to do.

Key Takeaways of Mind Management

I didn’t have much time to think about what was going on during the book writing process, but once the smoked cleared, I began to get more fascinated by what, exactly, my brain was doing throughout all of this.

I picked up a few armchair neuroscience books, the most powerful of which, by far, was David Rock’s Your Brain At Work. This book basically explains the brainwaves, neurotransmitters, the different regions of the brain, and how they all work together throughout your day. I highly recommend it.

By really understanding how your brain works, you can have a framework with which to understand what is going on with your mind, and thus, you’ll be better equipped to know how to better use your precious mental energy.

Here are a few takeaways and tactics that I’ve developed from my research and experimentation:

• Your brain is plastic: Every time your neurons fire, it makes it easier for those same pathways to fire again. It used to believed that the brain was a static organ once you reached adulthood, but now we know that the brain changes throughout life. This means that each time you perform a thought or action, you make it easier for your brain to reproduce that thought or action. This has some pretty clear implications for positive vs. negative thoughts, and explains why meditation is so powerful (which I’ll get to in a bit).
• Love your prefrontal cortex: Your prefrontal cortex is the “newest” (in terms of evolution) part of your brain. Your prefrontal cortex is in charge of things like prioritization, planning, and suppressing urges. But, your prefrontal cortex is small, but energy-hungry. So when it gets tired, it’s hard for you to think about the overarching purpose of what it is you’re doing right now, or to keep yourself from checking Facebook and Twitter every 2 minutes. So, it’s important to get mental rest to keep your prefrontal cortex working well, and to set aside special time dedicated only to prioritization (such as Prefrontal Mondays).
• Fight your amygdala: Your amygdala is the oldest one of the older (in terms of evolution) parts of your brain. A lizard’s brain is basically all amygdala (this is why Seth Godin talks about the lizard brain). Your amygdala is extremely fear-driven, and is programmed to save you from danger. The really tough part is that your amygdala communicates with your body even before the rest of your brain (which can handle much more complex thinking). For example, if you see a snake, your amygdala tells your sympathetic nervous system to increase your heart rate before your eyes can even tell your brain “this is a snake.” The rest of your brain will then conclude “my heart rate increased, so I’m scared of this snake.” Your amygdala always wants you take the “safe” route, and will stifle your creativity, so you have to be wary of its power.
• Restorative things are productive: Given this struggle between your prefrontal cortex and amygdala, and the fact that your prefrontal cortex is so easily fatigued, it should be no surprise that rest is important to using your mind effectively. If you think you’re getting more work done by working until you collapse every night, I’d argue that you probably aren’t. You’re probably depleting your prefrontal cortex, and instead of thinking strategically, are filling up the time with reactionary, fear-driven (amygdala-driven) “work.” Restorative activities, such as exercising, sleeping, and spending time with loved ones help your brain reorganize. If you’re skeptical, there’s research showing that positive mood and sleep encourage insightful thinking, and that close relationships strongly affect happiness.

Mind Management in Action

With the above in mind, here’s a few actionable tips you can use to manage your mind effectively.

• Meditate: By practicing mindfulness meditation, you carve neural pathways to better process stimuli in your present environment, making you more calm and deliberate. To really get into it, I started with two sessions a day at 10–15 minutes for about 6 months. Now, I do one session a day. If you really think you can’t meditate, start with a 2-minute version of the 10-minute hack. If you can’t meditate for 2 minutes, you have bigger problems than being “too busy.”
• Make time for planning: Making planning a separate, dedicated activity has two benefits: 1) You can do it when your mental energy for planning is high (I like Sunday evenings), so that you do better planning, and 2) It frees up your precious prefrontal cortex to do other activities – since the planning and prioritization has already been done. I like to do a “weekly review” (a term familiar to GTDers) in which I make a bullet point list of everything going on in the coming week. Even if something is in my calendar, the act of typing it out into this list helps program it into my brain, while also reminding me to think about any details I might not have thought about yet (for example, if my flight on Wednesday is at 2pm, what time should I head to the airport?) Also, you might want to try Prefrontal Mondays.
• Trick yourself into starting: Just starting a task can be tremendously difficult. Without a clear goal in mind, your brain won’t produce enough dopamine to motivate you to start. The 10-minute hack gives you a really simple goal (work on this one thing for 10 minutes without stopping). The side benefits of doing this successfully are that resisting the urge to heed distractions helps strengthen your prefrontal cortex, and that once you’re actually 10 minutes into working on your task, it’s easier to continue working on it.

This is just the tip of the mind management iceberg, and as more great research is done, we’ll have more to go on in discovering how to manage our minds. If you’re into this content, I hope to expand on some of these ideas, so what sticks out to you? How do you manage your mind?

I recently gave a talk at IgniteChicago – with less detail than what follows – about just why it is that Comic Sans is so hated:

Comic Sans vs. Helvetica

To illustrate the poor fundamentals of Comic Sans, I will compare it to Helvetica, which is such a beloved font, that there’s a movie – about typography – named Helvetica.

First of all, I should acknowledge that comparing these fonts is a bit apples to oranges (which are both fruits, mind you), in that they both convey completely different moods: Helvetica looks strong and serious, and Comic Sans is usually used in situations where one wants to look playful and casual.

Both Have Unmodulated Strokes

Comic Sans and Helvetica both have unmodulated strokes, unlike Garamond.

But they have their similarities as well. They both have a relatively unmodulated stroke, meaning that the thickness of the strokes on the fonts don’t change throughout the stroke. This sample shows how Helvetica’s form differs from that of Garamond, which has a modulated stroke. Comic Sans also has an unmodulated stroke.

Scribed lettering had modulated strokes - a result of drawing tools - which later influenced the first printed fonts.

This modulation is a result of Garamond’s form being derived from that of scribed letters. Before printing was available in the West, scribes lettered Bibles beautifully and patiently by hand, using a flat-tipped pen, held at a fixed angle, which influenced the form of those letters – resulting in a modulated stroke. As printing was developed, the letters created mimicked scribed letters, and – while they eventually developed their own forms – printed letterforms almost exclusively had modulated strokes until sans-serif type was popularized in the early 1800′s. The forms of most sans-serif fonts are not influenced by drawing tools.

Helvetica Manages Weight Better

Helvetica manages the visual weight of its letterforms more delicately than does Comic Sans.

Though the strokes of Helvetica’s letterforms are unmodulated, some adjustments are made to improve its legibility. For example, notice how the stroke on Helvetica gets thinner where the shoulder meets the stem on this letter n. This helps to give the letter a more even visual weight. Notice how Comic Sans is not this way. If you squint your eyes, you’ll notice that there is a disproportionately heavy area where these strokes meet on Comic Sans, while Helvetica’s weight is more evenly distributed. The ironic thing about this distinction is that Comic Sans is actually influenced from a drawing tool: a round, felt-tipped pen or marker; but, the stroke of this tool is unmodulated. Meanwhile, the letterforms of Helvetica are rationalized from predecessors, without apparent influence of a drawing tool.

This mismanagement of visual weight is the main issue that makes reading Comic Sans an unpleasant experience. Evenness of weight, or “texture” is important to the legibility and readability of typography. Letters or blocks of text that are free from disproportionately light or heavy spots allow the letterforms themselves to shine through and be read easily.

Helvetica yields a more even texture in body copy than does Comic Sans.

This example shows how a block of text set in Helvetica differs in texture from a block of text set in Comic Sans. I’ve blurred both blocks of text and bumped up the contrast so we can all collectively experience an objective form of squinting – to identify areas that are excessively light or dark.

First, notice the general variation of lightness and darkness in the lines of type. The Helvetica is a more uniform grey, while the Comic Sans varies widely, with some very dark spots scattered throughout the body of text. The most obvious anomolies are the letters “e” and “t,” the former of which appears like a blood stain a number of times in the example, and the latter which sticks out like a dead tree.

The stroke modulation of Garamond allows for it to have a small eye & large aperture.

The Comic Sans “e” appears more dark than the other letters because it’s overall visual weight is mismanaged. When compared to Garamond and Helvetica, we can get some idea of why. Garamond’s “e” features a very large aperture, and small eye, but its stroke modulation keeps it balanced. The extreme heaviness of the stroke towards the bottom left of the “e” is balanced out by the large aperture, and the tiny eye is balanced out by the very thin bar that closes out the eye. Helvetica maintains balance by compensating for its absence of stroke modulation by having a larger eye and a smaller aperture. Comic Sans, however, by virtue of its handwriting-based style, has a tilted – incidentally “Venetian” – eye to its “e” giving it both a small eye, and a large aperture. Since there is no stroke modulation to Comic Sans, it can’t compensate for this lack of balance and thus utterly fails.

Comic Sans Has Poor Letterfit

But poor management of visual weight within the letterforms themselves isn’t the only characteristic that makes Comic Sans uneven in body text. The “letterfit” – or consideration given to the letterforms to allow them to be set together in an even manner – of Comic Sans is very poor. The letterfit of Helvetica allows for it to inherently have decent kerning tables. Kerning is the distance between two letters, and good fonts have parameters set for just about every letter combination (or “kerning tables”) in which the font may eventually be set; but if the letters themselves aren’t designed with consideration given to how the letters will relate to one another, then producing good kerning tables is impossible.

The poor letterfit of Comic Sans makes it nearly impossible for it to be kerned properly.

You can see that Comic Sans has an awkward gap between the “f” and the “o,” but this pairing can’t simply be more tightly kerned, as it would create an area of tension – from too close proximity – between the crossbar of the “f” and the “o.” You can see similar problems throughout the font, but this is one of the better examples. This problem could have been avoided if the leading portion of the crossbar of the “f” weren’t so long (notice that it is shorter on Helvetica). One way to compensate for these poor pairings would be to space the letters out a bit on the whole, to allow for relatively tighter pairings for problem areas such as I’ve described; but, this isn’t feasible in most computer applications, and it would do little to make up for the other blunders of Comic Sans.

So, the typographic fundamentals of Comic Sans are very poor as used in high-resolution situations, but Comic Sans was never intended to be used in this manner, and that is part of why its considered such a bad font.

Comic Sans isn’t Used as Intended

Comic Sans was designed to be used in these talk bubbles in Microsoft Bob.

Comic Sans was originally designed to be used in the talk bubbles of a program called Microsoft Bob. The font wasn’t completed in time to actually make it into the program, but it lived on to eventually ship with Windows 95; and that’s when the font really got ugly.

Once the font was in the hands of Windows 95 users, there was no telling how people would use it. Now, it was going to be printed out on bake sale flyers, birthday party invitations, and even business cards. But remember, this font was designed to be used on-screen, and in 1994, when the font was designed, most computers for personal use – and Windows 95 – didn’t have anti-aliasing.

Comic Sans was originally designed to be displayed aliased.

Anti-aliasing is the technology that makes fonts looks smooth on-screen. Without ant-aliasing, fonts look jagged – as if they were made of LEGOS®. This isn’t the end of the world, as long as the font is designed accordingly. Notice how much better the “e” of Comic Sans distributes its visual weight when aliased.

When aliased at 12px, Comic Sans is more readable than Garamond.

In fact, when compared to Garamond, which wasn’t originally designed for the screen, Comic Sans fares quite well in terms of readability.

Where the Hate Comes From: The Wrong Place at the Wrong Time

So, the story of Comic Sans is not that of a really terrible font, but rather of a mediocre font, used incorrectly on a massive scale. Windows 95 was the first operating system to really hit it big. Just as computers were starting to pop up in nearly every home in America, Windows 95 was finding itself installed on all of those computers, and with it, the font Comic Sans. So now, nearly every man, woman, child, and bake sale organizer find themselves armed with publishing power unlike civilization had ever seen; and few of them really had any design sense.

Comic Sans Rode a Wave: Desktop Publishing

It used to be that if you lost your kitten, and wanted to make a poster, probably the most efficient way to make a flyer would be to draw one up with magic marker, cut out a picture of the cat, and go down to the nearest supermarket to make copies of it at 15 cents apiece. Then, you would post them up in your neighborhood; and – like a caveman – you would pick up a phone, call the newspaper, and place an ad to help find your kitten.

But now that you had Windows 95, a personal computer, and a printer, you could use Word to make your lost kitten poster, and print it out at home. And, wow! You could use any font you wanted. What’s that? You don’t know anything about fonts? Of course not, because you’ve never had this power before. So, guess what font makes you think about your lost kitten?

This is a monumental moment in history – right up there with the invention of printing – for common people to suddenly have the power to typeset and print documents. No big deal for awhile: some people got to enjoy making their own Christmas cards, birthday party invitations, etc. for awhile, and the small audiences of their families and coworkers suddenly had to put up with some ugly, clip art riddled Christmas cards.

But then, gradually, over the next 10 years or so, the internet got more and more popular. Now, that publishing power got even stronger: instead of flyers posted in break rooms, Comic Sans was showing up on websites, and even as the default font for many people’s emails. Now, any one person could write a message that could potentially be read by millions, in Comic Sans. This actually happened when Cleveland Caveliers owner, Dan Gilbert wrote a letter regarding the dramatic departure of LeBron James, in Comic Sans – resulting in a media storm over the poor font choice.

Dan Gilbert's usage of Comic Sans was the height of the font's infamy.

The Rise of the Graphic Design Degree, & The Formation of an Army of Haters

But where did all of this hatred come from? Well, while grandmas around the world were printing birthday invitations in Comic Sans, the field of Commercial Art (now known as “Graphic Design”) was enjoying the revolutionary typesetting power that the Macintosh provided. No longer did they have to blindly “spec” out type, not knowing what the final result would look like until their work got back from the typesetter. This made the production of high quality print design much cheaper, and much more viable for businesses to spend money on. So, with the increased demand for Graphic Design services, Design schools started churning out graduates at an unprecedented pace. Who doesn’t want to just sit and draw stuff for a living, right?

At this point – the late 90′s – all of these young people are suddenly seeing the world through new eyes. Having been through it myself, words cannot describe the jarring experience of Pandora’s box being opened up to reveal that 95% of every designed thing you see is ugly. Terrible font choices, poor kerning, haphazard color choices, and stupid concepts suddenly assault your eyes once you learn about design principles, color theory, typography, and concept development. A large portion of conversations between myself and other self-righteous design students were – and still are – about how terribly designed everything is: campus wayfinding signage, the t-shirt for the latest toga party, and yes, lost kitten posters.

But most of these design students were – and still are – blind to what a monumental, mammoth, incredible, revolutionary, huge thing was occurring. Their grandmother could typeset and print out as many lost kitten posters as she wanted. She can even make a website about her kitten, and someone in Tanzania can read about it (this is probably only remarkable to you if you don’t live in Tanzania). This makes Gutenberg’s 42-line Bible look like the non-self-inflating Whoopie cushion!

The Clash of Knowledge & Ignorance

Eventually, regular people got more familiar with this publishing power, desktop publishing applications – like Microsoft Publisher – became more widely available, and more people started to get the hang of publishing on their own. This really started to encroach on the territory of these fresh design graduates, many of whom were finding being a Graphic Designer to really suck: a client may have her nephew design a brochure, and hire you to clean it up, or worse yet – take a stab at it herself.

Meanwhile – this is the last decade or so – the same invention that made Graphic Design easier was making it way harder: print was dying, and the web was growing. Now, clients are trying to direct designers themselves, and the designers need to learn how to code web pages just to stay relevant. This doesn’t sit well with most designers.

So, you see, Comic Sans is an archetypal enemy of the Graphic Designer. Its not only an unattractive font, but it also represents the invisible, evil force that is making the “print” designer less and less relevant. A natural reaction to being threatened is violence, and the hatred for Comic Sans is arguably violent.

A Well-Designed Future

Comic Sans is at the disposal of nearly everyone with a computer; but that doesn’t mean that we will always have to be subject to its awkward forms. The spread of Comic Sans – a pretty bad font – is the result of the spread of an inarguably good technology. Just as the advent of movable type eventually lead to a spread of literacy, the advent of personal publishing should lead to the spread of design literacy; and with it, a populace too informed to stoop to using Comic Sans.

Why You Hate Comic Sans kadavy.net/blog/posts/why…

— David Kadavy (@kadavy) February 22, 2013

Other Design posts you may like are Why Monet Never Used Black, & Why You Shouldn’t Either, and Why You Don’t Use Garamond on the Web.

Monet and Other Impressionists Explored Their Medium

Even when creating dramatic shadows, Monet avoided black, and instead manipulated the powerful relationships between colors

Monet, and other impressionists, experimented obsessively with their medium: paint, some brushes, and a canvas. So just as pixels prohibit the use of Garamond on the web, the characteristics of the impressionists tools shaped their work. The inherent qualities of oil paint (thick and viscous), paint brushes (just a bunch of hair on a stick), and sometimes the texture of the canvas itself, lent themselves well to paintings being much more – put simply: blurry – than the more realistic paintings that were popular at the time. Photorealistic painters strived to make these qualities invisible, but the impressionists (like pixel fonts did for pixels) embraced them.

In the course of this experimentation, impressionists had to experiment with color to create the desired effects. Much like a rich-colored image is dithered when restricted to a 256 color palette, the impressionists experimented with creating the illusion of a color by placing colors next to each other which would create the illusion of the color they desired for the viewer.

The Impressionists Became Masters of Color

This effect was experimented with further until it became the major focus of some impressionist painters as a technique called pointillism – which involves painting dots of color next to each other to create the effect of a different overall color. Georges Seurat is credited with developing the technique, and one of his paintings close-up doesn’t look all that different from a dithered GIF image, as you can see in this example of a close-up of one of Seurat’s paintings next to a blown-up GIF image with a palette of only 8 colors and a pattern dither.

Because he experimented with the juxtaposing colors, the pointillism of Georges Seurat is similar to a dithered GIF image

By experimenting this way, the impressionists were doing much more than simply trying to replicate reality: they were analyzing the area between the subject of a piece of art, and the eye of the viewer. They were exploring just what makes ripples on water, with light bouncing off of them, glimmer the way they do. They analyzed what collection of colors make up the shadow of an object to give it dimension, and black wasn’t one of those colors.

Color Theory Explains What the Impressionists Discovered

Why this is can be explained by color theory. You’ve probably seen a color wheel before. Here’s an extremely basic refresher:

The color wheel is made up of warm and cool colors

One half of the color wheel: from yellow through red, is made of what is called “warm” colors. The other half of the color wheel: from green through purple, is made up of what is called “cool” colors. Because these colors are completely saturated, I’ll go ahead and call them hues from now on. I’ll explain a little later what I mean by that.

Also, of note later on: colors that are opposite of each other are called complementary. Complementary colors contrast each other strongly, and any two complements, when mixed together as paint, result in a brownish-grey color.

Warm Colors Pop, Cool Colors Recede

As a general rule, warm hues pop out at the viewer, giving the appearance of being closer; while cool hues recede, or give the appearance of being farther away.

The red (warm) square pops, the blue (cool) square recedes

As you can see on the left side of this example, the blue block recedes, looking as if it is a hole in the center of the red block. On the right side of the example, you see the opposite effect, with the red block looking almost as if it is a tower extruding towards you from the blue block. The warm hue – red – pops out at you, and the cool hue – blue – recedes from you.

The hue is the pure base color – as taken from the color wheel. To create a more sophisticated color, a hue is tinted or shaded. A tint of a hue is basically a lighter version of that hue. If you were mixing paint, you would just be adding white. A shade is a darker version of the base hue. If you were mixing paint, you would essentially be adding black to create a darker version of the hue.

Tints Pop, Shades Recede

Its probably no surprise to you that – much like warm hues pop, and cool hues recede – tints pop, and shades recede, as you can see in the example below. With the same color of blue as the backdrop, a tinted square of that blue pops, while a shaded square recedes.

The tinted blue square pops, the shaded blue square recedes

Context is Important

But will that tinted blue square always pop? Of course not: context is important, too. In this example, that exact same square is barely noticeable on a backdrop of slightly less tint, while it really pops on a heavily shaded backdrop.

The tinted blue square pops more off of a shaded blue field than a tinted one

Temperature is Stronger than Tint

This same phenomenon of context applies to the relative position of two hues on a color wheel as well. While neither of the middle squares of both sides of this example have any tint nor shade, their appearance relative to the blue backdrop differs drastically. The square that is purple – a color which is adjacent to blue on the color wheel – almost blends in completely, while the square that is orange, which is blue’s complement, leaps violently off of the blue field. The contrast between these two hues is so great that there is a sense of vibration where they meet. Also note that while purple is a cool hue, it is still slightly warmer than blue, which causes the purple square to pop very slightly.

Even though none of these colors are tinted or shaded, the orange square pops more off of the blue field than the purple square does

The effect caused by the relative color wheel position of two hues is so strong that it nearly overpowers the effect caused by tint or shade. Even when laid over a shaded purple backdrop, the tinted blue middle square on the left side of this example recedes. Contrast that with the tinted purple square on the right side of this example, which rockets towards you off of the shaded blue backdrop.

Even when tinted, a blue square (left) recedes into a shaded purple field, while a tinted purple square pops off of a shaded blue field. This is because blue is a cooler color than purple.

The impressionists avoided black not only because it nearly doesn’t exist in nature, but because the effects caused by changes in hue are so much richer than those caused by changes in shade. When you use pure black to create contrast, you miss out completely on the powerful effects of changes in hue.

Even though a tinted purple square pops off of a black field, it appears more natural on a heavily shaded blue field

The left side of this example is the exact same color combination as the right side of the previous example. Notice how the dark blue backdrop recedes away from the light purple square, lifting it toward the viewer. The black backdrop certainly contrasts with the purple square, but since it has no hue relationship with the purple square, the purple square seems to just float around, while the edges between it and the black backdrop give an unpleasant effect of vibration.

Now You Know, Now What?

So, how can you use this knowledge to make your web designs better? By understanding how colors interact with one another, you can more strongly establish a heirarchy of information in your typography. Web conventions have made it widely acceptable to use black on white for text on web pages, but this is neither the most readable, nor most aesthetically pleasing option.

Enrich Your Typography

In the example below, the main text is 16px and pure black, or #000000, while the secondary text is 12px and #888888, or a neutral (neither warm nor cool) grey. You can see that there is a pretty clear heirarchy here.

This second example uses the same fonts and text sizes, but this time, a warm, dark gray is used as the base color. The main text is #503e2b, a very dark orange (a warm hue). The secondary text is a lighter version of this base color – #9e948a – found with w3school’s handy color picker. There is still enough contrast as to be readable, but the contrast isn’t as harsh as black vs. white. Overall, it’s visually pleasing, and, well – warm.

The main text in this final example uses the same dark orange from the previous example, but this time – instead of simply using a tint of this color, a complementary (cool) grey is used for the secondary text – #808094. This adds extra dimension to the hierarchy we’re establishing. The secondary text is not only smaller and tinted, but now it’s a cooler color, thus causing it to recede even more. Now there is a color relationship between the two pieces of information, which intensifies our intended hierarchy while still creating a sense of harmony and realism.

Add Life to Your Graphics

Skillful manipulation of color relationships is at the crux of creating engaging and lifelike interface graphics, such as buttons. The example below, created in Photoshop, features two buttons that are created by vector masks sharing the exact same base color (#cc6666), but the highlights and shadows are treated differently. The highlights and shadows for the button on the left are created using a “Gradient Overlay” layer effect featuring a simple black-to-white-to-black gradient, a “Linear Burn” blend mode, and a 26% opacity. The drop shadow on this button is composed of black, at a 75% opacity. This is a generally attractive button, but it doesn’t have quite the richness of the button on the right, which is created using a green-to-yellow-to-green gradient (green being cool, and the complement to red, and yellow being warmer than red), and a dark blue drop shadow – for more harmonious contrast, the text on this button is also a very light yellow. The color swatches adjacent to each button illustrate clearly how the resulting color palettes of these buttons differ.

Skillful manipulation of color relationships result in a more engaging button, with a more sophisticated color palette

Don’t be so quick to use black: if you really master manipulating color relationships to create dimension, you can really add freshness and life to your designs.

Why Monet Never Used Black, & Why You Shouldn’t Either kadavy.net/blog/posts/d4h…

— David Kadavy (@kadavy) March 3, 2013

Other Design posts you may like are Why You Hate Comic Sans, and Why You Don’t Use Garamond on the Web.

One of the most important principles behind every good piece of design is that the designer has to master his or her medium. With any medium – whether it’s pencil and paper, steel and glass, or pixels – the designer has to work with strengths and limitations. Work with these characteristics, and the design stands a chance to be good – work against them, and there is no chance.

Apple’s lead designer, Jonathan Ive knows this. He recently said

The best design explicitly acknowledges that you cannot disconnect the form from the material – the material informs the form…

Medium and Form in Type History

Typography is the perfect vehicle with which to illustrate this concept throughout history. From the beginning, the forms of our letters have been influenced by the tools we used to create them.

This cuneiform inscribed tablet is an early example of how medium influenced form in written communication. You can see, looking at these pictograms, that they are made up of a series of indentions that are pretty much identical. This is because they were formed using a wedge-shaped stylus.

The characters on this cuneiform tablet are similar to one another because they were created with the same tool

As this language was replaced in the west by our current roman characters, and the tools which we used changed, so did the form of our letters. Some of the best examples of early typography using roman characters are from – you guessed it – the Roman empire.

This is graffiti from the ancient city of Pompeii. It was created using a brush, and this is apparent in the letterforms. You can see there’s a great deal of variation in the strokes that make up the letters, and they all terminate with a soft point, just like you would expect from a brush.

This graffiti was clearly created with a brush.
Photo byvirtusincertus

Here’s a picture I took from Pompeii that I blogged about several years ago – dating back to the same time (remember, this city was frozen in time when it was buried under volcanic ash in 79AD). Only this time, the sign was chiseled in stone – and you can see how this has influenced the letters: all of the strokes of the letters are uniform in width, and to make the ends of those strokes looks nice – serifs were added. You can see little spur serifs from where the chisel was applied perpendicular to the stroke of each of these letters.

The forms of these letters were influenced by the chisel that they were created with

Now, moving more quickly through history, we have letters from the column of Trajan (which inspired today’s Trajan font), which were formed first by brush, then by chisel (it would have been awkward to chisel letters like the brush-drawn ones in the earlier Pompeii example). Then we moved on to lead and wood-cut printing, which first imitated work done by scribes with pens.

The lettering on the column of Trajan were brushed on, then chiseled.
Photo by Silver Tusk

The letterforms of Bodoni are geometrically rationalized

Once actual drawing tools were a smaller part of the design equation, typographers started to get more theoretical with their designs – creating constraints of their own – fonts like Bodoni are geometrically rationalized, as they were created in a medium (cast metal) with relatively few restrictions.

A Little Too Much Freedom?

In modern web typography, we still have the restriction that the letters of our alphabet take certain forms, but many restrictions have been removed. Rather than only having a couple of fonts available in our typecases, there are thousands. So, this makes it easy for bad habits to develop, such as trapping our information in images, or using fonts that just aren’t good for the web.

So, what makes a font bad for the web? There’s the widely-known issue of availability of fonts on the computers of our audience members – this, of course, is why we’re usually using widely-available fonts like Arial, Verdana, Georgia, Times New Roman etc.. Now there are some pretty feasible ways of using whatever fonts we want – methods like SIFR, Typekit, and Google’s new Font API, but that still doesn’t mean you should use just any font. Even great classics like Garamond can be a disaster on the web, so its better to use a modern font that has been drawn with the screen in mind.

What a 12px Garamond character looks like, blown up

And the reason behind this is that our display technology isn’t up to par with paper. You can see here a comparison of the great classic font, Garamond, blown up (as it might look on paper), next to a detail of what it would be anti-aliased at 12px height on a modern computer screen. You can see that it doesn’t look so good on-screen, because it’s just made up of a bunch of blocks of color.

Working With the Screen

So, the popular web fonts (Arial, Verdana, Georgia, and Times New Roman) are such not only because of their wide availability, but because they are drawn with the screen’s limitations in mind.

This Flash animation that I created illustrates how pixels distort curvilinear form – such as that of typography. It’s the same series of concentric rings, but as it changes sizes, you can see that a moiré effect results from trying to draw these rings out of mere pixels. So, the most web-appropriate fonts are drawn with these limitations in mind.

Georgia is more readable than Garamond on-screen because of its larger x-height

This illustration shows just what I mean by that. Georgia reads better on screen than Garamond primarily because it has a higher x-height (the height of an “x”), and – as a result – a larger eye. This prevents letters such as “e” from becoming muddled and unreadable, and overall makes the letters actually look larger. The notes on this illustration are in 9px Verdana with no anti-aliasing; and you can see those letters read very crisply, as this font was made for such an application.

The sharp edges of the serifs on Georgia make them display more crisply on-screen

Georgia has a huge advantage over Garamond on-screen because it was designed to be displayed as such from the very beginning, when it was designed by Matthew Carter for Microsoft in the mid-90′s. This has manifest itself in sharp serifs on Georgia, rather than more subtly modeled ones on Garamond. Look at little curve on the bottom of Garamond. This gets blurred at smaller sizes, and hurts the legibility of Garamond.

This limitation of screen technology has been embraced, and taken to extremes, though.

Some type designs, like these from miniml.com, embrace the limitations of the pixel

Starting in the late 90′s and early 00′s, we saw lots of pixel fonts being used in Flash, such as these from Craig Kroeger’s miniml.com, which are designed to be used at specific sizes, with no anti-aliasing.

The limitations of the pixel spawned design methods, such as the dithering used in this design

When it was more common for computers to have only 256 colors, which caused dithering, designers embraced that constraint to inform their designs. Though ostensibly created to minimize bandwidth (another constraint of medium), designs that were created for the5k embraced dithering and lucidly used every pixel.

The “Web 2.0″ design trends of the last five years or so, are thanks to display quality and bandwidth improving, removing some of this constraint. In 2000, 12% of web users had only 256 colors on their monitors – in 2010, 97% have over 16 million colors (the number of colors available has a big impact on how crisply type, images, or *gradients* are displayed). This has put into the hands of designers a color palette beyond that of CMYK printing, with increased bandwidth to push it through.

Additionally, displays are cramming in more pixels per inch (ppi). The cheap Dell monitor I’m typing this on is displaying at 100ppi, and my MacBook Pro is displaying at about 115ppi. Compare that to the iPhone 4, which displays at an impressive 326ppi. Now, we’re starting to get some display technologies that are approaching the quality of paper when it comes to displaying letterforms readably.

So, maybe some day Garamond can make its comeback.

Why You Don’t Use Garamond on the Web kadavy.net/blog/posts/des…

— David Kadavy (@kadavy) March 3, 2013

Other Design posts you may like are Why You Hate Comic Sans, and Why Monet Never Used Black, & Why You Shouldn’t Either.

I have hosted various sites on three different WordPress hosts over the past couple of years, and have finally settled on WPEngine. They are reliable, have great support, and serve things up fast. I’ve lined up a special WPEngine coupon code with them that will get you 3 months free.

—–

I heard rumblings last year that Google would start altering their rankings based upon speed of page loads. This was confirmed a couple of weeks ago on the Google Webmaster’s blog, and – while they say that their new speed standards will only affect 1% of searches – you can bet that portion will rise in the future.

A few weeks before Google’s announcement, I decided it was time to start looking at site performance. I moved a couple of my sites, including this one, from my Dreamhost Shared server, to a Virtual Private Server (VPS) on The Rackspace Cloud. Additionally, I implemented a few other performance enhancements that I’ll cover below. From all of these changes, I cut load time of pages on kadavy.net by 75%, and my Webmaster Tools performance graph now looks like this.

Also, Googlebot now crawls my site 90% faster. A summary of what’s to follow:

• I reduced average page-load time from 12 seconds to 3 seconds, saving my visitors almost one week of time per month.
• I did this by first switching from a Dreamhost Shared server to The Rackspace Cloud.
• I then used the W3 Total Cache WordPress Plugin, and served my media files from Amazon’s Cloudfront CDN, from multiple subdomains.

Great web publishing platforms like WordPress have made it easy for just about anyone to publish information and have it seen by the world, but as Google starts favoring sites that have the resources and knowledge to optimize page load time, some publishers’ messages may not have the reach they once did. Exacerbating this problem is that information on website optimization is somewhat complicated and assumes a considerable amount of technical knowledge. I hope to share my experience with improving the page load time of my WordPress site in as plain of language as possible. I’m a designer by training, and get by how I can as a developer. So, maybe some folks out there who know more than I do about this stuff will have some knowledge to offer. Maybe I did something completely wrong, in which case, let me know in the comments!

Servers: What’s the difference between Shared and VPS?

With shared hosting – such as Dreamhost‘s – your sites are all on one machine with a whole bunch of other sites, sharing all of the resources (CPU usage and RAM usage). You also don’t have much control over the configuration of your server, such as what PHP modules are activated (of which, there are probably way too many), and the configuration of your PHP.ini file.

With a VPS – The Rackspace Cloud, specifically – your “server” is a piece of a machine, with CPU and memory resources dedicated just for your piece of it. You can choose what flavor of Linux you have installed, how your Apache server is configured (if you want to run Apache at all), how your PHP is configured – you can control pretty much everything. The drawback is that you have to administer it all yourself. This was challenging for me to figure out, but as you can see the speed payoff is pretty amazing.

Why not use Dreamhost’s PS?

As I evaluated my options, I considered simply upgrading to Dreamhost PS. All I would have had to do was press a button to do this, but I had heard not-so-good-things about Dreamhost PS – and most importantly, my MySQL database would have still been on a shared server. I would have to pay extra if I wanted my database on a nicer server. This seemed pointless to me, and didn’t sound like a VPS at all. I wasn’t keen on administering my own server, but after help from some nice people at Jelly (especially Chris Chandler from Flatterline) things are going okay so far.

How much does the Rackspace Cloud cost?

I’m not really sure yet, because I haven’t gotten a bill, but it looks like you can get started for around $12 a month, with a server with 256MB of memory. There are bandwidth and storage fees on top of this, but they seem pretty low. The coolest thing about The Rackspace Cloud so far is that you can scale your server up and down in a matter of minutes, and only pay by the hour, based upon the size of the server. My two WordPress sites, totaling about 60k pageviews a month, are currently on a 1024MB server, which I hope will cost me less than $50 a month, but I’m starting to make money on my properties, so the expense is worth it for me. If you don’t have much revenue, it may not be worth it for you – or you could increase your revenue: something I hope to write more about in the future.

Using the Rackspace Cloud

Once I signed up for Rackspace (they called me within 15 minutes of signing up, to confirm, before I could start using it), I signed in and created a server. When doing this, you can pick the flavor of Linux that you want to use. I didn’t really know what this meant, but I was advised by a friend to choose the latest version of Ubuntu they had. So I chose 9.10 (Karmic Koala). I also could have chosen one of various Windows servers. After selecting the Linux flavor, I was able to name my server, and select the size of server that I wished to use. I started off with 256MB, but I very easily scaled up later on. After a few minutes, the server was all set up, and I got a confirmation e-mail, with my dedicated IP address, and login and password.

You can quickly and easily resize your server on the Rackspace Cloud

Setting up the rest of the LAMP stack

Now that my Linux was set up, it was time to install Apache, MySQL, and PHP. I SSHed into the server using Terminal on the Mac. That command looks like this (but I used my actual IP address):

ssh root@111.111.11.111

Setting up Apache, MySQL, and PHP – and phpmyadmin – was super easy thanks to this great article in the Ubuntu Documentation.

Transferring the Data

Now I was ready to get the data over to my new server. I SSHed into my Dreamhost server (you may have to contact support to get this enabled), and created an archive of kadavy.net:

tar -cvf kadavy.tar kadavy.net

I then transferred that archive over to my Rackspace Cloud server using Secure Copy:

scp kadavy.tar root@111.111.11.111:/home

Then I decompressed the file on my Rackspace Cloud:

cd /home

tar -xvf kadavy.tar


Setting it up

I then used PHPMyAdmin to export my database from Dreamhost, and import it onto my Rackspace Cloud instance. I had to change a few settings in the options table of my database to match the IP address of my server, rather than my domain, so that it would run properly before setting up my DNS. I also made a few changes to my wp-settings.php so the installation was pointed at the right database.

Using the easy instructions from the Ubuntu documentation, I set up the virtual host on Apache, and started up the server.

After I felt everything was right – and after messing around with optimization tricks below – I pointed the DNS to this new server. Rackspace has a DNS management tool, but I found that GoDaddy (my registrar) had more user-friendly DNS management.

Optimizing WordPress / The Front-End

Now that I was on a much faster server, there were a few other things I learned that made my pages load even faster. After learning these tricks, I found that there was one WordPress plugin that used many of these tricks. I used the YSlow Firefox plugin to benchmark the speed of page loads, and also to get tips on ways I could optimize my pages. Here’s some of the more important tactics I learned.

Page Caching

The most popular WordPress optimization advice I found was to cache the pages. Instead of having to hit the database every time a page is called, caching allows your server to serve up static HTML. The server doesn’t have to process all of that PHP and build the pages from the database. There are several plugins for WordPress which automate this, one of them being W3 Total Cache, which I’ll talk about more in a minute.

Using a CDN (Amazon Cloudfront)

This was the most intimidating sounding advice I received, but it turned out to be pretty simple. A Content Delivery Network is basically a bunch of servers around the world through which you serve your larger files, such as images, CSS, and Javascript. When someone visits your site, the assets are served from the closest server to them, thus speeding up load time. I had heard of Amazon Web Services many times before, not really understanding what it was, but their Cloudfront service is a very cheap CDN (looks like it will cost me less than $1 a month). You can sign up for it at aws.amazon.com, and can freely upload assets using S3 Browser, amongst other applications.

Once you’ve signed up for Amazon, you can create a “bucket” on Cloudfront by clicking on the Cloudfront tab, then Create Distribution. Name your bucket, and you can set up CNAMEs (media1.mydomain.com, media2.mydomain.com). You’ll have to set these up in your DNS with your registrar as well. I’ll get to why you would even want to do this in a bit, but this gives you various subdomains you can use to access the same resources in your bucket. In addition to these subdomains, you’ll be able to access your resources at locations indicated under “Domain Name” and “Origin Bucket.”

Using Amazon Cloudfront, you can set up a bucket from which you can serve your media files

You can get the Access Key ID and Secret Access Key required to upload resources via S3 Browser by creating an Access Key under Account > Security Credentials.

Using S3 Browser, you can upload your media files to your Cloudfront bucket

The most daunting thought about using Cloudfront was uploading all of my resources, and pointing my code to them, but there are a number of WordPress plugins that automate parts this process, including W3 Total Cache, which I’ll cover in a bit.

Using Multiple Domain Names

Why did I set up multiple subdomains on my Cloudfront media bucket? It turns out, the HTTP spec states that “A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy,” and, even though this spec was written in 1999, many browsers still adhere to this specification. So, if you are accessing more than two assets from one domain – be they images, CSS files, or Javascript files – many users’ browsers will only download them two at a time.

The workaround for this is to set up multiple subdomains that all point to your Cloudfront bucket (media1.mydomain.com, media2.mydomain.com, media3.mydomain.com, media4.mydomain.com), and rotate through them as you code URLs to various media assets. I’ve been advised that 4 subdomains is plenty, as this will allow any browser to download as many as 8 files at once.

Multiple subdomains, one Cloudfront

Doing it all (almost) with W3 Total Cache

The caching component of the advice I found has been around long enough that not only is there a WordPress Plugin called WP-Cache, there is also another plugin called WP-Super Cache. Now, there is the amazing W3 Total Cache, which not only caches your pages, it also minifies (removes line breaks to save space), and uploads files in your media library to a CDN, such as Amazon Cloudfront.

While W3 Total Cache does upload to a CDN your wp-includes, theme files, CSS, Javascript files, and any other files you specify, it does not soon will change the paths to any images within your CSS files , and in your theme files, so you have to do this manually. But, since W3 Total Cache doesn’t soon will support the multiple subdomains I was talking about, this is probably for the best. I manually inserted different subdomains into my CSS and theme files.

W3 Total Cache will cache pages and upload all of your media files to Cloudfront

Be careful with minifying your Javascript files, as I found that doing so broke Google Website Optimizer tracking code.

Other Optimization Tricks

• CSS Sprites: This is the technique of putting all of your design graphics in one giant file, and selectively displaying parts of it through CSS. This reduces the number of HTTP requests, and the total size of graphics to be downloaded, this reducing load time by quite a bit. It’s also a bit of a pain in the ass, so I’m saving it for a future redesign.
• Putting CSS and Javascript inline instead of in separate files (for pages that are usually the only one visited): Since I have a couple of pages that visitors hit from a search engine, and then tend to leave, I did this on a dedicated template for a few posts. This really only helps if the page in question is the only page a user is likely to visit on your site. This is not a good technique for visitors that visit multiple pages, as they will have to re-download all of your styles.
• Gzip files: but Amazon Cloudfront does this automatically.
• Yahoo outlines some other best practices you may want to try, depending on how much effort you’d like to put in.

It still remains to be seen whether this performance enhancement will improve my Google rankings, but I hope this document helps some less technical publishers understand just how much impact they can expect from the choices they make in hosting platform and front-end development.

P.S. If you do decide to use The Rackspace Cloud, I sure would appreciate it if you signed up through this link. Clearly they’ve worked well for me, but I wouldn’t mind the referral bonus.

Elsewhere on the web: How to speed up your blog (the non technical guide)

• If you are a Windows user and don’t want to go through all of this hacking, you can buy iTunes Transfer software at my partner site. It will help you back up your library – with playlists – and transfer it to your other computer.
• If you’re trying to transfer music from your iPhone or iPod to your computer, unfortunately, Apple won’t let you do this freely, but you can buy iPhone/iPod to Computer software for PC (free trial download), or iPhone/iPod to Computer software for Mac at my partner site that will allow you to do this.
• if you just have the hard drive of your old PC, Ben has shared with us how to make the transfer
• if you aren’t keen on messing with XML files – and play count isn’t important to you - Oden has a simple process, involving smart playlists, for retaining song ratings when you transfer iTunes library.
• Collin has a simple way to find out those duplicate songs that you may end up with when transferring your catalog.
• Aaron devised a clever way to transfer while retaining playlists in your collection.
• If you are transferring between Macs, pbaron has a method involving FireWire mode.

[Original post]

Since I’m moving, I wanted to transfer all of my music from the iTunes library on my work computer to the iTunes library on my home computer. This is pretty simple – just transfer iTunes library from my work computer’s iTunes library onto my Firewire Hard Drive, take it home, and transfer the music onto my home computer – but I rely on all of my song ratings, accumulated over thousands of hours of listening to iTunes while I work, to populate my iPod Shuffle with songs from the “My Top Rated Songs” Smart Playlist. I couldn’t find any information on how to transfer my iTunes music, while still retaining my song ratings, but I finally figured it out.

Move Your Music Library

Before you do this, you’ll have to first transfer the actual files to your new computer. You may choose to burn CDs, DVDs, or use a thumb drive; but using a FireWire cable is easiest for large libraries, unless you have a portable hard drive.

Move Your Metadata

Here’s a video tutorial I put together. Written instructions are below.

1. Export the source iTunes library as an XML file (File>Library>Export Library…). This will create a file that holds information about the location, song filenames, and *song rating*!
   
   

   Export iTunes library
2. Replace the file paths in your XML file with the path that the songs from the source library will be in when you import them. This path may point to your FireWire Drive, a DVD you have burned, or a temporary folder on your hard drive that you have copied your music to. Just to be sure of the new path, copy one of the files from this location to your library, export your destination library, and look at the file path to that song in the resulting XML file. To actually replace the file paths, I did a Find/Change in TextWrangler but you can just use TextEdit (Edit>Find>Find…).
   
   

   transfer-itunes-library
3. Set the preferences in iTunes in your destination library to “Copy files to iTunes Music folder when adding to library.” This is under “Advanced.”
   
   

   Set iTunes preferences
4. Import your library (File>Library>Import Playlist…).
   
   

   import playlist into iTunes library
5. Delete redundant files. If you’re like me, you have some duplicate songs in your multiple libraries. This is a tedious task, but I plan to do it over time.

Of course, you can prevent all of this by being organized in the first place. I probably should have just had an iPod that I synched with my home computer and brought to work.

If you need help getting the actual files over to your new computer, this video will show you how to copy your music to your new computer using iTunes Home Sharing:

UPDATE: If you’re looking to transfer music from your iPod to your computer, I’ve put together a short guide here. I hope to improve upon it soon, but please share your findings in the comments.

Fortunately, I don’t have Cancer – well, at least not in that growth that was in my mouth. It turns out I had a Mucocele, which is a kind of mucous retention cyst, and is apparently quite common, or at least it is to an Oral Surgeon. It’s funny though, that if you search for the symptom: “lump in mouth” along with my diagnosis: mucocele, on Google, you will get zero pages. Until now. Even the page on Mucoceles I keep linking to describes it as a “transparent structure“. Who is going to go to the doctor and say “I have a structure in my mouth?” So for all of you people out there who are frantic about that lump in your mouth. Don’t get health advice from me. Go see your doctor. But it may just be a Mucocele.

So here is almost exactly what they did about my Mucocele (warning: gross pictures). It took about ten minutes, and they just used Novocain, followed by Ibuprofen for pain relief. I had to eat alot of soup for a couple of days, and it hurt to smile for a bit afterwards. This was easily remedied by pinching my cheeks together with my hand when I smiled, which looked ridiculous and made other people laugh, which made me laugh, so I had to pinch harder and I looked more ridiculous – it was quite the vicious circle. I was ready to eat nachos with gusto after about five days.

They did a biopsy, just as a precaution, and it was quite amusing:

Multiple sections show stratified squamous epithelium covering fibro-collagenous tissue containing lakes of mucinous material. Viable and necrotic polymorphs and lymphocytes are entrapped in the mucin. Regional mucous gland lobules exhibiting ductal ectasia, acinar degeneration, stromal fibrosis and an infiltrate of lymphocytes and plasma cells are also seen. Regional striated muscle bundles are also noted in the stroma.

Then there was the important part:

Diagnosis
Mucocele

So I live a few more days.

Oh, and here is my good semantic deed for the day:
Lump in Mouth
Lump in Lip

[UPDATE: 03/29/2006 10:37 PM] There is obviously a great deal of discussion going on about this topic, so I have disabled comments on this post, and dedicated a forum to mucoceles. You can find it at LumpInMouth.com. Please share your experiences!

[UPDATE: 09/15/2008] I’ve summarized what I’ve learned since writing this post in a special mucocele section of the site.