|
Size: 314
Comment:
|
← Revision 32 as of 2018-02-10 23:19:48 ⇥
Size: 3386
Comment:
|
| Deletions are marked like this. | Additions are marked like this. |
| Line 1: | Line 1: |
| Describe BlogWebDesigns here. | == Components/aspects of pages == |
| Line 3: | Line 3: |
| == Components/aspects of pages == | [[https://finnwea.com/blog/stealing-passwords-from-mcdonalds-users|Stealing passwords from McDonald's users - Tijme Gommers]]: transparent nav bar in header [[https://blog.freelancersunion.org/2017/01/11/convincer-phrases/|How "Key Convincer Phrases" can land you the gig every time]] 'V' in header, done w/ SVG [[https://stratechery.com/|Stratechery by Ben Thompson – On the business, strategy, and impact of technology.]] Great overall design, love the footnote widget (..., click to see note). |
| Line 8: | Line 12: |
https://0x65.net/ and https://0x65.net/j/. beautiful shadows behind headings, reminds me of oldblog.samat.org design. `text-shadow: 0 0 1px #667` [[https://www.tildedave.com/posts.html]]. Great heading https://www.slightfuture.com/error-page-404-preview. Error 404 page. has search, and links to most recent posts. Uses Nikola; per-post header images. http://syntheti.cc/van-build/. Box around photos. {{{#!highlight css numbers=off padding: 20px; background-color: white; box-shadow: 0px 3px 16px -2px rgba(0, 0, 0, 0.4); margin: 0.5em auto; }}} http://nobi.com/ Great, transparent header. {{{#!highlight css numbers=off header { background: #333; background: 00000080; } a { color: white; text-shadow: 0 2px 0 black; } }}} [[https://www.mailpile.is/blog/|Mailpile blog]]: line height, extra-large headings == Full designs == https://kjellski.github.io/. Dark colors, monospaced, beautiful blues and greens. [[http://equimper.github.io/|Emanuel Quimper]]. Dark colors, monospaced. [[http://tiago.acaia.ca/|❤ | ❤]]. Monospaced theme, Nikola-based. [[https://rsms.me/|Rasmus Andersson]]: Light-colored monospaced theme http://blog.jacobtorrey.com/rowhammer-defensive-programming http://williampross.com/tech-companies-trend-backing-losing-candidate/ Header with animated title text. Header (and homepage) with background graphic, along with animations on scroll. [[https://blog.aurel32.net/|Aurélien Jarno]]: Nice black, grey, and white look. Rounded boxes. http://www.ybrikman.com/writing/2014/04/09/six-programming-paradigms-that-will/: Navbar, header, etc. [[https://blog.haschek.at/2016/my-door-sends-me-chat-messages.html]] : Header, body, etc. https://www.tnhh.net/: Entire design, love the white & black minimal look. == Landing pages == https://abrah.am/ - Uses Twitter cards, OpenGraph, looks good. Uses JS to load higher-resolution background image. FontAwesome for social network links, etc. http://jefftannenbaum.com/. Love the fading in from black into the background image; great detail. http://jose.io/ == Themes == [[http://blog.base68.com/|The Base]]. Medium-like theme called [[https://github.com/dirkfabisch/mediator|Mediator]] [[https://mademistakes.com/work/minimal-mistakes-jekyll-theme/|Minimal Mistakes, a Jekyll Theme × Made Mistakes]]. Used by https://blog.kylemanna.com/ [[https://mmistakes.github.io/so-simple-theme/|So Simple Theme]] [[https://wordpress.com/themes/intergalactic/|Wordpress Intergalatic theme]]. Variant used on [[https://levels.io|levels.io]] |
Components/aspects of pages
Stealing passwords from McDonald's users - Tijme Gommers: transparent nav bar in header
How "Key Convincer Phrases" can land you the gig every time 'V' in header, done w/ SVG
Stratechery by Ben Thompson – On the business, strategy, and impact of technology. Great overall design, love the footnote widget (..., click to see note).
AMP and Incentives - TimKadlec.com. Like the header. Like the date overlaid a line in the heading.
https://tridnguyen.com/. Great header. Navigation on left, photo and tagline on right.
https://0x65.net/ and https://0x65.net/j/. beautiful shadows behind headings, reminds me of oldblog.samat.org design. text-shadow: 0 0 1px #667
https://www.tildedave.com/posts.html. Great heading
https://www.slightfuture.com/error-page-404-preview. Error 404 page. has search, and links to most recent posts. Uses Nikola; per-post header images.
http://syntheti.cc/van-build/. Box around photos.
padding: 20px;
background-color: white;
box-shadow: 0px 3px 16px -2px rgba(0, 0, 0, 0.4);
margin: 0.5em auto;
http://nobi.com/ Great, transparent header.
header {
background: #333;
background: 00000080;
}
a { color: white; text-shadow: 0 2px 0 black; }
Mailpile blog: line height, extra-large headings
Full designs
https://kjellski.github.io/. Dark colors, monospaced, beautiful blues and greens.
Emanuel Quimper. Dark colors, monospaced.
❤. Monospaced theme, Nikola-based.
Rasmus Andersson: Light-colored monospaced theme
http://blog.jacobtorrey.com/rowhammer-defensive-programming
http://williampross.com/tech-companies-trend-backing-losing-candidate/ Header with animated title text. Header (and homepage) with background graphic, along with animations on scroll.
Aurélien Jarno: Nice black, grey, and white look. Rounded boxes.
http://www.ybrikman.com/writing/2014/04/09/six-programming-paradigms-that-will/: Navbar, header, etc.
https://blog.haschek.at/2016/my-door-sends-me-chat-messages.html : Header, body, etc.
https://www.tnhh.net/: Entire design, love the white & black minimal look.
Landing pages
https://abrah.am/ - Uses Twitter cards, OpenGraph, looks good. Uses JS to load higher-resolution background image. FontAwesome for social network links, etc.
http://jefftannenbaum.com/. Love the fading in from black into the background image; great detail.
Themes
The Base. Medium-like theme called Mediator
Minimal Mistakes, a Jekyll Theme × Made Mistakes. Used by https://blog.kylemanna.com/
Wordpress Intergalatic theme. Variant used on levels.io
