I am happy to announce that Tab Candy is coming to Firefox 4. Starting today, Tab Candy will be called Firefox Panorama and be available as a feature in Firefox betas. Head to the Firefox 4 feature list, or watch the video below, to learn how to organize your tabs into groups and reclaim your browsing experience from clutter and information overload.
Continue Reading » | RT @azaaza Firefox Panorama: Tab Candy Evolved
Let me start by saying that, at least in the US, Google does not censor Tiananmen Square. Nor does Bing. Nor Yahoo. But we can make it look like they do. If you don’t believe me, click here, here, and here.
As you can see, I’m linking to the real Google domain and the looks and acts legitimately. The URL looks normal. You can even change the search, say remove “massacre” and Google still doesn’t find anything. Try it with quotes. Remove square. Still no results. The “censorship” certainly feels fairly real, and the hoax would be even harder to detect if if I had said that they were only censoring links from some third party sites.
Continue Reading » | RT @azaaza Does Google Censor Tiananmen Square? How To Create an Internet Hoax
The power of the browser has grown substantially in the last ten years. We now use the Web to multi-task the activities we juggle every day, like vacation plans, purchases, sharing pictures, listening to music, reading email, and writing a blog post.
It’s hard to keep everything straight with dozens of tabs all crammed into a little strip along the top of your browser. Your tab with a search to find a pizza parlor gets mixed up with your tabs on your favorite band. Often, it’s easier to open a new tab than to try to find the open tab you already have. Worse, how many of us keep tabs open as reminders of something we want to do or read later? We’re all suffering from infoguilt.
We need a way to organize browsing, to see all of our tabs at once, and focus on the task at hand. In short, we need a way to get back control of our online lives.
Enter: Tab Candy.
Continue Reading » | RT @azaaza Tab Candy: Making Firefox Tabs Sweet
It’s not often that you learn something from spam, besides that there are an extraordinary number of generous Nigerians (replete with theme song) and amazing number of variations in the spelling of viagra. Yet, I recently got spam where the offer was written in pristine English: no numbers replacing letters, no images, and no misspellings. How had such a brazen piece of spam got through my filters? The answer, it turns out, was some clever CSS that caused the HTML markup to be garbled but its visual rendering to be readable. I’ll show you how to use this for both good and evil.
Continue Reading » | RT @azaaza How To Phish, Protect Your Email, and Defeat Copy-And-Paste with CSS
There are currently two proposed additions to CSS to make animating easier and with better performance: CSS Transitions and CSS Animations. Both are unfortunately named. The later is complicated, overkill, and probably won’t be supported by non-Webkit browsers, which leaves CSS Transitions as becoming the de-facto way to natively animate on the Web. Besides reducing power-hungry Javascript-based animation, the declarative CSS Transitions opens the door for hardware acceleration and commercial quality games. iOS devices and Safari already do so for buttery smooth results, and hardware acceleration just might make it into Firefox 4.
Normally, when you change the value of a CSS property, it changes instantly. With CSS Transitions, they automagically animate over time. Imagine you want to have a rollover indication for links where, on hover, the link changes its background color and jigs up a bit. With CSS Transitions instead of having the effect happen instantly, it can smoothly animated. Here’s how you’d do it.
You’ll have to use the -moz and -webkit prefixes for these properties until the CSS transitions specification is finalized.
a{
transition-property: all;
transition-duration: 350ms;
transition-timing-function: ease-in-out;
position: relative;
background-color: white;
color: black;
}
a:hover{
top: -2px
background-color: black;
color: white;
}
Continue Reading » | RT @azaaza Animation with CSS Transitions Made Easy
I was recently looking at some of my father’s, Jef Raskin, old documents and came across his February 16, 1981 memo detailing the genesis of the Macintosh. It was written in reaction to Steve Jobs taking over managing hardware development. Reading through it, I was struck by a number of the core principals Apple holds now that were set in play three years before the Macintosh was released. Much of this is particularly apropos in understanding Apple’s culture and why we have the walled-garden experience of the iPhone/iPad and the App Store.
Even better, I found some sometimes-snarky annotated comments Jef made to the memo as part of the Stanford Computer History project. The annotated memo follows my commentary.
Continue Reading » | RT @azaaza Macintosh Project Genesis and History
Non-designers are often called upon to make judgments about interfaces. Perhaps you are a business owner evaluating your new website, or a project manager looking at mockups from your designer. What do you look for in the design? And how do you give feedback in a more meaningful way than “It looks nice” or “It seems hard to use”.
While the full-depth of understanding design cannot be covered in a short article, here are some guidelines to help you out.
To get you started, here is an example of a critique I recently did of the interface for the yet-to-be-released Add-On Builder* for Firefox. The Add-On Builder is part of the Jetpack project and is a web-app of medium complexity that allows you to easily build Firefox and Thunderbird extensions online and then publish them to the world. I took screenshots of each screen of the interface, put them into one large document, and commented ex vivo.
Continue Reading » | RT @azaaza How To Critique An Interface
The web is a generative and wild place. Sometimes I think I missed my calling; being devious is so much fun. Too bad my parents brought me up with scruples.
Most phishing attacks depend on an original deception. If you detect that you are at the wrong URL, or that something is amiss on a page, the chase is up. You’ve escaped the attackers. In fact, the time that wary people are most wary is exactly when they first navigate to a site.
What we don’t expect is that a page we’ve been looking at will change behind our backs, when we aren’t looking. That’ll catch us by surprise.
Continue Reading » | RT @azaaza Tabnabbing: A New Type of Phishing Attack
Switching between applications, windows, and tabs is a fundamental action of modern computers. As people browse the web, we know that an average user will switch tabs more times in a day than they click on a link. Think about that. Much of your time using a modern browser (computer) is spent in the digital equivalent of shuffling papers.
Every major OS provides an “alt-tab” interface: a keyboard shortcut for quickly switching between windows and applications. To use it, you tap alt-tab and you are jumped back to the last focused window. Tap multiple times to cycle through all open applications. It seems simple enough, but there’s a interface gorilla in the room: What order should the applications be shown and cycled through?
While writing, I like to keep things simple. While I don’t go to the extremes of Khoi Vinh’s punishing Blockwriter, I generally use an editor that can’t even make text bold. When I write, it’s just the raw text and me, mano a mano. By using a bare-bones editor, the text can’t fight dirty by throwing frivolous fonts and formats in my eyes. At most, I use Markdown to add style to my text.
Must of my collaborators are the same way. We are often editing each-others’ work, but many hands in the copy-editing cookie jar means edits fly like popcorn kernels on the griddle. How do we keep collaboration simple, especially now that Etherpad is about to reach the end of its life? We need a robust method of keeping track of comments and edits. Standard revision control is too heavy weight, and most diff programs operate on a too-course line-level granularity. We needed another solution. Text interface design to the rescue!
Continue Reading » | RT @azaaza Collaboration Made Simple with Bracket Notation