2013-03-19 11 views
5

के आधार पर अनावश्यक सामग्री डाउनलोड करना रोकें मैं एक उत्तरदायी वेबसाइट बना रहा हूं जिस पर मेरे पास एक समाचार अनुभाग है। आगंतुकों के स्क्रीन आकार के आधार पर इस खंड में 2, 3 या 4 समाचार आइटम हैं। अभी के लिए, सीएमएस (मोडक्स) हमेशा 4 समाचार वस्तुओं की आपूर्ति करता है और यदि उपयोगकर्ता के पास एक छोटा सा व्यूपोर्ट होना चाहिए तो मैं मीडिया प्रश्नों के साथ अतिरिक्त समाचार आइटम छुपाता हूं।स्क्रीन आकार

यह बहुत ही कुशल प्रतीत नहीं होता है (यह छोटी स्क्रीन वाले लोगों के लिए अतिरिक्त बैंडविड्थ का उपयोग करता है)। उपर्युक्त दृष्टिकोण का उपयोग करके मैं "नई पोस्ट", "पुरानी पोस्ट" - टाइप नेविगेशन के साथ परेशानी में भाग लेता हूं (क्योंकि "पुरानी पोस्ट" पर क्लिक करने से हमेशा 4 पुरानी पोस्ट लोड हो जाएंगी, जबकि कुछ लोगों को केवल 2 या 3 की आवश्यकता हो सकती है)।

क्या ऐसा करने के लिए एक बेहतर, विश्वसनीय तरीका है? क्या समाचार वस्तुओं की सेवा को अधिक उत्तरदायी बनाना संभव है? दूसरे शब्दों में: स्क्रीन आकार के आधार पर, मैं अनावश्यक सामग्री को डाउनलोड होने से कैसे रोकूं?

+0

अलग-अलग साइटों के विरुद्ध उत्तरदायी डिज़ाइन के नुकसान में से एक यह है कि सामग्री को डाउनलोड किया जाता है भले ही यह सीएसएस से छिपा हुआ हो - इसके आस-पास एक तरीका स्क्रीन के आकार के आधार पर जेएस के साथ कुछ आइटम इंजेक्ट करना होगा लेकिन फिर यदि आपकी जेएस अक्षम है – Pete

+0

आप सर्वर साइड घटकों का उपयोग कर देख सकते हैं: http://www.lukew.com/ff/entry.asp?1392 –

+0

आपको इसे सर्वर की तरफ या आलसी- लोड हो रहा है, कृपया अपने डिजाइनरों को इस पृष्ठ पर भी निर्देशित करें: https://managewp.com/5-reasons-why-responsive- डिज़ाइन- यह – span

उत्तर

3

एक तरह से आप क्या कर रहे करने के लिए रिवर्स मार्ग लेने के लिए होगा: केवल 1 समाचार के साथ पेज पैदा करते हैं और उसके बाद से अपने आप पॉप्युलेट अधिक यदि आवश्यक हो तो

(बजाय 4 के साथ पैदा करने और फिर उन्हें छुपाने का) आप यह पता लगा सकते हैं कि उपयोगकर्ता का व्यूपोर्ट जेएस के साथ और कहानियों के लिए अनुमति देता है और उसके बाद उन्हें AJAX का उपयोग करके लाता है (शायद इस दौरान 'लोडिंग और ..' एनीमेशन के साथ)।

इस तरह मोबाइल उपयोगकर्ताओं को बैंडविड्थ का उपयोग नहीं मिलता है और यह गैर-जेएस उपयोगकर्ताओं के लिए भी 1 समाचार कहानी में गिरावट देता है (आप इसके अलावा गैर-जेएस उपयोगकर्ताओं को "अधिक के लिए क्लिक करें" के साथ बड़े व्यूपोर्ट प्रदान कर सकते हैं। लिंक)

+0

है जो समझ में आता है। मेरे मीडिया प्रश्न एम में हैं, क्या आप जानते हैं कि jquery एम में भी व्यूपोर्ट आकार का पता लगा सकता है? क्योंकि तब, यह एक उत्कृष्ट समाधान होगा। –

+0

चारों ओर देखकर मैं देखता हूं कि यह मुश्किल होगा, इसलिए मुझे लगता है कि यह केवल तभी काम करेगा जब मैं अपने मीडिया प्रश्नों को पीएक्स में करता हूं। –

+0

@Ella Ryan का उल्लेख है, प्रगतिशील वृद्धि आपके उत्तरदायी साइट उपयोगकर्ता के अनुकूल रखने के लिए एक महान और एकमात्र समाधान होगा। AJAX के साथ और अधिक समाचार प्राप्त करना काफी सरल है और हैंडहेल्ड उपकरणों का उपयोग करने वालों के लिए एक अंतर बनाएगा –

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