Comments on: Format Your Posts For Readability http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/ Better Looking Blogs Grow Faster Thu, 11 Mar 2010 20:03:15 +0000 http://wordpress.org/?v=2.9.2 hourly 1 By: Uzairhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-1023 Uzair Sun, 16 Sep 2007 06:57:26 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-1023 It really helped me. It really helped me.

]]> By: Michael Martinhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-547 Michael Martin Mon, 03 Sep 2007 13:19:44 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-547 Just right. In particular, most people won't know about the ":first-letter" pseudo-class, which is very handy. :) Just right. In particular, most people won’t know about the “:first-letter” pseudo-class, which is very handy. :)

]]> By: Marco Ruelicke.nethttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-543 Marco Ruelicke.net Mon, 03 Sep 2007 05:21:15 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-543 thanks :)I think if we are already talking and testing this technique, I should at least also show the code and explain how this can be achieved in case someone else don't know as much about CSS and would like to also use it :) thanks :)

I think if we are already talking and testing this technique, I should at least also show the code and explain how this can be achieved in case someone else don’t know as much about CSS and would like to also use it :)

]]> By: Michael Martinhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-530 Michael Martin Sun, 02 Sep 2007 20:29:08 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-530 Thanks for sharing your technique with other readers. :)I wouldn't worry about going through old articles though. It's not worth the effort. If it's a style you like, then just start using it in posts from now onwards. Don't worry about the oldies. (It can actually be good to leave the older ones as they are, because it shows your blog has developed)And sure - Cleaned up now. Thanks for sharing your technique with other readers. :)

I wouldn’t worry about going through old articles though. It’s not worth the effort. If it’s a style you like, then just start using it in posts from now onwards. Don’t worry about the oldies. (It can actually be good to leave the older ones as they are, because it shows your blog has developed)

And sure – Cleaned up now.

]]> By: Marco Ruelicke.nethttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-529 Marco Ruelicke.net Sun, 02 Sep 2007 20:08:20 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-529 oops...Michael, can you be so kind and fix the HTML entities I messed up? oops…Michael, can you be so kind and fix the HTML entities I messed up?

]]> By: Marco Ruelicke.nethttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-528 Marco Ruelicke.net Sun, 02 Sep 2007 20:07:17 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-528 well, I'm using the :first-letter pseudo class to make this happen. That's why each paragraph gets the the capital letter. The CSS to do that: div.entry p:first-letter { font-size:1.5em; font-weight:700; text-transform:capitalize; }I'm now changing it so I can decide where I have the effect by using this CSS code: div.entry p span.c_letter { font-size:1.5em; font-weight:700; text-transform:capitalize; }You just have to wrap a <span class="c_letter"> around the letter you want to capitalize and you get that effect. This will only work if the span is inside a paragraph.e.g.: <p><span>T</span>he first letter is huge[...]</p>I believe this method is way better because it gives you a bit more control on the layout...only problem is that I need to edit older articles if I want to use that on them...I edited the <a href="http://www.ruelicke.net/2007/09/peter-gabriel-amazing-voice-combined-with-touching-lyrics/" rel="nofollow">Peter Gabriel article</a> just to see how it looks like :) well, I’m using the :first-letter pseudo class to make this happen. That’s why each paragraph gets the the capital letter. The CSS to do that:
div.entry p:first-letter {
font-size:1.5em;
font-weight:700;
text-transform:capitalize;
}

I’m now changing it so I can decide where I have the effect by using this CSS code:
div.entry p span.c_letter {
font-size:1.5em;
font-weight:700;
text-transform:capitalize;
}

You just have to wrap a <span class=”c_letter”> around the letter you want to capitalize and you get that effect. This will only work if the span is inside a paragraph.

e.g.: <p><span>T</span>he first letter is huge[...]</p>

I believe this method is way better because it gives you a bit more control on the layout…only problem is that I need to edit older articles if I want to use that on them…I edited the Peter Gabriel article just to see how it looks like :)

]]> By: Michael Martinhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-525 Michael Martin Sun, 02 Sep 2007 18:51:15 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-525 I actually prefer it on the headers. It looks a little too much on short paragraphs (Like in your story), but it looks really good on your blog on the headings. Have you tried applying it to only the headings? How do you think that would look? I actually prefer it on the headers. It looks a little too much on short paragraphs (Like in your story), but it looks really good on your blog on the headings. Have you tried applying it to only the headings? How do you think that would look?

]]> By: Marco Ruelicke.nethttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-524 Marco Ruelicke.net Sun, 02 Sep 2007 17:33:26 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-524 Michael - Without your article I would have needed a bit more time to become that good in structuring my articles, I'm sure.I just added a piece of CSS to try that "first letter of a paragraph larger than the others" idea. Feel free to share your thoughts, but I think it does look quite good, although it messes <a href="http://www.ruelicke.net/2007/08/star-wars-soldiers-vs-jedi/" rel="nofollow">my story</a> up a bit... Michael – Without your article I would have needed a bit more time to become that good in structuring my articles, I’m sure.

I just added a piece of CSS to try that “first letter of a paragraph larger than the others” idea. Feel free to share your thoughts, but I think it does look quite good, although it messes my story up a bit…

]]> By: Michael Martinhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-506 Michael Martin Sun, 02 Sep 2007 12:02:48 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-506 Marco - The most recent post is great. I had a scan down it, and it was easy to pick out the bits that interested me. I loved your usage of the many images. That really livened things up. If you can find an appropriate image for a post, it usually does look good. :DDaniel - Yes, having large blocks of text is probably the easiest way to scare off your readers. Ample spacing is a pleasure to read from. Marco – The most recent post is great. I had a scan down it, and it was easy to pick out the bits that interested me. I loved your usage of the many images. That really livened things up. If you can find an appropriate image for a post, it usually does look good. :D

Daniel – Yes, having large blocks of text is probably the easiest way to scare off your readers. Ample spacing is a pleasure to read from.

]]> By: Daniel Johnsonhttp://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-502 Daniel Johnson Sun, 02 Sep 2007 11:37:28 +0000 http://www.problogdesign.com/blog-usability/format-your-posts-for-readability/#comment-502 Some useful suggestions there. I try to use as much of these as possible as it breaks up the text nicely. I'm very weary of having too uch text in one space on my sites. So subtle changes to posts like the ones listed are really useful. Some useful suggestions there. I try to use as much of these as possible as it breaks up the text nicely. I’m very weary of having too uch text in one space on my sites. So subtle changes to posts like the ones listed are really useful.

]]>