1

Recently, I tried viewing a website on my Android device. Some of the content of the website contains text in a specific Indic font. I noticed that the website is not displayed in the Android browsers (Chrome, Firefox, Opera, etcetera) as it is displayed on my PC. The intended font (Indic font) is replaced by another font, when viewed in any browser on my Android device. As I have root access on my Android mobile, I moved the indicfont.ttf file (which I downloaded from the Internet) to the /system/fonts folder and restarted my phone. Now, I can view the website perfectly (but only on Firefox browser for Android). I have the following questions to ask:

  • Can someone please explain all the steps involved in the process of displaying the Indic font by Firefox browser (in the particular scenario explained above)? The indicfont.ttf was placed in the /system/fonts directory.
  • Why does the previous solution only work on Firefox browser and not on other mobile browsers?

Most importantly, could you suggest a possible solution for non-rooted Android phones? It is okay even if it is a difficult solution to implement.

My device: (Android 4.4.4, Firefox 32.0.1)

EDIT: There are many fonts for Sanskrit (Devanāgarī script) among which the following two are the ones in the scenario: Sanskrit2003 and Mangal.

  1. These are some important facts that are derived from a good source about Indic fonts available on this site.

    From Android 4.0 on wards, Tamil and other few languages are supported through browser as said in Android 4.x API overview as seen below.

    Support for Indic fonts (Devanagari, Bengali, and Tamil, including the complex character support needed for combining glyphs) in WebView and the built-in Browser.

    My issue is that the default support given by the browsers display the Sanskrit text in Mangal font and not in Sanskrit2003 font (a superior font compared to Mangal ).

    enter image description here
    Source of the image

  2. The whole issue is to let the android mobile browser display Sanskrit (which is intended to be displayed in Sanskrit2003 font) to be displayed in the intended font and not in Mangal (which is very less superior in comparison with Sanskrit2003 ).

Thanks.

5
  • Can you provide link so that I can verify it? Meanwhile you might get some info if you see this question (if not already).
    – Narayanan
    Sep 23, 2014 at 12:03
  • @Narayanan You can verify through this link. Yes, I have already seen that question and found it very informative. In my problem, I am concerned about displaying Sanskrit in a specific font (the best available for Sanskrit indeed) in the browser of a phone. I haven't really thought of displaying it locally in the phone (in messages, etcetera).
    – progammer
    Sep 24, 2014 at 9:41
  • The above said link is perfectly readable in my Nexus 5 running stock (but rooted) 4.4.4. I opened the link in Chrome browser both in my phone and in my computer running Windows 8.1 and I could not find any deviation in the way the characters are rendered. I can even notice that the web site you said does display the font of your choice (Sanskrit 2003).
    – Narayanan
    Sep 24, 2014 at 10:59
  • @Narayanan I am sorry. I sent you the wrong link. It has Sanskrit2003 embedded in the web page. Unfortunately, I cannot provide the original link without the permission of the owner. I will search for another link meanwhile. I am sorry for the inconvenience.
    – progammer
    Sep 24, 2014 at 11:16
  • Here is the link which is to be tested. This link doesn't have Sanskrit2003 font as embedded, but the Sanskrit text is displayed in Sanskrit2003 if the font is available on the client device.
    – progammer
    Sep 24, 2014 at 11:51

2 Answers 2

1

To answer the second part of your question first:

'Why does the previous solution only work on Firefox browser and not on other mobile browsers?'

You are using TTF file. This type of font file is supported by firefox , Safari and Chrome. The other browsers may not support it. For eg: IE supports EOT ; Opera supports SVG etc. But mostly all android browsers support TTF so that is strange.

In short check which type of font the browser supports.

'explain all the steps involved in the process of displaying the Indic font by Firefox browser'

In some scenarios, along with the web data, the web font is also embedded and sent to the browser which the browsers uses to display the data. In other scenarios, only web data is sent.The font used is not a web font (like in this case) In such cases the browsers searches for the font file within the system. If it finds it, it displays the data otherwise tries to display the data using some default font.

2
  • I am sure that the solution that was mentioned by me doesn't work on any browser other than Firefox. It certainly doesn't work on Chrome. Maybe other browsers need some settings to be changed. But then, that procedure is definitely not straight-forward. I am not an expert in Web Technologies, but I was told that the font I am referring to (Sanskrit2003) is not used as a web font as it takes too long for the page to load and for the font to be rendered (in case it were embedded). You mentioned "In such cases the browsers searches for the font file within the system ..."
    – progammer
    Sep 24, 2014 at 10:11
  • Thank you for the explanation. But, I am looking for an in-depth explanation. Browsers apps do not have root privileges (even on rooted phones), whereas the font files are present in root directories!? Then how does the browser 'search' for the font file?
    – progammer
    Sep 24, 2014 at 10:13
1

Can someone please explain all the steps involved in the process of displaying the Indic font by Firefox browser (in the particular scenario explained above)? The indicfont.ttf was placed in the /system/fonts directory.

If you have control over the website, I suggest you should add a @font-face rule to the site's CSS stylesheet. This will work on all browsers versions from the last ten years or so, including in basically all Android browsers (except Opera Mini). You can use services like fontsquirrel to convert a font file to a @font-face compatible font format that will work across different browsers. Note you may need to purchase a licence to be able to distribute certain fonts that are free for personal use, check the terms and conditions for the licence of the font or contact the author of the font if you're not sure.

If you do not have control over the website or if you don't want to go to l through the hassle of provisioning licence for the font, you can inject any CSS rule into websites using Stylish addon. You'll need a browser that is supported by Stylish like Firefox Mobile or Dolphin.

You do not need root to use @font-face in the browser nor to install Stylish. The page you linked to that mention rooting refer to replacing the system font, i.e. the font used for system UI.

1
  • As it was mentioned in one of my previous comments, I was told that the font Sanskrit2003 is not used as a web font as it takes too long for the page to load and for the font to be rendered. The other option that you mentioned (Stylish) looks promising. I will look into it. Thank you.
    – progammer
    Sep 28, 2014 at 10:16

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .