Rob Larsen

Archive for the 'tips-and-tricks' Category

rel="canonical?" I'm Down. More Importantly, So Are Yahoo! and Google

In the middle of moving all those underscore delineated URLs to dash delineated URLs*, Google went ahead and announced the rel="canonical" scheme for defining the preferred URL for a piece of content. While it's not the biggest deal for me, other than the "/" vs "/index.php" question, for many people with more dynamic systems it's a big deal. Bravo to everyone involved as it's a really straightforward, easy-to-implement solution to a common, troublesome problem.
(more…)

Code I Like – Link Prefetching

I was reading John Resig's Browser Page Load Performance post earlier today and followed up from there on the concept of Link prefetching. Currently supported by Firefox 2+, Link prefetching is a browser based mechanism for fetching "future" content. Considering I wrote (and ultimately scrapped*) similar functionality for my gallery pages, I was obviously intrigued.
(more…)

Webmonkey Relaunches and I Flashback to the 90s

For real! I ran through all of the primordial webmonkey tutorials* when I was starting out building sites (10-11 years ago now!) and if the newly relaunched site is half as helpful it will be a great boon to the community. Great info and a friendly, funny attitude made it the place for me to learn about the web thing back in the last century. Honestly, I owe a lot to the usefulness of those early tutorials. Looking back on it I realize that Webmonkey, coupled with the community that sprang up around Dreamweaver at the time**, was a great forge upon which to build up my web chops.

We're Back! Webmonkey Relaunches, Rejoins Wired

The original web developer's resource has returned. Webmonkey has been completely redesigned, and we're ready to rock once more. Also, our entire content library is now hosted on a wiki, so every tutorial, reference page and code example is open for editing. Come on in and show us what you've got!

Webmonkey: the Web Developers Resource

*Some still exist: like Thau's JavaScript Tutorial, which is over ten years old now.

**I've been a Dreamweaver user since Version 1.2.

Google Doctype – First Pass? Very cool.

Google Doctype, as introduced by Mark Pilgrim:

The open web is the web built on open standards: HTML, JavaScript, CSS, and more. The open web is a beautiful soup of barely compatible clients and servers. It comprises billions of pages, millions of users, and thousands of browser-based applications. You can access the open web with open source and proprietary browsers, on open source and proprietary operating systems, on open source and proprietary hardware.

Google has built its business here, on the open web, and we want to help you build here too. To that end, we are happy to announce the formation of an encyclopedia for web developers, by web developers: Google Doctype.

Google Code Blog: Introducing Google Doctype

Personally, I'm excited by this development (both practically and philosophically) and will likely contribute wherever it makes sense for me to lend a hand. Looking at it quickly some of the HOWTO information is already very useful (the web security information especially) and it will only improve with time as more and more dedicated people get involved with the project.

Twenty New Yahoo! Performance Breakthroughs

I don't know how many of these are "breakthroughs," but if you really are getting an A (and even if you're not), you might want to take a look at the following enhancements to squeeze the most out of your site's performance:

Looking at the list, many are already very familiar to me, but there are definitely a couple I'm interested in learning more about- more than a full bullet points in the above slideshare. Hopefully the teaser of "more detail coming soon" in the YDN blog post will come to pass sooner rather than later.

And no, I don't yet score an A, but I do get a 96 for the components I fully control, so I'm more than happy to look to other suggestions (like the ones below that I don't already practice) to get this place running a little quicker.

1. Flush the buffer early [server]
2. Use GET for AJAX requests [server]
3. Post-load components [content]
4. Preload components [content]
5. Reduce the number of DOM elements [content]
6. Split components across domains [content]
7. Minimize the number of iframes [content]
8. No 404s [content]
9. Reduce cookie size [cookie]
10. Use cookie-free domains for components [cookie]
11. Minimize DOM access [javascript]
12. Develop smart event handlers [javascript]
13. Choose over @import [css]
14. Avoid filters [css]
15. Optimize images [images]
16. Optimize CSS sprites [images]
17. Don't scale images in HTML [images]
18. Make favicon.ico small and cacheable [images]
19. Keep components under 25K [mobile]
20. Pack components into a multipart document [mobile]

More at the YDN blog:

Yahoo!'s Latest Performance Breakthroughs