Dave Stewart
2021 refresh of davestewart.co.uk
Overview
Content-driven, static Vue site, with an emphasis on simplicity, discovery and interaction.
The site aims to balance putting newer product and project work front and center, whilst making older work easy to find, browse and appreciate.
Creatively, the look is simple, modern and fresh. Technically, it boasts snappy interaction and a more app-like feel than a traditional site.
Detail
The site’s engine is VuePress (opens new window), rendering nested project folders of markdown and images, and hosted on Vercel.
It runs a fully custom theme, with feature highlights including:
- Content: optional folder indexes with tree, list and thumbnail views
- Search: text, tag and date filtering with date and tree views
- Media: gallery, image, video, and website embeds
- Gallery: intuitive mouse & keyboard navigation with full-screen presentation mode
- Navigation: breadcrumb and sibling links with additional keyboard shortcuts
In 2021 I found more time to work on the site and added:
- Navigation: desktop + mobile, header + footer navigation
- Reactions / comments: courtesy of Hyvor Talk (opens new window)
- Sharing: links to share to key social platforms
Additionally, new content:
- Home page: new home page with better formatting and work preview
- Blog: an expanded blog with thumbnail navigation and new posts
- Bio: a more informative bio with photo and links
The site’s code can be found on GitHub.
Keyboard shortcuts
The site also has some handy keyboard shortcuts.
Projects:
Left
/Right
- cycle through visible gallery postsShift
+Left
/Right
- navigate to sibling postsShift
+Up
- go up one folder level
Search:
Esc
- toggle searchDown
/Up
- walk folder tree