كما رأيت أول يوم، فإن موقع arabia.io يستخدم font awesome وهو خط يوفر مجموعة من الأيقونات للاستخدام،

حسب ما أظن فالموقع يستعمل ما بين 9~12 أيقونة إن لم أكن مخطأ، وبقية الأيقونات غير مستعملة،

فأجدها عبئا إضافيا، فحجم الخط هو 80 كيلو بايت، وحجم SVG هو 240 كيلو بايت، كما أنّ الأيقونات تظهر بشكل بشع في كروم الخاص بويندوز،

والأمل الوحيد لإصلاحها هو استعمال خط SVG في كروم، لكن هذا يعني 240 كيلو إضافية في التحميل،

فالحل الأنسب الذي أجده هو استعمال أحد الموقعين التاليين

http://icomoon.io/app/#/select

http://fontello.com/

وهي مواقع تقوم بتخصيص الخطوط، بحيث تستعمل ما تحتاجه فقط، بمعنى بدل 80 كيلو بايت للخط، ستستعمل 2 كيلو فحسب، و6 كيلو لل SVG

وأجد حل مناسب ويضرب عصفورين بحجر واحد، وهو تخفيظ حجم الخط، وكذى إصلاح مشكلة كروم،

وبالنسبة لحل مشكلة كروم، فهي تكمن بتقديم خط SVG لها في media query تستهدفها لوحدها، يمعنى بهذا الشكل

@media screen and (-webkit-min-device-pixel-ratio:0)
{
    @font-face
    {
        font-family: 'font awesome';
        src: url('/fonts/fontawesome.svg#fontawesome') format('svg');
    }
}

وإضافة بقية الخطوط بشكل عادي قبل الميديا

ولا يجب استعمال خط SVG لوحده، لأن فايرفوكس لا يدعمه

وبالتوفيق