Adding @font-face CSS support for Fennec on Windows Mobile


Its been a few days since I mentioned that I had been poking around in Fennec on windows mobile.  I was very interested from the start and so it seemed only logical that this was something I should get some experience and knowledge on.

For my DPS909 Project I have chosen to work on implementing a feature into Fennec to support the @font-face CSS rule.

Background on Fennec and @font-face

Fennec is the working name for the mobile version of Mozilla’s Firefox browser.  Fennec is currently being developed for Windows Mobile and Nokia’s N810 which runs Maemo (Linux).  The word Fennec comes from the Fennec Fox which is a small fox found in the Sahara Desert in North Africa.  Logically it makes sense and is quite clever.  A small version of firefox ? a small fox for the logo.

fennec fox fennec_logo

The @font-face CSS rule is part of the CSS3 working draft set.  The rule is designed to allow web programmers to be able to use custom fonts on their web pages even if the users of the page do not have the custom font installed on their system.  In this case the system is the mobile phone.  The @font-face rule was introduced into Firefox 3.5 not long ago to allow for font linking support.  Why is this concept so important for a mobile browser ?  Simple.  If you want to use a custom font or even a standard font for a desktop system it may not be installed on every different phone out their depending on many different factors such as handset brand, OS platform, version number, etc.  Drive space on the device can also be a concern so you might not want to fill up a device with 100 fonts that are only ever used once in a blue moon.  Font linking with @font-face allows for the font to be downloaded as needed and disposed of after a browsing session if necessary, all transparent to the user.

The process

The information about my project will be updated mostly on my wiki page.  News about progress or random things I find interesting to write about will be here in my blog once a week or so.

We have 3 releases that are scheduled to go out.  Release 0.1 on the week of Oct 19, 0.2 the week of Nov 16, and 0.3 the week of Dec 7th.

Plan for each release

0.1 – To get some basic initial code working that can recognize it needs to grab a font and use it. basic implementation.
0.2,0.3 – Review feedback from initial reviews and make subsequent releases and fixes.

To Learn

I’ve got a lot of researching to do on this subject.  Moz-build, Mercurial, building on windows, how the @font-face code works in Firefox 3.5, the windows mobile emulators and SDK’s, and so on.  I’ve used the windows mobile SDK’s and emulators before briefly so I can handle that part fairly quickly I think but there is still a lot of dots to connect before I’ll be running smoothly.  I plan to jump into the code in Firefox that handles this and then work on duplicating its functionality within the windows mobile environment.  I will probably rely heavily on help from the irc community along the way for sure.  So far it has been extremely helpful (  I have also gotten a little bit of experience with and looked at some code for how this is done on MAC in Firefox.

Its all about who you know not what you know

Well… not in this case:) I’ve spoken to Brad Lassey (irc: blassey) and gotten some good information and a direction to go in for this project.  He has been very helpful so far.  I also spoke briefly with John Dagget (irc: nattokirai) who has had a hand in this and has a blog about the subject in Firefox 3.5 and is listed as the editor on the W3C page on the @font-face specification.

Brad suggested I look at the code in Firefox that does this functionality and go from there and it makes sense I don’t need to reinvent the wheel here.

Collaboration and Contribution

I’m not sure what kind of contributions I can make to others projects throughout the semester as I don’t think anyone else is working on anything to do with mobile right now but I will have to see in the coming weeks what everyone’s projects are.  As far as others getting involved with my project, feel free to email me or post a comment or question and I’ll look into finding answers and I’m open to any suggestions on implementation along the way.


I’m a little bit worried about how this will all pan out in such a short time frame but I’m sure I will manage to get through it.  I’m hoping once I get my feet wet and have built Fennec a few times and copied it over to the phone and run it and gotten used to how it works on bus rides into class in the mornings I’ll be more comfortable with the whole project as time goes on. I don’t particularly see any large roadblock, hazards, or risks in my path.  Just a lot of good learning and conversation on IRC in the future.


Firefox for Windows CE


I’ve had quite an interest in windows CE since Jan last year when I bought my HTC touch windows mobile phone.  I’ve enjoyed modifying it and customizing it and being able to treat it as a cross between a phone and a laptop.

I got into a little bit of windows mobile programming during the spring of this year just to do a little playing around.  So I figure since I am taking the open source course now why not look into what the story is on firefox for windows mobile ?

Well it turns out Mozilla has a project called Fennec which is the code name for a mobile version of firefox.  Windows CE is one of the platforms it is targeted to support.

I’ve had a little trouble finding a .cab file I can download to try out the beta version which is supposed to be available but I haven’t had time tonight to fully investigate (broken link on the project page to download).

I did signup for the mailing list though and I found the information for the weekly meetings.

Meeting Details:

  • Wednesdays @ 9:30AM PST (12:30PM EST)
  • +1 650-903-0800 (US/Intl) x92 conf# 8605
  • +1 800 707 2533 (US) pin 369 conf# 8605
  • #mobile for backchannel
  • Agenda and notes can be found here

My first blog post


So I’ve never really thought of a blog as something I would ever find useful or need to start doing for myself but after  spending the summer working on an ASP.NET project and realizing how many times I ended up reading someones blog after searching on a problem or concept I can definitely see its potential.

About myself :

My name is Daniel I am in my 5th semester of the BSD program and I am heading into this open source program with expectations that I will learn quite a bit to help round out my skill set.

I currently hold two separate college diplomas in computer networks engineering technology and electronic engineering technology and after spending 6 years in the work force I decided it wasn’t right for me and that I wanted to do what I had always been interested in which was programming.

So here I am now working part time and trying to keep it all together for four more semesters until graduation.