Skip to content

swatson555/swatson555.github.io

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

67 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

swatson555.github.io

This repository contains the source content and design documentation for my blog. The static HTML is generated by the swatson555-blog-compiler, a static site generator built with Haskell and Hakyll.

Design Goals

Accessibility and function were the primary criteria for the design of this site. The hierarchy of information was created using the following considerations:

  • Content Priority: Primary content is always center framed. Simple and primary information always lay "above" secondary information.
  • Aesthetics: Elements were chosen for high contrasting colors, primitive shapes, and clear metaphors (like a list or a piece of paper).
  • Skimmability: Images were included only in the landing page to add personality at the outset, but are not included in the articles so that the content remains in focus.

Principal Color Palette

This palette was chosen to support the design goals, especially the requirement for high-contrast colors.

color palette

Usage

Please refer to the static site generator for other details.

Prerequisites

Build & Run

# 1. Obtain a copy of the compiler
git clone https://github.com/swatson555/swatson555-blog-compiler.git && cd swatson555-blog-compiler

# 2. Build the compiler binary in the compiler's source directory (downloads GHC/Dependencies)
stack build

# 3. Compile content and start local server (auto-reloads)
stack exec blog watch
# -> [http://127.0.0.1:8000](http://127.0.0.1:8000)

Project Structure

  • css/: Styling (CSS for presentation).
  • posts/: Source content (Markdown files compiled into HTML).
  • index.html: Site index.

The compiled project can be inspected on localhost without the compiler using a local server.

python3 -m http.server 9000