cruzgodar.com is hosted on GitHub Pages, which is a great way to host static websites for free. I wrote the code from scratch rather than use a site like Wordpress, which does little more than charge a steep price just to take away control. My goal was to create a site that used modern web technologies to their fullest extent while still being clean, fast and lightweight; to that end, it doesn’t use templates like Bootstrap, and it’s written in plain and simple HTML, not some abstract language that compiles to it. The only required libraries are AOS, Smooth Scroll, Workbox, and Modernizr — all simple and small — and notably, not jQuery.
I made sure to design the site with privacy in mind. There are no cookies of any kind, and everything runs entirely locally (except Disqus, but that can be disabled completely). There’s no data being mined and no ads tracking you.
Creating a website from the ground up like this is a good way to learn about programming and graphic design, and it’s also just a satisfying hobby. If you’re interested in the code, the repo is here, and a complete documentation of how everything works is here. Consider crediting me if you use something large like an entire page layout in your own project.
One final note: this site is built only for the latest versions of popular browsers because backwards compatibility is more trouble than it’s worth. If something isn’t working, first make sure your browser is updated, then file an issue here.
Show minor versions
Back to Square One
Added a floating button at the top of the viewport to scroll back to the top of any page.
Implemented a slew of speed-increasing features, including preloading the banners on every banner page linked to by the current page, and added a few applets.
Hard at Work
Added an about page (this one!), created a complete documentation of how the site functions, updated the site logo, externalized CSS and JS from fancy pages, and automated AOS.
Floating Above it All
Added a “floating” footer that can be accessed from anywhere by hovering or tapping near the bottom of the page.
The Gradient Operator
Added a gradient to non-parallax banners and recreated every banner from its original source image to drastically improve quality.
Added an ultrawide layout for screens that are very wide or very large, rewrote the image links CSS to use grid, and improved banner performance.
Message Without a Bottle
Removed all bottlenecks from loading banner pages, making it only dependent on the banner itself. Also added a teaching page, removed the research one for the time being, and gave Corona’s a facelift.
Overhauled the settings system to take full advantage of the website being a single page app.
Added the short story Desolation Point, a true black theme, and a Mandelbrot set explorer.
Vanilla Ice Cream
Removed the dependency on jQuery, making the site faster and cleaner.
One Page is Enough
Became a single page app, improving speed, reducing requests, and making cross-page scripting much much easier.
Took major strides to improve site accessibility and intuitiveness and added a comments setting.
Became a Progressive Web App, allowing users to install the site like a native app on their device.
Image System Overhaul
Fundamentally changed how images work, adding support for WebP and including a portrait version of every banner to save space when possible.
Added a Julia set explorer applet, the applets page itself, a contrast setting, and a smoother transition when the back button is used.
Settings Expansion Set
Added three settings — one to disable AOS, another to disable the link transition, and a third to make banners act like normal images — and added stage bubbles on the Corona page to show large-scale progress.
Added a fade transition when navigating between pages and a section on the homepage for the newest subpages.
Settings Set Up
Added a settings system so that the site’s appearance can easily be customized.
Changed first-level pages’ icons from being their latest subpage’s icon to being a clean glyph on a pastel background.
Light on its Feet
Simplified footers by making a function to insert them dynamically and improved cross-browser support.
Another First Impression
Completely redesigned the home page banner and improved the banner system in general.
Added a dark theme and gave the bio page a banner.
Better Banners, Inc.
Changed the banner animation to use a fading form of parallax.
Added the short story Mist and more blog posts.
Suddenly, a Blog
Added a blog and navigation buttons along with it.
(Very) Humble Beginnings
Where this damn time sink started.