Use woff/woff2 files

[mustafa0x]

The TTFs are nearly double the size.

E.g.

• https://quran-1f14.kxcdn.com/fonts/ttf/p241.ttf
• https://cdn.rawgit.com/mustafa0x/qpc-fonts/f93bf5f3/mushaf-woff2/QCF_P241.woff2

[mustafa0x]

# Install
git clone --recursive https://github.com/google/woff2.git
cd woff2
make clean all

# Usage
for file in fonts/*; do
  ./woff2/woff2_compress "$file"
done

[naveed-ahmad]

@mustafa0x Fonts we're using has many issues, list is huge but biggest one IMO is no seo. We're using weird codes for rendering text. Search engine can't index the actual mushaf.

I tried to use ligature feature of tff to render using actual text, and it works great except Safari ( and Firefox on Mac). So we rollbacked those fonts, also ligga didn't worked on woff/2 at all.

See #672 and #735 for more detail.

Looks like its good time to start hacking again. I'm thinking about generating ttf with ligga then convert/compress them to woff, woff2 using https://github.com/google/woff2.

[mustafa0x]

SEO can be solved as I described in the other issue — user-select: none and transparent Arabic text (Google may penelize for the deceit, except that it isn't).

But the issue here is unrelated to that, and seems to be unrelated to the other things you mentioned. :)

[mustafa0x]

Also, use woff2 and fallback to woff — woff2 support is good, but not good enough. https://caniuse.com/#feat=woff2

[M86xKC]

@naveed-ahmad you can also fallback or primarily use SVGs (but I think you need to rewrite alot of things), the text will be selectable and indexed by SEs.