Week 1: How I made my portfolio website

Week 1: How I made my portfolio website

I’ve decided to dedicate time to the business of being freelance (Grace the biz) so I’ve finally decided to set up a portfolio website. Over the next weeks I’ll be writing about the steps and resources I’m using to building it :).

Week 1

– I’ve set aside some time to do this because I know I wont if it’s not scheduled! Wednesday mornings every week is my chosen day.

Step 1: Research sites that I love 

I came across Tyler Riewer’s site on twitter a few months ago and absolutely loved the simplicity, humour and personal touches. Also loved that all you needed to know was on one page. 

Screen Shot 2016-01-26 at 12.31.33

I also searched “best portfolio websites” selecting websites I really liked and writing what I liked about them.

jessicahische.is/anoversharer love the humour in this website, simple and easy to navigate and she gives us nuggets like tips page

nolowenenowak.com/– again one page will all the information; portfolio,services, works, about me, timeline. The balloon navigator is cute!

tanmade.com/biolike the allen is…. thinking, reading, collecting, designing, editing, writing, playing around. It gives you a clear idea about what he does. 

www.rleonardi.com– amazing site that really shows off his animation/ web building skills

Screen Shot 2016-01-26 at 14.41.44

The key things every site I saw has are;

  • About me
  • Services
  • Portfolio
  • Works/ CV/ current projects
  • Contact details

Step 2: Create a brief for the site

So I’ve decided on a one page. It’s simple and less daunting for my first website design and build!

  • Simple- one page with all my key information
  • Easily navigable
  • Friendly
  • Grace-full
  • Use symbols?

Key elements

  • logo and name
  • tagline- tactician; project development, design & architecture, community engagement
  • headshot/ picture of me
  • text about myself, my story & what I love
  • services; community arts, architecture, graphic design, project development
  • working on now
  • timeline (how do I show this as my experience isnt very linear, lots of simultaneous projects?)
  • portfolio/ projects
  • contact details
  • social media (email, twitter, linked in)
  • FAQs- e.g why do you laugh all the time? 
  • links to blogs- roller banner of interesting things or posts from blogs

Tools I want to use/ learn

  • Udemy course
  • wordpress
  • key word research
  • google analytics

Step 3: Decide on what platform to use

I had a look at free sites like wix, some of my friends have used it but I didn’t like the look of it particularly and I would like to use this opportunity to learn about web design & coding. 

Step 5: Set up a domain name & web hosting

Choosing a domain name, I found some tips on Robert Mening’s blog post on how to make a website

    • A) Is it brandable? For example, if you make a site about poetry then best-poetry-website.net is not a good choice: poetryacademy.com or poetryfall.com is much better.
    • B) Is it memorable? Short, punchy and clear domain names are much easier to remember.If your domain name is too fuzzy, too long or spelled in a strange way, visitors may forget it.
    • C) Is it catchy? You want a name that rolls off the tongue, describes what you do and sticks head. Coming up with a cool name can be a bit tough since there are approximately 150 million active domain names in the world right now – but don’t give up.
    • There’s one rule that always applies to domain names: If you like it, go for it.

My domain name? gracemark.co.uk

Next web hosting for my website the best description I’ve heard is it’s like paying rent for a store front but online. 

I used 1&1 because I’d already bought my domain name with them and they had a good deal (I thought the price was per year but t’s actually per month so read the small print!)

Screen Shot 2016-01-26 at 14.39.16

So I’m already to get started designing and building :). Check out week 2 soon :).

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s