WHAT MAKES A GOOD PORTFOLIO?

Whether you are a full-stack developer seeking to showcase your range of coding skills, a front-end web designer looking to demonstrate your visual flair, or a database wizard deeply embedded in Oracle or MySQL, you will need to assemble a portfolio of your work to impress the persons most likely to increase your bank balance with lovely money. Here are three essentials to consider when assembling a portfolio in any web career.

1 — Presentation

Your website should immediately make obvious to any potential employers or contractors that you have a striking visual style, that you are able to offer the sort of eye-catching quality that visitors to your website are looking for. If the UI of your site is unapproachable, bland, and clunky, the chances are no one will want to even click on your portfolio link, let alone consider drawing up a contract. To ensure visitors want to peruse your portfolio, you should have a dynamic, funky interface that makes use of the relevant coding languages in which you are qualified. It’s essential to make a memorable first impression and not to assume that everyone will have the courtesy to look past the surface of your site to your excellent work underneath. In short, no Wordpress templates, no old-skool designs, no low-res images, no wonky links. You should consider hosting your site on a paid-for domain with a security certificate.

2 — Curation

When curating your portfolio, make sure not to simply lump together a batch of your Greatest Hits. You should consider the skills the potential employer is looking for, and assemble a carefully chosen sample of your work, ensuring that your strengths are spotlighted. If your strength is exquisite problem-solving using your own skill and initiative, make that the focus of your portfolio with well-selected examples. If your strength is in solid, consistent quality of code in your chosen language, choose a range of examples that demonstrate this from freelance or private projects. You should always annotate your code to show clearly what each function is doing and show this working on the website with appropriate screenshots. You might want to consider hosting your sites live on a certain section of your website, alongside a place where the code can be viewed (or use GitHub, see below). In short, it’s simply a matter of the art of the humblebrag.

3 — Connectedness

Make your there are live examples of your code (tested and working) on GitHub, so employers can check whether you are selling yourself properly, or whether you have a working solution to a problem they are seeking to resolve (often employers are seeking very specific solutions). Make sure you are contactable on social networking sites such as LinkedIn and Twitter. It can also help if you are a frequent voice on problem-solving websites like Quora or Stack Overflow, where your solutions to users’ problems will be viewed by a large number of people Googling the same problem that you have fixed. Any positive attention is a bonus, so keep your usernames consistent across all your accounts.

Further reading:

Quora — Building a Good Portfolio

Hackernoon — Inspiring Portfolio Examples

UNDSGN — Creating a Portfolio Website

Tamuk — Front-End Developer Portfolios

Bad Portfolio:

Good Portfolio:

BE LIKE JOHNNY ROTTEN. BE A PROFESSIONAL.

Professionalism is a prerequisite to success in every creative art. Even if you’re in an anticapitalist punk trio and spit venom at the corporate suits, you are still required to present your demos to potential record companies in a way that makes them listen, and to honour your contracts and musical obligations. (The Sex Pistols are the epitome of a band who marketed their skills in the most profitable, professional way. Sorry, punk purists).

In the area of web development, whether freelancing or working for a company, codes of professional conduct are absolutely essential for cultivating and maintaining a career in your chosen discipline. You should consider the following points for a pain-free route through the world of professional ethics.

1 — Clients

When dealing with clients, you should make sure to establish a tone of openness and honesty and, equally importantly, to be responsive to their concerns, requests, and demands. You should establish realistic parameters to the conversations you can have with your clients—your response times to emails, any updates to your work schedule such as delays, extra costs, or extra resources, and whether you are able to execute certain tasks unaided. Any failure to deliver will not help your reputation. You should always respect your clients’ intellectual property and keep any data, electronic media, and personal files safe, and ensure that all material is secure and never shared with third parties. Likewise, you should expect your clients to treat you with the same courtesy, and be wary of clients who may not value your expertise enough to pay you a respectable rate for your work.

2 — Users

Ethical web development is a code of ethics for developers. There is a collectively understood list of essentials that every developer should commit to memory. The first of these is that web applications should share an obvious and oft-forgotten trait—usability. By focusing on accessibility, developing inclusive, responsive features, and testing thoroughly with targeted users, you should have an app that respects the contract between user and creator, that is clear as crystal from the first click. Secondly, as with your clients’ intellectual property, you should take measures to ensure your apps are as secure as Fort Knox in a hurricane. You can ensure this by using https (the secure version of http), making clear how their information is being used (such as cookies or tracking), and have a robust security package in place to make sure no sensitive data is leaked. The most well-known code of ethics for computing is set by The Association for Computing Machinery.

3 — Colleagues

This may seem blindingly obvious, but always respect your colleagues. If you are working in teams, the most common route to happiness is to use GitHub to log your changes to shared code, and to always comment and test your latest changes to prevent time being wasted on backtracking mistakes. You can also engage in the coding community by contributing to open source projects, and to make use of open source code for your own work. You should, of course, rise above the anonymous rudeness of the likes of Twitter, and conduct yourself with consummate politeness and mannerliness at all times in all exchanges.

Further reading:

On Ethical Web Design

On Programming Ethics

The Pistols at the Lesser Free Trade Hall, 1976.

FREELANCING — THE ROAD TO RICHES?

Being a successful freelancer requires a stubbornness of character, an in-built self-motivation muscle, and special device for mainlining coffee into your veins. In certain creative industries, such as journalism, freelancing is a vital way to showcase your work in the hope of bagging a spot on a newspaper as a regular, and with a skilful use of social media, exposing your world instantly and reading a vast audience. As a freelance web developer, the same rules apply, on a less explosive scale, and anyone starting their own web development business should consider the responsibilities involved. Here are three important things you should bear in mind when considering whether or not to freelance.

1 — You Complete You

The extent to which you will be successful depends on the extent to which you understand how freelancing works. You are your own boss, employee, human resources manager, accounts department, and crisis management operative. You must understand exactly what your particular set of skills are as a developer, what value these skills have for potential clients, and whether these skills are competitively priced and deliver value to the client. You must understand that clients are interested in squeezing the best possible service from you for the least they can possibly pay. Before you set up shop, you should research thoroughly how other developers charge for the same services you intend to provide, whether you can offer competitive rates for your work, and set realistic time constraints for delivering work.

2 — Self-Motivation

A common failing for first-time freelancers is failure to understand that you are your own one-man or one-woman marketing department, so in addition to your full-time coding work, you should also spend time embarking on a vigorous campaign of self-promotion. These things can involve paid advertising, asking previous clients to recommend you to potential clients, to leave you positive reviews on social media, to contact potential clients through LinkedIn and elsewhere, to advertise your services on all manner of relevant freelancer websites, to make yourself known in the community by engaging with other developers, building a network of contacts on social media, attending networking events, and so on. It is important to devote a significant chunk of your working day to staying seen.

3 — Precision is King

Understand that when you are setting up as a freelancer you are no longer a work-in-progress. You have a specific set of skills that you are bringing to a specific set of problems to a specific set of clients. This will save you hassle in the long-term. One of the boons of specialisation (and scalability) is the ability to re-use code from previous projects, freeing up your time to work on improvements suggested by your client, to make changes based on testing and feedback, and to spend time on managing your finances. You should also know which elements to outsource (usually the content of websites are outsourced), and not to take on work that requires you to learn new skills from the ground up. Being super-specific in what you have to offer is a way to make freelancing less stressful and more profitable.

There are many, many more things to consider. Check out some of these links for additional guidance on whether freelancing is for you.

Freelance Web Developer Guide

Managing Finances as a Freelancer

The Realities of Freelancing

Is Freelancing for You? Take a Quiz

NETWORKING IS VERY VERY GOOD FOR YOU

As with many other collaborative industries, networking within web development is important, crucial if you wish to succeed as a freelancer. The advantages of constructing a network of contacts, friends, and ex-colleagues, are vast in a world where referrals, recommendations, and cronyism are often (rightly or wrongly) extremely common to securing work. Here are a series of things to consider when embarking on a frenzied campaign of you.

1 — Help!

Stack Overflow and WC3 Schools are useful life rafts whenever you encounter a coding challenge beyond your immediate abilities, but having a series of regular collaborators, friends, and colleagues on hand to share suggestions and solicit help from is invaluable in an industry where error-zapping is a day-to-day requirement. You will find that multiple heads are better than one-head-plus-Google, so having a support network, and offering support in return, will position you as a capable individual and boost your status in the industry. Making these connections and friendships will stand you in good stead for many career-boosting quid pro quos. Consider your networking activities as part of your overall portfolio of work, rather than an irritating necessity, and you may find yourself a satisfying niche.

2 — Help!?

The easiest way to network is to actually network. This means not resting on your laurels, content with the occasional poke around LinkedIn or posting a comment here and there. Create content and share your ideas on social networks, on your website, or on web development websites accepting guest blog posts. Respond to the comments enthusiastically and make e-friends with the responders and enthusiasts. It’s important to network with purpose in the right places. Identify the areas in which you are most capable, rather than spreading yourself thinly across various venues and various coding disciplines. A perfect solution to a coding problem on Stack Overflow, for example, will earn you many likes and draw attention to your profile and website, while showcasing your bodacious debugging skillz.

3 — Help?

The important thing to consider when networking is that cynicism is a non-starter. Yes, you will need to reach out to others at important moments in your own work, but if you haven’t proved useful or responsive to others, then they won’t feel inclined to help you in return. Make sure you strike a decent balance between offering your time to others and asking others to offer their time to assist you. Of course, there are advantages to asking “who is the most important person in the room?” and descending upon them with the ravenousness of a vulture, but most people seek sincerity and honesty in relationships and have finely attuned bullshit detectors. If attending physical (or Zoom-based) networking events, make your voice heard, but resist the temptation to be overly pushy. Putting yourself forward is important, but the trick is to make the whole process seem casual and friendly. Remember, if you have a circle of friends and colleagues, there’s nothing to gain from a closed loop. Always remain open to speaking to new people.

Here are some links to more detailed insights on networking within web development. Good luck!

Advantages of Attending Events

Andy Soward's Advice on Networking

Networking Tips from Viking Code School

Web Developer's Guide to Networking

IP FREELY? KNOW YOUR ONLINE RIGHTS.

There are four types of intellectual property: trademarks, copyrights, patents, and trade secrets. Patents are used to stop inventions from being manufactured by others who have stolen your invention or arrived at the same discovery at the same time as you (famously the telephone was invented by Antonio Meucci, then credited to Alexander Graham Bell who registered the first patent). Copyrights protect the creators of original work, i.e. writers and musicians, as well as the makers of software and applications. Trademarks prevent the stealing of brand-specific words or designs. Trade secrets specifically refer to original recipes or designs companies have in creating their products, such as that special pep that makes Reggae Reggae Sauce such a mouthwatering condiment.

In the world of web development, copyright protections and trademarks are the legal areas with which you should be concerned. The web is a wild wild west (www) of creative banditry, with strangers reappropriating content unattributed left, right, and centred (as per their text-CSS settings), leading to potential copyright conflicts that are avoidable if you wield your intellectual property rights.

In order to wield these, you simply have to make use of a copyright vest (using the © symbol), providing that all the text, images, and code on your website or application have been created by you. Whenever taking images from the internet, you should always check the usage rights (on Google, if you select Tools, you can access a menu for this purpose), and use images listed under Creative Commons. Under the most frequently used clause of these, CC 2.0, content is free to be edit and disseminated anywhere on the internet, provided proper attribution is given (i.e. the creator is credited). If an image is in the public domain (such as on Wikipedia Commons), then no attribution is needed.

If you are found to be in violation of these, the creator can request you remove the content from your website, or pursue legal action (usually nothing comes of this, but decorum isn’t dead). Unless you are a large platform such as YouTube, which has algorithms that can detect the illegal use of songs from the soundwave patterns, for example, it is harder to stop your content from being taken and reused without attribution, and there are realistically very few ways to protect your content. The most common method for images is to use watermarks, which ensure instant attribution. You can also disable the right-click “save image” so the image cannot be immediately nabbed (Wordpress has a plug-in for this, although the image can still be viewed separately in a fresh window). You can also perform a Reverse Image Search on Google, which scours the net for any repeat uses of your image.

If you are specifically seeking to sell your images online, these protections are essential to protect your intellectual property. For other content, such as writing, you can easily search for reused text, which is often pilfered at the highest level (the UK Government, for example, recently cut and pasted the terms and conditions for a shipping contract from a pizza website), by entering a passage into google search. Copyright protections work on an honour system, utterly ineffective without legal consequences, so it is important to respect them if you want others to respect your work.

Here are some links to more info on IP rights:

Creative Commons 2.0

Four Types of Intellectual Property

Protect Your Images

Pinsent Masons on IP Rights