Sep82010
File Under: Browsers, Software

Page Speed Add-on Headed to Chrome

One of the most useful browser extensions for web development is coming to Chrome.

Google is working on a Chrome version of its Page Speed add-on. Page Speed is an essential tool for testing sites in Firefox. It breaks down all the stuff on your page and shows you how long everything is taking to download, execute and render. It’s also fully open source and it has its own SDK.

Matthew D. Steele, one of the key engineers at Google responsible for Page Speed, has confirmed that a Chrome version is “already in the works,” and will be ready within a couple of months.

Page Speed currently runs inside of Firebug on Firefox, and there is already Firebug Lite for Chrome. There’s no word yet on whether Page Speed will remain dependent on Firebug (Lite) once it moves into Chrome, or if it will be a stand-alone add-on, but we’ll find out more details soon. In the meantime, if you have an answer to that mystery, let us know in the comments.

If you are curious about using Page Speed to speed up your website, check out Scott’s recent post on using Page Speed and YSlow together.

See Also:

Sep82010
File Under: Browsers, Multimedia

Firefox 4 Beta 5 Adds Audio Tools, Hardware Acceleration

Mozilla has released a fifth beta for Firefox 4, adding hardware acceleration in Windows, a new audio API and support for a new security protocol.

You can download Firefox 4 beta 5 from the Mozilla website, or, if you’re currently using beta 4, head to the Check for Updates menu item to update to beta 5.

The most obvious change for Windows users will be the hardware acceleration, which should make Firefox considerably snappier. While beta 4 included support for hardware acceleration on Windows, it was not enabled by default. Beta 5 gives users hardware acceleration out of the box (provided you’re using a version of Windows that supports DirectX 10).

Like we’ve seen in the most recent graphics-intensive games on Windows PCs, the idea behind hardware acceleration is to shift some of the work from your computer’s main processor to the graphics card. In a browser, this speeds up page rendering, particularly text, graphics and scripted animations. The coming Internet Explorer 9 and future versions of Google’s Chrome browser will both take advantage of hardware acceleration.

The other major new feature in this release is a new Audio Data API that gives web developers a way to interact with raw audio data in HTML5’s <video> and <audio> elements using JavaScript. With the new API, developers can read and write audio data within the browser, opening the doors for online tools like spectrum analyzers, audio remixing tools and 3D audio visualizations.

For more on what the audio API offers, check out our earlier write up and be sure to read through Mozilla developer Dave Humphrey’s blog post. To see the new tools in action, check out the video Humphrey created to showcase some of what’s possible with the new audio API.

The Firefox 4 beta also now supports the Strict Transport Security (HSTS), a new security protocol that allows websites to require that Firefox always use secured connections. Designed to help stop the so-called “man in the middle” attack — where something lurking between your browser and the secure website steals your data — Firefox 4 Beta now remembers which sites use the HSTS protocol and will only connect to those sites using SSL in the future.

See also:

Sep72010
File Under: CSS, JavaScript

Google Shows Off Its Bouncy Balls

If you’ve visited Google’s home page Tuesday, you’ve seen the bouncy ball demo. The Google logo is made of little colored balls that run away from your mouse and jump around furiously when you click on them. The balls will also jiggle from side-to-side if you move your browser window around.

The company did it using CSS positioning and some JavaScript math.random functions, so it works best in non-IE browsers with fancy JavaScript engines. In the useless-but-freaky-cool department, it ranks up there with the playable Pac-Man doodle from earlier this year.

Not content to let Google have all the fun, Rob Hawkes created an alternate version using HTML5 canvas that reproduces most of the functionality. His code is on github, too.

Sep72010
File Under: Mobile, Multimedia

TinySrc Shrinks Your Images for Mobile Browsers

If you’ve played around with optimizing your website for small screens, you know one of the big headaches is resizing images. You can set the viewport in your head tags to make sure your main content is the focus on mobile devices, but you can’t easily shrink images.

On many mobile devices, rendering the images is what slows down page load times. That’s where TinySrc comes in. It’s a clever service that parses your images and presents scaled-down versions to mobile devices.

Using tinySrc is pretty simple, all you need to do is prefix your image URLs with the tinySrc domain, something like:


http://i.tinysrc.mobi/http://foo.com/foo.png

TinySrc will then detect the device that’s visiting your site (tinySrc has partnered with Device Atlas so its device listings are extensive) and serve out an appropriately shrunken version of your image.

If you’d like complete control over the size of your images, you can specify parameters in the URL. For more details on all of tinySrc’s settings see the documentation.

While you are relying on a third party service — a choice which always carries the usual concerns about speed and reliability — tinySrc is definitely one of the fastest, easiest ways to shrink your images for the small screen.

[via Ajaxian]

See Also:

Sep72010
File Under: Identity, Social

Yahoo Users Can Now Open a Google Account With OpenID

Google is now letting any Yahoo users sign in to Google using OpenID, the company announced Tuesday.

When you’re signing up for a Google account, there’s now a new button you can click on that says “Verify by signing in at Yahoo.com.” Click it, and you’re sent to Yahoo, where you’re asked to allow Google and Yahoo to link up your accounts.

Tuesday’s development marks Google’s first attempt to be an OpenID relying party — a website that accepts OpenID logins from third-party providers. Also, this only works for Yahoo users for now, but Google says it’s going to start offering support for other OpenID providers soon.

On the surface, this may look like an attempt by Google to poach users away from Yahoo by making it even easier for them to switch. In fact, it’s a real-world example of the type of interoperability that OpenID has been promising to bring to the open web for some time.


Continue Reading “Yahoo Users Can Now Open a Google Account With OpenID” »

Sep32010
File Under: Blog Publishing, Identity

Six Apart Shuts Down Vox

Six Apart is shutting down its Vox blogging service. Users have until Sept. 30 to export their data to other services, including Six Apart’s TypePad blogging service. After that, Vox will be gone.

If you’ve got a Vox blog, there are several export options — Six Apart has instructions for moving to TypePad, Posterous and WordPress. There’s also an option to move your photos and videos over to Flickr.

Of course none of those services quite combine the privacy and small social network features that endeared Vox to users, but at least you can retrieve your content in some form.

The export options also make no mention of the fact that Vox is an OpenID provider, which means that, presumably, when your Vox URL is gone, your OpenID is gone with it. That means any site you’ve signed into using your Vox account will no longer let you sign in. In some cases that could mean a total loss of access to the third-party site — exactly the sort of thing OpenID is supposed to help prevent.

UPDATE: Six Apart vice president Michael Sippey responds to this issue in the comments. We’ve added it here:

Quick note. Vox will continue to serve as an OpenID provider through September 30. If a Vox user chooses to migrate their blog to TypePad, OpenID requests at the original Vox address will delegate to TypePad for authentication.

We know that shuttering a service is never easy on users; We’ve invested a lot of time and effort in making sure that there are tools in place to migrate content off of Vox, and that if folks are using Vox as their OpenID provider that there’s a solution in place for them.

If there’s a moral to Vox shutting down, it’s pretty simple: choose your OpenID provider with care. It would seem that the bigger the provider, the safer you are. Alternately you could be your own OpenID provider, ensuring that you retain control over your identity.

Six Apart’s blog does not give any reason for the shutdown, and the company did not respond to requests to comment on this story. However, it seems likely that Vox was simply supplanted by Facebook, Twitter and other, more popular means of sharing content with your web friends.

The social network landscape has also changed considerably since Vox launched in 2006. Much of the initial appeal of Vox — namely, its tightly controlled privacy — is less of a concern for many of today’s users.

See Also:

Sep22010
File Under: Browsers

Chrome 6 Arrives, Just in Time for Cake

Chrome6

Google is celebrating the second birthday of its Chrome web browser with the release of a new, improved version.

Chrome 6 arrives with an updated user interface, better syncing tools that include support for web form data and extensions, and — as should be expected with every new browser release these days — increased speed and numerous bug fixes.

If you don’t want to wait for Chrome to automatically update, head over to the download page and grab Chrome 6 for Windows, Mac and Linux.

Google’s browser is in an enviable position right now. It recently passed Safari in user share — new data from August shows the lead it snagged in June is stretching — and it’s gaining on Firefox and IE. Also, in a market where raw speed is the most important metric, Chrome is enjoying a solid reputation as the one of the fastest — if not the fastest — browser on the scene.

Worldwide Browser Share

Chrome has also had considerable impact on how other browsers in the market look and behave since it arrived in September, 2008. It kickstarted a shift toward minimal interfaces that Firefox and Internet Explorer are mimicking. Chrome also started the trend of tightly sandboxing web browsers to improve stability and security.

If you’ve been using early builds of Chrome 6, there isn’t much here that’s new, but if you’re upgrading from the older, stable release of Chrome 5 there are quite a few changes.


Continue Reading “Chrome 6 Arrives, Just in Time for Cake” »

Sep12010
File Under: HTML5, Web Standards

Using Microformats in HTML5

With all the attention being paid to HTML5’s <video> tag, few have clued in to what is perhaps the most useful magical pixie dust hidden inside the web’s next markup language: the new semantic tags.

Rather than using <div> tags to wrap your page sections, HTML5 offers much more sensible elements like <header>, <nav>, <section>, <article>, <footer>, <aside> and <time>.

Of course, cool as the new tags are, they don’t cover every situation, which is why, as with HTML 4, you can extend HTML5’s tags to add even more semantic meaning to your pages.

One of the more useful ways to extend HTML is with microformats — small chunks of semantic markup for address book info, event listings and machine-readable metadata. In HTML 4, this is done using the class, rel, rev and profile attributes, along with some established design patterns and nested tags.

However, HTML5 tosses out the rev and profile attributes and adds some new things like WAI-ARIA’s role and aria- attributes, as well as the new data- attribute system.

So where does that leave microformats? Well, the answer is a bit complicated, but our friends over at HTML5 Doctor recently dove into the confusion and have published a rough guide to what works in HTML5. There are some great tips, not only about implementation, but also what you should avoid and what might change in the future.

The article walks through a number of common microformats like address cards and licensing information, showing how they work in HTML 4 and what elements might be extended in HTML5 — like using the time element within the hCalendar microformat.

In the end, while the article has some caveats you should read up on, the good news is that you can safely use microformats in HTML5. Also, be sure to read through the comments on the post as Tantek Çelik, one of the authors of microformats, has some important clarifications and suggestions for using microformats in HTML5.

See Also:

Sep12010
File Under: CSS, Web Basics

How to Speed Up Your Site With YSlow and Page Speed

We all want our websites to load faster, but speeding things up can be tricky. There are numerous tried and true tricks we all use to keep page load times down, but once you’ve done a few rounds of optimization, you tend to hit a plateau where it’s tough to squeeze any more speed out of your code.

Most web developers are familiar with tools like Yahoo’s YSlow and Google’s Page Speed. If you haven’t ever used them, go install both right now — they’re available as add-ons for Firefox. Both tools are designed to help you speed up your site’s page load times by showing you exactly what’s slowing them down, and used in tandem, they can alert you to some optimizations you never knew existed.

I recently sat down and tried, as best I could, to do everything that YSlow and PageSpeed recommended and I managed to shave my page load time roughly in half. When I started, my homepage took between four and six seconds to load. Now, it loads in one to three seconds on average.

To compare load times I used both YSlow and PageSpeed, as well as WebPageTest. Those numbers aren’t exactly benchmarks, since there’s some speed variation depending on what’s loaded in the cache, but a performance increase of about 30-40 percent is what you can expect if you haven’t yet explored these methods.

Some of what YSlow and Page Speed will tell you should be obvious — limit your HTTP requests, minimize, compress and combine your JavaScript and CSS files, use CSS Sprites, put your script tags at the bottom of the page and compress your images.

However, some of the more obscure and less-used (judging by viewing source code around the web) techniques these tools point out can make a surprising difference.

Before we get to the “how to” part, keep in mind the old saying “premature optimization is the root of all evil.” What I did with YSlow and its ilk was the last bit of optimization I did. In other words, be sure you’ve taken care of the big problems before you try to stamp out the smaller ones.

That said, I was surprised by how much of a difference some very small changes made.


Continue Reading “How to Speed Up Your Site With YSlow and Page Speed” »

Aug312010
File Under: Browsers

Browsers Turn Their Backs on Old Macs

Word is out that Firefox 4, when it ships at the end of October or thereabouts, will probably not include support for older, non-Intel Macs.

Mozilla’s director of Firefox Mike Beltzner hinted at the change on a Mozilla developer mailing list last week: “I am gathering data on the number of PPC users we have, but the likely outcome is that we will not be supporting PPC for Firefox 4. More on that as I get the data.”

PowerPC Mac users have precious few options for modern web browsers these days. Firefox 3.6 will likely be the last Firefox option for PowerPC Macs, and Google Chrome only runs on Intel machines. Apple is still supporting PowerPC Macs with Safari releases, but the latest version, Safari 5, requires Mac OS X 10.5 or later — users still running 10.4 (Tiger) can only run Safari 4.1, which has many of the features found in Safari 5, but is likely the end of the line. Opera 10 runs on older PowerPC Macs, but it struggles. Opera 9 is more reliable, but has fewer features. Slim pickings, and getting slimmer.

Of course, the problem could be solved by upgrading. And we have — most of us already have second or third machines at this point.

Our aging computers, especially laptops, are often put into service as dedicated devices for streaming music, checking e-mail or browsing recipes in the kitchen. In today’s cloud-based world, you need a good web browser to do most of those tasks.

An old machine that still runs but doesn’t have a decent browser is basically worthless.


Continue Reading “Browsers Turn Their Backs on Old Macs” »

« OLDER POSTS