SEO can be tricky. The search engines are doing their best to index your site’s relevant content, but there are things you can (and should) do to make sure they are successful.
Read MoreArchive for the ‘Code’ Category
Frontend Optimization, pt. 5
In the fifth and final part of our multi-part Frontend Optimization series, I’ll cover my notes from Steve Souder’s “High Performance Websites” and “Even Faster Websites” books that can help optimize your images and javascript code.
Optimize Javascript Code
- Minimize DOM Access. Manipulating the DOM is very resource intensive for browsers.
- Smart Event Handlers. Use Event Delegation. You can put on event handler on a container div and then figure out which button inside that div was actually clicked in the function to be executed.
- Reduce size of private functions (those called only within the js itself, not those called in other documents). So function foobar() would become…
Frontend Optimization, pt. 4
In the fourth part of our multipart Frontend Optimization series I’ll cover my notes from Steve Souder’s “High Performance Websites” and “Even Faster Websites” books that can help reduce your file sizes and configure your Apache settings to squeeze out more speed.
Reduce File Sizes
- See optimizing images for reducing image sizes.
- Minify CSS and JS files. Use Google’s Closure Compiler for JS and ICEY for CSS.
- Minify HTML files with HTML Tidy.
- Reduce file size with using relative links including //subdomain.example.com instead of http://subdomain.example.com
Configure Apache and .htaccess
- Disable ETags
- Add future expires headers
- Enable GZip Compression
- Since 15% of users don’t have gzip due to proxies you can override that with gzip detection. See…
Frontend Optimization, pt.3
In the third part of our multipart Frontend Optimization series I’ll cover my notes from Steve Souder’s “High Performance Websites” and “Even Faster Websites” books that can help optimize your HTML and CSS code.
Optimize HTML Code
- Get rid of iFrames if possible. They’re by far the slowest dom element and even prevent onload from firing until the onload of the frame src is finished. Also stylesheets will block the iFrame from loading. iFrames also share the max connections with parent. 2 connections per server don’t turn into 4 because the iframe src is on another server.
- Get rid of table based layouts. This isn’t always the…
Frontend Optimization, pt.2
Ordering of Assets
In the second part of our multipart Frontend Optimization series I’ll cover my notes from Steve Souder’s “High Performance Websites” and “Even Faster Websites” books that can help optimize how you order and attach assets on your website.
- Put JS files at the bottom of the html if possible.
- Ensure that your stylesheets come last in the <head> (after any scripts attached in the <head>.)
- Make all CSS and JS files External. This leads to better caching of assets. If they’re inline they have to be downloaded every time.
- Don’t use @import it causes download order to be wacky in IE and if its used with…
Frontend Optimization, pt.1
In this first part of our multipart Frontend Optimization series I’ll cover my notes from Steve Souder’s “High Performance Websites” and “Even Faster Websites” books that can help reduce HTTP Requests on your website.
- Combine as many background images that don’t tile into sprites as possible while checking to ensure that larger images combined don’t increase file size.
- Combine js files into one single file. Note: Checkout Sprockets, getsprockets.org
- Combine all of the CSS files into one file.
- Remove any assets you’re not using such as, images, js files, stylesheets, movies, audio files, etc. It may seem obvious but sometimes they slip through the cracks during…
Generic Twitter Widget using jQuery Template Plugin
I swear on every new project I start, I’m always recreating the same old twitter sidebar widget. NEVER AGAIN! I finally sat down and made an extremely generic widget that with some css tweaking, should be able to fit into every project.
A few minor features it includes:
- Linkifying twitter text — adds links to #hash tags, @replys and standard links.
- TimeAgo function — The twitter API sends the time the tweet was created using a funky time format. This function returns it in a more pretty form such as “3 hours and 26 minutes ago.”
- Loading icon until tweets are received from the…
SXSW 2010
Being involved in the web industry, one event always comes to mind when talking about big conferences, South by Southwest. One of my New Year’s resolutions was to attend this event to see what it had to offer and to experience what all the commotion was about. I have to admit, SXSW was my first real conference, so I don’t really have anything to compare it to, but from what I have heard and what I experienced, it’s hard to compare it to anything in the first place.
Before heading to the conference I did not really know what to expect.…
Read MoreWhat I’ve learned: Time for the ad industry to catch up.
Ok, everyone take a deep breath. I’m not going to go on an endless rant on why I think more companies need to modernize their approach to rich media ads……or am I? (cue evil laugh) Ahhhh-ha-ha-ha-ha.
What I will say is that a little more progressive thinking would help cut out a lot of the senseless number of versions required for some companies running rich media ads and also (potentially) increase your margin for success. So how did I come to this conclusion? Through recent conversation with some ad partners and also jumping through a technical hurdle or two.
We recently…
Read MoreWhy 2010 is Going to be a Great Year for HTML/CSS Developers
With 2010 just getting started we’ve already seen many impressive developments in the world of HTML/CSS that have paved the way for a promising year for us HTML/CSS developers.
Read More
