Batch optimise Images with a single command
I find the Page Speed tool from Google extremely helpful for optimising my websites. I have a tip which can save time if your website is failing the “Optimize Images” test. Using the in-built Smush.it is one option but if most of your images are jpegs, you can achieve the same result and save time […]
Why does some website text look bad on Windows?
Look at the difference between these two 50px headers that use the Georgia font: The top one is from IE8 on Windows Vista, whereas the bottom one is from Firefox 3.0.15 on Ubuntu 9.04. On Windows, the text is clearly less pleasant on the eye? It is has jagged edges, has a pixel or two […]
Supporting image alignment in your WordPress theme
If you are making a WordPress theme you owe it to the user of your theme to make sure image alignment works as expected. Most of the Visual Editor formatting buttons use inline CSS which won’t be affected by the theme but this is not the case with the alignment buttons in pages/posts when applied […]
Using the Purisa Light font on a Website
If you want to use the “Purisa Light” font on your Linux hosted website, you can follow the following steps: Copy the font file from your desktop machine to your webserver. On Ubuntu the “Purisa Light” font file is located at /usr/share/fonts/truetype/thai/Purisa.ttf. e.g: scp /usr/share/fonts/truetype/thai/Purisa.ttf <username>@<webhost>:/<pathToWebsite>/fonts/Purisa.ttf Add the font face to your stylesheet: Now you […]
Show more than 10 items in a Amazon Carousel
What is a “Amazon Carousel”? It is a advert showing a bunch of items you can buy on Amazon: Amazon.co.uk Widgets Amazon put a limit on the number of items in a carousel. However, if you have more than 10 items, you can use a little javascript to select 10 at random so a different […]
Website Templates, Themes and Inspiration
Are you looking for website templates you can buy or borrow? Here’s a handy list: Buy: Template Monster BuyTemplates.net Pixelwave Web Design Theme Forest Borrow: Open Source Web Design FreeCssTemplates.org Also, here’s some good links for inspiration: BlogSpoonGraphics.co.uk TheDesignInspiration.com CSSLuxury.com Line25.com WPFloat.com (WordPress designs) DesignBombs.com MixCSS.com
Clearing floats with pure CSS
Do you ever use <br style=’clear:both’ /> or <div style=’clear:both’></div> in your webdesign? If you do, stop now, there is a better way to prevent subsequent page elements being affected by the previous floating sections: Bad: Why is it bad? <br style=’clear:both’ /> is bad because it introduces a blank line when you actually only […]