Mark Boulton is a designer who writes about typography and grid systems for the web.
Commenters recommend his five-step articles on grid design and typography as excellent resources that predate grid frameworks.
Fun! But a heavy emphasis on doing things by eye. Personally I prefer the results of following stricter rules extracted from print typesetting. A few examples:
- I recommend reading about [vertical rhythm](https://24ways.org/2006/compose-to-a-vertical-rhythm), which turns a lot of imprecise choice to exactly correct sizes.
- I've never heard of there being a rule for how much space goes above a paragraph (this is a funny thing about web typography, since in print you indent the paragraph so there's no additional space). But I guess I'd consider it correct from a vertical rhythm standpoint to either use the line height or half of it.
- Regarding vertical space between lines, what I've heard is you want to make the spacing between lines visually appear greater than the space between words. As far as I know this is just done by eye. (I.e., so the rule is to choose a leading that makes your space between lines appear larger than the space between words.)
- I think there are exact header sizes that are better than picking an arbitrary font size that seems to look big enough. The trick I use here is to take the [traditional point scale](https://markboulton.co.uk/journal/five-simple-steps-to-better-typography-part-4/) and convert it to a ratio relative to 12 point. This is a way to bake historically refined font ratios into your design.
- Personally, when choosing margins I'd use a [grid system](https://practicaltypography.com/grids.html), which will give you an exact gutter…
Mark Boulton's posts really are some of the best typography eye-openers. Especially his "Five Steps" posts[1][2] were what got me into design and made me "get" it. And it didn't take a lot of time to read through them. I recommend that people skip his book and read these two pieces instead.
Bear in mind that the grid guide is more of an intro piece; you probably won't be able to create grid-based websites after reading it (I know I wasn't).
Another good resource is Typography for Lawyers[3]. I'm actually very surprised (and disappointed!) that Paul didn't mention it. It's recently undergone a redesign, which has rendered all its former links broken, and it seems a little harder to navigate and browse for fun, but you must flip through the digital pages. It's probably the best typography resource for newcomers along with Boulton's 5-step guides.
I also just combed through my bookmarks to see if Boulton had anything else, and a great presentation popped up[4]. It, too, is great to get you into the typographic mindset.
These are really the best way to get someone into typography, and they are quick to read; no resounding THUMP from dumping seemingly insurmountable literature on your desk.
Of course, once you've got the bug, it'll never leave you, and a lot of the world will look a lot worse and be more painful for it. Educate yourself at your own risk.
[1]: http://www.markboulton.co.uk/journal/comments/five-simple-steps-to-better-typography
[2]:…
I try to keep my subscription to an absolute minimum since I like to leave some time for reading books. After a lot of culling, I'm currently subscribed to some popular feeds:
http://www.smashingmagazine.com/ (general web design / dev)
http://www.alistapart.com/ (long form web design / front-end)
http://dailyjs.com/ (Javascript / node.js)
http://createdigitalmusic.com/ (digital music / software)
http://www.creativeapplications.net/ (new-media art)
And a handful of unpopular ones:
http://www.ribbonfarm.com/ (absolutely my favorite blog in the world – self-describes as "refactored perception)
http://www.tempobook.com/blog/ (same author as above, posts related to his last book)
http://worrydream.com/feed.xml (not really a blog, but Bret Victor writes some of the best long-form articles on interaction design around – read all of them)
http://www2.technologyreview.com/rss/video_rss.aspx (Tech Review videos, sparsely updated – mainly because the editor's interviews are awesome/hilarious)
http://idlewords.com/ (breathtaking travel blog from the founder of Pinboard)
http://www.loper-os.org/ (awesome / hilarious posts by a software heretic on the general terrible state of things in technology – keeps me in touch with Alan Kay-esque thinking)
http://we-make-money-not-art.com/ (the only contemporary art blog I like from a very dedicated Italian writer)
http://vagueterrain.net/ (occasionally published digital art magazine, themed topics, guest…
This is more awesome than it first appears.
They are a SaaS "Create Once, Publish Everywhere" (COPE) provider. NPR popularized the term a few years back, and the use it in their production environment. I have one client actively using the same architecture in production, and they love it. They use a Django site as the backend, and node.js-powered websites to publish the content.
Some links on the topic:
http://blog.programmableweb.com/2009/10/13/cope-create-once-publish-everywhere/
http://www.linkedin.com/groups/Do-you-COPE-Create-Once-3912082.S.117059484
http://www.slideshare.net/KMcGrane/adapting-ourselves-to-adaptive-content-12133365
http://karenmcgrane.com/2012/09/04/adapting-ourselves-to-adaptive-content-video-slides-and-transcript-oh-my/
http://www.markboulton.co.uk/journal/adaptive_content_management
http://meetcontent.com/blog/structured-content-an-overview/
One of the uphill battles they face is the nomenclature. Most people couple their content creation tools with the publishing tools. I.e., we think of a CMS as both the editor and the content renderer. This sort of system decouples that.
I think they are smart starting with a PHP library: that seems to target a broad install base, and publishing in PHP using an API is much easier than building a solid CMS in PHP.
I couldn't agree with you more. I have been working on trying to get some skills therein. I paste the notes from my personal expertise board.
Graphic Design:
Relationship
Transition
Layering
Principles of Design:
Repetition
Opposition: Excitement and tension. Too much is bad.
Particularly thick and thin lines in logos.
Priority: The order of the items.
Position: Use a grid. Divide in twos and connect corners diagonally.
Attributes of Design:
Balance: Arrangements so that elements equal each other, not overpowering each other. Can balance objects with each other or whitespace with objects.
Emphasis and Contrast: too little is boring, too much irritating. Plain text with bold or underline in small quantities works.
Rhythm: regular movemet, reduce line spacing or tighten words to increase speed. You can increase the line height, but too much and the eye has trouble finding the next point. The rhythm should fade out, and not end abrubtly.
Position:
Grid Choices
http://www.troytempleman.com/2010/04/30/grids-in-graphic-design/
Rule of Thirds
Golden Ratio
Columns
Baseline Grid
http://www.markboulton.co.uk/journal/five-simple-steps-to-designing-grid-systems-part-1
Start with a symmetric plus, and then use 1.414 ratios to create smaller sections with margins.
> I wonder if we need a middle-class of open source contributor [...] I wish somebody would do the time-consuming and boring-but-valuable work of polishing these contributions into something merge-worthy...
We need a valuing of non-coding contributions, and a way of welcoming them into projects.
I like building community and dealing with people. I like project management, planning, and thinking about funding opportunities. I even like (but am not good at) writing documentaiton - but only if the author of the code is willing to explain _why_ they wrote the code this way rather than get me to write how it works.
I haven't come across a project that is open to welcoming people who bring these skills. People do these things have got to that place through long-term involvement, or because the role fell to them. Or no one does it.
A decade ago there was a drive to get designers and UX people involved in open source projects [0]. It came to little, to the detriment of the entire open source community. Writing code isn't the only skill important in a project, and if we embrace that the whole experience of using the framework, library or software improves.
0. https://markboulton.co.uk/journal/design-in-open-source/