Sketch and build a blog
Process
- Browse some single-column Tumblr themes
- Sketch a blog design, using the themes for inspiration
- Wireframe the page, using all elements below
- Get wireframes approved
- Build it
Requirements
- Mobile-first
- Single-column
- Offset element, using absolute positioning
- Webfont
- Sass + Compass
- Sprites
- Multiple pages (homepage + about + anything else you want)
- Jekyll (download new scaffold and then run
jekyll serve --watch)
Blog site pattern
Chrome (i.e. header & footer)
- Title
- Author
- Author bio
- Links to About pages, other pages
- River of posts
- Footer
The post
- Headline
- Body / excerpt (see below)
- Datestamp
- Tags
- # of comments / link to comment
- Share buttons
Blog post types
- Headline + text + inline images (optional)
- Big image + caption
- Quote
- Video