A Personal Anecdote About Learning HTML and CSS

When I set out to learn programming in early 2012 in order to build Uncover, I was primarily focused on learning Ruby on Rails. When I thought about what programming was to me, it was always about being able to develop the backend so that I could add, edit, and delete data. That’s the underpinning of any web app, and I was interested in building a web app.

I teamed up with a friend who was a web designer and proficient in HTML and CSS, so I put other aspects of learning to program on hold. I wanted to be a backend developer. I learned enough to be able to integrate my Ruby on Rails with his HTML and CSS, but it wasn’t until twelve months later that I actually took my first crack at coding up a page from only a Photoshop file.

One of the many tasks of a startup founder is to drive sales. Sales are the lifeblood of a company. If they’re going poorly then morale will be low, but if they’re going well, then everyone will be happy and continue to produce great work. As Uncover is a B2B company, one thing that’s required when you’re selling B2B software is Case Studies. We put together one with one of our customers, SeatGeek, and I tasked myself to do the HTML and CSS from only a PSD file.

I’m a little ashamed that it took me so long to make my first attempt at doing the frontend for an entire page from scratch, but when I finally did it I loved every second of it, and I want to tell you why.

The first thing that’s exciting is that when you’re developing frontend HTML/CSS, Google Chrome’s Inspector gives you the ability to make changes in real-time. The page will change as you add, edit and remove HTML and CSS elements. This is different from backend development for the most part. It was liberating to be able to fiddle around with code and watch it change on the spot. My friend Kyle Fox sent methis gif over Twitter, and while it’s always frustrating, at least you’re always getting real-time feedback.

Another aspect of frontend development that I loved was that there’s a real sense of accomplishment as you’re building the page out. You’re hopefully fortunate enough to be working with a good web designer who has given you a PSD file to work with. That makes things a lot easier. As you’re writing HTML and CSS, the page will begin to come to life, and it’s a really neat feeling.

It was also exciting to learn, finally, that frontend development, unlike backend development, allows for a lot of different ways to achieve the intended outcome. While there are conventions in HTML/CSS, just as there are with Ruby on Rails, there is definitely more than one way to do things. With RoR, there is generally only one agreed upon best practice.

Writing frontend code allows you more latitude when you write. It’s nice knowing that getting the page to look exactly like the PSD is the end goal, rather than perfecting the code. Obviously, you shouldn’t write sloppy code, but knowing that there’s more than one way to get where you’re going is liberating.

Just don’t look at it in Internet Explorer when you’re done.

source blog teamtreehouse