Scott Mebberson

Icon

Web Technologist

Custom Fonts

We’re working on a redesign of a website at work, that needs to follow new branding guidelines. A particular font is used heavily within the brand for most headings and introductory text.

We had to decide between fudging the font into the website design, or not. We try to follow standards at Enpresiv as much as possible, but from time to time that is not always possible.

We turned to the usual font replacement techniques:

But I also wanted to dream a little, and take a look at what the future might hold. I made a few examples using the new @font-face css3 capability, and thought they might be useful for others.

The @font-face rule allows you to use TrueType and OpenType fonts directly in your webpages. Browser support is VERY limited at present, but Safari Version 4 beta does a really nice job at rendering the custom fonts.

I can see a whole new ‘licensing’ problem arising out of this new capability. Its going to be so easy to add any font into your website, but whether or not you’re allowed to is something entirely different.

I’m also a little scared of what the web might turn into. Despite the low number of web fonts being very limiting for professional designers, those with little design skills tend to turn to ‘fancy’ fonts and colours to try and spice up their designs. With so many great programs making building webpages within reach of the every day person, I can only imagine what we’re in for.

Filed under: technology, web 2.0

Custom Google Maps Icons

The ability to use custom Google Maps icons (the graphics that mark locations on a Google Map) has been around for a long time, but a feature that is rarely used.

You can use a custom icon to great affect, making your map ‘look and feel’ more like your brand. I’ve thrown together a quick example showing a custom icon on a Google Map.

After you’ve created your custom icon, it is relatively simply to define the custom icon:

// create the custom icon
var customIcon = new GIcon(G_DEFAULT_ICON);
customIcon.image = "wsimages/marker.png";
customIcon.iconSize = new GSize(109, 28);
customIcon.iconAnchor = new GPoint(30, 27);

and then use the custom icon:

var marker = new GMarker(point, {icon:customIcon});
map.addOverlay(marker);

Go and check it out, or download the example directly.

Filed under: google maps, technology, web 2.0

Sharing my snippets with snipt.org

I’m always looking for ways to improve my “Social Professional” online presence; and I’m going to be adding snipt.org to my toolkit.

Day to day I run a business and project manage RIA projects, but at heart, I’m a programmer. I keep a libraries of reusable code and a bunch of snippets; some of those snippets I use regularly and others are as close to genius as I’m going to get, so I keep them.

Other than my programming team at Enpresiv, my libraries and snippets largely remain private. Until now!
I’ve found a fantastic website that can manage my snippets and improve my online presence by automatically adding to my output streams on Twitter and my blog at WordPress.

snipt.org is kind of like delicious, only its for code snippets; and you can share your snippets in the ‘social collective’. It saves each of my snippets with their own URL, and sends that URL to my Twitter account as I create new ones.

You can also download Cloud Coder, a nifty little Adobe AIR application that integrates directly with the snipt.org API. Now all I need is direct TextMate integration like snipt.orgs competition Snipplr has.

Filed under: social networking, technology, web 2.0

Google Chrome on the Mac

I’m a big fan of new. I love new gadgets. I love new technology. Basically, if its new, I’m keen. As such, I’ve been hanging out for Google to release Chrome on the Mac ever since it has been released. I do have Chrome running on XP VM, but its not the same and I rarely fire-up VM.

Having been away for the office for a while, I Googled for any developments on Chrome for Mac. While I didn’t find exactly what I was looking for, I did stumble across Crossover Chromium!

Even though its not the same as the Mac version of Chrome that Google are working on, at least its something. It doesn’t look so great (it still contains the Windows-based chrome), but should prove useful for browser testing; and besides, it’s all us Mac users have at the moment.

Filed under: technology, web 2.0

Playing around in the clouds…

I’ve just come down from a little experiment in the clouds.

I received my invitation to the Stax beta today, and was a little too keen to get my hands dirty.

I gave myself a quick 15 minutes to write a simple weather application, and deploy it to the Stax Cloud (I had already created my application and downloaded a local development version via the Stax SDK). In short, Stax is a breeze to use and I think it will become a very compelling platform in the future.

The Stax Cloud allows you to easily deploy web applications straight to Amazon EC2. You can deploy many popular Java based technologies including ColdFusion and Flex.

It’s the first platform I’ve seen allowing you to deploy the Adobe ColdFusion application server to the cloud. Other than Stax, I’ve only heard of Railo being deployed to Amazon EC2 because of all the licensing problems with Adobe ColdFusion. I still haven’t investigated how Stax are overcoming the licensing issues (that’s on my todo list).

You can visit my weather application, and I managed to get it done within 15 minutes.

I really like the Stax Cloud. It makes it so simple to get an application up and running, which essentially is an Amazon EC2 instance. I’ll definitely keep playing around with this technology.

Filed under: cloud, coldfusion, technology, web 2.0

twitterfeed.com

I just signed up to twitterfeed.com to alert all of my twitter friends, about any blog posts I make.

Not quite sure how it is going to work yet, but the process seemed simple enough. I guess this will be the first blog post that automatically reaches Twitter!

Filed under: social networking, technology, web 2.0

Market Research via Twitter

I’ve just been the target of some directed market research via Twitter.

A couple of days ago I posted a tweet about livingsocial.com. Today, I received a reply from LivingSocial asking if I had any suggestions for categories.

So I responded with a few suggestions, and told them about my thoughts on how I intended to use LivingSocial once I first heard about it.

I think this could definitely be considered and is considered a new and valid option for market research. I was happy to provide my feedback via a quick Twitter, but I rarely fill out the 10 minute surveys from companies like Dell, Microsoft and Adobe.

It is definitely a large task to compile bite-sized chunks of market research into something worthwhile however. It’s an interesting space to watch over the coming year or two.

Filed under: marketing, social networking, web 2.0

That one darn strip of cloud!

We currently have an interesting problem with Google Earth. There is a nice big cloud directly over a location we want to zoom in on.

The strip of cloud appears directly on top of the location we’re interested in, and it is proving rather annoying!

Google hasn’t updated this part of the world (or specifically this strip) for quite some time, so I thought I’d dig around to see what I could find out about the frequency of updates to the satellite imagery.

I found some interesting information, but in short, I didn’t find any real public information about how and when Google update the imagery, or what the selection criteria is (blurry vs obstructed, etc). It all seems rather random.

I should probably use the database report page, maybe Google might pay attention to this one silly strip of cloud? I can’t even imagine how many reports they receive to fix insignificant strips of the earth.

Filed under: google maps, technology, web 2.0

A List Apart Survey 2008


I took the survey!

I took the survey!

Filed under: web 2.0 ,

Microformats and jQuery

I’ve been reading a book on Microformats, written by John Allsop. I’m not very far into the book yet, but so far it sounds very interesting.

I’ve read a fair bit about Microformats in many blog posts, and the microformats website itself is very informative. While I understand and appreciate that microformats are important for the greater good of the internet infrastructure, as a business owner and manager of the development team, I’ve been struggling to find a business proposition as to why we should start using them in our website development.

I assumed they would make coding more complex and perhaps increase client budgets (through development time) for no real gain for the client. I’m still tossing around the idea in my head, of how can the client really benefit from the use of microformats on their website.So I decided to play with a few microformats and dreamed up a hCard and jQuery combination (or mashup?).

Using jQuery it was really easy to dig into the body of the page and pull out address information, which is exactly what microformats are all about, creating markup that firstly humans can read and second computers can read.

Once you have the data using jQuery, your imagination is the limit really. I came up with a few trivial examples. The first example demostrates mining for the address and simply linking it to maps.google.com.au. The second example mines for the addresses and then as you click on them, plots them on a Google Map. I was amazed at how quickly and easy it was to program these examples using jQuery.

With this expirmentation I’ve found the business proposition and argument as to why we should start programming using microformats where possible; they make development easier and faster all the while increasing the infrastructure of the web!

You can download the source for the microformat and jQuery examples.

Filed under: technology, web 2.0 , ,

About Me

I'm a web technologist living and working in Adelaide, Australia.

My Tweets

Navigation

My Older Posts