How2Freelance

Learn to Earn on the Internet

Guide to Web Design and Development Freelancing

by

Web design and development is the most popular freelancing category – both for buyers and freelancers. Go to any online freelancing marketplaces and you will see that the most projects are for web design and web development. By corollary, most freelancers belong to this category. So, if you are a good web designer or web developer, you will never be short of work and hence money.

Types of Web Design and Development Freelancing Jobs

Listed below are the most common jobs or projects on online freelance marketplaces like Guru.com, Freelancer.com, Fiverr.com etc.

  • Web design in PSD format
  • Slicing / converting PSD to HTML / WordPress etc
  • Complete static web design and development (brochureware sites)
  • Complete dynamic web design and development (database / flat-file backend for admin, other features for interactivity)
  • Re-design & re-develop website
  • eCommerce stores design and development (Amazon stores, Magento, BigCommerce, Shopify etc)
  • Open source CMS website design and development (WordPress, Drupal, Joomla etc)
  • Commercial CMS website development (Wix, Squarespace, Weebly etc)
  • HTML email / newsletter design
  • HTML for ePub ebook creation
  • Enhance website loading speed
  • On-page SEO – since it requires some coding I’ve included it here
  • Restore malfunctioning websites
  • Restore malware infected websites
  • Then there are small jobs like:
    • HTML form with / without form-handler script
    • Edit HTML and CSS files
    • Add / edit content (may include some HTML etc) to websites
    • Website transfer to different server / host (although not classically web development, web devs can do this)
    • Setup web hosting (again quasi-web-dev)

There may be variations of these as also other custom jobs and just small tweaks.

How much can you earn in web design and development freelancing?

As usual, it depends. On fiverr.com, you can get small jobs from as low as $5 to hundreds of dollars. On Guru.com, Freelancer.com etc, you may earn upto thousands of dollars. These marketplaces have created dollar millionaires – top freelancers have now transformed into web development agencies employing other pros on their team.

Your fee is directly proportional to your skillset and the value-add you provide. Other factors include the competition and buyer’s budget. Remember that your objective is to have a client for the long term. This will ensure that your future customer acquisition costs are low, since you already have a captive client base.

Web developers tend get paid higher than web designers because of the complexity of their task. But I do know of some top designers who command a very high fee.

But wait, is web design different from web development? Can you do both? Answers follow…

Difference between Web Design and Web Development

Web Design

Web design includes the aesthetics (the “look”) and usability (layout) of a website. Web designers first discuss with the client to understand their requirements. You can read about design principles here. For example, they might ask few questions such as:

  • Objective. What do they intend to use the website for? Is it simply like an information brochure that is online, or will it be useful for generating sales leads? Perhaps they intend to sell products and / or services on the website (eCommerce). And so on…This enables the web designer to create a layout that converts a website visitor into a buyer or a marketing lead etc. The layout should bring attention to the “call to action” section (buy, download, register etc) besides providing good user experience.
  • Branding. Branding is the message communicated via the brand name, logo, typography, colors, images etc. ( In the post on freelancing as a graphic designer, there is a section on Brand Identity.) The web designer should ask about the client’s logo and the organization’s color palette etc. S/he should then propose the appropriate typography (some refer to as fonts) for the website. The aim here is to communicate the desired message and have consistency in the design across all mediums (online and offline).
  • Images. The web designer should also ask for image preferences or restrictions. For example, an insurance company I worked with always insisted on images with racial harmony. One travel agency wanted no stock photography on their website, but original photos taken by them. As a designer you should be able to tell the client which images work or won’t work for their business objective. Better to be safe than get into a controversy later.
  • Examples. Web designers usually ask clients for their favorite websites and what elements they like in each. This should also give a fair idea as to what the client prefers. But again, user experience is more important than client preferences. This should be explained to the clients, as it will affect their business in the long run.

Based on client responses, the designer creates a wireframe (visual mockup that outlines the structure of a website) for the website using the tools mentioned in this post. After the wireframe is created, the design is usually handed off to the developers who develop the frontend using HTML, CSS and Javascript.

Most web design freelancers I know use Adobe Photoshop to create the layout and other visual elements of the website. After it is approved by the client, the design is “sliced” i.e. converted to HTML, CSS and perhaps Javascript. Which means in this case, the web designer is also the web developer to some extent (if you leave out the backend programming…I will come to that in a minute).

As you would have guessed, wireframing and handing off to developers is usually for large projects handled by big agencies. For a freelancer, it is good to know about Photoshop design as also coding in HTML and CSS.

Web Development

Web Developers take the website design handed over by web designers and create a functional website from it. Thus, web developers use HTML, CSS and Javascript and it’s many libraries for programming the frontend (the interface seen by web users). They may also use programming languages like ASP.net, Python, PHP etc for the backend. (Website backend is the layer that functions on the web server, performs the core functional logic and interacts with the frontend. e.g. when a user submits a form, actions that affect the data is coded in the backend scripts). Read more on frontend and backend here.

Present day web development has eased to a considerable extent because of the evolution of CMS (Content Management Systems) like WordPress, Joomla, Drupal and many more.  CMS are easy to deploy on web hosting platforms. Once installed, you can select from a wide selection of free and premium themes (or templates) specific to the CMS. Creating websites using CMS has forced many freelancers to become web designers AND developers. This led to the creation of a new species of developers called the Full Stack developer – who expectedly are high in demand now.

So should you be a web designer or developer or both?

The answer is – it depends. Are you just a creative person who doesn’t care for programming? Then stick to website designing along with other graphic design freelancing. Whereas, if you do know or can learn programming and if you don’t have patience with colors and fonts, then you are best being a developer. But as I said earlier, with the proliferation of CMS, life has become easier for website creators – my suggestion will be to learn as much as possible about HTML, CSS, Javascript and PHP as also basic to intermediate skills on Photoshop.

The best place for learning web designing and development is Udemy.com. Go take advantage of the various sales offers they have and learn from the comfort of your home at your schedule.

Where can you get Web Design and Development Freelancing Jobs?

First and foremost, register on online freelance marketplaces like Guru.com, Freelancer.com etc if you haven’t. This is easiest as you can work as per the place and time of your choosing. You don’t need a physical office for freelancing. You can even freelance while you are in a full-time job (provided it does not create a conflict of interest with your job; read your HR policies). Read this post on good and bad of freelancing.

Later you may want to take it to the next step. You can establish a physical workspace where you can hire staff, interact with clients and so on. This implies that you are now graduating from freelancing to a full scale business – congrats!

Tools for Web Design and Development Freelacer

Besides the obvious ones like a computer with Internet connection, here are the tools you need.

Web Design

Web Development

  • Adobe Dreamweaver (expensive) or Atom / Notepad++ (free)
  • Various libraries like jQuery, Angular, Bootstrap, React.js etc
  • Code / scripts from Codecanyon.net etc

Marketing your services

While having an account on online freelance marketplaces will get you some gigs, what about actively seeking work? For this you need to reach out to potential clients through the web and social media. So, firstly as a website designer or developer you MUST have have a website yourself. This website should showcase your portfolio for clients to see and understand your capability. The website can also have pricing information, the process and tools you use for website creation and even an online ordering system.

If you want to create your and your clients’ website using WordPress, Joomla or other CMS or even just HTML & CSS, then I recommend Siteground for website hosting. I have written an exhaustive post on why Siteground is the best hosting service.

You also have a choice for DIY website creation service like Wix which creates websites faster and easier for you or your clients. Read more about why Wix is the best online website creation tool.

I hope you now have a basic understanding of what it entails to freelance as web designer or web developer. Done right, it is a nice paying and satisfying profession as of now. You get the satisfaction of seeing your work being used by thousands of website users and also contributing to the client’s business objective. This (satisfaction) perk is under-rated by most, but is one of the key components in creation of dopamine, the chemical in your brain, which contributes to you being happy.

On the other hand, if one takes shortcuts to create a website, it may end up being a lose-lose situation for your client and you. A fantastic failure example is when Hertz (car rental company) sued Accenture for $ 32 million for a botched website redesign! . Can you believe it – $32 million and the website was NOT even delivered! Well that went badly for Accenture…but for a freelancer, it may be loss of future business. So, get skilled, do your homework with the client and deliver fantastic websites – you owe to the website visitors also.

My best wishes to you for starting your web design or development freelancing career.

Do write in the comments below and share this post on your social media. Cheers!