DNN Theming Tips and Tricks

Striking a Balance between Design, SEO and DNN - Part 2

By Ralph Williams, Jr. on 6/10/2013

I have been seeing quite a few references to Google talking about website speed lately. It seems as though Google is going to consider your websites speed in an effort to "make the web faster." (read article here) I like it.

I think there should be more of an emphasis on making the web more usable and speed is a major factor. This can seem like a challenge when it comes to DotNetNuke because so much of it is out of our hands (mostly because I am a designer and skinner, not a programmer).

Less is More

So, what can we do to make our sites more speedy? One thing that I have been working on for some time is to reduce any code bloat in my skin. I have done this by abandoning the table layout for a pure css layout. I have seen some nice improvements on page load by doing this.

One benefit that I have is that I usually design the sites that I skin, so I plan ahead for this while I am designing. I have become a firm believer in “less is more” and anyone who has been around me can attest to the fact that I keep saying that. I make my layouts less complicated to make the code needed to make the design as small as possible, trying to make the content to code ratio be heavy on the content side.

Google even talks about minimizing payload sizes and optimizing browser rendering. This is an area that I still need to improve on. A problem that I run into is that some of the default DNN files are not speed optimized. The Default.css as well as the Module.css were among the files that were not optimized. There is an Unload CSS Skin Object by Timo Breumelhof that is worth a look. This will remove any unwanted/unneeded style sheet references which will help in reducing server requests and reduce payload size. I plan on trying it out on my own site sometime soon and seeing what kind of difference it will make.

Something else worth taking a look at would be Mitchel Sellers’ article: “Simple DotNetNuke Performance Improvements

Related Links:

Google’s Page Speed tool: http://code.google.com/speed/page-speed/index.html

Unload Css Skin Object: http://dnnskinextensions.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=31187

Remember, this is just one of the many things that can be done to improve your DNN website’s speed. I didn’t even touch on image splicing, combining JavaScript files, compression, and so on. So, please, feel free to add any other techniques that you have come across for improving your DotNetNuke website’s speed.