CSS: Font Stacks

http://articles.sitepoint.com/article/eight-definitive-font-stacks

Font stacks are a useful, practical way of achieving richer, more unique web typography than that dictated by sticking to only web-safe fonts (and without waiting for CSS3 web fonts to gain wide-spread support from browser vendors and font foundries). However, a reliable font stack must take into account a number of factors, not just the number of users that have one specific font installed.

The Times New Roman-based serif stack:

font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;

A modern Georgia-based serif stack:

font-family: Constantia, "Lucida Bright", Lucidabright, "Lucida Serif", Lucida, "DejaVu Serif," "Bitstream Vera Serif", "Liberation Serif", Georgia, serif;

A more traditional Garamond-based serif stack:

font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;

The Helvetica/Arial-based sans serif stack:

font-family: Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;

The Verdana-based sans serif stack:

font-family: Corbel, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", Verdana, "Verdana Ref", sans-serif;

The Trebuchet-based sans serif stack:

font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Bitstream Vera Sans", "Trebuchet MS", Verdana, "Verdana Ref", sans-serif;

The heavier “Impact” sans serif stack:

font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", Charcoal, "Helvetica Inserat", "Bitstream Vera Sans Bold", "Arial Black", sans-serif;

The monospace stack:

font-family: Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;

Tags:

No Comments

aviary

aviary is a great image manipulation / creation / everything else tool.  Perfect for people who don’t want to pay for adobe software.  It’s free to use.  So for clients who need to crop images, etc…. we should prepare a few guides, etc….

No Comments

Magento Here we Go!

I’ve installed a version of Magento (magento-1.2.3.2.4) on the server and after adding a couple of PHP extensions… all set to go!  We need at least LA(2.2)M(4.1.20)P(5.2.0), SMTP, extensions:

  • PDO/MySQL
  • mcrypt
  • hash
  • simpleXML
  • GD
  • DOM
  • iconv
  • mod_rewrite
  • SSL

Get ready to install….

chmod 777 var/.htaccess
chmod 777 var/ -R
chmod 777 media/ -R
chmod 777 app/etc -R


                      

Tags: ,

No Comments

Canonical URL’s for WordPress

canonical:

basic definition: reduced to the simplest and most significant form possible without loss of generality; “a basic story line”; “a canonical syllable pattern”

It’s common for a site to have several pages listing the same set of products. For example, one page might display products sorted in alphabetical order, while other pages display the same products listed by price or by rating. For example:

  • http://www.example.com/product.php?item=swedish-fish&trackingid=1234567&sort=alpha&sessionid=5678asfasdfasfd
  • http://www.example.com/product.php?item=swedish-fish&trackingid=1234567&sort=price&sessionid=5678asfasdfasfd

If Google knows that these pages have the same content, we may index only one version for our search results. Our algorithms select the page we think best answers the user’s query. Now, however, users can specify a canonical page to search engines by adding a <link> element with the attribute rel=”canonical” to the <head> section of the non-canonical version of the page. Adding this link and attribute lets site owners identify sets of identical content and suggest to Google: “Of all these pages with identical content, this page is the most useful. Please prioritize it in search results.”

WordPress has traditionally been very lenient in the URLs that it will accept.  So, what’s the problem with this? The URLs are all showing the exact same content, so why should it matter? Well, search engines can’t assume that all of these alternative URLs represent the same resource. So they don’t automatically get condensed into a single resource. As a result, you can actually end up competing against yourself in search engine rankings. So to avoid confusing search engines and to consolidate your rankings for your content, there should only be one URL for a resource. We call this URL the canonical URL. Canonical means “standard” or “authoritative.” It’s the one that WordPress generates, and it’s the one that you want everyone to use.

How do I specify a canonical page?

  1. To specify a canonical link to the page http://www.example.com/product.php?item=swedish-fish, create a <link> element as follows:
    <link rel="canonical" href="http://www.example.com/product.php?item=swedish-fish"/>
  2. http://yoast.com/wordpress/canonical/ – This plugin helps you solve duplicate content issues on your site. It’s not the cure for all evil, but it will make it easier by preventing tagged URL’s from being indexed.

Tags: ,

No Comments

Making full use of Social Media

Don’t forget twitter, it’s a fantastic way of increasing links to your site, think about, everyone who follows you has added a link to your site, or a particular page, which means that search engine ‘crawlers’ will find it more often, and that combined with the relevant content will increase your rankings.

Perhaps you can think of an editorial to do on your site, complete with an image or two, then write about that on twitter, mention on facebook, then …. wow look at all those links!  That’s how you use social media to drive traffic to your site…

There are several plugins to make this work…

  • Tweet Blender – although when I added this to GodVenture, it broke the page – will probably work with a more robust template. Having said that, also broke commercial template by changing background colour.
  • Facebook Dashboard Widget – for displaying ‘friend’s’ status updates, etc….
  • Simple Facebook Share Button – Excellent!  Works well automatically, with neat standardised buttons. Works well with Firefox, not on Chrome.

Tags: , , ,

No Comments

WordPress SEO

How good is WordPress for SEO. Obviously it’s vital that sites can make it up to the higher echelons of Google’s organic links so it doesn’t make sense to cripple your chances with the wrong choice of CMS. Fortunately popular opinion is that WordPress is better than most content management systems when it comes to SEO.

I’ve come across a comprehensive article which covers how to ensure that WordPress is configured to maximise SEO…. http://yoast.com/articles/wordpress-seo/. Definitely one worth working through when constructing a new site or optimising an old one.

Step So Far:

  1. Change Permalinks to be more descriptive: Settings -> Permalinks. The default permalink is ?p=<postid>, but I prefer to use either /post-name/ or /category/post-name/. For the first option, you change the “custom” setting into /%postname%/
    You need access to .htaccess to complete this. Remember to lock down permissions again when you’re finished.

Something New:

Google XML Sitemaps 3.1.9 Google XML Sitemaps 3.1.9
» Arne Brachhold (url)
This plugin will generate a sitemaps.org compatible sitemap of your WordPress blog which is supported by Ask.com, Google, MSN Search and YAHOO. Configuration Page

Tags: ,

No Comments

SEO vs PPC

Search Engine Optimisation vs Pay Per Click… An interesting fact is that 72% of people searching using Google click on natural/organic/free search results as opposed to the AdWord/paid links. No marketer can afford to buy every click for all their keywords, that means that hundreds, sometime thousands of searchers will never see your ad or know that you exist unless you are ALSO found in the natural search results by using SEO.

Tags: ,

No Comments

Firebug and jQuery

Just installed Firebug into Firefox on the iMac.  http://getfirebug.com.

jQuery available from jQuery.com, current version is 1.3.2 which you can either store on the server or use a CDN (content delivery network) such as Google code.  http://code.google.com/apis/ajaxlibs/


<script type="text/javascript" src="http://ajax.googleapis.com/jsapi">
</script>

<script type=”text/javascript”>
google.load(“jquery”, “1.3.2″);
google.setOnLoadCallback(function()
{
console.log($(‘#title’).text());
});

Tags: , ,

No Comments

WordPress e-Commerce

Installing a full featured e-Commerce plugin on godventure.co.uk -  http://www.instinct.co.nz/e-commerce/.  So far so good, it has all the options I’m looking for, namely pay through paypal, table rate shipping, coupons, etc… Now I need to check that I can display the product as and how I want to.

Tags: ,

No Comments

Adding Twitter to Wordpress

Using Twitter for microblogging works if you parcel it up with the rest of your blog world… that means viewing your tweets on the same page as your blogs…
http://www.webdesignermag.co.uk/tutorials/integrate-twitter-into-wordpress/ Download files here

Even better if you can Tweet from your mobile phone… link to facebook another time!
As I’m tackling this, so I’m going to enter info/thoughts as I go. jQuery is currently on version 1.3.2 this tutorial uses 1.2.6. You can get it from http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js via google.load("jquery", "1.3.2");

Okay now I just need to incorporate it into the side bar of this blog…  The tutorial is based on WordPress 2.6, however in the current 2.8.5 widgets are designed using the new widget API, http://wpengineer.com/wordpress-built-a-widget/ so I’m going to leave that for another day.

Tags: , , ,

No Comments