Over the past few months I’ve looked at a look of themes. This has inspired me to try and produce a ‘premium’ theme of my own and I’ve started on what I consider to be the most important part: typography.
The basics of typography are clear: font-family, font-size, color, margins, baseline rhythm, etc. But there is more to it than that. To that end I have a few questions about your experiences with themes.
Firstly I want to know what areas of typography have you found lacking in the themes you have used? One area I have always wanted to see, and so will build in to mine is the option to style introductory paragraphs separately (paragraphs with the class ‘introduction’ that kick of a post).
Second, do you prefer control (i.e. sheer number of changeable variables) or automation (you enter a few values and the rest is calculated for you)?
Finally, are there any standard blocks of HTML that need styling? I don’t mean simply paragraphs, I mean html with specific classes. For example:
[html]
What I really want to do with this theme is to move the art of theme options one step on from where it is now. This is not an easy task, but I think it is possible with your help.
(__)
`
PS: You will probably be reviewing a plugin of mine in the next month and a bit. When you do, don’t go looking at the CSS for the admin panel! … I don’t always practice what I preach :P
(__)
`
Yes is, in fact it is a problem in most of them. Firefox, Opera and IE8 (I think) all have the ability to use text-resizing instead of the default zoom functionality, it’s just not as easy to access as in previous versions.
Google Chrome uses text resizing only and does not have any zoom functionality at all.
Having said that, all of those browsers incorrectly resize text in px’s whereas they should leave them at their set pixel height as recommended in the W3C specs, but they’ve chosen not to.
However using px’s is generally just sloppy coding IMO. EM’s are there for a reason and should be used accordingly, particularly if some future browser decides to resize the text the way they’re supposed to.
(__)
`
That’s an interesting point. In fact I have made the conscious decision not to use EMs in my theme. I used to use them for everything but I don’t think font resizing is an issue in any modern browser.
(__)
`
The worst thing about most themes is that they don’t use EMs for heights. Font sizes should always be measured in EMs and definitely not PXs.
(__)
`
I think that trying to determine what classes people might use in the body of their posts would prove to be somewhere between daunting and impossible.
Depending on the structure of your post, you may not even need to define a special class for your introductory paragraph. (The more semantic the markup and CSS, the better.)
For instance, if your post has its title as an H2 (or H3), that is immediately followed by your introductory paragraph P, then your CSS declaration can use the “H2 + P” (or “H3 + P”) selector to style just the first paragraph following your post’s title.
(Note that you’ll probably need to increase the specificity of the declaration, such as:
#page #center #post H3 + P
Or, if your post is split into div.post-title, div.post-body, and div.post-footer, you could use:
#page #center #post-body > P
to style the first P that is a descendant of your div.post-body.
(Of course, I don’t think those selectors are backwards-compatible with IE6 (why can’t it rest in peace already?).)