Tag Archives: Chrome

Tablet Tip: Using Bookmarklets with Chrome for Android

Overall I like having Chrome on my Nexus 7, but there are a couple of things about it that bug me.

First: You can’t hide the tabs and search/URL bar. That’s not a problem in portrait mode, but in landscape mode, it takes up way too much screen space. Otherwise the tablet would be perfect for things like reading comics at Thrillbent.

Second: Bookmarklets are tricky. Because on Android Chrome loads your bookmarks in a new tab, not a menu, when you tap on a bookmarklet, it acts on a blank page, not on the page you wanted to use it for. If you have an app that provides a sharing intent, no big deal. You just share the page to that app, and you’re done. But if you want to run something on the page, or share it with a website that has a bookmarklet but not an app (like, say, Pinterest or Timely), it would be nice to be able to run them.

As it turns out, you can use bookmarklets in Chrome through the search bar!

  1. Pick a good name for it that you can get to auto-complete quickly.
  2. Type the name into the search bar when you want to run it.
  3. Tap the bookmarklet when it shows up in the drop-down.

Not quite as easy as tapping a button, but close!

Screenshot: Android Chrome bookmarklet for Delicious called via autocomplete

Farewell, Xmarks Bookmark Sync!

It’s not a huge surprise, with all the major web browsers adding their own bookmark sync services, but Xmarks (formerly Foxmarks) is shutting down in January.

I figure I’ll just use Firefox Sync, Chrome sync, Opera Link, etc. to share bookmarks between the desktop and laptop, but what I really liked Xmarks for was its ability to sync different browsers together. I’m always switching between Chrome, Firefox, Opera and Safari (and occasionally IE when I’m on a Windows box) and it’s nice to have them all on the same set of bookmarks.

I guess it’s back to periodically exporting from my main browser and importing in the secondary ones, unless I find a tool or find the time to read up on the bookmarks formats and write one.

Update: Xmarks lives!

Check Your Plugins!

It’s a safe bet that your web browser uses at least one plugin, and probably several. Maybe it’s just Flash for viewing animations and video (think YouTube and Hulu). Maybe it’s Silverlight for watching Netflix, or Shockwave for playing games. You’ve probably got Java installed.

Just like your web browser, these plugins must be kept up to date or you’ll run into problems: missing features, instability, or (worst case) security vulnerabilities. Unfortunately, most plugins don’t update themselves.

Several months ago, Mozilla introduced a service called Plugin Check that will identify the plugins you have installed and tell you whether they need to be updated — and how to do it. At first it only worked on Firefox, but now it’s been expanded to all major browsers: Chrome, Safari, Opera, and even Internet Explorer.

It’s worth taking a few moments to check. Think of it as a pit stop for your computer’s web browser.

Webkit display:table-cell Problem

I recently tried to retrofit a mobile layout onto an old table-based site using CSS. It was a fairly simple layout: A banner across the top, two columns, and a footer. I figured I’d use CSS to “unwrap” the table and make the sidebar and main content area into full-width sections instead of side-by-side columns.

In theory this should be simple: CSS handles tables by using the display property and assigning it table, table-row and table-cell for the <table>, <tr> and <td> elements. You can assign these properties to other elements and make them act as tables, or you can assign block or inline to these elements and make the table act like a series of paragraphs.

Initial testing worked perfectly in Firefox 3.6 and Opera 10.5x. Internet Explorer 8, as expected, ignored the changes entirely. Chrome, however, did something very strange, and Safari reacted the same way: The banner shrank, and the columns changed from a narrow sidebar to a 50/50 split…making it actually worse for small screens.

Clearly WebKit didn’t like something I was doing. Unfortunately, WebKit powers the exact platforms I was targeting: the iPhone and Android!

I dug around with the developer tools a bit to see if I could figure out what was going on. Was the browser not applying the property? Were the table cells inheriting the “original” property from somewhere else? Did I need to change properties on thead and tbody as well?

What I found was that WebKit did recognize the display:block I had added, but somehow the computed style was reverting to display:table-cell. This only applied to table and td, though. Table rows actually did what I told them to, which was why the result ended up looking bizarre.

If it hadn’t changed anything, I probably would have chalked it up to the capability just not being implemented yet. But since it worked on table rows, but not on cells, I decided to treat it as a bug in WebKit and went looking for the best way to report it. I ended up creating a WebKit Bugzilla account and reporting it as bug 38527.

Check out the testcase in Firefox 3.6 or Opera 10.5 to see what it should look like, then take a look in Chrome 4 or 5 or Safari 4.

Browse-o-Smart

After a week of playing with Chrome as my main browser, I’m back to Firefox. Chrome’s fast, but sometimes too much like Breathe-o-Smart.

Me: Why won’t you show me the full (relatively long) URL of this link?

Chrome: You won’t want to look at the full URL with Chrome!

Me: But what if I do?

Chrome: Trust me, you won’t. You’ll never need a URL again.

Me: But what if I need to look at it just this once?

Chrome: Well, I suppose you could actually follow the link. Or copy it and paste it into a text editor. If you really must have the URL. Not that you’d want to, of course.

Me: Why should I have to do that just to look at a URL? *headdesk*