Vodafone V640i with Netfront, one of the worst mobile browsing experiences

This summer I had the opportunity of getting a new phone for free (or for a small fee on some models) included in a new contract that dotMobi got for me. I thought it would be a good idea to get my hands on one of those phones that every normal customer get with their contract. Having loved my Sony Ericsson W810i I thought it would be wise to get another Sony Ericsson, so I chose the V640i, Vodafone exclusive. The phone is not exactly the lowest end on the market in fact it features a very good media player (including a good music player and playlist manager), bluetooth, stereo headphones included and a few more things. The camera is really cheap, very far from the now really old one included in my W810i. Per my personal tastes, the keys are a bit small and the green and red ones are too close to the accesskeys, but overall (and considering it was free) it’s a good phone and does all you would expect from a basic phone and more.

What I was most curious, of course, is the browser. The experience has been very poor and even if the device has the right accesskey configured to connect to Vodafone Live, the NetFront browser is really really bad. While the browser is capable of rendering WML, XHTML Basic and some basic HTML pages, I really do not see any reason why a user or customer would ever use this more than twice. I have a few screenshots that will prove my points, but let’s start saying that while I was browsing I often had no clue if the browser was retrieving content or not, in fact it was often stuck “loading”, but stopping and reloading the page would make it appear instantly, the browser really seems stalled from time to time. Initially I was in doubt if it was the phone, the network or the browser, but once I installed Opera Mini I was sure it was the browser.

My first test site is Metajam, a site about movies, TV shows and Music. I recommend that you click and see how the page is normally presented so that you get an idea. (Note: the side design has slightly changed since these screenshots were taken)

This is the first thing that I am presented when visiting the site:

At first I thought the site did not work on the V640i.

Clicking on the options accesskey (the left one), I see this item-list where the first item is “accept” (sorry for the poor quality):

I assume this does not tell anything to anyone, but to me, it immediately reminded of the form wizards in some WAP 1 browsers, so I clicked it (and wished I was not accepting something strange such as transferring 1 million dollars to a Nigerian bank).

This is what I saw once clicked, the real page body. Notice how each link is on an individual line, SO 1999:

Clicking again “options” and “accept” I get this very helpful page that I have no clue where it comes from and how it would be of any use:

Later I was looking for a mobie and did not want to browse movies by title, I rather wanted to search by keyword, but I could not find a search menu even though I knew on the iPhone version I had seen one! I took me quite a few pages before I thought about the “options” key. Again, “options” and “accept” was the unexpected solution. Here is another form wizard that you can see only using the “accept” menu. Clicking on the two square brakets opens a blank page where you can type the text and confirm and then be back here, not even automatically go to search.

Again very poor usability!

Enough with forms, let’s see how unordered lists look like. This time I am visiting ta-da.mobi, the test site of DeviceAtlas. Once logged in I go in the “Display” section to test the display size. As you can see the section has two tests and there is a bulleted list:

This is another page in TA-DA, with another bulleted list. The markup is EXACTLY the same, but we have no clue why the browser is displaying a broken image instead of the bullet:

If you are curious, this is the markup of the first page (the one that works):
<div class="item-list">
<ul>
<li><a href="/link1">Usable Display Width</a> (-)</li>
<li><a href="/link2">Usable Display Height</a> (-)</li>
</ul>
</div>

And this is the code of the second page:
<div class="item-list">
<ul>
<li><a href="/link/180">Bigger</a> (180)</li>
<li><a href="/link/60">Smaller</a> (60)</li>
<li><a href="/link/reset">Reset</a> (reset)</li>
</ul>
</div>

Again, the user will have no clue what’s happening and will think that this is a poor site that doesn’t even have the images in the right paths.

Browsing experience is really poor and some features such as landscape browsing are completely useless and the usability is even worse than with the normal browser. Developer efforts would have been better spent on making the browser work properly. 😉

On the bright side, Opera Mini 4.1 (I have not tested 4.2, yet) works like a charm, it is fast and reliable and both mobile and desktop sites work as expected. A must have for all V640i owners (and maybe all NetFront browser owners).

Arun’s views on the new HTML Charter

Arun Ranganathan from AOL has come with a public blog post about HTML 5, the status of XHTML2 and why AOL is going to be active in HTML and NOT in XHTML2.
In two words he’s saying that AOL is not going to work in XHMTL2 because they are not browser vendors and so that’s not their field, but that they are going to work in HTML WG (and the development of HTML5) because they are content providers.

XHTML2 is just a draft, it’s a future implementation, so it might make sense to leave it to browser vendors, but then why bother to work in HTML 5? To me, this means that XHTML2 is dead for AOL and that HTML 5 is the way to go.

Isn’t this a HUGE thing?

Read the full article: (Re)birthing Pangs: The HTML Charter Revisited.

Premus update!

A little bit of publicity and links are worth much more than bare money.

I wrote a short Premus review here the other day and now David has updated the online demo to the latest development version that includes the validator, better source view and syntax highlighting.

He also squashed a few bugs here and there.

Bookmarking has been disabled due to spammers immediately using it to publicize their sites. The current version shows how bookmarks can be used, but you are not allowed to create new ones. If you make a local install you will be able to use them, of course.

See the updated Premus live, or read the CHANGELOG for a few more details about the changes.

Message to David: you need to practice your communication skills, the changelog is too short! 😛

Premus

“The name Premus comes from PRoxying EMUlator Service. It is a mobile browser emulator that converts WML, XHTML MP, cHTML and Vodafone’s PML (c. 2004) into standard HTML that you can browse in your normal web browser.”

This is what David Johansson says on the site as a short description of the software. David has been developing mobile services for many years now and he was among the early supporters of WURFL.

Premus was born from the need of testing mobile sites, WML in WAP 1 in the beginning and later many more markups. I would not call it exacly an “emulator” as David does, but rather a testing tool. In two words, Premus lets you pick a user-agent (from WURFL, of course!), define a URL and specify extra headers, if you’d like. The software makes the request and reformats the markup so that it renders well in your web browser. It’s not a Java application or applet, it’s not a real emulation engine or and SDK. It’s a web-based tool that lets you easily test your sites and make sure that all the links work and the pages look as you expect.
You should not expect a faithful representation of how it will look on the mobile device; it does not show alerts if you picked the user-agent of a WML device/browser and the remote site returns XHTML. It is intended for programmers and authors that have developed a site or a complex service and need to check that everything is OK.

Since real device testing is ALWAYS suggested, this is the perfect light-weight tool to make a general test before going with the mobile.

More in detail, while browsing with Premus, you always see the general page layout, but you can also see the original source, you see, edit and force cookies and headers. By default you have a some input fields on the top of the page for the user-agent, URL and manage all the proxy features and see the page in a dedicated box. De-activating the “frame” checkbox you can see the page layout in a window on its own, more similar to the mobile browsing.
A very helpful feature is actually on the bottom of the page. It shows a list of external resources (normally images) and the size of each. Also provides the time needed to download the markup and all external contents. The time is calculated on the fast internet connection of the server, not calculating the mobile networks latency, but will be useful to compare different pages and sites.

Premus will help you save a lot of time.

Premus is now released as open-source so you are free to download and adapt it to your needs.
If you look at the version in development you will see some new features that are not in the online demo, yet. These are features that I have strongly suggested to David and actually it really took him a few hours to implement them, but I think they will make a big difference.
Syntax highlighting has been added for the source view, very useful when you need to check your markup. Also the spacing has been changed for better readability.
Even more important to me is the markup validation. It’s disappointing when you build a big site, get ready to test with your mobile (take it from the drawer, put the correct SIM card, check the WAP profile, go online) and discover there’s a typo in the XML declaration. Checking that your markup is validated will certainly guarantee the best interoperability with all browsers. When you want the best possible support you really want this. Well-formedness is the first thing! Look what happens if you validate http://m.gmail.com/ :

Premus validation resulf for mobile Gmail
All the code is Python and should be easy to install on most modern Linux disto’s.

Some other minor things could be cleaned up and improved. Nevertheless this is a very good testing tool. If you are a mobile sites developer, I suggest you try it out, especially the development version that adds those 2-3 features that will actually ease your work a lot.