This site needs to showcase who I am, what I do and who I do it for. Allowing me to connect with kindred spirits. There's only one metric I care about that tells me it's doing that. The rest is noise. I don't want increased dwell time. I don't care about bounce rates. I just need it to give a good enough reason to sign up to https://rewild.digital/daily-list.

So this is how I decided to make this site...

Nothing exists in a vacuum. There's always a bunch of external factors that put pressure on how we create. I obviously want this site to be discoverable. On the flip side I don't want to dance with the devil of keeping up with policy and legal requirements. Opting instead to avoid coming into scope of that stuff where possible. Ethics and the social considerations that come with lobbing more digital content into the void is a continuing dialogue that I want to learn from and set an example for others to build upon. Perhaps most importantly the resource cost and impact on the nature I serve is where I draw the hard line when it comes to tech selection and my practices up and down the supply chain. There are no shortcuts. My considerations must cover the full gamut of design, development, deployment and how I plan to sustain it. I want this website to walk the talk.

So I came up with 3 project principles to guide my hand in wrapping up those external constraints together with what I functionally needed to keep me on the straight and narrow and get this thing done well.

1. Tech must serve me and not the other way around. It must be easy to maintain. If I can minimise how long it takes me to go from idea-to-code-to-deployment then the better. It's good for resource control, keeps me focused on what's important and is good for my sanity.

2. Change or add anything in a matter of hours not days. Owning the compute is massive. Universal computation is perhaps one of the biggest exceptional abilities that we've created in this digital age. This sliced off corner of the net should allow me to create, tinker and express myself without restriction from any organisation.

3. Respect people and planet. For people this means respecting their time and their experience. Some people may say this is accessibility. It's more than that. It's about mindfully catering to difference and ensuring everyone feels welcome and valued. For planet this means being as thrifty and lean with my use of resources as much as possible where possible. It matters what technology I choose to use.

And these were some of the key decisions I made to meet these principles.

Hosting & DNS

I host my own servers on a Virtual Private Cloud (VPC) with a hosting provider who understands the holistic inter-connectedness of environment, sovereignty and privacy concerns. They've been running on renewable energy before it was cool to publish a white paper about it. They do things differently, give me some space and then get out of my way. Perfect for someone like me. I popped a base Linux OS that is extremely light and hardened on it, which I use to run docker containers that I can easily spin up and tear down as required. If you curl this website you can see that I chose to use Caddy - https://caddyserver.com/ - as my web server. This satisfies my low maintenance need (a couple of lines to handle a redirect for example) its defaults are highly secure, it can change to be whatever I want it to be (static server, reverse proxy, firewall etc), it handles https renewal automatically and has no dependencies.

CI/CD

As I'm sure you're getting I'm a big fan of being able to lift the hood at any level of the stack. That applies to Continuous Integration/Continuous Deployment (CI/CD) too. The way these things work is to have a function, server-less or not (marketing nonsense alert), that listens for any commits to my repository. It picks up a change, such as a new commit, that matches the metadata parameters, triggering it to pull code, test it, build it and deploy it. I looked at hosting Woodpecker CI - https://woodpecker-ci.org/ - to do this for me. In the end I opted to go with a simple bash script that runs on commits to my main. It's not fancy and it's not clever but it cuts out the need to spin up multiple docker containers for my pipeline every time I need to update a couple of markdown files once in a while.

VCS

I use Codeberg - https://codeberg.org/- for my Version Control System (VCS). That lot know the importance of libre software and providing an alternative to more commercially motivated platforms. Other libre VCS's exist, I just really like how they communicate and what they represent.

Analytics

I initially used a 'simple' or 'privacy' centric version of analytics, which was Umami - https://umami.is/. What that project is doing is great ( other analytics solutions like this exist ) but after running it for a few weeks in one of those docker containers I mentioned, my evaluation was that I just didn't need that data, it was over the top. And so I tore it down.

Cookies

As a result there are absolutely no cookies baked or dropped onto your client devices. Cookies can be used for things like analytics but also as persistent storage methods for scripts that I may need to run on the client-side. But I don't need to run scripts with persistent storage needs. I don't need to display self-serving cookie notices that beg for different levels of cookie usage and so omitting these entirely keeps me well away from this disrespecting stuff.

Libraries & Frameworks

I always advocate for minimising or removing any external tech dependencies where possible to keep things easy to maintain but in this case I decided to adopt the following as better trade-offs to meet my principles.

I use Eleventy - https://www.11ty.dev/ - as my static site generator. It does just enough out of the box for what I need and no more. It's extensible and can accommodate any changes I'm likely to need in the future with some nice plain old Javascript support should I choose to reach for it (I don't use it right now). Plus I like its file format agnosticism that gives me flexibility to use Markdown, Nunjucks, whatever templating language I want really. In short it's small, light and stable.

Tailwind - https://tailwindcss.com/ - is admittedly a nice to have CSS library. I don't need it, it's just convenient and is a candidate for removal but for now it can stay as it's also small and light.

I could do without all of these and handcraft the site that you're reading this on with HTML and CSS only but I allowed myself some small tools for convenience on the basis that it will reduce my screen time (and therefore development resources)!

Structure & Style

I'm not a great fan of single page websites. I think they deliver a 'splat' of information that is then left to the visitor to hopefully navigate. The information architecture I'm going for is to enable people to get in, get out and carry on with their day as quick as possible. On top of that there is a technical consideration that I want a site to be flexible to any new proposition, information or experiment. In short I crave encapsulation. So I put in place a routing system that supports pages and pagination galore. If I need a new page, like this one, it's a case of bolting it on rather than shifting things about. Great.

I have one layout. It's mobile-only. That way I know that all devices can functionally display it and I can keep things simple by styling once and avoid any annoying surprises. Yes, this constrains me, but by limiting my decisions on layout it forces me to focus on the message more than how pretty it is.

By now you've figured out I'm not a visually-focused designer, I'm biased to function over form. I know font choice matters to a lot of you out there. Beware the font rabbit hole! So in a bid to stay light, avoid font conversion, ensure accessibility, legibility and therefore respect the visitor's choice as to how they wish to experience the content, I decided to only use system fonts.

Content

For raster images, like photos, I crop one copy to the maximum possible resolution required, which is small. I don't need multiple copies to serve to all the ranges of devices out there. The mobile-only layout approach helps me with getting away with that here. This then gets dithered locally with a custom script I wrote then converted to webp format. Otherwise I use svg as much as possible. These images are set to cache and lazy-load upon request to keep repeat transfers to a minimum. Lastly I don't need to run and host a CMS. I like to write in markdown and push changes when I need to. I don't have to keep on top of CMS updates, worry about hosting requirements or strap in for a weekend of hot swapping the inevitable CMS replacement down the road. My assets live alongside the code.

Data

So the only data I ever ask of a visitor is an email address when they sign up to https://rewild.digital/daily-list/. That email address is not shared with anyone else, ever. I utilise a privacy focused newsletter service that I self-host. It gives anyone signing up the option to manage their own data including export and delete ability at anytime they choose. This has and always will remain the decision of the person subscribing, I cannot and do not want to interfere with that. Of course I don't apply any tracking to the emails I send and write everything in plain text.

Accessibility / A11y

First and foremost there is always more to do here. This is an ongoing concern and not a checklist item. WCAG standards have been followed - https://www.w3.org/WAI/standards-guidelines/wcag/. Some particular standouts have been noted below for brevity.

There is a passive dark mode which means if your system is setup to run in dark mode then this site will respect your decision and render a dark mode version of this site. I know it isn't for everyone which is why it doesn't default. Perhaps I will add a button to toggle this on-demand for ultimate control but so far I haven't received any feedback for this so it goes in the You-Aint-Gonna-Need-It (YAGNI) pile.

Colour choices are limited, specific and have been selected with the help of accessibility checkers and tools (WAVE is a good place to start if you want to know more about this - https://wave.webaim.org/).

Semantic HTML because it hits all the principles. Its easier to parse and read by eye and by screen readers. It's frankly where the HTML specification is going anyway and it keeps things easier to maintain when I'm up to my elbows in guts of code. Where semantic HTML can't be used then we have aliases and tags as standard.

Certificates & Badges

You may notice I don't include these. These are included by other sites to give some form of independent confirmation that what you say and do is verified to some degree. Never shall I say never but right now the benefit of their inclusion does not outweigh simply stating what you have and haven't done like I do in this post! Ironically I tested a number of 'green' badges and site measurement certification schemes only to find that the weight of their script inclusion was exceeding my site size budget. If you want to check out my site credentials then, instead of me requesting this on behalf of every visitor via a script that fires on your device for every page render, I'd encourage you to go grab this on-demand yourself by visiting here - https://digitalbeacon.co/report/rewild-digital.

So after all that in the end I have a site that I can measure in kilobytes not megabytes. It's fast and (I hope) easy to get at what you need. This is a lean and mean site that I fully intend to keep that way.

So what's next?

Developing digital tech is akin to tending a garden. You cannot set and forget. So there's a growing list of ideas and ways I can improve upon this that I aim to share in due course.

This has given you a small taste of how my mind works. Contact me at chris@rewild.digital if you have any questions or want further detail on any of the above.