Ask HN: Is it worth a back-end developer's time to get into web-design and HTML/CSS

[orange5912]

I'm a Rails developer that can handle the back-end stack of web development, but never invested the time to do any web design or HTML/CSS.

Is it worth investing my time to learn web design and HTML/CSS, or should I source these and focus on other parts of the app?

I'm bootstrapping a site right now, and definitely feel a bit handicapped not being able to create the HTML/CSS and creatives to tie it in with the back end. I figured being able to create sites from start to finish would be helpful for both possible freelancing gigs and bootstrapping sites in the future too.

An option I've thought of was to use free resources for the creatives, and use free HTML/CSS templates, and go from there.

The developer side of me is saying to learn it right from the beginning - start looking into web design tutorials, mainly ones from scratch (PSD/pen and paper to static HTML/CSS).

The business side of me is leaning towards sourcing the web design and HTML/CSS, or partnering up with a web designer (have yet to find one but am familiar with the sites that do that) and trade services or form a team.

I'm sure there are alot of you guys that are jack-of-all-trades and others that specialize in either the front-end or back-end of web development, that have questioned this too. Thoughts?

[pj]

omg, this question is painful.

HTML and CSS are skills that are worth your /time/. Forget the money. You can improve your /own/ life with HTML and CSS.

The more you know, the more powerful you are!

Have you ever been approached by someone from the front end who said, "Man, it's hard to build this page the way I want it because the backend doesn't do XYZ?" and you look at them like, "figure it out!"

You only do that because you can't relate to them. You don't know how hard it is to do a three column layout in CSS so you blow them off and think, "It's been done before go do it."

But that's not the right approach. The right approach is to understand /why/ it's hard from the front-end so you can make your back-end more suitable to the front.

Building complex systems is a conversation between layers. Data comes from the database, goes through the "backend" then gets displayed. At each of these levels, the more one knows about the other, the easier the dialog between the layers.

So, OF COURSE it is worth a back-end developer's time to learn more about the front-end. It's also worth a front-end developers time to learn more about the backend.

YES.

[alabut]

Here's a designer's take on why this is a great answer by pj - the html/css is the meeting ground between designers and programmers, so without a basic understanding goes a long way.

Think of it this way - html by itself, even without css, is like the skeleton of a body. The programming (backend & javascript) is like the muscles that move stuff around and the css & visual design is the skin, makeup and clothes that define the style. It's a bit simplistic and ignores more advanced interaction design that can help define the skeleton in the first place, but it's a good shorthand for how designers and programmers make stuff, especially in early stages.

So that's a hell yes to learning html/css. Learning web design means more than learning simply the toolkit to create those designs, it's also about developing an eye for what makes an attractive or usable interface, so learning whatever you can there should probably be a hobby that teaches you to appreciate good work. Try cruising the css gallery sites or smashingmagazine for examples.

[mechanical_fish]

Amen.

The right approach is to understand /why/ it's hard from the front-end so you can make your back-end more suitable to the front.

I still don't know how to answer when people ask if I am a front-end or a back-end developer. I just don't get it. I used to think I could claim to be a back-end guy because I do know SQL, but I don't know how to make pretty mockups in Photoshop. But now it's apparent that knowing HTML and CSS and JS makes me a "front-end" developer in many people's eyes, so I've gone back to not knowing how to answer. It's like asking whether I walk primarily with my right leg or my left.

I think the dichotomy broke completely when Ajax came on the scene. In earlier times it was possible to pretend that the division between client-side code and server-side code was aligned with the division between the presentation layer and the logic and persistence layers of your app. That alignment was never very clean (there are limits to what you can rearrange with CSS alone, and while JS can theoretically rearrange everything the result is liable to be slow and fragile and terrifying to behold, and obviously the needs of the interface designer need to drive the optimization of the back-end data store, etc.), but you could still pretend. The ever-increasing role of client-side JS makes that view of the world less tenable. Now some logic lives on the client as well as on the server, and Google Gears threatens to give the client persistent storage as well, and the interaction between client and server can potentially have a lot more moving parts, and a developer gains a big advantage by having a basic understanding of the entire stack.

[pxlpshr]

Very well put. A team is only hurting them self if designer|vs|engineer qualms and misunderstandings aren't managed. It's as equally important for the product to work, as it is for the consumer to understand. There are complexities on both ends.

[Retric]

I disagree. It's useful to be able to do a full prototype so a superficial understanding is useful, but I don't think there is significant value really learning HTML / CSS.

There is a huge body of information about which version's of which browsers work with which feature. This is one of those cases where specialization pays huge dividends and working with someone who keeps up with this field is really useful. Think of it like accounting it's useful to quickly learn the fundamentals, but knowing how to audit a fortune 500 company is overkill.

PS: The problem with learning HTML / CSS / JavaScript is it's got a short shelf life. You can learn C and come back to it in 20 years but GUI side of things keeps evolving so unless you constantly keep up you are basically starting over when you come back in 5 years.

[rockstar9]

I think it's important to learn HTML/CSS. A good understanding of user interface will complement and affect the way you program. You should have a good grasp of how a website should "flow."

On the other hand, graphic designs is a different story. Developing a good artistic sense will take time and practice. If you plan on developing entire websites on your own, why not spend a little time to graphics design to make things look prettier? However, you don't plan on spending any time on this, then find a good designer :)

[potatolicious]

Having a good design "sense" is important - you should at least be good enough to tell excellent from good from bad. This goes doubly if you're in business for yourself, since you'll likely have someone else doing your design for you on a contract basis, it's good to know they're good at it.

[raffi]

I'll avoid me too and agree you should learn these front end technologies. That said, there seems to be a question of how and what underlying your post. I'm not a designer by any stretch of the imagination, still I hope this helps:

== XHTML/CSS ==

1. Learn basic HTML, understand what "semantic markup" means. I assume you know some HTML already.

2. To understand CSS, understand the box model. Understand inline and block elements. Understand selectors. Understand positioning. The rest of it falls in place from there.

Hopefully you'll have an appreciation for markup and meaning versus presentation at this point.

== JavaScript ==

3. Learn Javascript. Understand that everything is a hashtable. Understand how it handles scoping and understand classless objects. Once you're comfortable with this you're ready to move on.

4. Understand the DOM and how to manipulate it.

5. Read a little on AJAX, I found the DHTML utopia book on Sitepoint.com?myaffiliateid=me was good.

6. After you understand AJAX and DOM, go learn a library like JQuery or whatever else people advocate these days. These libraries are like mana from heaven. They will save you time! Oh, if you did steps 3-5 you'll be productive with a JS library in about 2 minutes. The learning curve is small at this point. Great stuff!

7. Install Firebug and spend an hour or two learning how to use it. Firebug will save you time and console.log is so much better than alert(). Firebug has made me happy.

Now you know how to manipulate sites on the client side. Great! Last step:

== Graphics ==

8. Learn a tool like Photoshop or the GIMP. Understand how to select stuff, copy and paste. Then become familiar with layers and masking. I am not a graphics guy but I've only recently become turned on to the power of masking. Wow. People like you and I can do neat things.

I don't have resources for everything because I scrimped and learned as I went. However this should represent a good order (and some pointers on what to look at) as you pursue this. Good luck!

[mnemonik]

Nice outline. I agree with just about everything you have put forth here, but I think OP might want to either skip the graphics part for now and let someone who really knows it handle it, or learn that right after XHTML/CSS. JavaScript is going to be easy for him, better not to focus too hard on it and give time to what is going to be a little more challenging.

As for learning XHTML/CSS, http://htmldog.com/ is an incredibly easy tutorial. You'll understand it all in hours.

[ssharp]

The answer could be to source it now but still learn it for the future. The nice thing about learning the entire vertical of a platform is that you don't HAVE to rely on outside help for any part of the process. You may still want to, but being able to do everything yourself is a definite advantage, especially when time and/or money is an issue.

However, you time is best spent just learning CSS and web page layouts. Web design and graphic design are not the same thing. You can learn to layout web pages with limited artistic talents. When a site may need heavier graphic elements, you're better off going with an expert. Knowing your strengths and weaknesses is very important.

The wonderful thing about the web is that its very easy to stand on the shoulders of giants. With layouts and usability, you don't need to do your own work and testing. Take a look at websites with great layouts and morph their ideas into your own. Read design and usability blogs and try to determine what will be best for you.

Best of luck!

[rsayers]

I am also a back-end developer and have found design knowledge to be very useful.

Very often I'll be given a layout which breaks once I started adding code to it, a good html/css understanding will let you fix issues like this without having to pass it back to a designer.

I can think of many times where design skill has paid off, namely a time when our sole designer quit leaving me to fill in for him, but I've found the knowledge to be extremely useful even if I only need it occasionally.

[critke]

From my experience I would suggest learning html/css coding but finding a creative person to do the actual design (colors, logo, white space, typography etc etc). I really doubt that it's possible to be good at everything - but html/css is 'just' coding - design however is a completely different story.

[alain94040]

I second that. Learning CSS/HTML is easy for a developer, not a problem. But don't think you can draw, pick color or balance objects on a page in pleasant way. Artistic style can't be taught the same way you learn a language.

If you are like the average geek, you can spend years reading many books on good design and you still will only create ugly, flat, boring sites. Just be aware of your limitations.

[Encosia]

In the ASP.NET community, we catch a lot of flak for the terrible sites that some developers have created with ASP.NET WebForms. That embarrassment is due exactly to developers choosing to hide behind the (leaky) WebForms abstraction and remain ignorant of the markup that their server-side code produces. I'd advise against emulating that failure case.

If you're working on any code that's within one tier of the HTML/CSS, you should have a basic understanding of the HTML/CSS.

That general rule applies to most things. The more understanding you have of adjacent concerns, the better you will be at your own task.

[teej]

I'll reach across the aisle here and admit that this happens in the Rails community as well. Reliance on scaffolding and generated code can be toxic and should be handled with care.

[sachinag]

I'm going to, as someone who cannot code, take the minority view here. You are more valuable to your company or to your clients (if you're doing freelance work) if you know systems administration in and out. Between crowdSPRING + PSD2HTML, you can get a decent implementation of a design relatively cheap. There's no way to outsource "good enough" systems administration.

[russell]

This is especially good advice if you are in the Java world. Configuration, deployment, and all round administration skills are part of the tool kit that you need even if none of this is your primary responsibility.

I would also add JavaScript and Ajax to the necessary skill set. If you are a freelancer or job hunting, JS, HTML, and CSS increase the number of gigs that you can tackle. Even when the backend is your primary responsibility, you will often be called upon to do a quick fix in the other areas.

Farming out design is good advice, but often the HTML and CSS is not really usable, so you will need to know enough to make it work on your site.

[wallflower]

The more you know about design in general, the more effective you are. People don't respond to a back-end transaction program - they respond to the user experience.

I would highly recommend checking out a CHI meeting (Computer-Human Interface a.k.a. UX/UXD). I guarantee you will learn a lot by meeting and listening to designers lecture other designers.

http://www.sigchi.org/local-sigs/

[ggruschow]

http://c2.com/cgi/wiki?SpecializationIsForInsects

[sokoloff]

It depends on what your goal is.

I'm a backend guy who runs an IT department for a top 100 e-commerce site in my day job. Knowing HTML/CSS doesn't do me any practical good there.

For my side projects, I know just enough HTML/CSS to be dangerous. (http://www.almamatersports.com is all programmed by me in a couple hundred hours this year, but has obvious visual bugs on several different browsers, some layout issues, etc, but that didn't stop it from pleasing the guy paying the bills.) For those kinds of things, knowing more at the start of the project would have saved me tons of time and gotten a better looking end result, but wouldn't have changed the clients satisfaction all that much. Then again, the gameplay is so much better this year than last for him that it's not a fair comparison, since for most sites that level of visual bugs would be unacceptable.

When I think about my day job (which is what really pays the bills), in my experience it's much harder to find top-notch back-end developers than it is to find top-notch front end guys. Yes, the very cream of both crops is hard to find, but there's a much larger number of A players in the front-end space, so I'd recommend concentrating and developing your skills on the back-end and just getting a (relatively) tiny bit of exposure to front-end development issues and hiring that expertise out.

[gommm]

Like a lot of people here said, I think it's important for you to learn html/css. At least enough to be able to do simple websites (or modify designs that you outsourced to integrate them in your website.)

For css try to use and understand a framework like blueprint or better even compass which is a meta-framework ported on sass (sass is to css what haml is to html). It will save you a lot of time by not having to deal so much with browser inconsistencies).

On the javascript side, read the book "Javascript the good parts" from Douglas Crockford, watch his videos and then play with jquery (it's very sweet and simple to use).

One last recommendation on the front end is to read Steve Souders "High performance websites". It's a quick easy read and highlights a lot of important considerations for the front end performance (like this you'll know for example that it's a good idea to ask designer to slice images that they use as background in the css file)...

It doesn't mean that you need to do everything by yourself (I hate doing css for example) but having a thorough understanding will help you chose the right web designer to work with and make sure that you both speak the same language.

[inerte]

Yes, it is worth, specially since you're making a website, even if you're going to hire someone. You can at least glance if they're doing correctly, as far as you will know.

HTML/CSS isn't hard. And you need to consider if what you're doing will work on multiple browsers, including mobiles. Knowledge about this will mean more visitors, and thus more money.

Now, creative... that's another question. A good design, in the strict aesthetics sense of the word, is very hard. In fact, for some people, it's a whole career :)

Also, while I don't recommend going for the aesthetics route, there's much more involved in webdesign. SEO, usability, accessibility. You should be able to take a pretty PSD from a designer, and develop with ul/li for menus instead of using Flash, for example.

[cmars232]

Yes, you need to know design. Even if you hire a designer, you'll be better off in understanding what you're paying for, being able to maintain the site they deliver (and being able to tell if what they give you is maintainable).

I learned design by reading a bit on CSS, JS, and reverse engineering & imitating sites that have a certain effect I'm trying to get. Firebug is awesome. jQuery is awesome. Blueprint CSS might be what you need, or it might get in the way, but give it a try.

Oh, and don't be afraid to break the "rules". If your page looks and works the way you want, you win, even if you used (gasp!) tables.

[epoweripi]

I was a backend guy and was faced with the same dilemma. I thankfully listened to the engineer in me (at that time we had our UI work contracted out and was not shaping up well). It took a while to get a good grip of HTML, CSS and JS. They are the tripod on which today's web UI is balanced. In the end I think it was the right decision to learn it all!

Moreover if no core team member knows UI - then either get one or you become one, becoz sooner than later you will repent outsourcing it fully.

[eugenejen]

I did back end for a long time. But in last two year I have to get into the front end because I couldn't find good front end guys for the project. It helps me to be better in looking at whole pictures and prevent some mistakes that front end developers made for the the back end and vice versa.

Business wise, it is not good. But for a better understanding of the whole system. I think it is worthy. It is especially good for DIY projects for bootstrap and experiments.

[ramenjunkie]

as a very proficient front-end designer/developer, and a competent but generally average backend person, the short answer is a resounding YES.

whether or not it's worth your time depends on why you want to learn and to what extent you want to be proficient at it.

here are the best reasons why i think you should delve into the front-end:

- you want to be able to bootstrap reasonably well a site from front to back - you don't want to be completely reliant on a front-end person - you want to become a better back-end person by learning the needs of the front-end - you want to fully appreciate the value a front-end person brings to the table - you want to have more control over how users directly interact with and perceive your product

if you agree with any of those reasons above, you should certainly consider delving into the front-end. however, let me get to my second point.

if you're going to jump in, i recommend you afford yourself the time to really get deep into the subject matter. why? because we've seen a tremendous diversity of front-end design patterns/methodologies sprout up in the last decade; all of which can have a sizeable effect on how the back-end is designed.

[functionoid]

I'd say learn html/css and along with that concentrate more on usability of the website. To be really good at creating graphics and flash for websites could take some time. So I'd say definitely learn HTML/CSS also learn the usability aspect of web design and out source the graphics part. May be for this project you might want to outsource the html/css also.

[epall]

If I/he were to hire out the design stuff, where is the best place to find designers? Optimally I'd love to find a designer to partner with and work on projects as equals, but I'm willing to pay somebody to do the design if necessary. Any ballpark estimates on what reasonable web designers cost?

[siong1987]

So, you are a MC Rails guy without the V. IMO, you really have to learn how to design a simple website with CSS and HTML.

One thing that definitely can help you is to screen shot or bookmark every website that you think that is simple and nice. From those example websites, you can start designing your website.