How to Write CSS That Doesn’t Suck

A few days back, I read an article that ended up significantly improving the way I wrote CSS. Given how quickly and easily stylesheets can get horribly disorganized and out of hand, I found the tips to be immensely useful.

The article is primarily for teams of coders, who need to keep a ton of CSS organized such that many different people can understand it. Even so, I found a lot of it useful as an independent developer. Here are the things I found most useful:

  • Group related styles together. If you do absolutely nothing else this article mentions, do this. It is so helpful to scroll through a stylesheet and know that since you’ve run across your <p> tag styles, your <h1> styles have got to be around here somewhere.
  • After you’ve grouped related styles, try to arrange them by which page or set of pages they apply to. After that, create some suitably humungous, obnoxious, and obvious comment headers and make section headings, like this:
    This makes it infinitely easier to know which page you’re styling and also helps save your ass if you accidentally name a class or id something stupid and uninformative.
  • Make constructive use of white space. For closely-related styles, put only one blank line between styles; for more loosely-related styles, use 2 or 3. Put 4 blank lines before a new heading. This groups stuff up visually and makes it even easier to find what you’re looking for.
  • In terms of individual styles, use this standard format. It’s easy to read, it’s the near-universal standard, and more. Single-line CSS is almost never a good idea.
    .foo {
      display: block;
      background-color: green;
      color: red;
  •  Indent full rule sets if they’re nested. For example, if you’re mobile enabling, indent all the styles inside the brackets after the @media tag.
  • If a style relies on another style elsewhere, or if the meaning of the styles is otherwise at all ambiguous, add a comment! CSS never has enough comments. I know it’s annoying that there’s no single-line comment, but seriously, you can afford to type that extra asterisk and slash to make your code readable.
  • Last tip: be very, very literal about your selectors, because the computer certainly will be. Do not say “header ul” when you mean “.nav”; even if you don’t have another ul in your header, this kind of selector generality is a very bad habit that can and will come back to bite you. Whenever you’re writing a selector, ask yourself: “do I want ALL x, or just some x?” If you want just some x, write a more specific selector. Even if you don’t think you’ll ever use the other types of x.

If you want more CSS tips, go on and read the full article! It’s a fun and helpful read, full of great info. Otherwise, that’s all for today: happy coding!

You Can Draw (really!)

As you may know from this blog, and as you certainly know if you follow me on Tumblr or DeviantArt, I’m an artist. Whenever I draw in a public place, which I do a lot, there is always someone who comes up to me and says some version of, “wow, you drew that?! I can’t even draw straight lines, I could never do that.” And this irks me just a little bit, even as I say thank you. Not because they assumed that just because I can draw, I can draw straight lines (I can’t). Because they can “do that”. Because art isn’t magic, it’s a skill.

Why do I say people think art is magic? If I asked someone, they probably wouldn’t say they do. People know that art is a skill, or at least a talent or a gift or a blessing or something. But the fact remains that when people see the process of art being done, or see a finished piece, they don’t think of the process at all. People think “ooh pretty” long before, and mostly in lieu of, thinking “how did they do that?” So you get responses like the one I mentioned. So for practical purposes, people do think of art as magic, at least subconsciously.

It can be very easy to think of art as magic. After all, there really isn’t a way for good information-transfer between two human brains other than oil and carbon on dry tree pulp. But the fact remains that art is not in fact magic, and there is in fact some process by which artists learn how to do art. So why do people act like it is?

I posit that it works like this. Humans really like being right, and when we’re wrong, we kind of freak out. This freak-out can be anything from a giggle to a scream, depending on the person and circumstance. Consider, for example, how people react to optical illusions.

The thing that humans are wrong about in terms of art is whether or not it’s real. “Is that a painting, or is there a person looking at me through a hole in the wall?” thinks your caveman brain, which wants the art to be real.

“Obviously it’s not a real person, because real people blink and move and stuff,” says your modern brain, which cares a lot more about truth and logic than your caveman brain.

But your caveman brain, which also thinks that anything with two dots and another shape below the dots counts as a face, is undeterred, and so, subconsciously, you freak out a little.

So then, the first step in understanding how art works is to convince your caveman brain that it’s not magic. The second step is to learn the real process behind art.

How art is done is actually very, very simple. There are two steps. Step one, pick up a pencil and try to draw. Step two, notice the ways in which your drawing does not look like the thing you were trying to draw, and then return to step one. Repeat ad nauseum until you do good art.

“But if that’s all there is to art,” you may want to ask, “where does all this stuff about color theory and vanishing points and other art words come from?” The answer to this is pretty straightforward: artists need names for certain ways of representing the world on paper. Color theory is just a guideline for making colors work together, and you unknowingly use it every day when you pick an outfit. Vanishing points are just a guideline for how to draw distance, since distance is a 3D thing and all we’ve got is 2D paper. This is how it goes for all the art things: they’re simple techniques to get art to look like reality.

Once an artist is very good, there are a few more steps to the drawing process. Think of an idea, map out how to put it on paper, think of colors, decide how to use them, then draw. But don’t be fooled: it’s not actually any harder. The real difference is that here, the analysis happens before the drawing, not after.

So basically: art is actually a very easy thing, made to seem hard because your caveman brain wants to think of art as reality. With this knowledge in tow, you should know one last thing: you can learn to draw too.

There is literally nothing special about me that makes me a better artist. There wasn’t a heck of a lot special about Michelangelo that made him a better artist. It was, in both cases, some small amount of talent and a ton of hard work (Michelangelo’s hard work was exponentially greater than mine), spread over many many years. The simple cycle of self-improvement does its thing and out comes a good artist with good art.

A lot of people don’t learn to draw because art seems complicated or hard, but you already know it’s not. All those years of improvement may seem daunting, but they’re not: do one drawing at a time, whenever you want, and you’ll improve. That’s all there is to it.

To wrap it up, if you want to learn to draw, you can draw. Don’t wait for the art fairy to sprinkle you in pixie dust; it won’t happen. You don’t need magic, or even talent. You need a pencil and an eraser. Just go ahead and start! It is really that easy.

My Top 3 Soft Skills

Through my past few years both working and attending school, I’ve learned quite a few things about myself. It’s difficult to wrap your brain around at first, because you don’t consider that things that are easy for you aren’t also easy for everyone else, but there are always things you’re good at that very few people are: humans are cool and unique that way.

Here are three things I noticed I’m good at that few others are.

1.  Artistry

This one might seem a bit odd. Art isn’t an uncommon skill, and I’m certainly not the best artist I know. But this is the reason I said “artistry” and not “art”. I’m talking not just about drawing, but about making anything and everything as efficient, easy-to-use, and aesthetically pleasing as possible.

I’ve been good at aesthetics my whole life, and it’s always been something that mattered a lot to me. At first it manifested in art: I started drawing seriously when I was very young, and I’ve been told by a number of people that I have a distinctive artistic style that is vibrant, colorful, and elegant. By the time I was 13, I had enough of a following in art that I was selling my work at conventions.

But then I learned enough about myself to realize that this creativity and artistry is not just liking to draw, or drawing well. It permeates many aspects of how I do work. I like making things elegant, efficient, and pleasant to work with, and this applies just as much to designing a user interface as it does to drawing a portrait.

When I was first learning to code (I started in Python around age 8), I went out of my way to comment it, format it, and indent it in a way that was very easy to read and follow. I did this even though, at that point, nobody had told me I should. I just wanted it to look clean and aesthetically pleasing; I needed no other reason.

As I progressed as a programmer, I continued to find new ways to make code both easy for a human to read and easy for a computer to run. I could never understand paying a programmer by the line of code: a good programmer, to me, was someone who could solve a complicated problem in as little code as possible. Good code, to me, was efficient code, and still is.

2. Analysis and problem solving

My best examples of analysis and problem solving come from situations where the existing ways of doing things didn’t satisfy my artistic need for elegance and efficiency, and as such I created new and better methods.

For just shy of three years, from age 14 to 17, I worked for a local Eat n’ Park as a prep cook. At the beginning, I had a supervisor by the name of Mike, who was focused on effectiveness and was always looking for ways to improve our processes, and he encouraged me to do the same. Only a month or two after I started, however, he left, and the prep department, for all intents and purposes, became mine.

One of the big changes I made was this. We had these massive ovens into which we put full size (26×18 inch) baking trays. We cooked a lot of things in these ovens, but one of the things was bacon. It came to us in big cardboard boxes, maybe 30 pounds each. Each box contained two ~15 pound plastic-wrapped containers, called cases. (I cooked around three cases every day. Americans love their bacon.) Each case contained over a hundred wax paper sheets with bacon on them.

In the manuals, we were told that we should lay out these sheets in a certain way on the trays, but after the manuals were written and published, management had changed the ovens and trays, but the manuals weren’t updated. As such, the method described in the manuals was inefficient, and so I created a new one. My method maximized the surface area of the bacon that was exposed to the air, so that it would cook thoroughly, while also minimizing the total cook time for each case by putting as much bacon as was reasonable on each tray.

Another example of problem solving came from a situation which there was no formal, documented procedure, but the informal procedure was also inefficient.

If you’ve ever been to an Eat n’ Park, you know the trademarked “smiley” cookies. In order to create those colorful smiles, we had to pipe an awful lot of icing, and in order to do that, we had to refill piping bags on a very regular basis. The problem was, the icing came in 5-gallon buckets, and we had no reasonable transfer mechanism. It was worse than trying to pour from a gallon of juice into a thimble.

The existing, informal procedure was to use an ice cream scoop to transfer some icing from the 5-gallon bucket into a smaller plastic container. Then, holding the icing bag open with the other hand, you’d pour the icing from the plastic container into the bag. This was messy and kind of difficult, but it got the job done. Even so, the artistic part of me was unhappy, and so I went about fixing it.

The biggest problem with the existing system was that holding an icing bag open is really hard, and holding it open with one hand is even harder. To fix this problem, I tried a number of methods to try and hold it open; after much trial and error, my best option was some to-go soup containers: I’d fold the bag into the bottom and wrap the top of the bag around the container’s top. Even so, I found myself thinking, “This is too wide and not tall enough. Where do we have something similar that’s taller and narrower?” One day I realized: we had steel milkshake mixer cups that were the perfect dimensions! This worked much better, and the icing bags were easier to fit over the narrower lip. Additionally, I didn’t need to hold the icing bag up anymore, so if I wanted to not bother wasting a container and an ice cream scoop, I could pour the icing directly from the 5-gallon bucket. Soon, other people saw me doing it this way and my method became the de facto standard.

Overall, I think my biggest strength here comes from the combination of this skill with the previous one. While each skill is uncommon and useful by itself, in combination they create an interesting hybrid which thinks objectively and analytically about aesthetics and beauty.

3. Drive

This was a skill I didn’t even know I had until recently, but to explain why requires a short story.

Growing up homeschooled, I always had a lot of choice in what I did with my time. If I so chose, I could have bare-minimum graduated from high school and worked as a prep cook for the rest of my life: my parents were never the sort to push their kids. But I didn’t want to do that; I knew I could do better, could make a difference in the world in a way that mattered to me, and I decided to pursue it.

At first I didn’t know the best way to do that. I thought that blowing the top off all my academics would work, and as such, I chose to seek out challenging classes and activities, and I chose to work as hard as I could at them. Because of this, I have a host of academic achievements under my belt: many high scores on AP tests, the AP Scholar with Distinction award, the Maureen O’Donnell Award for four consecutive National Latin Exam gold medals (one for each year of Latin I took), and National Merit Commended Scholar status. I did these things because I wanted to, not because a school or parent was pushing me.

Sometime last fall, though, as I was getting ready to apply for college (and as Yale was mailing me a letter a week, like seriously, tone it down maybe?), I had to consider whether it made sense to continue down that path. Was the opportunity cost of four whole years of my life, during which I wouldn’t be pursuing my career, worth it for the degree? After a lot of careful deliberation, I decided that no, it wasn’t. My goals were to make a meaningful difference in the world, and a degree wasn’t necessary to do that. I dropped the entire college application process in favor of going full-dive into my career.

The first thing I had to do was finish up the classes I’d already signed up for. I completed my spring and summer coursework and made a plan for what needed to happen to get my career started, which included a career prep program called Praxis. For the first two weeks after summer classes, I ate, slept, and breathed code as I did nearly nothing but web programming, creating the site you’re on right now. The school system is very bad at giving students any hands-on work, so this was one of my first major coding projects, even though I’d technically been programming since age 8.

This headstrong attitude, drive to improve, and complete lack of consideration of the potential for failure is the kind of attitude I bring to anything I do. I brought it to my schoolwork, I brought it to my previous jobs, and I’ll bring it to my future career. Stay tuned to see how that turns out!

5 People Exercise

“You are the five people you spend the most time around.” It’s a common saying we’ve all heard, but there is still a lot of truth to it. So it makes sense that if you want to improve at something, you should spend a lot of time around someone who is good at it. As a starting point, I catalogued the five things I want to get better at along with the five people I spend the most time around.

List of things I want to improve the most at:

  1. Pushing myself
  2. Focus
  3. Organization
  4. Teamwork
  5. Work ethic

List of people I spend the most time around:

  1. My mom
  2. My sister Ana
  3. My fiancé, Tyler
  4. My good friend, Cole
  5. My brother, Ben

And finally, here are some words on if, and how much, these people correlate with the things I want to improve at.

There are very few people in my life at the moment who I would say have better focus and work ethic than my mother. Right now, on top of working a highly-skilled full-time job, she owns and operates three small businesses and does all of the household’s financial upkeep. Even despite all this, she has no home office: instead, she sits in the middle of the living room, with her children working or talking or playing around her and intermittently asking questions. The reason for this is that on top of everything else she does, she also homeschools her four children, and as such being available to help us is important to her. In order to accomplish all these things, she needs absolutely amazing work ethic and focus.

Another prime example of focus is my brother Ben. He sits in the living room studying flashcards for Greek, or Arabic, or Spanish, completely oblivious to the world in a way I’ve only ever seen on other people when they have noise-cancelling headphones on. He’s not very introspective, so I can’t really get a constructive answer if I ask how he does this, but at least he’s a good role model. Ben also pushes himself very hard: he decided very early on that he wanted to get into a top-tier college, and between being dual-enrolled at our local community college, getting a crazy high SAT score, and recently taking an immersion Arabic course at the University of Pittsburgh, he’s well on his way to achieving that goal.

Another person I know who pushes himself to achieve difficult goals is my friend Cole. He lives and works on a farm in The Middle of Nowhere, South Dakota, where the only classes taught at his school are about how to use farm equipment, and even despite this he decided he would find himself a liberal arts education. Almost exclusively through self-study, he’s acquired what I would, from experience, consider to be an AP-level understanding of math, physics, chemistry, psychology, and English, among others. I highly doubt that if I lived somewhere where the nearest drug store is four hundred miles away (I visited him once so I know. There are billboards), I wouldn’t be able to learn what he has.

There are a relatively small number of things I’m actively bad at that I want to improve, but two of them are teamwork and organization. Naturally, I’m a messy loner. But fortunately, I have pretty good role models for both.

My sister Ana, who is five years my senior on all levels except physical, has always been an excellent team player. When a group she’s in is given a daunting task, she steps up and coordinates everyone so that not only does the work get done, but everyone on the team (including her) is happy while doing it. I contrast this with my current approach to being in a group given a daunting task, which is to take the whole thing over myself and work day and night to get it finished. Ana is an inspiration to me in a lot of ways, but her ability to make a team more than the sum of its people is definitely one of the major ones.

In addition to being kind of a sub-par team player by nature, I’m also kind of a mess. Fortunately for me, though, my fiancé Tyler is essentially the poster-child for organization. Our bedroom, in which he keeps his many books and figurines, is meticulously put together to make optimal use of limited space. On his PC are schemas and schematics for everything, from where things go on his coffee table to the structure of the shelf he’s building. Icons on his desktop are arranged to best go with his background, and files are meticulously and hierarchically ordered. Not only are his physical and electronic spaces organized, so are his explanations. If he can’t articulate a vision purely in words, he whips out a pen and, with the steadiest hand I’ve ever seen, draws visually elegant diagrams and charts.

So it seems, if you do become the five people you spend the most time around, I seem to be becoming an absolutely amazing person.