Redirection of a webpage

To avoid “404 File Not Found” Error!’s after deleting webpages in the context of a website update, it’s often useful to redirect these webpages to a new url. There are at least 2 major different forms of web page redirection : Client-side Redirection & Server-side Redirection.

Stay away from Client-side Redirection. These methods of redirecting a webpage range from using html meta tags, to javascript, and even using flash embedded on a page to redirect. All of these methods are notorious for getting you de-indexed from search engines, or at the very least, you’re page getting automatically penalized from search engines.

The best and safest way to this is the “301 Redirect“. The following tutorials describe the “301 Redirect” method :

There are different ways to set up an “301 Redirect“. Using .htaccess to accomplish the 301 redirect is highly suggested due to it being fairly convenient to manage, rather than setting redirects on each individual page, you can simply add the redirect code to the .htaccess file. An Online .htaccess editor to configure the redirection is offered by Hideyo Ryoken & Masato Mannen.

A php sample code to redirect an individual page permanently to a new location is shown hereafter :

  1. <?
  2. header( “HTTP/1.1 301 Moved Permanently” );
  3. header( “Status: 301 Moved Permanently” );
  4. header( “Location: http://www.new-url.com/” );
  5. exit(0); // This is Optional but suggested, to avoid any accidental output
  6. ?>

If the redirection is only temporary, you should use the “302 redirect” method. A php sample code to redirect an individual page temporary to a new location is shown below :

  1. <?php
  2. header(”Location: http://www.NewTemporaryWebAddress.com”);
  3. exit();
  4. ?>

Web cache

last update : August 16th, 2011
A Web cache sits between one or more Web servers (also known as origin servers) and a client or many clients, and watches requests come by, saving copies of the responses — like HTML pages, images and files (collectively known as representations) — for itself. Then, if there is another request for the same URL, it can use the response that it has, instead of asking the origin server for it again.

Web caches are used to reduce latency and to reduce network traffic. A very useful tutorial about web caches has been published by Mark Nottingham under a creative common licence.

An appreciated tutorial about wordpress caching has been posted by Kyle Robinson Young in Web Development Tutorials.

A cached representation is considered fresh  if it has an expiry time or other age-controlling header set and is still within the fresh period, or if the cache has seen the representation recently, and it was modified relatively long ago. Fresh representations are served directly from the cache, without checking with the origin server.

HTTP headers are sent by the server before the HTML, and are only seen by the browser and by any intermediate caches. Typical HTTP 1.1 response headers might look like this:

HTTP/1.1 200 OK
Date: Fri, 30 Oct 1998 13:19:41 GMT
Server: Apache/1.3.3 (Unix)
Cache-Control: max-age=3600, must-revalidate
Expires: Fri, 30 Oct 1998 14:19:41 GMT
Last-Modified: Mon, 29 Jun 1998 02:28:12 GMT
ETag: "3e86-410-3596fbbc"
Content-Length: 1040
Content-Type: text/html

The Expires HTTP header is a basic means of controlling caches; it tells all caches how long the associated representation is fresh for. After that time, caches will always check back with the origin server to see if a document is changed. Expires headers are supported by practically every cache. One problem with Expires is that it’s easy to forget that you’ve set some content to expire at a particular time. If you don’t update an Expires time before it passes, each and every request will go back to your Web server, increasing load and latency.

HTTP 1.1 introduced a new class of headers, Cache-Control response headers, to give Web publishers more control over their content, and to address the limitations of Expires. The most important response is max-age=[seconds]. It specifies the maximum amount of time that an representation will be considered fresh. This directive is relative to the time of the request, rather than absolute. [seconds] is the number of seconds from the time of the request you wish the representation to be fresh for.

A tool (REDbot) to check Cache Control and HTTP headers has been made available by Mark Nottingham; a public instance is available at rebdbot.org.

Facebook Connect API

Facebook Connect is the next evolution of Facebook Platform which enables developers to integrate the power of Facebook Platform into their site. Facebook Connect was announced on 23 July 2008 at Facebook’s annual conference for developers and made available to users on 4 December 2008.

There are four ways to add social context to a private website : Identity, Friends, Social Distribution and Privacy.

At its core, Facebook Connect is an alternative means of logging into a website. The Facebook Connect Button is best placed near the standard login flow. Once a user is connected, it’s important to provide him with an indicator that they are logged in with Facebook (for example a Facebook profile pic with the Facebook favicon (“f”) in the corner). To avoid unexpected or conflicting states, it’s best to use the auto-login and auto-logout functions. The Facebook Developer Terms of Service states that an application can only store user data from Facebook for up to 24 hours to make sure that if a user changes their data, it is refreshed across the web. To obey this rule, one way is to do an API call to Facebook for data on every page load, another way is to use XFBML, a markup language that pushes data access to the client layer.

Whenever a user creates content on a website, the API allows to publish that back to Facebook. Publication actions include forum or blog posts, calendar items, photos or albums, events and wiki articles. A tutorial to create a blog that allows user comments, a trying-out and a demonstration (The Run Around) with Facebook Connect are available on the developer website. An easy way to set up a first Facebook Connect application is the comment-box.

How to add Facebook Connect to your website using Javascript or PHP are two very usefuls tutorials with sample codes and demos to start with a Facebook Connect application.

In 2006, Facebook added News Feeds and Mini-Feeds to their application. News Feed highlights information that includes profile changes, upcoming events, and birthdays, among other updates. News Feed also shows conversations taking place between the walls of a user’s friends. An integral part of the News Feed interface is the Mini-Feed, a news stream on the user’s profile page that shows updates about that user.

One line stories get their point across in a single line and appear only on the Wall on the user’s profile. Short stories are formatted with templates and allow a small amount of text with media – which can be an image, MP3, video, or a SWF file. Short stories appear in the stream in a user’s and the user’s friends’ News Feeds and on the user’s Wall.

The Wall is a space on each user’s profile page that allows friends to post messages for the user to see while displaying the time and date the message was written. One user’s wall is visible to anyone with the ability to see his or her full profile, and different users’ wall posts show up in an individual’s News Feed.

To integrate with the Feed system, you need to create a framework for the stories you want your application to tell. You create this framework through a set of templates that you register with Facebook. You combine templates in bundles, and each bundle contains one template for each story size. A template bundle tells facebook how to display the data that you are sending to a feed. An application can have multiple Template Bundles as well as supports ‘one line stories’, a slightly longer ‘short story’, and a more verbose ‘full story’. Links to referring descriptions are listed herafter :

There are three ways an application can publish to a user’s Feed :

This link shows a feed form example (smiley). Template bundles can be created at the Facebook feed link. The creation of a new Template bundle is not possible (message error that id is not valid) if the developer has no friend.

An xd_receiver.htm file is necessary for cross-domain, the included XdCommReceiver.debug.js library corrects some errors existing in teh XdCommReceiver.js library. I experienced a weird [“null” is null or not an object] Javascript error when using Facebook Connect applications with IE (versions 6, 7 and 8 ) which has also been reported by other developers (Anuragsharma). Ajennings proposes a workaround solution described in the Facebook Connect Forum. His test application is available at the shoptivate website.

On March 11, 2009, Facebook released a new home page for users.

Facebook Open Stream API

last update : 29 august 2010

On april 27th, 2009, Facebook announced a new Open Stream API that will allow developers access the home page and profile streams. Facebook has always been known as a walled garden of social data (bringing lots of information in but rarely letting information out). Until now, the only data you could access was the status updates of the user, and a few other things.

The stream is the flow of information on Facebook, which manifests itself on a user’s home page as the News Feed and on the user’s profile as the Wall. It represents the content a user shares with friends in a real-time setting. Initially the stream content appeared only on Facebook, and now with the Open Stream API, developers can connect to their users’ streams and let their users read their streams wherever they want. This means that for the first time, you can build new user interfaces for the stream everywhere including Web, mobile, and desktop applications.

The stream API allows for reading and creating content. Thus, your applications can get users’ stories, comments, and likes, and incorporate this data into your user experience. More informations are available in the release notes.

Google Maps API, Mapplets and KLM

Google offers an API to embed Google maps into personal websites. A Google Maps key is needed to access the API, to apply for the key you need to have a Google account and to agree to the terms and conditions of Google Maps API. The key can be generated online on the Google signup webpage.

Google maps are integrated in a website with Javascript. Embedding static maps without Javascript by using image tags is also possible.

The Google API accepts certain parameters. Some are required while others are optional. The parameter list is given below:

  • center of the map : This parameter takes a comma-separated {latitude, longitude} pair
  • zoom : Maps on Google Maps have an integer “zoom level” which defines the resolution of the current view. Zoom levels between 0 (the lowest zoom level, in which the entire world can be seen on one map) to 19 (the highest zoom level, down to individual buildings) are possible within the normal maps view.
  • size : width and height of the map in pixels; 640×640 is the largest image size allowed
  • format : gif, png or jpg for images
  • maptype : satellite, terrain, hybrid, and mobile (default = roadmap)
  • markers : one or more markers to attach to the image at specified locations. This parameter takes a string of marker definitions separated by the pipe character (|)
  • path : a single path of two or more connected points to overlay on the image at specified locations. This parameter takes a string of point definitions separated by the pipe character (|)
  • span : a minimum viewport for the map image expressed as a latitude and longitude pair
  • frame : specifies that the resulting image should be framed with a colored blue border
  • hl : the language to use for display of labels on map tiles
  • key : the Maps API key for the domain on which this URL request takes place
  • sensor : specifies whether the application requesting the static map is using a sensor to determine the user’s location

The process of turning an address into a geographic point is known as geocoding. Goggle provides a GClientGeocoder object to convert a string address into a latitudes and longitudes.

A marker descriptor contains a string defining the location to place the marker and the visual attributes to use when displaying the marker. These strings contain the following variable values:

  • {latitude} (required) specifies a latitudinal value with precision to 6 decimal places
  • {longitude} (required) specifies a longitudinal value with precision to 6 decimal places
  • {size} (optional) specifies the size of marker from the set {tiny, mid, small}
  • {color} (optional) specifies a color from the set {black, brown, green, purple, yellow, blue, gray, orange, red, white}
  • {alphanumeric-character} (optional) specifies a single lowercase alphanumeric character from the set {a-z, 0-9}. Note that default and mid sized markers are the only markers capable of displaying an alphanumeric-character parameter. tiny and small markers are not capable of displaying an alphanumeric-character

An online tool to create map-markers is available on the donkeymagic website.

The Google geo-developer website prodides documentation, tutorials, code samples, demos, guides and more ressources. A blog for Google geo-developers provides tips and tricks and announcements of new features concerning Google maps. Personal Geo Content can be submitted to Google, guidelines are available on the KLM webpage. KML is a file format used to display geographic data in an Earth browser such as Google Earth, Google Maps, and Google Maps for mobile.

Another useful option are Mapplets, mini-applications that run within Google Maps. You can create Mapplets that add new features or overlay your data on Google Maps.

Mike Williams published a great tutorial about the Google maps API.

eBay API

Today, I registered for an eBay Development account. The eBay Developers Homepage provides support, documentation, code samples, API keys, affiliate programs, forum, sandbox, tools, release notes and system announcements.

A sandbox key and a production key can be generated on the personal account page. There are different API’s available : shopping, merchandising, feedback, trading, client alerts, large merchant services, platform notification, research. The developer center is segmented in Windows, Java, php, Javascript, Flash and other. The eBay community codebase contains several open-source projects.

I started using the shopping API (view guide) which is optimized for response size, speed and usability. This API allows to search for eBay items, products and reviews, user info, and popular items and searches. You are able to retrieve public eBay data in a buyer-friendly view, for easy consumption by buyer-focused applications. The call reference (version 613) of the eBay shopping API is available on the following link. The call “FindItemsAdvanced” is the most useful and enables you to search for items on eBay based on many possible input fields and filters. Detailed informations are available here.

Google Analytics API launched

On april 21th, Google announced that the Google Analytics Data Export API beta is now publicly available to all Analytics users. The API will allow developers to extend Google Analytics in new and creative ways that benefit developers, organizations and end users.

A list of featured examples from Google customers is available at the Google developer website. All the documentation needed to use the API is found on the same website.

FeedBurner

FeedBurner is a Chicago-based company that provides media distribution and audience engagement services for blogs and RSS feeds. Its Web-based tools, including an extensive feed and blog advertising network, help publishers promote, deliver, and monetize their content on the Web and make feed-based content more accessible and manageable for its end users. In 2007, FeedBurner was acquired by Google.

A FeedBurner Blog is available at the Google website. FeedBurner Stats is Google’s analytics offering for blogs, websites and feeds of all kinds. The service is free with every FeedBurner feed and provides publishers with a comprehensive view of their audience.

The FeedBurner Stats service for feeds provides the following feed-related information:

  • Subscription data (e.g. number of subscribers by day, previous week, last 30 days and all time) and Reach data (the estimated number of individuals clicking or viewing your feed content in a given day)
  • Breakdown of feed readers and aggregators, email services, web browsers and bots by which subscribers are accessing your content
  • Clickthrough tracking
  • Uncommon uses — sites where your content has been resyndicated including other blogs, directories and even spam sites
  • Item enclosure downloads (podcasts)
  • Live hits, conveniently translated to your local time zone

For even more insight, you can activate the following PRO features for no charge:

  • Reach
  • Item views

Today I activated FeedBurner for my Blog.

(http://feeds2.feedburner.com/InteractiveRichMedia)

RSS feeds about contemporary arts

I assembled the following list of handselected rss-feeds about contemporary art :

Luxembourg News :

Integrate rss feeds in a webpage

Last update : December 28, 2011
To integrate rss (Really Simple Syndication) feeds in a webpage, different technical solutions are available.

XSL Transformations

rss feeds are xml documents. To transform xml documents into another format like XHTML or HTML, XSL Transformations (XSLT) are used. XSL stands for Extensible Stylesheet Language. I tried this technique in 2006 with the artpet.lu website and I run into several problems with browser incompatibilities needing browser specific code selectors in the related javascript file.

Javascript widgets

A second possibility is to use a Javascript widget displaying the parsed rss data provided by a third party rss to HTML service.

The following list shows a few rss to javascript providers :

Flash Widgets

Some rss  to HTML providers offer Flash widgets to display the parsed rss data.

PHP

PHP coupled up with HTML is the favored method for showing RSS feeds on a website when it comes to search engine optimization.

Among the php scripts, Magpie RSS, published by Kellan Elliot-Mcrea under a GPL licence, is widely considered to be the most robust option, with SimplePie coming as a second best with the less restrictive BSD license and a few additional features. SimplePie is a fast and easy to use PHP library for parsing RSS and Atom, written by Ryan Parman and Geoffrey Sneddon. There are a number of alternative RSS-Libraries for PHP, including lastRSS.php, PEAR::XML_Feed_Parser, PEAR::XML_RSS, rss2array and PHP RSS News Parser.

I installed SimplePie on my hosted webserver a few years ago. The provided testscript to ensure that the basic requirements have been addressed by the server and that you have everything you need to run SimplePie properly is very helpful.

simplepie

simplepie

I use the php technique at the www.lesliesartgallery.eu website.

Late 2011, I prefer the Google Feed API solution to quickly integrate feeds on my websites.