Designing A Personal Website for Designers and Developers

Photo by Ben Kolde on Unsplash
  1. Font: There are a lot of free fonts you can use from Google fonts. My personal favorites include Muli, DM Sans, DM Serif, Montserrat, Lato, Spartan League, and Overpass.
  2. Color Scheme: Most personal portfolios I have seen are minimalist and in black and white, but the colored ones always look exceptional.
  3. Patterns: This a design elements that can spice up your site. I see it in a lot of personal websites. Some use background patterns others use illustrated patterns.
  4. Illustrations: Illustrations usually adds some flavour to a website, you can use it if you can make one or get someone to make you one.
  5. Design Pattern: Anyone that sees a website made by me, can identify the rest. This is because I have already an established pattern for how I build websites. I hope to build it into an actual design system in the future. Having a consistent design patterns across your works can tye them together. It doesn’t all have to look similar but you can have a particular element that marks your works.
  1. Logo: You can use plain text but, there is nothing wrong with creating a simple and elegant logo for your brand.
  2. Links: I think one of the most important and first things for your personal portfolio is to have links to your various online space for example medium articles, youtube, LinkedIn, and other social media. This might seem counter-intuitive, but if someone's attention is drawn to some link on your site, then they might be the written customer, else they can continue scrolling down the page.
  3. About: A lit bit about your self followed by your social media handles will do. You can also add your interest.
  4. Preferred Tech stacks and tools: I always find it fun splashing bubbles of all the programming languages I know or software packages I use, with some text by the side.
  5. Client Works: This is the best place to give a hint about the kinds of projects you would be excited about. You can arrange them in order of preference or date delivered, but make sure not to include shabby or unfinished works.
  6. Personal Projects: You can also include your personal projects for documentation or to even serve as part of your professional portfolio. I have often found developers with even much more sophisticated personal projects mostly because they worked on it over a long time without constraint to scope.
  7. Contact: Don’t forget to add a means for anyone interested in your services to contact you.
  1. .design
  2. .com
  3. .codes
  4. .io
  5. .me
  6. .dev
  7. .link
  1. Wix
  2. WordPress
  3. Webflow
  4. For me, I will be using a Vuejs Page hosted on firebase
  1. Makes you more professional
  2. Can be used as a resume
  3. Can be used as a blog
  4. Can be used as a journal
  5. Can be used when applying for jobs
  6. Can be used as a gallery for your works
  7. Helps you in global reach

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store