2015-03-17 7 views
32

मैं Pingdom के माध्यम से अपनी साइट का परीक्षण किया और यह मिल गया:Google फोंट के लिए मैं 'ब्राउज़र कैशिंग का लाभ कैसे उठा सकता हूं?

enter image description here

मैं खोज की, लेकिन इस के लिए एक समाधान नहीं मिल सका। क्या किसी को पता है कि मैं यह 14 से 100 कैसे प्राप्त कर सकता हूं?

उत्तर

17

चूंकि आप गुगल हेडर (समाप्ति शीर्षलेख सहित) को नियंत्रित नहीं कर सकते हैं, इसलिए मैं केवल एक समाधान देख सकता हूं - इन दो स्टाइलशीट्स और फ़ॉन्ट्स को अपने होस्टिंग सर्वर पर डाउनलोड करें, तदनुसार HTML टैग बदलें।

फिर, आप वांछित शीर्षलेख (क्या पिंगडम 'जीवनकाल' कहा जाता है) सेट कर सकते हैं।

/* latin */ 
@font-face { 
    font-family: 'Montserrat'; 
    font-style: normal; 
    font-weight: 400; 
    src: local('Montserrat-Regular'), url(http://fonts.gstatic.com/s/montserrat/v6/zhcz-_WihjSQC0oHJ9TCYAzyDMXhdD8sAj6OAJTFsBI.woff2) format('woff2'); 
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; 
} 

डाउनलोड इस .woff2 फ़ाइल और अपने वेब सर्वर पर कहीं भी इसे बचा:

उदाहरण के लिए, first link खोलें। कॉपी करें & स्टाइलशीट के इस टुकड़े को अपनी किसी भी सीएसएस फाइल या एचटीएमएल में पेस्ट करें। लिंक को अपने नए यूआरएल में fonts.gstatic.com से बदलें।

Google इन फोंट को 1 दिन की समाप्ति समय के साथ सेवा देता है। आप इसे आसानी से 30 दिनों तक सेट कर सकते हैं।

+6

धन्यवाद, मुझे उम्मीद थी कि मुझे फोंट डाउनलोड नहीं करना पड़ेगा, लेकिन मुझे लगता है कि यह एकमात्र तरीका है। मुझे आश्चर्य है कि क्यों Google, जो पेजस्पेड को सक्रिय रूप से प्रोत्साहित करता है, अपने स्वयं के फ़ॉन्ट भी कैश नहीं करता है। आपका धन्यावाद। मैं आपका जवाब 2 मिनट में स्वीकार करूंगा। – J82

+0

जे 82, शायद, वे किसी भी समय फ़ॉन्ट को संशोधित करने में सक्षम होना चाहते हैं। हालांकि, एक व्यक्तिगत उपयोगकर्ता के रूप में आप वर्तमान संस्करण के साथ ठीक महसूस कर सकते हैं और इसे महीनों तक कैश कर सकते हैं :) –

+34

कृपया ऐसा न करें। सीएसएस फाइलों की सामग्री उपयोगकर्ता एजेंट के आधार पर अलग-अलग होती है! यदि आप क्रोम के साथ फ़ाइल खोलते हैं और सामग्री को सहेजते हैं, तो यह केवल क्रोम आदि के साथ काम करेगा! यदि आप अपने सर्वर से सीएसएस फाइलों की सेवा करना चाहते हैं, तो आपको क्रॉसब्रोसर समाधान प्रदान करना होगा। http://www.localfont.com/ के पास Google फोंट से किसी भी फ़ॉन्ट के लिए आपके लिए इस सीएसएस को उत्पन्न करने का विकल्प है। साथ ही आप सभी ब्राउज़र प्रारूपों में फ़ॉन्ट फ़ाइलों को डाउनलोड कर सकते हैं और यदि आप चाहें तो अपने मेजबान से भी उन लोगों की सेवा कर सकते हैं। – udondan

32
नहीं

एक पूर्ण समाधान है, लेकिन आप एक के दो अनुरोध के संयोजन से स्थिति में सुधार कर सकते हैं:

https://fonts.googleapis.com/css?family=Montserrat|Open+Sans 

मुझे लगता है कि one of my sites पर दो फोंट और के लिए स्कोर 86 की तुलना में अपने 14 महत्वपूर्ण बात, यह एक है वास्तविक गति, एक मनमाना स्कोर को कम करने के लिए सिर्फ एक हैक नहीं।

https://www.fontsquirrel.com/tools/webfont-generator

इस का उपयोग करने के लिए, आप फोंट (मोंटेसेराट और ओपन संस हैं डाउनलोड करने के लिए की आवश्यकता होगी सक्षम होने के लिए:

+1

यह विधि एक वास्तविक गति (मुझे लगता है) है। अपने सर्वर पर फ़ॉन्ट रखने का वैकल्पिक तरीका (आपके सर्वर पर अधिक लोड डालने) परीक्षण पर "100" दिखाते समय धीमी चीजों की संभावना अधिक होगी। वास्तविक प्रदर्शन> परीक्षण स्कोर। – KnightHawk

+1

याद रखें कि आपको पाइप वर्ण '|' को यूआरएल एन्कोडेड स्ट्रिंग 'के बराबर'% 7c' के बराबर बदलना चाहिए, ऐसा नहीं करने से कुछ परिस्थितियों में त्रुटि आ जाएगी। तो उपर्युक्त उदाहरण 'https: //fonts.google.com/css? परिवार = मॉन्टसेराट% 7cOpen + Sans' †: [संदर्भ] (https://www.w3schools.com/TAGs/ref_urlencode के रूप में प्रस्तुत करेगा। एएसपी) ‡: [संदर्भ] (https://stackoverflow.com/questions/21940826/how-to-handle-escape-characters-pipe-in-url-spring-rest-cxf) – MrGrigri

1

एक काफी आसान समाधान का फ़ॉन्ट गिलहरी के Webfont जेनरेटर के साथ अपने स्वयं किट उत्पन्न करने के लिए किया जाएगा दोनों फ़ॉन्ट गिलहरी पर उपलब्ध हैं) और जनरेटर में जोड़ें। इसका उपयोग और अनुकूलन जोड़ने के लिए किया जा सकता है। (मैंने उन मामलों में कई बार इसका इस्तेमाल किया है जहां Google वेबफोंट के फ़ॉन्ट में हंगरी भाषा के लिए आवश्यक सबसेटिंग नहीं थी, भले ही यह मूल फ़ॉन्ट में उपलब्ध था।)

8

सबसे पहले यह भेद को स्पष्ट करना महत्वपूर्ण है Google फ़ॉन्ट्स सीएसएस फ़ाइलों और वास्तविक फ़ॉन्ट फ़ाइलों को कैशिंग के बीच। Google Fonts FAQs के अनुसार, उनकी फ़ॉन्ट फ़ाइलों को वास्तव में एक वर्ष के लिए कैश किया जाता है। यह सीएसएस फाइलें हैं जो 24 घंटे के लिए कैश की जाती हैं:

सीएसएस संपत्तियों के लिए अनुरोध 1 दिन के लिए कैश किए जाते हैं। यह हमें अपडेट किए जाने पर फ़ॉन्ट फ़ाइल के नए संस्करण को इंगित करने के लिए स्टाइलशीट को अपडेट करने की अनुमति देता है, और यह सुनिश्चित करता है कि Google फ़ॉन्ट्स एपीआई द्वारा होस्ट किए गए फोंट का उपयोग करने वाली सभी वेबसाइटें प्रत्येक रिलीज के 24 घंटों के भीतर प्रत्येक फ़ॉन्ट का सबसे अद्यतन संस्करण उपयोग कर रही होंगी ।

फ़ॉन्ट फ़ाइलों को स्वयं एक वर्ष के लिए कैश किया जाता है, जो संचयी रूप से पूरे वेब को तेजी से बनाने का प्रभाव डालता है: जब लाखों वेबसाइटें सभी एक ही फ़ॉन्ट से लिंक होती हैं, तो उन्हें पहली वेबसाइट पर जाने के बाद कैश किया जाता है और तुरंत दिखाई देता है अन्य बाद में देखी गई साइटों। हम कभी-कभी अपनी फ़ाइल आकार को कम करने, भाषाओं के कवरेज को बढ़ाने और उनके डिजाइन की गुणवत्ता में सुधार करने के लिए फ़ॉन्ट फ़ाइलों को अपडेट करते हैं। नतीजा यह है कि वेबसाइट आगंतुक Google को बहुत कम अनुरोध भेजते हैं: हम प्रति ब्राउज़र परिवार प्रति दिन केवल 1 सीएसएस अनुरोध देखते हैं।

मैं इन सीएसएस फ़ाइलों को स्वयं होस्ट करने के खिलाफ अनुशंसा करता हूं, क्योंकि आप पीछे आ जाएंगे और फोंट के नवीनतम संस्करणों का उपयोग नहीं कर रहे हैं।

हालांकि, वहाँ कुछ तरीके आप सीएसएस अनुरोध में तेजी लाने के कर सकते हैं:

  1. मार्क उसके जवाब में उल्लेख किया है, आप एक ही अनुरोध में अपने दो वेबफ़ॉन्ट गठजोड़ कर सकते हैं: https://fonts.googleapis.com/css?family=Montserrat|Open+Sans
  2. यदि आप केवल फ़ॉन्ट की एक निश्चित शैलियों का उपयोग करके आप केवल उन शैलियों को लोड कर सकते हैं जिनका आप वास्तव में उपयोग कर रहे हैं। यहां हम सभी मॉन्टसेराट लोड कर रहे हैं, लेकिन केवल ओपन सेन्स की तीन शैलियों को लोड कर रहे हैं; नियमित रूप से (400), इटैलिक (400i), और बोल्ड (700): <link href="https://fonts.googleapis.com/css?family=Montserrat|Open+Sans:400,400i,700" rel="stylesheet">
1

मालूम है कि आप 24 घंटे से अधिक गूगल द्वारा प्रदान की सीएसएस कैश करने के लिए अनुमति नहीं है रहो।

बस कह ... according to Google's terms and conditions.

0

क्या मैं काम करने के लिए मिल गया (कोड के साथ मेरी .htaccess फाइल में मेरे सीएसएस फ़ाइलें करने के लिए एक के बाद प्रोसेसर के रूप में पीएचपी जोड़ने था मैं एक कस्टम .pcss फाइल एक्सटेंशन का उपयोग कर रहा - बस यह मेरे सरल सीएसएस फ़ाइलों से अलग बनाने के लिए):

<FilesMatch "\.pcss$"> 
SetHandler application/x-httpd-php 
Header set Content-type "text/css" 
</FilesMatch> 

तो मैं निम्नलिखित कोड मेरे सीएसएस फ़ाइल में मिलता है और फ़ॉन्ट यूआरएल मैं चाहता था की सामग्री प्रतिध्वनित करने के लिए इस्तेमाल किया।

<?php 
echo file_get_contents("https://fonts.googleapis.com/css?family={FONT}"); 
?> 
+0

इतनी भयानक हैक! – m47730

संबंधित मुद्दे

 संबंधित मुद्दे