Blog
Hot Off The Press
- Pixar Almost Lost Toy Story 2
- Web Tips 2: JavaScript – The Drama Queen
- An Honestly Good Time
- Web Tips 1: I’ll Have a Sprite.
- Project Glass
- Acid Drops
- Folklorama Behind the Scenes
- Flying like a bird with “Human BirdWings”
- Design Matters
- Lightning and the Milky Way from Space
Who Do You Love?
- Andrew McCrea
- Callum Beattie
- Charity Scantlebury
- Erin Heroux
- Jadyn Klassen
- Kerri Wilkinson
- Sherril Matthes
- Trisha Burch
Categories
- Advertising
- After Hours
- Awards
- books
- Branding
- Business
- Company News
- Design
- gaming
- General Life
- Humour
- Illustration
- Inspiration
- Motion
- Movies
- Music
- National News
- Newest Work
- Newest Work
- Packaging
- Photography
- Printing
- Retail
- Technology
- Tips
- travel
- Typography
- Uncategorized
- Video
- Video of The Week
- Web
- World News
Archives
- May 2012
- April 2012
- March 2012
- January 2012
- December 2011
- November 2011
- October 2011
- September 2011
- August 2011
- July 2011
- April 2011
- March 2011
- February 2011
- January 2011
- December 2010
- November 2010
- October 2010
- September 2010
- August 2010
- July 2010
- June 2010
- May 2010
- April 2010
- March 2010
- February 2010
- January 2010
- December 2009
- November 2009
- October 2009
- September 2009
- August 2009
- July 2009
- June 2009
- May 2009
Web Tips 2: JavaScript – The Drama Queen
Today I'm going to talk about an easy, 10 second change that might be a little bit more common but maybe not totally wide known. This tip comes from the book Even Faster Web Sites by Steve Souders. It's definitely an interesting read as it dissects (and sometimes even casts a light of shame on) some of the biggest websites like Google, Facebook and Wikipedia. What is this wonder cure? All of your JavaScript <script> tags should be placed just before the closing </body> tag instead of in the <head> tag. How can this make such a profound change? Part of it is perception but it also has a simple technical explanation. Script tags are blocking and as soon as the browser encounters one, it stops what it's doing to process the JavaScript. It does this on the assumption that JavaScript dynamically changes the website document (which is usually true), so <script> tags get some of the highest priority. Placing Facebook's JavaScript for the Like button(s) at the bottom also works despite what their developer instructions say. As for the perception bit, the browser encounters your CSS at the top, parses your HTML and applies styles to it immediately, then blocks to load the JavaScript at the bottom. It is faster, but it also makes it seem even faster than the actual performance gains.
POSTED IN: Uncategorized Leave a comment »
Web Tips 1: I’ll Have a Sprite.
To get in the habit of blogging more, I'm going to share some tips I use to develop better performing websites. This might be a little technical for the average person but anyone who has dabbled in HTML and CSS recently should be able to follow along just fine. Today I am going to cover CSS sprites—a simple way to consolidate template images to reduce requests to the server. They are used by the biggest websites and I first learned about them 2 years ago by studying Facebook's HTML code with Firebug. I tend to take frequently used images such as the logo, icons, ribbons and shapes, and I lay them out in Photoshop in one image using a grid. My grid is usually made up of 5px squares with 25 or 50px divisions. I have a CSS class, usually titled .main_sprite, that contains my sprite as a background image and other classes for each image on the sprite such as .logo. My logo class would contain my normal rules, such as the width and height of the element and also the position of the logo image on the sprite. I simultaneously write the CSS code as I create the sprite so that I can lock down the co-ordinates. Here is an example:
.main_sprite{background-image:url('sprite.png');background-repeat:no-repeat;}
.logo{width:200px;height:100px;display:block;background-position:-100px -50px;}
In the HTML, I would create my logo like this:
<a href="index.php" class="main_sprite logo"></a>
That's all there is to it! You now have one large image that you might be using in place of 20 different images, but the server isn't opening and processing 20 different connections. You also have the benefit of more effective browser image caching as the image was loaded via CSS which leads to all around gains.
TAGS: programming, web design
POSTED IN: Technology, Tips, Web 2 Comments »
What happened to Christmas?
I'll start off by saying that I'm as far from organized religion as you can get (I'm still spiritual). Almost everyone I know celebrates Christmas and it's pretty hard to avoid the commercialism in general, what with Scotiabank in Winnipeg Square putting it's tree up in September, for example. I truly want to believe that Christmas is a time to come together, to decorate with blinking lights, and Irish coffee season, but today's news out of America regarding Black Friday "Christmas" shopping is just ridiculous. Here's a small overview: someone pepper sprayed 20 other shoppers at Walmart in numerous departments, 2 people have been shot and 3 people have been robbed. This gives "Macy's" a whole new connotation. There's also been reports of crippled websites, with one person commenting on a forum "screw them. I'm not ordering jack if they can't get their system to work properly. Sent off a nasty email which I'm sure they'll ignore." EARTH TO AMERICA: I'm pretty sure you're doing this Christmas thing wrong. I'd be incredibly embarrassed about this international news, just as I was for Canada with the Vancouver riots. I'm well aware Christmas has nothing to do with it's roots anymore—that's not the point of this post. The point is that in an overly-communicated society, this behaviour becomes more common place and sets an example for younger people. Christmas now dominates 3 months of the year and cheap plastic crap will ALWAYS be available on store shelves. At the very least, could we try to be nicer to each other? It really doesn't take much, nowhere near as much as it does to premeditate a pepper-spray attack; it actually feels kind of good. Forgive me for skipping gifts this year. I'll be with my family, in my house-coat enjoying Irish coffee.
POSTED IN: After Hours, Business, General Life, World News Leave a comment »
The Web Department Just Got A Lot More Social…
Andrew here, coming to you from the *honest agency web department, where this week we've rolled out a Facebook application on the cityplace Winnipeg page. Programmers are usually know for being so busy building the web, that they have little time to really socialize face-to-face, but this cityplace application presented some unique challenges, and I certainly added a lot to my skill set. For instance, I already know how to build a website, so the fact that Facebook applications are websites that run inside the Facebook template gave me a good head start, but then you need to 'talk' to Facebook to get some information from the users of the app, such as an email address, name, and profile picture.
POSTED IN: Uncategorized Leave a comment »