Day48: Redesigning my website

Posted by csiu on April 13, 2017 | with: 100daysofcode, Setup

I spent most of today updating my personal website and figuring out how to replace the header with yesterday’s D3 stars.

New version

In the new version, I cut out a lot of unnecessary scrolling and compacted the information to 1 page. The portfolio grid, experience and CV sections are lost, but I’m okay with that – this information is on linkedin.

Previous version

In the previous version, there was a lot going on. Too much for my liking. I found that the look and feel of the “portfolio” section did not fit in with the rest of the website and the “experience” section focused too much on the past and not enough on the future.

Replacing my headers

Replacing the headers really depends on how the HTML, CSS, and Javascript are specified. Generally, you need to create a HTML div id="stars" anchor and then use Javascript to select for and include the D3 stars with d3.select("#stars").append("svg:svg") (see: 3d5e351). After that, you can replace the CSS styling to make everything look nice (see: fad17c7).