The days that Web developers dreamed about — seemingly, at the time, against all odds — for about half a decade are nigh upon us with this progression.

Although much work remains to be done before all browsers can be universally relied upon to render HTML in a consistent and relatively uniform manner, the Web development community can at least now begin breathing a sigh of relief about having finally gotten some of the worst of it behind us.

But has anyone ever stopped to think about the folks that actually get off on making other people’s jobs difficult? Clean style sheets? Progressive Enhancement? Semantic Web?

How do you suppose they feel right now? Whether it’s sadism or nostalgia, they’ve got feelings, too.

To them, I say with reassurance: fret not!

For them, I offer here three fabulous pointers for writing CSS like a total douche bag:

1. Use the same IDs for more than one element in an HTML document. The HTML spec is very explicit about not doing this, so you can absolutely bet that — some time down the line — some other developer tasked to add some jQuery or Prototype enhancements to your page will totally get screwed.

2. Sprinkle your IE 6 “hacks” directly into and all throughout your primary CSS files. Do not separate these IE 6 optimizations out from your main.css file into main_ie6.css. Coding your site to standards first will only make it easier to phase out this pollution when IE 6 finally drops off the planet. To ensure you really nail this one, you should be previewing the site in IE 6 from the very beginning of your development efforts. In fact, I could even recommend you develop the site’s HTML and CSS in IE 6 exclusively first, then go back and apply hacks to make it work in the rest of the more standards-compliant browsers… in fact Firefox 3.x and Safari 4.x both include really great developer tools to help you figure out which “standards compliancy hacks” you’ll need to use to keep the site from looking completely fucked in those browsers.

3. Use CSS style and ID names like next_alignright_blue or registration_form_gray. The more you mix styling cues directly into these names, the more you’ll be able to laugh and laugh and laugh and laugh when those “next” links need to be green when the site’s holiday theme feature gets finished after Thanksgiving. Honestly: what’s funnier than knowing that next_alignright_blue will render green links? And, if you’re truly lucky, maybe a usability audit of the site might conclude that the “next” links should not get jammed to the right, but should appear adjacent to their associated “previous” link.

4. Avoid descendant selectors like the plague. The only thing that these will ever afford you is the opportunity to minimize the number of IDs and class names. Where will your opportunity for laughs come when elements can be targeted by JavaScript enhancements using a syntax like this:

       [#!javascript]
       $('#sidebar .panel .description a.more').click( ... );
   

   instead of:

       [#!javascript]
       $('#sidebar_videos_panel a.more').click( ... );
       $('#sidebar_widgets_panel a.more').click( ... );
       $('#sidebar_uploads_panel a.more').click( ... );
       $('#sidebar_archives_panel a.more').click( ... );
   

   The first example allows some other developer to continue to leverage the selector code to enhance the “more” link, should another .panel element with a qualifying like in its .body element, rather than having to explicitly add another line.

And so I hope I’ve demonstrated that there’s simply no reason to mindlessly progress into the hegemony of maintainability, efficiency, and sanity for your colleagues. Not when you can utilize simple little techniques like these.

With your efforts, we can squander much of this hard-earned potential for progress! If you have other douchey ideas you’d like to share, please leave them in comments.

1. Respect the Spirit of the ‘Net: communication and connection to people and information.

2. Listen.

3. Add value. Before posting a message as a new participant in a forum, ask yourself: How is this providing value to the conversation? To the community?

4. Respond.

5. Do Good Things. This goes beyond adding value online. It means fundamentally changing your business model from a single bottom line — profit — to a triple bottom line — people, planet, profit — and then perpetuating this social responsibility to all you do in business, including online marketing and selling.

6. Share the Wealth. In social media, sharing is the fuel of the conversation engine.

7. Give Kudos. Social media works when you are generous. There is nothing wrong with self-promotion, but things really take off when you give others praise or a moment in the spotlight. The rise of retweeting — real retweeting, not spammy retweeting — shows how far giving credit to others can go in social spaces.

8. Don’t Spam.

9. Be Real. Authenticity is the secret ingredient behind any good and valuable social media marketing campaign.

10. Collaborate. Before you dive into social media for marketing and selling, take a look at who is out there and who is doing it well. How can you work with them, instead of trying to muscle your way into the space with all of your dollars?
    

The author of the article largely organized it to speak to larger commercial organizations, but the basic points are valuable advice for developing the identity any type of brand on the social Internet.

Check out the full article for a fuller take.

Some Terms

Throughout this post, for the purpose of simplicity, I will use the term brand to apply to all types of public personae, whether organization or personality.

I will also be speaking about a brand’s domain of interest, by which I intend to refer to the plurality of whatever industries and/or disciplinary fields that are relevant to the brand. I’ll use it in this singular form as a blanket concept, covering all topics of interest to the brand.

Finally, I’ll be using the term market to refer to any and all entities to whom a brand seeks (largely competitively) to offer a value proposition, and who interest — in whole or in part — in the brand’s domain of interest. In the case of a company, their market is naturally their customers, clients, etc. In the context of an organization, its market may be composed of the members it seeks to attract, or the community that it seeks to serve. Finally, a market for an individual’s own brand can consist of one’s prospective employers, clients, students, an educational institution, or grant or fellowship for which he or she may wish to apply.

Why Even Bother With Twitter?

Before I get into the any of the how, let’s invest a moment to get on the same page with respect to the why, since the means must be evaluated against whether or not they advance your efforts towards the desired ends.

This is material that’s been covered the world over around the Web, so I’ll keep this concise:

The goals are currency and reputability.

Currency here refers to the state of maintaining continuing familiarity with the ideas and topics relevant to the conversations presently taking place in the brand’s domain of interest. Currency helps a brand focus its efforts to remain relevant to its market, and is maintained by consuming incoming information.

Reputability refers to the brand’s reputation within the context of its market. Its measure exists only in the eyes of the brand’s prospective market, so it can only be built and developed with public action. On Twitter, this means publishing, or tweeting.

And so the value-proposition that participation in the Twittersphere offers a brand is that it can help the brand stay at the top of its game, and give the market a sense of the brand’s voice, relevance, and even competitive acumen.

But how can a brand engage with Twitter to realize these goals?

Currency Through Consumption

We’ve already covered the idea that keeping current with one’s domain of interest equates to consuming relevant information.

The trick, of course, is ensuring the “relevant” part — there’s just so much “information” vying to get attention, it gets difficult both to know which sources to pay attention to, and to discover new sources worth following.

Basics: Follow to Consume

Crafting a good set of accounts to follow is the most fundamental way you can use Twitter to keep abreast with the various conversations taking place in your brand’s domain of interest.

1. Follow liberally. Especially when you first start. Remember that one of the great things about Twitter is that it’s real easy to unfollow. Unlike joining a mailing list, you never have to worry about not being able to unsubscribe from notifications, etc.

   So, if you come to realize that a blog you love has a Twitter feed, follow it. When you stumble upon someone that seems to be making great tweets (eg, you find they get re-tweeted often), follow them. When you attend a great lecture and find out the speaker has a Twitter account, follow them. If some organization that’s relevant to your domain of interest has a Twitter feed, follow them. Did you just learn that someone new is following you? Review their recent tweets and consider following them as well. Get the picture?

2. Periodically identify people to unfollow. That is, you should consider if anyone’s just been tweeting about how they hate being stuck in traffic, or how they fear they’ll never learn to say “no” to dessert.

   The more people you follow, the more effort you’ll find it takes for you to focus on the information that is relevant to you. This might mean giving Ashton Kutcher or Oprah a pass. Or not, if their work interests you.

Your goal, over time, is to compile a list of people, publications, organizations, etc. to follow that consistently put out useful material — ones that share relevant links, post meaningful insights, etc. Of course, very few will be all great all the time, but you get the gist: keep the signal-to-noise ratio leaning much more heavily towards signal than noise.

Advanced: Trends, Hash Tags, and More

Apart from the relatively passive act of following particular users, it is possible to engage in alternative, more engaged modes of consumption on Twitter.

1. Check out Shared Links. This may sound obvious at first, but it’s worth mentioning explicitly. Note that most URLs are shortened (more later), so the link’s immediate value may not be apparent from the link itself.

2. Note Hashtags. A hashtag is any word in a tweet that starts with the # symbol, such as #politics or #superbowl. Hashtags are used to define certain words in a tweet as keywords, much like tags on Flickr or a blog.

   - <strong>Hashtag Links</strong>. Many Twitter client applications (though notably not Twitter itself) render hashtags within tweets as clickable links. Clicking a hashtag's link in such a cases will produce a global Twitter search results page, listing the most recent tweets containing the hashtag in question — this can be an excellent way to hunt down links to additional information about a topic someone has tweeted about.
   
   - <strong>Hashtag Searches</strong>. Hashtags can be searched for, as well. A hashtag search can offer different results than a non-hashtag search because hashtags declare _intentional classification_. Searching for "calculus", for example, may yield results which include tweets complaining about how difficult someone's homework is, but searching for "#calculus" will show only tweets whose authors have declared to be _about calculus_.
   

3. Check in on Trends. “Trends” are basically terms that are used with a high frequency on Twitter, within a given window of time (say the last 2 hours, 24 hours, etc).

   Trend terms on Superbowl Sunday may include the best (or worst) player in the game, the company that aired the best commercial, etc; while trend terms on New Year’s Eve may include champaign, resolution, resolve, happy, healthy, and midnight.

   Mashable has a list of various tools for checking in on Twitter trends, from websites, to apps for your mobile phone.

4. Hashtag Trends. You can even follow trends of hashtag assignments.

As you might expect, the basic and advanced activities feed each other. Exploring hashtags will occasionally introduce you to new users potentially worth following, and following interesting users will introduce you to new hashtag topics.

Because of the way these modes of consumption relate to each other, the consuming information on Twitter carries a very different (and potentially greater) value proposition than, say, following the headlines on your favorite news sites or blog using an RSS reader, since Twitter subscriptions give you the chance to learn about someone’s work before the mainstream news sources even get their act together to pick up on it.

Reputability Through Publishing

Now let’s get into the tips for making the most of your publishing activities, to give you that street cred you’re looking for. Let’s start with these very basic guidelines:

1. Public Isn’t Private. Keep your tweets topical. Remember that you’re on Twitter to build a brand, whether this brand is your company, organization, or yourself. I would even especially emphasize this point then the brand is yourself. You’re tweeting to pimp your brand’s relevancy to, mastery of, and involvement whatever its domain of interest may be.

   - _Do_ personalize the wording on your tweets. It's even usually appropriate to proclaim emphatic love or strong distaste for things in your tweets, _as long as these things are somehow relevant to your domain of interest_. This cultivates and expresses your _editorial voice_, which makes reading your tweets more interesting; no-one likes to read sterile posts, after all.
   
   - _Do not_ make the mistake of using your brand's Twitter account to air your laundry by posting about deeply personal stuff. If you wanna tell the world that your mother is annoying, or that your boyfriend is a douche bag, go update your Facebook status. Or create a separate, _personal_ Twitter account, if you simply must tweet it.
   

   Again, if you’re not using Twitter to build a brand, this piece of advice doesn’t apply… but then, why exactly are you still reading this article…?

2. Stay on Topic. Keep the majority of your tweets relevant, at least in some way, to the brand’s domain of interest. It’s absolutely acceptable to bend the rules of “relevancy” from time to time — again: a little variety or deviation will spice up your feed with a bit of personality. And consistent deviations can add layers to the brand (particularly an individual’s personal brand), but exercise care with that and try to hit 90% on-topic or better, if you can.

3. Share Your Discoveries. Did you have an interesting conversation? Tweet the conclusion, conundrum, or topic. Share the links of any interesting article or website you encounter that is relevant to your brand’s domain of interest.

4. Share Your Work. Do you have a blog? Make sure you tweet links to your posts. Did you get some press mention? Post a tweet about the experience, and follow it up with a link when it gets published online.

5. Shorten Your URLs. Use services such as http://tr.im, http://is.gd, or http://tinyurl.com to reserve as many of the 140 allowed characters in a tweet for use in your message.

6. Engage. The greatest potential value from a social medium like Twitter is derived from the act of engagement.

   - <strong>Reply</strong>. When someone says something interesting or posts a good link, reply to them.
   
   - <strong>Consult</strong>. Are you stuck on some complex or nuanced question? Ask your followers.
   
   - <strong>Challenge</strong>. Or perhaps just come up with a great rhetorical, thought provoking one? Pose it to the folks following you.
   

7. Mentions. A mention is simply the inclusion of another user’s Twitter name, prefixed with the @ symbol, in one of your tweets. Here’s an example tweet with a mention:

   Meeting with @luvinspoonfuls today to discuss recipe software.

   Twitter automatically turns those into links that point to the twitter profile of the mentioned user, so mentions can be a powerful cross-promotional tool. As a rule of thumb, whenever you’re talking about someone who also has a presence on Twitter, make sure you include a mention for their Twitter user, even if the message is addressed to a third party. They’ll thank you, and more than likely mention you later.

8. Re-tweeting. A re-tweet (or RT) is the act of posting someone else’s tweet verbatim, in such a way that it includes attribution of its source. RTing is great because it accomplishes a few different things:

   - It's a mention, and therefore carries promotional value for the original author
   
   - Pimping other users with RTs casts you in a more social light to your followers, and helps reassure them that the brand is, in fact, participating in a dialogue, rather than just beaming self-promotional messages blindly out into the cosmos.
   

9. Use Hashtags. Categories the topics of your tweets with hashtags. Note that some hashtags can even be funny, like #painfullyobvious or #wtf. I like to hashtag inline, when I can, as in the following example (which also includes a mention):

   Awesome new #website: http://data.gov – I’m really impressed with the @whitehouse… Now THAT’S #technology in #government !!! #amazing

The key to building a reputation for a brand on Twitter is constructive participation in the community of users who share interest in the brands domain of interest.

Conclusions

These are the basic activities for building the strength of your brand on Twitter. I omitted certain ideas that may be relevant only to corporate brands, etc, but it’s really all about ways to engage in a dialog with your brand’s market.

I should note, also, that participating in the so-called Twittersphere is only a small (if potential-packed) part of the brand building social media publishing equation. I would also recommend maintaining a blog of some sort — ideally on the brand’s own website — to which longer-form content can occasionally be published; 140 characters isn’t a hell of a lot of opportunity to effectively convince people that you know your shit.

Finally, have fun! Get out there and meet people — engage them in person. Share your energy and ideas with them, and listen to the thoughts and insights they respond with. There’s no substitute for a lively conversation over a beverage.

Further Reading

• http://mashable.com/2009/04/20/twitter-strategy/ – 7 ways of approaching Twitter publishing
• http://mashable.com/2009/05/20/twitter-personal-brand/ – how to build your brand
• http://twittley.com/ – a Twitter-integrated version of digg (pimp your links)
• http://www.techcrunch.com/2009/05/25/viralheats-real-time-social-measurement-tool-analyzes-content-on-twitter-youtube-and-more/ – analytics for advanced Twitter publishing activity

I needed to know it could be done.

Having satisfied my need to see the proof-of-concept, I intend to return to using the non-hacked configuration (by disabling what I’ve done) for a little while longer, while I complete a review period during which I use the computer with only the applications found on the default system.

That said, I will mention that am rather pleased with the initial results of my efforts in hacking this thing.

Once I’m done assessing its performance and capability as configured in its “out-of-the-box” mode, I intend to hack the hell out of MIE. Maybe I’ll even manage to fix the damned issue I’m encountering with the Mail widget on the home screen that HP’s customer support facilities have utterly failed at helping me resolve… but I’ll get into the saga of HP’s epic failures at customer support in a future post.

Installing Flock

Head over to the Flock website and download Flock. Unless you’ve changed the default settings, Firefox will download the file to your desktop.

Fire up a terminal, cd to your Desktop (or whichever directory your Firefox is configured to save its download to) and type:

  [#!shell]
  $ sudo tar -C /opt -xjvf flock-*.linux-i686.tar.bz2

Test if flock works from the command line:

  [#!shell]
  $ /opt/flock/flock-browser

If Flock launched properly, it’s installed properly. Next, we want to get the command to launch flock accessible from your PATH by adding a symlink to it in /usr/local/bin:

  [#!shell]
  $ sudo ln -s /opt/flock/flock-browser /usr/local/bin/flock

Test if the symlink works:

  [#!shell]
  $ flock

If Flock launched, then our command line installation steps are complete.

Adding Flock to the Launcher

The next several steps will cover how we get the nice Flock icon in the Internet tab of the application launcher, which initially looks like this:

Backing Up the Original Settings

First, let’s backup our launcher’s current setup; the wise hacker always keeps a copy of the original configuration in case something gets hosed.

To create this backup, type the following into your terminal:

  [#!shell]
  $ sudo cp -r /etc/xdg/menus /etc/xdg/menus.original

If we ever want to restore to our defaults, we need simply type:

  [#!shell]
  $ sudo mv /etc/xdg/menus /etc/xdg/menus.hosed
  $ sudo cp -r /etc/xdg/menus.original /etc/xdg/menus

This reversion will keep whatever changes you made to the config files you accidentally hosed, in case you want to try to copy your hacks back, one by one.

Creating an Application Entry File for Flock

Create the file /usr/local/share/applications/flock.desktop and set its contents as follows:

  [#!ini]
  [Desktop Entry]
  Name=Flock
  Comment=Flock Web Browser
  Exec=flock
  GenericName=Flock Web Browser
  Icon=/opt/flock/icons/mozicon128.png
  Path=
  StartupNotify=true
  Terminal=0
  TerminalOptions=
  Type=Application
  Categories=Application;Network;

Note that we’re creating our Application Entry file in /usr/local/share rather than /usr/share. This is because this is the recommended practice for items added manually by the user in Unix-like operating systems.

Adding the Application to an Existing Tab

Let’s add Flock to the launcher’s Internet tab.

Open /etc/xdg/menus/applications.menu file, and make the following change:

  [#!xml]
  <Menu>
    <Name>Internet</Name>
    <!-- ... other nodes ... -->
    <Layout>
      <Filename>firefox.desktop</Filename>
      <Filename>thunderbird.desktop</Filename>
      <Filename>pidgin.desktop</Filename>
      <Filename>skype.desktop</Filename>

      <!-- We're adding this line -->
      <Filename>flock.desktop</Filename>

    </Layout>
  </Menu>

Save your file, then go to the application launcher. You should now see the following:

I won’t cover replacing Firefox as the default browser here, nor will I get into how to add tabs to the launcher — I’m not ready to get into all that just yet. Rest assured, however, that I’ll definitely get there once I dive headlong into my hacking activities.

The material I based this entire endeavor on is from HP’s Mini forum — check it out!

Good hacking, amigos.

24 May: HP has got the Mini’s fora back up and running, so I’ve updated the URL to the material, and removed the Google Cache link.