James Murphy
RE: Write
Published in
4 min readMar 16, 2018

--

Making a Portfolio Site

As I dive further into the creative industry, the need for a good portfolio site is becomming everymore pressing. Currently, I have two sites up, my making blog and my portfolio site. Both were made in the same way and neither are up to par. This presents me the opportunity to create something new that I am proud of. The questions become, what does it look like and how do I build it. The latter is what I want to talk about here. There are four main options available to me, CMS tools like Square Space or Wix, status site builders like Jekyll, tools like Bootstrap and coding the site from scratch.

CMS Tools

CMS stands for content mangagement system and is software that manages content for a webpage. CMS tools like Square Space make it very easy to create a website by providing visual buiders instead of coding. The advantages of this is that it lets anyone build a site regardless of skill in coding. The sites are very visually appealing as all of the elements and templates are pre-designed. The disadvantage isthe cost. Square Space is over $100/year for the cheapest hosting package. It is more if you buy your domain from them. When you campare this to the $20/year for domain and hosting from namecheap.com the difference is significant. That difference is paying for the convience of not having to know any hosting. Additionally, the sites are limited to what the CMS has built into it.

Statis Site Generators

The only static site generator I have used is Jekyll. I used a Jekyll template for both my making blog and my portfolio site. Once Jekyll is installed the only coding you need to know is Markdown which is extremely easy to learn. The entire tutorial on Lynda.com is just barely over an hour. Jekyll takes these files and turns them into and html file that can be read by the browser. To make a site look designed, I downloaded a jekyll tempalte from jekyllthemes.org. I filled in the blanks and filler text with your my own information and then wrote all my posts in Markdown. When I run Jekyll the data in the template is turned into html and css and is ready to deploy to my domain. The advantage of static site generators like Jekyll is they require very little knowledge of coding and a pretty nice site is created. Also, if you do know some code, you can get into the files that Jekyll spits out and even futher customize the webpage. The disadvantage lies in installing Jekyll, this requires some knowledge of terminal. For more information on how to install and use Jekyll check out this making post. Additionally, the sites are, as one might expect, static meaning they have no interactivity.

Bootstrap Template

Bootstrap is an open source toolkit for developing with HTML, CSS, and JS. The most common way to use Bootstrap is to install bootstrap then download one of their templates. The templates have pre-written html, css and javascript files in them. All I need to do is crawl through the code and make it my own. There are quite a few advantages of buiding a site with Bootstrap. First, it is a great way to learn html, css and javascript as it requires reading the code to change it. Second, it allows for a decent degree of customization without the user knowing a ton about coding. Finally, there are a wide array of templates to choose from and unlike Jekyll, they are not all static. The disadvantage is the learning curve required. If one does not know any html, css or js they are going to be very lost.

Code from Scratch

Coding a site from scratch is something that is very intriguing to me and may be something I do for myself in the future. As one would expect, coding a site from scratch requries moderate to advanced knowledge of html, css and js. I am still at the beginning stages of all three. However, coding a site from scratch allows for maximum customization, is the most impressive to others, and provides the opprotunity to be completley unique and not template based. With my current level of coding knowledge I would be able to create a simple one page site with limited interactivity and I do plan on doing that as a learning experience and something to build on moving forward.

Conclusion

Based on my current skillset and the level of site I want to have, Bootstrap is the way to go for me. I downloaded a template that I like that has infinite scrolling and have begun to go through the html. The next and maybe the more difficult step for me is thinking about how I want it to look.

--

--

James Murphy
RE: Write

From Flint, MI where I was a marketing project manager for Kettering University. Came to Boulder for grad school and adventure. Passions: Pets, Tech, Nature.