How to Export Bookmarks from Delicious?

Quite a shocker for a Friday morning to learn Yahoo is shutting down Delicious; social bookmarking service, since it was acquired in 2005. From what I’ve read, it’s due to the downsizing happening at Yahoo and Delicious isn’t the only team affected by this.

Well, let’s not dwell on the matter.

Quickly export a backup of your bookmarks, before it’s too late!

Once you’re logged in, you’ll have to navigate to the Settings.

Then, scan through the Bookmarks and find Export / Backup Bookmarks.

You’re now 1-step away from relief. All you’ve to do now is click the Export button and save the generated HTML file.

Hurray! You’ve successfully backed up your bookmarks and saved yourself from crying over spilled milk later.

Okay. So what now?

Well, I don’t really have a recommended alternative to Delicious. Plus, an article which wrote about the Top 15 social bookmarking websites didn’t help either. Because Propeller, which was listed below Delicious, has also been shut down by AOL.

Plus, Reddit doesn’t look like a website I’d put much trust in. No offence.

But I’ve checked out Diigo, which incidentally I created an account, long ago that I forgot. They allow you to store your bookmarks online and have extensions even for Chrome. In addition, they’ve nifty features like saving highlighted text, screenshots and more. But note, some features are only on a paid account. Saving bookmarks is free though.

So, I’m now using Diigo to store my bookmarks. I’ll probably find out how easy it is to retrieve certain bookmarks later as I use it. But for now, that’s my alternative.

Or, do you have a different suggestion?

Website Review: iPhoneCase.com.my

The website owner dropped me an email to do a review of their website. And my instant reply was I’d only do it with the condition, I’m given freedom to write a website review of my opinion. They obliged so let’s jump into their website.

Protective covers for iPhone 4 fanatics

The website is an e-commerce store selling iPhone 4 protective cases only. And you’d be very surprised to find the variety of brands and protective case models they carry is quite large. Their main menu sports the 5 primary brands; Incase, Mica Glam, More Thing, Sienna and Speck. Which the only brand I recognize is Speck since I use their protective casing for my MacBook Pro.

It’s all about the colors

Now, this is one of few websites I know which let’s you shop by the iPhone 4 casing color. Because if you think about it, guys and girls normally have a set of preferred colors.

So, great job to the owners having this placed in the main menu. Plus, they even followed through by having the menus reflected in the labeled colors.

I’m pretty sure you’d get some really awesome buying behavior data from doing this. We can probably expect seasonal promotions based on colors in the future?

Let me have a look at you, girl

Another thing I liked about this website was the ability to see the front and back of the iPhone 4 casing from the product category page. Normally, views of the product are viewable only in the product details page. But not for this website.

When you hover the default view; back cover, the image changes to the front view. Once again, a well thought of executed idea from the customer’s perspective. And if I really wanted more views, I’d then click on the product to find out more.

Over-sharing and troublesome wish list

The product detail page has your standard multiple product views, again using hover as a navigational. Not something I’m in favor, especially if you had a bad Internet day.

Then, if you may have noticed, there’s 2 types of Facebook plugins used. One’s the Like button and the other is the Share button – using Share This to generate buttons like Twitter, Facebook and Email. Honestly, I find the dual Facebook overkill. Plus, I’d have placed the sharing after the Add to cart action, not before.

Now, about the Wishlist. If you wanted to use it, you’ll have to register an account. That’s fine, if you didn’t have to fill up 10 fields. That too is overkill to start my wishlist.

Bonus: Other things to think about

I’ve told myself 2-3 years ago, rule of thumb when I design a website is to not have text smaller than 12px. Unless it’s for something unimportant like the Copyright information. And if the owner reads this, please change the font color of your 4 links beside the search bar to a darker grey. Everyone’s monitor isn’t calibrated like mine to see the slightest of greys.

The next thing you’d want to do is, have a proper contact page. It’s not that hard to have a contact form done since you already have an e-commerce website. This’ll be better than the image in the footer with your email address which people can’t highlight to copy and paste. Plus, it’s not exactly short to type.

I’ve a question. Why do you need to link the Paypal, Visa and Mastercard logos back to Paypal Malaysia? Is it a pre-requisite?

You might also want to consider turning ‘Join the mailing list’ into a title, instead of a button. Due to the consistent use of grey text in your footer, it’s difficult to distinguish what’s a button without an image.

Overall, I think you did quite a good job. All improvements can be made without much problems. So I’m hoping to see them implemented later.

Now, please don’t ask me about iPhone 4 protective cases. This is only a review of the website; iPhoneCase.com.my. Questions should be directed there.

How are You Different from Your Competitors?

This has been the question nearly all prospects get stumped on when I pose it to them. The general response I’ve been given:

My ‘insert company name‘ delivers high quality and professional customer service. And, our products are also very competitively priced in comparison to our competitors.

If you ever wondered what was marketing talk, this was it. It’s a load of smokescreen with words which could mean something to mislead you from the fact, this company doesn’t have a differentiator.

In the Internet business today:

• Anyone can setup a website design business.
• Anyone can create and customize a blog.
• Anyone can create an application (nearly).

But how many people do you know, could tell you why is their business or product different from the next?

Why do you need to know how is my company different?

If I asked you, where would I buy burgers? You’ll mostly answer; McDonalds. If I asked for fried chicken, you may most likely say; KFC. But these are huge conglomerates right?

So, if I asked you where’s the best chicken rice? You’ll give me a long list of them. Hence, how do I define what I really want here? Simple.

I’ll refine my question, where’s the best chicken rice in Old Town, Petaling Jaya? You’ll give me a shop name and if I asked why, you may tell me because the stall owner uses ‘qi gong’ to tenderize his chicken.

Now, how many stall owners you know uses ‘qi gong’ to tenderize chicken – if existed. By telling me; your designer; your account manager; your marketer; about your differentiator, I can then better communicate on your website – visually.

Therefore, what’s your ‘qi gong’?

How to Modify Your Domain Name at Domain Registry Malaysia

Back in January, Domain Registry Malaysia (formerly MYNIC) decided to introduce a new system for domain name owners to have better management of their domain name.

The new system was integrated but there’s a major problem now. They’ve changed the only known way by domain name owners to update their domain name information. I know this because my friend; Alvin, said:

Haha… its in the main left column INSIDE the Flash banner…

That was the only known way. However, I finally found at the corner of my eye, how to modify my domain name at the Domain Registry Malaysia – that’s a mouthful.

Step 1: Look for the Login Button

Someone must have thought an orange button would’ve been good enough. Well, it isn’t. Because I’d say it’s the most important part for the website followed by the domain name checker and whois.

Step 2: Enter User ID and Password

There’s a minor change here as well. It’s no longer called User ID but username. When MYNIC sends the details of newly registered domain names via email, it’s always User ID and not username. So better inform your clients about this.

Step 3: Enter the Contact Code

Seriously, I wonder if managing a .US is as cumbersome as this. Because a client’s first comment would go, what’s a contact code?

And there’s another interface design flaw here. You need to click on the magnifying glass icon to popup a window to start searching for the required contact code. This is a flaw because the first step in this process is you need to click on the icon first. Now, it’s placed at the end of the field like an action to perform AFTER you filled the field. And by the way, look out for the popup window in case your blocker is switched on. But if you already know it, great! You’ll save a lot of time, trust me.

Step 4: Start trying to search

In the popup window, there are several ways for you to search. From my experience, it was best to search using the first and last name. I tried using the domain name option, it works only sometimes. And the organization option is quite hopeless, I tried searching Simpleet or Exabytes and it had no records.

So best advice I have for you, store your contact codes in a document for better reference.

Step 5: Select the Contact Code

Once you’ve finally found your Contact Code, select it from the list. Now, you can proceed with logging into the system.

Step 6: You are in!

After going through all that, you will finally be logged in. It’s not a looker but I’ll say the system upgrade to finally be able to manage these details is welcomed. Not to mention, they now have a logout link. Yes, they didn’t have that previously.

So, I hope this mini guide helps you and maybe your clients out. And, do read my website review when they launched their new website earlier in 2008. I think the company who did it weren’t very happy with what I found.

My Breadcrumb Navigation Design Principles

Hansel and Gretel escaped the forest by retracing their steps from the breadcrumbs laid by Hansel. Though Wikipedia’s version tells Hansel left a trail of pebbles.

Anyway, the trail is identified as the breadcrumb navigation in website design. In a website with a deep menu structure, you’ll find a navigation which looks similar to this:

You are here: Home > Products > Kitchen > Microwave >  Model

This is the most common breadcrumb navigation. Personally, the design criteria for this navigation is to:

• Tell the user it’s a breadcrumb. Normally by the “you are here”.
• Differentiate the webpage you’re on from the trail you used.

In addition, here are my other principles to breadcrumb navigation design.

Unobtrusiveness

The breadcrumb navigation is most commonly located directly beneath the main navigation. Otherwise, directly above the primary content of the website. A breadcrumb navigation is not a replacement of the main navigation but a complimentary navigation.

Readability

I grew from using a minimum typeface size of 11px to 14px (if possible). The only time I used a 10px typeface size is when I’m forced to or the content presented is of no real importance – copyright information. However, I’d avoid using a 10px size for the breadcrumb whenever possible.

Strong Contrast

I’d say this is one of the difficult ones to achieve. Being designers, we end up busy sprucing up the rest of the website, we’d have a tough time trying to make the link colors and activated text color stand out in the breadcrumb navigation. Look at NASA’s website.

Their primary navigation link color and the activated text color of the breadcrumb navigation ended in collision. Oh well.

Other than breadcrumb as a navigation, folks of Delicious applied the breadcrumb concept to a tag filter. Neat.

But before I conclude this article, I personally think slahes (“/”) are not ideal for breadcrumb navigation because they can be easily misinterpreted as divisions and choice (“or”) statements.

Well, these are just my principles when designing a breadcrumb navigation.

P.S.: This article was inspired by Smashing Magazine’s Breadcrumbs In Web Design: Examples And Best Practices.