Archive for the 'Technologies' Category

MobileMe launching countdown

According to Apple, MobileMe is launching on July 9th Between 6pm-12am PT, just few hours away now. :-) Apple describes MobileMe as a suite of web-based applications (Mail, Contacts, Calendar, Gallery, and iDisk) and Push sync services.

As I said in Is MobileMe Innovative?, Apple is approaching their massive consumer base with the message of Easy-to-use, elegant interface and desktop look-n-feel. As an application deverloper, I am interested in MobileMe’s perfermance behind the SproutCore javascript platform, and I am going to do some simple tests, including:

  1. I will test the speed of the iDisk with some large files. (Reason: To see if it gives me the desktop look and feel)
  2. I will test the mail with all basic features and then compare with Gmail’s conversation-style. (Reason: MobileMe and Gmail target the same market)
  3. I will run MobileMe on IE6 (Reason: According to W3C, 26.5% browsers are IE6, which is not on the supported browsers list of MobileMe)
  4. I will go throught the javascript to do a brief test about security.

P.S. MobileMe lives at me.com

7 Useful SEO Analysis Tools

  1. Google Trends – search patterns and trends.
  2. xinureturns – search engines, social bookmarking results aggregation.
  3. quantcast – Internet ratings
  4. alexa – traffic and changes
  5. analytics – keywords / traffic source / visitors and more
  6. compete – advertisers like reports from compete
  7. search-directory – categories search tool

I’d like to say a massive thank you to the guys developing these fantastic search engine optimization tools, which make our life much easier. :-)

Matt

What’s Bizroof Made?

The application is made with PHP and javascript, and we use a MySQL database. Amazon’s S3 is used for storage of files upload by users. Prototype and script.aculo.us provides us with easy-to-use and sexy user interface. We use Zend Framework APIs to support web services (such as Google, Flickr, Yahoo and Amazon). Meanwhile, we support microformat and RSS.

Wordpress helps us to build our fantastic Bizroof Blog which is powered by K2 theme, and iconshock provides all the icons we need.

Is MobileMe Innovative?

If you never heard about Apple’s MobileMe, what do you think it does? Mobile… mobile phone? get connected anywhere? Me…. all about my stuff? Yes, you are absolutely right. It is a simple way to keep everything organize and sync. If you look closer, MobileMe is actually a web-based application which helps to store and manage your emails, contacts, calendars and files on both your computers and iPhones or iPod.

The idea is not new and so simple. Well… all the brilliant ideas are simple. The question is that what is the innovative stuff involved?

SproutCore, a javascript platform is being used to provide the desktop-like feel. This approach is definitely not new as there are plenty of similar platforms being used all over the place, you name it… Google Web Toolkit, Ext-js, Objective-J, YUI etc.

The business model is not new neither. Keep everything up to date and share large files with friends are well discussed and executed throughout the web industry.

Could MobileMe succeed? I think so…. The reasons are simple:

A. Apple has a good reputation building easy to use stuff.

B. Apple has a massive consumer base, among which there are plenty of evangelists.

C. MobileMe can solve problem, fairly enough :-)

The world is using different browsers

According to the latest browsers statistics report (May, 2008) from the W3C, IE is still the most common browser (IE7 26.5%, IE6 27.3%), and Firefox becomes more and more popular as 39.8% of the public are using it today. At the same time, Safari and opera takes 2.4% and 1.5% of the market respectively. However, as we all know, different browsers response to CSS and javascript differently, and this will definitely give the developers and graphic designers some extra work.

As for the Bizroof development team, we dive into the specifications of each browser and try to discover all their preferences, and then we test our code in all the 6 major browsers, including IE6, IE7, FF2, FF3, Safari and Opera. It is a painful and time consuming job, but we are doing it now and we will continue doing it in the future. The reason is simple: As a web application provider, we need to make each user’s experience count!

AJAX Calendar is now in alpha testing

The new calendar is in iCal format which is a standard for calendar data exchange with apps like google calendar, yahoo calendar, MS outlook, MAC iCal and lot more. We use AJAX wherever possible for this design, and keep improving on the usability.

The Current features include:

  1. Customize “first day of week” (i.e. week start on Monday, Saturday and Sunday)
  2. Support multi calendars (coloured labels) for each user
  3. Drag and drop events to make changes
  4. Quick add events (just one click)
  5. Translate human language to computer readable language. i.e. “Lunch with Jason 3pm tomorrow”
  6. Auto detect “Time Zone” and “Daylight saving time” on the user’s computer
  7. Support multi languages
  8. AJAX auto-completer to add guests to events
  9. Feed for events
  10. Export in iCal and MS Word formats
  11. Filter events by tags

Don’t hesitate to contact me if you have any suggestions. ;)

7 Rules of Web Page Design

1. Test your page on Firefox, IE and Safari

CSS and javascript behave differently on those three major web browsers. So, make sure the page look almost the same on all of them.

2. Make your page easy to read

Don’t put too much stuff on your home page, otherwise it fairly easily confuses people. Also, it potentially slow down the page loading speed.

3. Arrange the page content according to the importance of page sections

People pay more attention to the top right area of a page, followed by Top Left, and then the bottom areas. By putting appropriate content upon their importance, it will dramatically increase the ability to attract visitors and helps them to get your message much quicker.

4. Keyword is KING unless you don’t want search engines to pick up information

Don’t forget that you can always use <meta name=“keywords”>, <metaname=‘description’> and page title/url name to store the desired search terms. In that case, you don’t necessarily put all of them on the page itself. :)

5. Make as fewer HTTP requests as possible

HTTP requests occurs when loading images, css, javascript, and HTML files. Apparently, the more stuff to load, the longer it takes, and 24% visitors leave a site if it takes more than 4 second to load, especially for the home pages.

6. Don’t use more than 4 different colors if you are not an expert :)

Statistically, most people are able to handle 3 different colors on a page quite well but abit struggle facing 5+ colors situation. Also, the colors you like may not be your visitors’ favorite.

7. Validate HTML, CSS, Feed

CSS validator: http://jigsaw.w3.org/css-validator/

XHTML validator: http://validator.w3.org/

Feed validator: http://validator.w3.org/feed/

Bizroof Home Page:

(Please give me some advice on how to improve)

Display posts in your website (wordpress)

Yesterday, I installed wordpress on the server where my website hosted, and I decided to show several of my latest posts on my home page in order to let my visitors know my roadmap in real-time. Also – since I am using smarty templates to to facilitate the separation of application code from presentation, I don’t really want output (echo) the post data directly onto the page. After playing with the loop process for a while, I finally got this sorted out. Here is how I did it:

<Step One> Include the wp-blog-header.php file.
require('blog/wp-blog-header.php');

<Step Two> Collect all post data as required.
query_posts('showposts=4'); //Show latest 4 posts
while (have_posts()) //checks if any posts collected
{
static $blog = 0;
the_post(); //prepare for the iteration of the loop
$title[$blog] = the_title('','',0); //the_title function has 3 parameters, including 'start', 'end' and 'output or not'
$url[$blog] = get_permalink(); //post link
$date[$blog] = the_date("M d, Y", '', '', 0); //the_date function has 4 parameters, including 'date format', 'start', 'end', and 'output or not'
$blog++;
}
$numberOfPosts = $blog; //$numberOfPosts will be assigned to the loop number in the smarty template file.

Note – I created 3 arrays to store the relevant post information from the blog, including $title, $url, and $date, and then I use smarty template to display all them onto my home page (Demo Page)

Have Fun! :)