by Liz Lorena

My First Portfolio

Published 1 June 2017 in HTML Website


My first portfolio was a one-page design made with HTML, CSS, Bootstrap, and Javascript.

I think this is the earliest screenshot I have from my early attempts at making a website with a proper design from scratch. I tried to go with a minimalist modern design with lots of white space again, but I wasn't happy with the loose and sloppy way the pages behaved. In retrospect, the index page does look pretty cool, and if I only still had the source code I would share it with you over on my Github. In fact, I may try to remake it sometime. I do recall that I used bootstrap to center the elements on the page and make the buttons, so this places this design somewhere in mid to late 2017.

Version 2.2.0 - Late 2017

Visit SiteSource Code

My first stable portfolio site was made thanks to the work of Tania Rascia, a web developer who makes extremely useful tutorials for web development and design. This particular theme was made available by her for free on Github here. She has a Patreon, so you can support her there!

This theme is a trendy one page theme that looks fabulous on mobile with its sliding menu. Because at this point I was learning about the importance of responsiveness in modern web design, I took apart and reassembled this code with some modifications to learn further. Its simplicity makes it best for a resume-style personal website.

With this theme I got to experiment with a little bit of Javascript and jQuery, making my project descriptions toggle on and off. I actually started making tons of progress GIFs at this point with ScreenToGif, and it's thanks to that that I'm able to recover bits of my progress to make this blog!

Here's a screenshot of the whole site using the FireShot FireFox extension: