A rant about bloggers who make their own layouts
This entry was posted on November 12, 2007
These days anyone can start their own blog. Some of them choose a dedicated bloghost such as livejournal or blogger, whereas others opt for their own webspace where they can use their choice of blogging engine and have complete control over their layout. Sometimes this can be a good thing as it allows budding web designers (like me) to try their hand at creating their own sites, thus improving their skills and learning along the way.
Sometimes, however, it can be very dangerous. Blog owners in general have an interest in only one part of web design : the aesthetics. Of course, I don’t deny that this is a very sweeping generalisation, because there are thousands of bloggers who take their web designing seriously (and I like to count myself in that group), but, I’m not talking about those people.
I’m talking about the people who come up with layouts using bastardised HTML and consider themselves to be “proper designers”. Customising wordpress / making your own website layout does not make you a web designer. But, I’m not talking about what makes some a web designer either.
What I’m really talking about is whether blog owners are dangerous or not. As mentioned above, most blog owners (the ones on their own webspace) who decide to make their own layouts can often be dangerous. Mention usability and they’ll start talking about how cool their navigation is because it’s made from coloured blobs. Mention accessibility and they’ll tell you how cool their site looks in Internet Explorer (or Firefox, depending on their browser of choice).
A lot of blog owners make very personal choices when it comes to their designs (on everything from tiny fonts, narrow columns, large images, and anything else they like), but where does that leave the visitor? A blogger / webmaster’s personal preferences don’t always match the preferences of their visitors, and this is where the danger starts.
What’s more important - the blogger’s tastes of the visitor’s tastes? To me, it’s the want / need of every blogger to get their writing to as many people as possible. This involves having at least a basic understanding of usability and accessibility and what they mean for you and your visitors.
Unfortunately when it comes to visitors’ needs, our personal preferences have to be put aside. If we could all indulge our personal preferences, my site would have giant green Georgia for the body text, with justified text and a header containing a picture of Zac Efron. Sometimes it’s good when we put our visitors’ needs and wants before our own!
I think the key to understanding your visitors’ needs is to accept that each of your visitors’ is unique, and that none of them are the same as you. I visit my site using Firefox on Windows Vista, but barely any of my visitors view my site the same way. Out of those who do, they probably don’t all like giant green Georgia and Zac Efron, and though I think that’s a shame, I can accept that it’s not what they want.
So there we have it: my rant for the day. Blog owners need to be more aware about the implications that creating their own layouts has for their visitors, and accept that not all their visitors have the same tastes / technology / browsing habits that they do.
19 lovely people have commented
Top tips for organising your stylesheet
This entry was posted on October 28, 2007
If you take a look at my stylesheet, you will see that it is a complete mess! Aisling may like to be taken on an adventure when she’s looking through her stylesheet, but I do not! I like to be able to scroll through and find exactly what I’m looking for. I want to be able to see with a glance the padding that makes my layout mess up in Internet Explorer, or the typo that means my layout fails in Firefox.
Group your CSS rules
Grouping is good! So, have all your header rules in one place, all your link rules in another place, all your table rules together. Keep like things together, and unlike things apart.
Comment your stylesheet
/* Comments in stylesheets are enclosed with a forward slash and an asterisk. You can use comments to provide headers for each section of your stylesheet, as well as to leave notes on what each part is for, so that you (or anyone else working on your stylesheet) will know what each part does. */
Shorten your declarations
body { margin-top:0px; margin-bottom:0px; margin-right:0px; margin-left:0px;} can be shortened to body {margin:0;} - much less text, don’t you agree? Anything that has a value of 0 can have the units removed. 0 is 0 whichever way you look at it. 0px = 0em = 0% = 0. Properties such as margin, padding, border, and font (amongst others) can all be shortened to one declaration rather than four.
Name your classes and id’s logically
CSS is used to control the aesthetics of your website, and id’s and classes should be semantic - ie, they should make sense away from your stylesheet. What happens if you later decide to change your layout? Some of your classes won’t make sense. Let’s say, for example, you currently have an id of “pink” for your header div. This could make perfect sense for your current layout because you want your header to be pink. But let’s say for your next layout you want your header to be blue. Where’s the logic in having #pink { background:blue; } in your stylesheet?
What are your top tips for organising your stylesheet? Are you a fan of shortened declarations, or do you prefer to write everything long-hand? Do you leave yourself comments, or do you automatically know which part does which job?
14 lovely people have commented
8 steps to a more readable blog
This entry was posted on October 24, 2007
What use is a blog that your visitors can’t read? Where’s the point in you working hard on great content if no one can see what it’s about? Here are my top 8 tips to making your blog more readable.
- Keep your lines short. No more than 15-20 words is good. If you have a fluid layout that’s designed to stretch for larger resolutions, consider using max-width in your stylesheet so you can limit the width to 1000-1200 pixels.
- Use a generous line-height. 140% is a good rule of thumb. Too much and you risk your visitors’ eyes getting lost. Too little and your text will be unreadably squashed.
- Colour contrast is good! Dark grey (not black) on white is best, and dark on light is easier to read than light on dark.
- Never ever ever use Comic Sans MS. Ever.
- Small text is not good. Yes, it’s good for your meta data, but it’s not good for your main body text. If you do insist on using small fonts, at least size them in a unit other than pixels so all your visitors can resize your text as needed.
- Allow plenty of space between blog entries. If you’ve spaced out your text, you should space out your entries. Whitespace is good - cramped blogs are not.
- Never use more than three different fonts. One font is best, two fonts is acceptable, but three’s a crowd. Instead, try experimenting with font-variations, font-weights, colours, and sizes. You’ll be surprised what you can achieve.
- Don’t type all in capitals. Capital letters on the web implies that you are yelling at your readers. Do not yell at them!
