Google does the right thing about the Blogger Nav Bar

It's a time for rejoicing, not only in less sketchy CSS code needed but also in the reaffirmation of Google's intentions for us: it wants us to use its software, even if others don't know we're using it.

So now, let us bid farewell to all that is old and broken:

Now, we can chill out and work with this:

"Nobody's going to try to do that"

Someday I'll track down the quote that really describes this right. Something like:

If you try to anticipate how someone will use something, and design it specifically for that purpose, its general usefulness decreases.

It also means that if you design something just for what it is, then people will be able to use it in all the ways a designer didn't anticipate.

So here's my case study for today: working on a presentation that cites a bunch of articles. A typical word processor type task.

The fastest way to do the list of articles is to drag their titles in. Linked titles are no problem: drag 'em in and immediately they show up linked and unstyled. The unlinked ones in heading tags required some formatting and manual linking. I can deal with that.

But the folks who decided to use some sketchy "custom fonts using flash" solutions for this page had decided that having their font showing up exactly the same on all browsers was more important than it being copy-and-paste friendly. So theirs is the one title I have to re-type.

Now I remember getting into conversations with clients over this, back in the days of putting text in as an image. I'd say "people have to be able to copy and paste this." And every once in awhile, I'd hear "nobody is going to try to do that." Every time somebody decides that, they're actually setting a condition: "Anybody who tries to do that is going to be frustrated by our choices."

The more something submits to the user, the more it gets used. If the user has to submit to it, especially by doing extra work, it better not be for the sake of esthetics.

Here's another example. I really wanted to be able to copy and paste this list:

I knew it probably wouldn't work, but it might also be one of those happy occasions where I find something that's been made more usable through careful coding.

The list, when copied and pasted and de-formatted, looks like this:

Dirty Dozen Plus™
Buy these organic

1

Apples

2

Celery

3

Sweet bell peppers

Or if you paste it into a plain text email or comment field on the web, it also looks pretty bad, but more importantly it makes the user do their own extra formatting work:

5
Strawberries
6
Nectarines
– imported
7
Grapes
8
Spinach
9
Lettuce

That's a pain.

I solve these kinds of problems by using CSS and HTML in a more modern way, so you get a list that looks great and stylish in the web browser, but copies and pastes into exactly what you want it to:

Dirty Dozen Plus™
Buy these organic

1. Apples
2. Celery
3. Sweet bell peppers
4. Peaches
5. Strawberries
6. Nectarines – imported
7. Grapes
8. Spinach
9. Lettuce
10. Cucumbers
11. Blueberries 
12. – domestic
13. Potatoes
14. Plus
15. Green beans
16. Kale/Greens

+ May contain pesticide residues of special concern

I do it right by using two technique substitutions for menus and lists:

• background-image CSS instead of <img src=""> HTML
• HTML list instead of numbers in text form

It's important to think about how you want your layout to look when it's copied and pasted, and what format people might want to paste something 

How to expand all posts and remove the toggle triangles - Blogger Post Archive Customization with CSS

Here's how to make Blogger display all your blog entries in the Blog Archive, without making your users expand the years, then months, to view a chronological list of your blog entries.

Use this in the CSS portion of your Blogger Template:


#ArchiveList .collapsed ul { display: block; }

#ArchiveList .toggle, .post-count {display: none;}

I put it at the end of my CSS on instinct.

Your Blogger Template can be gotten to like this: customize: layout: edit html: after the variable definitions and before the body tag.

When to choose free tools instead of a traditional website

For most people, small businesses and artists, creative combinations of free services like blogspot, wordpress, myspace, the Internet Archive, YouTube etc are the best way to publish and promote on the 'net. Here's why:

• You don't have to pay for domains that can expire or get hijacked. Can you tell for sure whether your audience cares about whether or not you have a custom domain name? If you really do need one, it's easy to apply one to a Blogger or Tumblr account.
  
• You don't have to pay for hosting that's limited, private, insecure and less reliable than free public services, and you don't have to lose your data when the company goes under or fails to bill you.
• Content can be updated without specific software or hardware, from any location, by anybody who's granted access. Access rules are easy to set, and files don't have to be transferred.
• You won't look like somebody who's willing to pay for what they can get free. If it's done right, it can just look smart instead of cheap.

For me, this is about Wordpress vs. Blogger, and when to use each. Wordpress, the full installed one that everybody uses, anyway, even though it's a CMS, relies on a traditional website infrastructure to function properly. And that layer is yours to manage, whether you want to or not. If you don't need to manage that layer of things, and you're not prepared to provide the backend security and stuff to make sure all bases are covered, then don't jump into that pond. That's my advice to small business people - err on the side of small, if you're in doubt about this decision.