Web Developers & Web Designers

I recently spoke with a friend of mine who is a web developer but somehow secured an interview for a web design position. This article will address several issues. First, I will clarify the confusion surrounding the terms web design and web development. Next, I will show ways to bridge the gap between web design and web development. And finally, I will show you how to market your web development skills effectively. There is no way you will fail with this method.

When many speak of web design they are specifically referring to the user interface (UI) design. They want this to be fluid, dynamic and visually rich which they believe can only be achieved by a web designer – not a web developer. They often minimize the importance of the server-side language which makes the application function. Honestly, I don’t think many companies paying for a website really care what language drives it as long as the user interface is exciting and intuitive. This brings up an important point: there is a distinction that needs to be understood between a web designer (user interface designer) and a web developer. A web designer is someone who specializes in user interface design while a web developer most often specializes in the back-end programming which drives the site. With few exceptions, web designers are not web developers (making the exception for some basic PHP programming) but conversely web developers can be effective web designers as well.

There are essentially three aspects to delivering and receiving data to and from any dynamic web page. First, there is the graphical user interface. This includes the form, the data display, overall layout and embedded functionality. Next, there is the back-end system which processes input, retrieves information from a database or performs some type of data manipulation. Finally, there is an intermediate process to send input to the back end code and accept returned data. An example of this interface layer might be jQuery posts which allow the user to trigger a function using an event, validate data, send data to a component using a .post() function, display a loading image, and then display the returned results within a <DIV> on the page -all without a page reload. This third aspect was neglected by web developers for a long time, especially as frameworks came into play, but this asynchronous connection is necessary on any modern website. Without it, a form submission causes a page to reload or even directs the user to another page entirely. This was the normal method of data transfer for many years but that method has become totally unacceptable today. Today’s users want a rich experience with infrequent page loads and short wait times. Also, as bandwidth is often an issue on mobile devices developers must limit the amount of data returned to the device. To send back an entire page takes much longer than sending back a streamlined JSON response. This all translates into an improved user experience, happy clients and repeat customers.

With that understanding in place, let’s get back to the issue of web developers not being web designers. As I said above, most web designers (not all) are just that – designers. They can create wonderful interfaces and even communicate with the server using standard plugins, basic PHP, and utilize existing code found online. However, when it comes to complex programming they are simply not the best choice for the job. If they were, it might be more accurate to refer to them as web developers instead. Web developers on the other hand, not only handle the back-end heavy lifting but can often create engaging front ends too. Additionally, using jQuery these developers can deliver the results to the front-end in a seamless manner (I believe the web designer takes the credit for this delivery system!) Just as an understanding of databases is crucial to any web developer so is an in-depth understanding of jQuery or other client-side asynchronous methods of data transfer. This is not an optional skill set anymore but an essential one. In summary, a web developer can also be a web designer but rarely is a web designer a web developer.

When companies are looking for web designers they generally don’t know what they need. Most companies hire the designer based upon their front-end portfolio and ultimately the result is the designer delivers an awesome functional website. But behind the scenes, the design firm is subcontracting the programming work to web developers. Unfortunately, the web developers generally cannot show a portfolio like the designers because their magic lives at the code level. The web developer may have a client who has an awesome website and the prospective customer may look at it and like it, but the chance of them navigating through and exploring the functionality is not likely. Take this website we built. It’s a basic engineering tool for inductors, yet the true functionality isn’t apparent on the page load. It takes several clicks to get to the results page and several more to show the graphs which we’re so proud of. What are the chances of a potential client changing input parameters, or using the filtering, printing the graphs, or exporting them to Excel? Not likely. However, it is the functionality that most developers want prospective clients to see. This portfolio limitation is especially true if the main functionality lies behind a login screen. Therefore, in my opinion, web developers need to find a new way to market themselves.

There is a solution! I believe that the web developer must create an extensive portfolio of responsive, one-page designs. There is no need to put links to other pages; chances are the prospective customer won’t check them out anyway. These demo pages are just to show the wide range of layouts you can create. Then, after building several awesome designs, even subcontracting those to web designers if need be (reversing the subcontracting process!), build in some backend code to make it do something spectacular. Use jQuery’s existing cool UI effects, bring in a YouTube video and do something awesome with it, the possibilities are endless. For example, create a template that displays products or videos and use mouse overs to pop up details like Netflix does. The idea here is to do two things. First, show the wide array of designs you can create and second, to show a wide array of functionality you can provide. If you can do this, you will get the contracts. That is why the designers are getting them now.

What if I program in a no-so-popular language? Honestly, most companies don’t care what language you use to get it to work, as long as it works. True, there are some customers who will specify the language, but those are few and far between. I doubt very much that most companies will even ask, and if they don’t, then that ends it. Use .NET, PHP, ColdFusion or whatever you are comfortable with. Just make sure it works as described. Listen, at the end of the day all the back-end language does is give the jQuery post something to display to the user. Remember, we’re talking about front-end here and what the user sees is all that is important for a portfolio. As much as we, as web developers, like to elaborate on the coolness of our preferred language – don’t do it unless they ask. The truth is, if they don’t ask then they probably don’t care. So, you as the web developer can make the call. If you tell them what language you plan to use, then that only opens the door for objections, whatever that language is. The web designers don’t mention it so why should you?

In summary, there is a huge difference between a web designer and a web developer. However, due to the confusion surrounding the terms, the designers have come out on top. They are highly sought because their work is highly visible. Today’s web developer possesses the skills to create a site and make it work. However, marketing that skill is difficult. Our portfolios often stink if they are available at all. The solution is to create simple one-page concept sites, build in some of the functionality you are most proud of and market the heck out of it. Show many different types of layouts and brand each one for a different industry. This way you double the chances of getting a contract. If they like a layout great, if they see their specific industry on a layout they will probably feel comfortable going with you. Now that you have the tools. Go get ‘em!