Skip to main content
Personal Portfolio Site Design Requirements

Personal Portfolio Site Design Requirements

·3 mins·
Author
Gabriel Baltazart
Undergraduate Student at the University of Alberta
Table of Contents
Personal Portfolio Site - This article is part of a series.
Part 2: This Article

Introduction
#

In this article I describe the initial idea and design process behind creating a personal portfolio website.

Before writing a single line of code and making any purchases it is important to understand that exact design requirements for the website. My main audience for this website is potential recruiters. Knowing the statistic that the average recruiter spends six to seven seconds looking at a potential candidate’s resume, my goal is to showcase as much of my skills as possible on the homepage of my website. Following this idea I plan to have a video background featuring my latest project, three featured projects at the bottom of the page, and a contact button right in the center.

General Layout
#

It is very easy to lose hours by spending time making small changes to the HTML and CSS elements that don’t even make it into production. To avoid this, an important step in the design process was drawing a rough layout. While I could have created a professional demo in a program such as Figma, I didn’t see as much value in creating a comprehensive demo as I was working on this project alone and did not need to communicate my ideas to a supervisor or to other team members.

Design requirements
#

The main ethos behind this project is to have a secure, easy to deploy, quick to update site where I can focus on showcasing my talents rather than a site that requires constant tweaking of the hosting configuration and website code. Below I have listed detailed requirements of this project

  1. Low cost
    • The cost of running the website should not exceed my budget of $30 per year
    • This means need to compare different top level domain names (TLDs) and registrars to find a deal that fits within my budget
  2. Low maintenance
    • After being setup, the website should not require my constant attention to stay running on the internet
    • This means that I will need to look into website hosting providers rather than using a self-hosted situation
  3. Content management system
    • After the initial setup of the website, I need to be able to write and edit articles on the website without having to manage the hosting or code of the website
    • My goal is to write articles in Markdown in the Obsidian editor and have the completed articles automatically be formatted to markup and published to the website.
  4. Responsive
    • The website needs to be viewable on any device, this means creating a responsive design that adapts to the aspect ratio of a mobile or desktop browser
    • There are already many examples of web dev projects that have accomplished this I will need to look into what option fits my project that best
  • Fast loading times
    • Following the idea that the average recruiter spends about 45 seconds on a resume, the website should be able to load quickly on a typical internet connection
  • Good search engine optimization
    • Ideally I would like my website to appear in search engine results for my name, this means looking into search engine optimization
  • Secure
    • While my website will not be handling any user data from visitors, there are still security considerations in avoiding domain hijacking and ensuring that the content of the website cannot be changed without my knowledge.

Thumbnail image by Glenn Carstens-Peters on Unsplash

Personal Portfolio Site - This article is part of a series.
Part 2: This Article