Posts Tagged ‘css’
I was performing a bit of optimization on one of my WordPress blogs and wanted to clean up the header. The default installation of WordPress adds quite a bit up there and this bloat can be compounded by a theme’s own customizations. After quite a bit of searching around Google, I came up with a clean solution. Here is what I did to help de-clutter my theme’s header.
Read the rest of this entry »
WordPress is my favourite blogging platform and CMS as you can guess from the types of posts you may have come across here. It’s amazing flexibility is due to the tremendous plugin contributions that WordPress fans have written. While adding plugins can definitely add a variety of functionality to your blog, however, this does not come without a cost. Here, I will show you one small technique you can employ to improve your WordPress website performance, specifically as it concerns CSS files.
Some WordPress plugins will make calls to their own external CSS stylesheets. These stylesheets are usually called for within the WordPress header. Now, as proper coding has probably taught you, external stylesheets are a good thing and you should avoid inline HTML styling. However, if you have ever run Firebug and YSlow for Firebug (both are Mozilla Firefox extensions) and are obsessed with website performance you will notice that reducing the number of HTTP requests is also a good thing. This is actually logical: if you reduce the number of files a browser has to download in order to view your website then you can increase page loading speed. Combine this with server-side compression and your web pages will feel like they are on steroids! You may be asking yourself, “How does this apply to plugins and does reducing the number of HTTP requests involve losing site functionality?” The answer, “[Wow! That was a long question!] No, you do not lose site functionality and you can see how below.”
There are a few websites you visit frequently, but some of them could use a makeover. Perhaps the entire styling of the site could be improved for visual attractiveness or tweaked for improved usability. Before I found out about Stylish, I did not think this was possible. However, after applying some of the custom CSS found at userstyles.org I realized that I could customize the look of a few very popular websites I frequently visit and even create custom styles myself!
The Stylish plugin works within Mozilla Firefox (there are alternatives for other web browsers) and enables you to use your very own stylesheet to determine how you want a particular site to look. Many users have submitted their own styles for a few popular sites that you can take a look at. Just load the style into Stylish and the changes take effect immediately! My favourites are the ‘Google web search – dark grey redesign (vC)‘ and ‘Gmail Redesigned (by Globex Designs)‘ styles, the latter of which works in both Gmail and Google Apps E-mail.
In addition to site styling, there are also App Styles that can replace quite a few extensions available as separate plugins. Should you want to try your hand at customizing the style of your own, read through the Honestly Illustrated guide that goes into a lot of depth about the tools you will require.
I am quite fascinated with this plugin and what it can do. There are always new styles to discover and test out. One word of warning, however, is to constantly check for updates on your custom styles. As sites undergo changes, these changes will have to be adjusted for in the custom user styles. Sometimes functionality may break, but deactivating the style is usually a quick short-term fix. Enjoy!