Website for a podcast
I built this for some friends, and really it’s a proof-of-concept that jamstack sites can be put together extremely quickly and cheaply.
The Hit For Six landing page.
How’s it built?
- Gatsby is the frontend framework (Gatsby/Image is a dream)
- Netlify CMS makes editing wonderfully straightforward
- Bulma CSS, while not cutting edge, saved a lot of time (and it doesn’t ship that much CSS with PurgeCSS)
Why I used Spotify player embeds
A podcast site needs a podcast player, but all the embeddable <iframe>
players are bad for performance.
The obvious choice for performance was to pull episodes from the podcast feed and roll our own HTML5 audio player. …but, the idea is to get people in a podcast app and subscribed, so while a cool decentralised player would make me happy, it’s not the goal here.
So maybe a player embed is the way to go? Why Spotify?
- it’s platform-agnostic
- for Spotify users, the audio plays in app
- for everyone else, it still works
- there’s a subscribe button
And performance? On page load, the browser loads a static mock-up of the player using the srcdoc
attribute. When the user presses play, the real embed is loaded and starts to run.