I Love You <\3


What is SpearsGoode?

Easy, It's my website. Okay not so easy... Its where I keep things I've created and practice HTML and CSS. As I continue to add to this website, I hope to leave behind some kind of idea of how it was all put together for anyone looking to code their own website from scratch or improve one they've already coded.

Check out the about page to learn more about what you can find on my site, and the Site Archive to see how far we've come.

Learn More

New Artwork

New Blog Post

Version 2


Version 2.00

Version 2.00 was built from scratch looking at version 1.11. I wanted everything to work together correctly, and I had changed a lot of stuff around in version 1.11 so I did this to avoid any issues that could arise from my sub-par coding in version 1.11. In version 2.00 I added content to every page and removed the photography page so I could focus on more important parts of my website.

One such thing that I focused on was the art card layout on the artwork page. I made them look much nicer by nesting a flexbox within the grid items on the main grid instead of trying to use a grid nested within a grid nested within a grid. I also added the downloadable site archive and my first blog post to the programming and blog pages. I also added on-screen navigation to my home and artwork pages because they were beginning to get quite long.

Version 2.22

In version 2.22 I set out to make my site look better. I did this by designing a new logo and using the colors in my new logo as the colors for my site. I also went through my code and added padding and margins to a lot of the content to add more white space. I finished the Home page layout and made the art card layout that you can see on the artwork page now. Once everything looked nice, I resumed adding content to my site. I added a new blog post, an about me, and an interactive site archive. I also started learning JavaScript and created the testing area on the programming page.


Building your site again from scratch doesn't take as long as you would think, and can really help you understand how everything works a little bit better. If you want your colors to look good together, put them all in an image so you can see how they work together. If they all work together in close proximity, then you're set. Also, I would recommend adding padding and margin to everything as you go instead of going back and doing it after the site has already been put together. I will be taking this to heart when I design version 3 which will be started after I feel a little more comfortable with JavaScript. If you want me to go more in depth on anything please send me an email at [email protected]

Site Archive

Website Plan

  • add contact form
  • implement more artwork into design of website
  • Make icons for pages
  • add hidden things in website for people to probably never find or even look for
  • clean up code
  • JavaScript
  • add donation link
  • add templates
  • add github compatability
  • Make 404/page not found pages
  • Add social media integration
  • Add sections to Blog page
  • custom urls
  • compress images
  • better font
  • make text smaller
  • make better art cards like example
©: SpearsGoode