Ben Samara

Game Designer
Art and Programming Generalist

Blog

Website (Update #1)

(November 11th, 2021)

I went off my schedule for about 2 weeks and have been working on finishing my website instead. I felt like it was reasonable to delay my regular routine a bit to get my site up and ready to present.

I was primarily just trying to recreate the portfolio site I made during my Associate’s Degree. This site was originally made using the GUI website builder, Wix (https://www.wix.com/). I think this is a reasonable tool, especially to present to a generalized group of game design students who aren’t necessarily all interested in learning much programming (though I do personally think all game design students benefit greatly from learning programming - how else would a designer or artist know what is practically feasible to implement in a video game - but that is a separate topic). However, Wix forces you to use their given domain name (‘username’.wixsite.com), as well as having a banner advertising Wix across the top, or pay them a monthly subscription to upgrade your account and allow you to use your own domain with their service. So, I had three main reasons to build my own site, rather than continuing to use my Wix set:

1. The domain name/banner was unprofessional, and to change it to my own domain, I’d have to pay more than I would like. I had already done some HTML in high school and knew it’d be worth it to set it up on my own rather than pay for the service
2. I wanted to have more experience with Web Design/HTML/CSS and to be able to advertise that skill on my portfolio
3. I would have more direct control over my website, rather than using the preset paradigms given by Wix

I purchased a domain quite some time ago. I then spent some time looking into hosting. I fiddled with Apache for a bit, using an IP provided by my ISP, but after troubleshooting with Apache for awhile, I ended up just using GitHub Pages to host my website. This ended up working pretty well for me as I had already started to use GitHub to backup my projects anyway.

I then started to recreate my website using HTML and CSS. I haven’t used any JavaScript here, yet, managing to get all I wanted done just with CSS. There are some points where I’d like to try implementing some JS in the future, perhaps for showing images in a slide-show format.

I learned a lot throughout this process and really enjoyed it. Each page basically had a new challenge for me. The major ones were, using iframes to embed pdfs/video so that they are readable on most browsers, centering div containers and making columned image sets, and the bloghome page was a good design challenge as well. A major point was, optimizing for mobile. I thought I may have to use JS to detect what device is being used, but I ended up using the @media{} tag. This effectively works like an if-statement, detecting what sort of media the page is being displayed on and running the CSS within the braces. So, I checked if it was displayed on a screen with a viewport width of under 1000px and if it was in portrait mode and, if so, the CSS would be changed to accommodate, generally increasing the size of elements so they could be more visible. If a mobile device is held landscape though, it just loads the default CSS.

This has been a very productive, fun, and informative project. Thanks for reading about it.

PORTFOLIO BLOG ABOUT
Website made by Ben Samara