How To Be A Freelance Web Developer

It’s safe to say that a popular end goal for a ton of people is to work for themselves. To hopefully start a business or chase a passion that ends up resulting in a successful career without having to clock in. For many designers and developers, creating a living solely from freelance web design/dev work is a big goal. The problem is that since freelance web design has little barrier to entry it & is often used for supplementary income, the market is flooded with designers. On the other hand, developers nowadays literally cannot stay unemployed.  The demand is massive.  I’m sure there are stats to back me up but I am a little too lazy to cite them.   As with most things, the key to becoming a successful freelance web designer/developer is to do the proper research, understand the market, create a brand identity, and understand the costs & necessary evils involved with working independently.

This guide on how to be a freelance web developer is going to be tailored towards beginners;  those who may haven’t ever bothered to write a line of code.  Specifically, I’ll focus on using WordPress to build sites.  I’m starting this way for a couple of reasons.   One, as you go deeper into the development realm, there are literally thousands of languages, frameworks, methodologies & whatnot you may need to learn depending on what task you’re tackling.  Two, I’m still young in my career, and have just as much to learn as anyone.  So here we go:

Skills

Yeah, you’re going to have to learn things.  A lot of folks I speak with about wanting to get into some extracurricular hustle like freelancing really shy away when I mention the time commitment.  It’s unfortunately commonplace for me now to be up until about 2-3am every week night working on some project or learning some new concept.  I like to think that an hourly rate — which I’ll get into more later — correlates to how much time you’re willing to spend learning something that someone else refuses to.  Thats why your lawyer costs $400 per quarter hour.

I digress.  I’ll go over a few of the basic skills you should definitely learn, and some that you should really consider learning if you want to make this sort of thing a full time gig rather than a hobby you do to pay for beer on the weekend.

If frontend web development was a person, HTML would be the bones, CSS the skin, PHP/Javascript/Etc the muscles.

HTML

Hypertext Markup Language.  The most basic tool in the frontend arsenal.  With HTML you’re essentially structuring a webpage.  I refer to HTML as the bones of the frontend beast as they are literally the most basic component that shape what you’re making.  I’m not going to go into some huge tutorial, but I will include some helpful links below.

CSS

Cascading Style Sheets.  This code is used to style your HTML elements;  the skin.  With CSS, you identify specific parts of your HTML, and add styles like borders, background colors/images, animation, tons of stuff.  CodePen is a really great resource to check out if you want to see the complex things that can be done solely using CSS.

PHP

Hypertext Preprocessor.  PHP is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML.  More importantly, it’s what the WordPress platform is built on, so it would behoove you to understand it, or at least get familiar with the WordPress Codex.

JS

Javascript.  JS is a dynamic computer programming language. It is lightweight and most commonly used as a part of web pages, whose implementations allow client-side script to interact with the user and make dynamic pages. It is an interpreted programming language with object-oriented capabilities.  As a beginner, you’ll probably use basic script calls, like when you want to use a Google Font or add a Facebook tracking pixel to your pages.

Useful Links

  • Free Code Camp
    • This is a pretty nice, free tutorial that will get you familiar with basic principles of frontend development.
  • Treehouse
    • Really nice UI.  Solid tutorials that get into intermediate concepts.  This one isn’t free.
  • Lynda: Become a Front-End Web Developer
    • You get a person talking at you about concepts you’ll need to know.  Free with LinkedIn premium account.

Software & Web Tools

There are a ton of helpful tools you will absolutely need to use when doing this kind of work.  Some are free, some are pretty expensive.  If you want to be a freelance web developer seriously, you’ll potentially have a bit of overhead immediately.  This is by no means a definitive list, rather a handful of tools I use on a regular basis:

WordPress

Obviously.  Wordpress is an open-sourced platform that was originally created as a blogging tool.  It has a post/page format that’s really easy to grasp onto.  Wordpress reportedly powers 18.9% of all sites on the internet.  That’s pretty staggering considering how many different tools are out there.  As a beginner, I really can’t see any reason why you wouldn’t use it — with an exception being Ecommerce — where I would probably point you to Shopify.

Download

Adobe Creative Cloud

Basically, Photoshop.  If you get more into the design/prototyping side of things, you’ll want to get cozy with Illustrator.  I can’t tell you how essential skill this one is.  You absolutely need to be able to generally manipulate images/icons/etc however you want them to fit into what you’re building.  Once you’re a CSS/SVG boss, this becomes less important, but still good to know.

Buy

Sublime Text

This is a text editor on steroids.  You’ll quickly find out that writing code requires you learning new languages, which can suck to type out.  Tools like Sublime Text help you out by color coding different parts of your code, helping you close elements, and many other actions.

Download

MAMP

MAMP is one of the coolest things in the world I think.  Essentially what it does is start up a server on your localhost.  What this means is that you don’t have to pay for hosting space through a 3rd party like GoDaddy.  You can do essentially everything you need to do on your own machine.

Download

Github

This one is really important.  If you want to stay really organized, collaborate with other developers, and join projects that are already in motion, you’ll want to get familiar with GitHub.  It’s a version control tool —  essentially cloud storage for website & app files.  Using other tools, you can deploy code to production directly from GitHub, which really comes in handy.

Sign Up

Coolors

This is a design tool that generates color schemes for you.  When starting a new project, it’s always nice to come equipped with some tasteful color palettes.  You will find no shortage of them here.  I use them for basically every project.  Besides this one.  I like black, relax.

Check It Out

Administrative Tools

Basecamp

Basecamp is definitely my favorite project management tool.  It’s nice to have your own account in which you can add your clients & collaborating colleagues.  You can break everything down by project, task group, task, etc.  The UI/UX is great, and it really does help keep things organized.

Download

Streak

Streak is an extension for Gmail.  If you don’t use Gmail/G Suite, you should — more on that later.  Streak has a couple of features that I use very often, and some I have yet to discover.  My favorite feature is read receipts on emails.  You can see when, where, and on what device someone has viewed your email.  It’s a nice feature for keeping tabs on your leads.  The second feature I use is the “Pipelines” feature, which builds a CRM (customer relationship management) tool into your Gmail inbox.  Why is this important, dude?  Well, when you start having a few leads roll in every week, you will need it.  No one signs the first day.  It usually takes a few weeks of back and forth to get an agreement signed.  Did you remember to follow up with Lisa from Kansas who wants a site for her organic cat food?  No, you didn’t.

Install

Bonsai

Bonsai is freelancer accounting Jesus.  Create contracts, agreements, invoices more from a super sleek, simple dashboard.  Invoicing integrates with Paypal, Stripe (Credit/Debit), and ACH transfers so you don’t have to wait for boring old checks in the mail.  It’s not 1995 anymore, bud!

Sign Up

Google Suite

Ahh, cloud Jesus.  Google suite is a group of tools that make your life amazing.  First, really cheap email hosting for your custom domain with the familiar Gmail experience.  Second, Google Drive.  I’m a Dropbox hater, so you’ll want to explore that too.  For me, you can’t beat the G Drive user experience & ease of sharing files.  There are some more great features in the Google Suite but I don’t use them super frequently.

Sign Up

Hardware/Gear

This part isn’t super essential, but it’s nice to have an optimized work environment — you’ll be spending a lot of time there.  I won’t go into a ton of detail, but here is essentially what I’m working with:

Business Development

Alright this stuff is important.  This is where you go from the dude that helps out your buddy Joe with his Guy Fieri fan page, to a legitimate sole proprietor.  Doesn’t matter if you’re going to specialize as a freelance web developer or marijuana marketing — this is important for anyone looking to make money online.

Build Your Website

I shouldn’t have to tell you this, alas, here we are.  Build a website!  Build it now!  Get your URL in the Google index now!  Working on your own site lets you play around with something nobody is going to get mad about you screwing up.  Learn things!  You can use mine as an example.  As soon as you land, it tells you what I’m going to do for you.  Choose a flattering image of  yourself to put somewhere, people like to know they are working with a real human.  There are conversion rate metrics to back this up but it is late and I am tired.  Some essentials for your website:

  • A homepage that outlines who you are and what you do
    • One that HAS A CONTACT FORM ON IT.  Make it really easy to contact you.  People are not as smart as you think
  • Resume page
  • Portfolio page (which I hypocritically haven’t updated in about a year now)
  • Blog (kind of optional — I think it’s a nice touch for people to read things I’m thinking about on top of the work I have done)
  • Implement other creative ideas — stand apart!

Do Free Work

This is solely to hone our design/development skills & to start building a portfolio.  My first “free work” project was for a then up-and-coming record label.  I got to be close to an industry that I love & improve my skills as a freelance web developer at the same time.  Additionally, you’re going to ask these people for which you’re doing this free work to tell their friends.  Tell the world, tell someone!  Sure enough, I got a referral from that first client, and thus fell into the freelance world.

Referrals

Referrals are where 50-70% of your first projects will likely come from.  You can provide incentives to your current clients as well:

Hey Paul, I’ll drop 15% off your next invoice if you refer a new client to me!

Ideally you wouldn’t have to provide any incentive because you’re such a great asset, but you get the picture.

SEO

Search engine optimization.  I’ll keep this relatively brief, as this is whole other can of worms to get into (looking back after writing this, wasn’t super brief). Anyways, this is how I get leads for the most part: optimizing for your local keywords.

My site, for example ranks #1 for the following terms:

  • freelance web developer los angeles
  • freelance web development los angeles
  • freelance web designer los angeles
  • freelance web design los angeles

It ranks high for these terms too if you’re in the LA area (Google knows):

  • freelance web developer
  • freelance seo

This obviously doesn’t happen overnight, but over time.  SEO is a long play — especially if you’re dealing with stiff competition.  I encourage you to use Google’s Keyword Tool to find some keywords of your own to target.  Here’s a very generalized formula of how to do good SEO:

  • Build links
  • Build links
  • BuIlD lInKs
  • Build links
  • Build links
  • Set your title tags & meta descriptions with proper keywords
  • Add 300-500+ words of relevant copy with your keywords on the pages you want to rank
  • Install SSL certificate
  • Build links

Some of you many have noticed I emphasized building links.  Don’t let old school SEOs fool you.  Building strong links is the NUMBER ONE ranking factor in Google’s algorithm by a long shot.  Here are some great ways to build links:

  • Write guest posts on other blogs & request an author link to your site
  • Content distribution strategy
    • For example, I will seek out some blogs who may want to share what I’ve written here with their readers.  Never know until you ask.
  • NAP
    • For local SEO (meaning you have a physical location)
      • This means “name, address, phone number.”
      • You’re going to go lookup every online directory in your area, and then nationally, and add your business details to it.  This helps Google with the fancy search engine placements.

 Wrapping Up

Well, thanks for reading.  Hopefully this helps you in your path in how to become a freelance web developer.  Some thoughts to leave you with: Make sure to do the proper research before even considering this as supplemental income — it’s very time consuming. Your initial work is going to set the precedent of how people view you as a professional/creative, take it seriously despite what you’re being paid — which is nothing. Create a brand.  YOU!  Know what you’re trying to sell people and where your attributes lie as a designer & developer. Build a portfolio, integrate yourself in the market, and use your own platform for marketing. Use all of these tools I have mentioned, and find your own diamonds.  There are new products popping up every day that will make your life a little easier. It’s a competitive-ish market depending on where you are, but with the right mixture of talent and preparation and weird, it can be incredibly rewarding & help you save for the future.