Posts Tagged ‘optimization’
Nielsen’s mobile phone statistics for the third quarter showed smartphones now account for more than 28 percent of the entire U.S. cellphone market. As such, mobile smartphone applications (apps) are the newest “must-have” item for retailers and businesses wanting to connect with tech-savvy consumers.
While mobile apps definitely have the potential to build your business by engaging customers in unique ways, many overlook a logical starting point: making your website mobile friendly. Some businesses have chosen to circumvent website compatibility and usability issues by offering apps that try to provide the same features as their website. While apps do have their time and place, they are not the silver bullet.
The benefits of mobile website optimization vs. applications include:
- Better Compatibility: apps are extremely platform specific, meaning that without having an app on each platform, you are alienating a portion of your potential traffic. As opposed to developing mobile applications for 2, 3 (or more) platforms, one standard website optimized for all smartphones can be accessed anytime on any device.
- Lower Cost: many times the mobile website can deliver the same functionality as would a stand-alone application at less than half the price of a full-fledged app. You may get more bang for your buck from the properly optimized mobile site than you would from an application.
- Customer Usability: the end-users experience is ultimately what matters. While applications can serve advanced purposes, it can still be difficult to navigate simple sites if it’s not properly optimized for finger-based browsing.
- Maximum Reach: mobile websites can reach a broader audience than can an individual app, based on the fact that they are aligned with your businesses website.
- Ease of Implementation: mobile websites do not require the download, installation and use of a particular operating system in order to be used. As recent research has shown, 62 percent of apps are deleted within two weeks of being downloaded, which can hurt if your investment depends on the apps long term use.
In order to make the case for mobile sites, it is important to look at the market and an increasing percentage US adults use their smart phones to browse the web; as the next generations of smart phones are launched, mobile browsing will only continue to grow. Many carriers are also requiring mandatory data plans with the sale of web-enabled phones, anticipating the growth of mobile web use.
Additionally, many non-phone mobile devices use a “limited function” browser to browse the web. This includes tablet devices such as the iPad and Amazon’s Kindle Reader. These devices also usually benefit from a mobile site, though not as significantly as smart phones.
This presents challenges to many companies who have invested in a very good and very effective website, but suffer from it being incompatible with mobile browsers, or just plain difficult to use on mobile devices.
Specifically, sites programmed in Flash are currently not compatible with almost any phone browser. Flash sites are excellent tools for traditional desktop browsers, and provide great tools for customer engagement, but are completely dysfunctional on mobile phones. Even if this changes with some of the new OS launches and upgrades this year, Flash sites will still require some mobile optimization to exhibit the same level of effectiveness.
None of this is meant to completely discount the value of apps for the right situation, just to emphasize that taking a step back to start with the overall mobile browsing experience makes sense. Apps and widgets definitely have their place and may ultimately work better for your particular business – but don’t ignore the basics when it comes to mobile website optimization.
Google recently announced that they began factoring in web site load time into their search engine ranking algorithm. This has brought the importance of a fast load time front and center even though “fewer than 1% of search queries will change as a result” of this update. MentorMate.com likely was not impacted very significantly from this change to Google’s ranking algorithm; however, we still decided to optimize our site’s load time. We did this because Google showed that “delays of under a half-second impact business metrics.” It’s better to be safe than sorry, and besides, it’s not that difficult to optimize your site. We recommend you do the same with your web site, here are nine easy ways to do just that:
1. Place scripts near closing body tag
Scripts block parallel downloads. While a script is downloading, the browser will wait until it finishes before downloading anything else. This is why it is recommended that you get everything else out of the way before having your users download scripts.
2. Remove any broken links/references
Simply enter your web page URL in Pingdom’s Full Page Test Tool. This tool will color-code any broken links/references in red so you can easily identify them.
3. Specify image dimensions
When image dimensions are not specified in the HTML and/or CSS of a web page, the web server must spend resources calculating these dimensions. It’s particularly important to specify the dimensions of images being used in conjunction with heavy Javascript image-manipulation libraries.
4. Localize external file references to minimize DNS requests
This is another spot in which Pingdom’s Full Page Test Tool comes in handy. Enter your URL and look for any file references to external domains. If possible, copy these files onto your own domain and link to them locally to minimize DNS requests.
5. Minimize slow-loading libraries and external widgets
Libraries and external widgets need to be chosen carefully. Sometimes it’s worth sacrificing load time for particularly engaging/useful libraries and/or widgets; however, sometimes you can live without the library and/or widget. For example, on MentorMate.com we felt it was worth sacrificing Sexybuttons for better load time, but sacrificing load time for Shadowbox. External widgets can be particularly bad for a site’s load time because of their reliance on external servers.
6. Compress your files using gzip
These days, gzip comes pre-installed on most web servers. You can check to see if gzip is running your server quite easily using Google’s Firebug “Speed Test” extension. Open Firefox, visit the web site you’d like to optimize, and open Firebug. From there, click “Analyze Performance” and select the “Resources” tab. Then you can expand any file to view details. If gzip is installed and compressing the element you are viewing, you will see what is highlighted in red in the following screenshot:
7. Merge Javascript and CSS files or use Minify
Depending on the complexity of your site, it can be quite time consuming to merge all CSS into one file. The same goes for Javascript. This is why Minify was developed. Minify “combines multiple CSS or Javascript files, removes unnecessary whitespace and comments, and serves them with gzip encoding and optimal client-side cache headers.” Then you simply need to install it on your site, select the files you want it to serve together, change some references in your header, and you’re good to go. This will minimize your site’s load time by further helping to reduce HTTP requests.
8. Load cross-browser compatibility hacks only for necessary browsers
For instance, we use the IE PNG FIX for IE6 PNG transparency compatibility. This script adds an extra second to web site load time. For this reason, we only load the script if the visitor is running IE6 by applying an IE6-specific stylesheet which references the IE PNG FIX. This way the extra load time will only impact IE6 visitors.
We simply added the following line of code to our header:
<!--[if IE 6]><link rel="stylesheet" type="text/css" href="css/ie6.css" /><![endif]-->
9. Use CSS sprites to minimize HTTP Requests
A CSS sprite is the combination of multiple images into one. Then CSS is used to reference different aspects of the image where needed. This reduces load time by minimizing all of these images into only one HTTP request. CSS Tricks has a good example of CSS sprites.
We did performance tests on several methods of paging implementation and found the fastest one:
DECLARE @PageNumber INT DECLARE @PageSize INT SET @PageNumber = 2 SET @PageSize = 10 SELECT TOP (@PageSize) * FROM ( SELECT ROW_NUMBER() OVER (ORDER BY FieldA) As RowID, FieldB,FieldC, TotalRows=COUNT(*) OVER() FROM TheTable ) TmpTable WHERE TmpTable.RowID > ((@PageNumber-1)*@PageSize)
One significant advantage of this implementation approach is that there is no need for a second query that returns the total count of the paged data. The total record count is returned as a column in the result set. This minimizes the number of queries that are needed to return a paged result set. If not needed, the “TotalRows” column can be removed from the query.