Blue Forest Blog

Archive for the 'HTML' Category

Microformat Cornucopia

Thursday, March 27th, 2008

Microformats are an increasingly common way to embed semantic information in a human-readable web page. By using classes to annotate the markup, you can call out information allowing a web browser or add-on to utilize it. For instance, using the hCard microformat, a human-readable address written in HTML can be downloaded and added into a user’s address book.

I’ve been offering restaurant addresses using microformats in UVFood.com, and more and more sites are providing support for them.

(more…)

Posted in HTML | No Comments »

XRAY

Friday, August 3rd, 2007

A very nice new tool called XRAY showed up recently. XRAY works with the Safari, Firefox, Camino and Mozilla web browsers (unfortunately no Opera or Internet Explorer support yet). It helps you examine elements on a web page, bringing up information about their dimensions, inheritance, attributes and styling. Best of all, it requires no installation and it’s free. Just drag its bookmark to your bookmarks bar and click on it when you want to examine a web page.

Thanks very much to Western Civilisation Pty Ltd for sharing this with everyone.
[tags]x-ray, javascript, css, web, bookmarklet[/tags]

(more…)

Posted in Browsers, CSS, Design, Firefox, HTML, Safari | No Comments »

Embedding Geographic Information in Web Pages

Saturday, July 14th, 2007

The main project I’m currently working on is a web site about food in the area I live in. It’s currently in testing and I’m quite a bit further behind on fixing it up to the point of opening it to the world than I’d like to be.

One feature that’s important to me to have in it is to mark pages that are associated with restaurants or other food-related organizations with their coordinates.

It turns out that there are several different ways to do this.

I’m currently using META tags in the HEAD section to specify geo.position, like this:

<head>
<meta name="geo.placename" content='Quechee, VT' />
<meta name='geo.position' content='43.645995,-72.416711' />
</head>

There are at least three other ways to do this:
(more…)

Posted in HTML | No Comments »

Developing Web Content for the iPhone

Friday, July 6th, 2007

Apple has published guidelines for developing web content for the iPhone. Some of the guidelines are just good practice (separating HTML, Javascript and CSS, for instance). Some of it is informational (how many pixels you can expect to be available in the iPhone – at least, in this version of it). Some of it is very iPhone-specific (META tags to help control the viewport and scaling).

The article also includes guidelines for encoding audio and video for access over EDGE and Wifi networks.

The iPhone runs a slimmed down version of Apple’s desktop browser “Safari” – you get real HTML, Javascript and CSS support, and it can do Ajax. In my few days with an iPhone I haven’t found any web sites that simply didn’t work on it, including Javascript-heavy sites like Flickr.

(more…)

Posted in Ajax, CSS, Design, HTML, Javascript, Macintosh, Safari | No Comments »

iframe Problems and CSS

Monday, June 4th, 2007

A while back I rigged up a little ad server to serve Amazon “ads” to our web sites. I wrote it up so that I could easily reuse it for different projects and have a central location for managing it rather than write the code, duplicate it across projects and then have to maintain it all.

Amazon has an affiliate program which earns you from 4% to 10% commissions on purchases done from traffic you drive to Amazon’s web site. You earn money on sales made during a shopping session that weren’t on the item you linked to, too. Like most affiliate programs, the more you sell in a given month, the higher your percentage commission.

My blogs and the web sites I’m working on are all focussed on particular areas. So, for Apocalypse Blog, I put together a list of apocalyptic media available via Amazon and use my ad server to display a random item on each pageview of the blog.

The problem? I embed the ad by using an HTML iframe to contain it. Unfortunately, its positioning is a bit off. As you may be able to tell, the iframe is shifted down and to the right just a bit.
(more…)

Posted in CSS, HTML | No Comments »

Links: