Newsletter

Subscribe to our mailing list

August 19, 2011
8 Ways to Increase Website Speed

8 Ways to Increase Website Speed


If your website is painfully slow, nobody is going to stick around. Studies and common sense say the longer a website takes to load, the more likely users will leave. Websites with poor load times can have higher operating costs. Website load times even affect your performance in search engines. Google states: "We've decided to take site speed into account in our search rankings".

Maintaining current visitors, reducing costs, and attracting additional visitors are a few reasons to consider optimizing your website's performance. Below are 8 great tips to help you bring down the load time. The two major factors that determine your website's speed are file sizes and the number of HTTP requests. Below covers how to reduce both of these for the best results.

1

External Scripts / CSS

To help speed up the initial download keep your scripts and styles separate from your content. This will allow your html page to load without interruption. If your scripts are not loaded externally, then the html will stop loading when the browser reaches the script code. The html will not resume loading until the browser is completely finished with the script. However, be careful not to load too many external files. Try to combine files when possible and only load files that are necessary for that particular web page.


2

Compress Your Code

When writing html, css, javascript, or any other code developers tend to write in a manner that's easy to read. This usually means several tabs or spaces with lots of line breaks. When it comes to files size each tab, space, line break, or key stroke counts. In order to bring that file size down you can "minify" it. You can insert your code into an online minifier and it will remove unnecessary characters that are only for readability. If you have large scripts or stylesheets, this can make a big difference. For easy editing, it's a good idea to have two copies: a normal file and a minified one, often with ".min" in the name. This way, if you need changes, you do it to the normal file then copy it into a minify service that will format the file for you. Once you have the new minified code, you can paste it into your .min file.

Here a just a few free services online:


3

Validate

Code Validation does play a role in good and efficient web development. If your website is free of errors then the browser can render it easier and quicker.


4

Optimize Images

Use an image editing software to optimize your images. Photoshop's "Save For Web" feature works well to optimizae your images. Be sure to select the best file type for the image. JPG is best for photos with a  variety of different colors. GIF is best for graphics with simple and solid colors and even simple transparencies. PNG is asimilar GIFs but works much better for transparencies and semi-transparencies. But be carefule with overuse of PNG files, as their file size adds up fast. Most image software will let you preview what it will look like and it's file size in these various file types. So, play around until you get the best looking image at the smallest file size.


5

Image Sprites

Image sprites are when you use one larger image that contains multiple images spaced out. An example might be a navigation with a roll over state. Instead of two separate images you can have the normal state and rollover state as one image right above the other then using css you can change the position of the background image to determine which one to show. This might not decrease the file size, but it will decrease your HTTP requests and ensure that your normal state and rollover are loaded at the same time. *Note: you are not limited to just two images for a sprite, I've seen an image that contains over 100 image sprites!


6

No Text Images

Sometimes you really want to design and emphasize text by using an image. But, this isn't always the best idea. Even outside of file sizes or HTTP requests, it hurts search engine optimization. Instead of using images, try using text and be creative with text elements using background images or CSS3. You can use non-web safe fonts on your site with extensions like Google Web Fonts: http://www.google.com/webfonts. But, this does increase download time (around 50kb), but can be worthwhile if you use this tool to replace just 5 images. It also means that text is now friendly to search engines.


7

Don't resize images in the code

The larger the original image, the larger the file size. So, re-size your photos using a program like Photoshop before you upload them. This will reduce the file size and increase the download speed.


8

CSS3

This one is a bit tricky. Because CSS3 is not supported in some outdated browsers (cough cough IE 7 and 8), you'll have to evaluate and use your best judgement. CSS3 can do several things that we previously used images and extra code to accomplish. Using CSS3 you can drastically reduce the amount of code and sometimes eliminate the need for images by implementing certain design elements, like rounded corners, gradients, and shadows using CSS3

Read our next post...

Marketing 5 “Must Do” Items to Enhance Your Marketing

Marketing Retargeting: Never Lose Sight Of Your Website Visitor

Web Dev Quality Websites Need Quality Typography

Marketing Web Development Meets Web Analytics: The Knowledge Gap

Web Dev Responsive Design: It's More Than Just Design

Marketing Economic Summit 2017

Marketing Mary Meeker's Global Interent Trends

Marketing, Web Dev A/B Testing: Getting the Most out of Your Site

Marketing, Web Dev Upping the Ante: Interactive Content

Marketing, Web Dev Google’s SEO Best Practices: A Starter Guide

Marketing Creating Timeless Content to Boost SEO

Marketing, Web Dev 2017 Research Recognizes 10 Pound Gorilla as a Leader in SEO

Marketing, Web Dev Designing an Elegant Website using Whitespace

Marketing, Web Dev Test Your Website’s Success Using Heat Maps

Marketing Start Fresh, & Advertise with Facebook!

DNN, Marketing, Web Dev 2017 DNN Summit Sessions

Marketing, Web Dev Web Design: The Past, The Present, & The Future

Marketing, Web Dev Intrusive Pop-Ups to be Penalized by Google

Marketing The New Wave of Advertising: Native Ads

DNN, Web Dev Proud Sponsor of DNN Summit 2017

Marketing Moving to Mobile

Marketing, Video Power of Video

DNN If you’re a DNN user, your site could be vulnerable to hackers

Marketing, Video The Art of Retargeting: How it works and Why You Should Retarget

DNN, Marketing, Web Dev 10 Pound Gorilla Named Top Ten Denver Web Development and Digital Marketing Agency by Clutch.co

Marketing 10 Tips to Design Your Website for Lead Generation

DNN, Marketing, Modules, Web Dev DNNCON: Thank You!

Marketing 10 Ways to Incorporate Direct Response Marketing with Print Media

DNN, Marketing, Web Dev 10 Pound Gorilla... One of Denver's Top 10 Digital Marketing Agencies

Marketing How to Turn Social Media Fans Into New Customers

Marketing Your Facebook Likes No Longer Matter!

Web Dev Is Google Going to Penalize Non-Mobile-Friendly Websites?

DNN DNNCON: Thank You!

DNN, Modules, Web Dev From Ordinary To Extraordinary

DNN, Marketing, Modules How to Sell, Quote or Budget for a DNN E-commerce Website

Web Dev Getting Users to "Respond" to Your Mobile Menu Designs

DNN, Web Dev DNNCON: Editor.css

Marketing Getting The Conversion

Marketing Tips for Writing Effective Newsletters

Marketing Why Should You Have a Newsletter?

Marketing Writing Copy That Will Actually Be Read

DNN Editor.css: Giving You & Your Clients Less Headaches

DNN, Web Dev Connall Cosmetic Surgery: Case Study

Web Dev Making the Case for a Responsive Site

DNN, Modules, Web Dev March Module Madness: Dynamic Forms

DNN, Modules, Web Dev March Module Madness: Ventrian News Articles

DNN, Modules, Web Dev March Module Madness: Form & List

Marketing 5 Tips to Online Marketing

Marketing How the Name "10 Pound Gorilla" Came to Be

Marketing Creative Online Marketing: Groupon & Living Social

Marketing Promoting Your Business With Instagram

Marketing Using Your Blog to Boost SEO

Marketing Suprising Social Media Facts & What You Should Do

DNN, Web Dev DNN Con 2013: Mobile Navigation

DNN, Web Dev DNN Con 2013: Determining What Makes the Mobile Cut

DNN, Modules, Web Dev DNN Con 2013: DDR And JQuery. More Than Just Hover And Drop Down.

Web Dev A Mobile-First Approach to the Web

DNN Southern Fried DNN: Best of both worlds: Great Design and Flexibility

DNN Southern Fried DNN: Different skin designs from just one skin file

Web Dev The Future of the Web: HTML5

DNN Dot Net Nuke World 2012 Speakers & Sponsors

Marketing Google Places is now Google+ Local

DNN, Marketing Day of DNN - Using DNN to Feed Data to Several Social Portals

DNN, Marketing Day of DNN - Easy to Use Strategies for Writing & Submitting Articles to Increase Inbound Links

DNN, Marketing Day of DNN - How to Optimize Your Socialization

DNN Guest Speakers at Day of DNN!

Marketing Enticing Your Followers with Fresh Content: A How To Guide

DNN, Web Dev What Can Website Templates Do For You?

Marketing Getting Up in the Ranks Through SEO

DNN, Modules Best DNN Shopping Cart

Marketing Enter into the "Timeline"

Marketing Making Your Facebook Business Page Secure

Marketing Get Your Tweet-Face On

DNN, Marketing Google Analytics and DNN

Marketing What is Social Media and What Can It Do for You

DNN Advantages of DotNetNuke

Web Dev 8 Ways to Increase Website Speed

Marketing Beyond Facebook and Twitter, Get "In" with Social Media

Web Dev 8 Great Website Development Tools

Web Dev Your Website & Internet Explorer

Marketing What is Google +1

Web Dev What is "The Cloud"?

Succeed

Contact 10 Pound Gorilla Today
for Your Free Consultation

or Call {970} 726.5144 or Connect