मोबाइल को पहले कैसे रखें, प्रदर्शन उन्मुख वर्डप्रेस थीम [भाग 2]

मोबाइल को पहले कैसे रखें, प्रदर्शन उन्मुख वर्डप्रेस थीम [भाग 2]

मोबाइल को पहले कैसे रखें, प्रदर्शन उन्मुख वर्डप्रेस थीम [भाग 2]
СОДЕРЖАНИЕ
02 июня 2020

यदि आपने यह देखने के लिए नीचे स्क्रॉल किया है कि यहां स्टोर में क्या है, तो आप सोच रहे होंगे कि अंक 1-5 को जो भी हुआ.


आह, सही, यह पता लगाने के लिए कि उत्तर क्या है, आपको इस मिनी-सीरीज़ के पहले भाग पर एक नज़र डालनी चाहिए.

संक्षेप में, यहाँ हम आपको एक गाइड दे रहे हैं कैसे वर्डप्रेस के लिए एक उच्च प्रदर्शन मोबाइल विषय बनाने के लिए. यह पहली बार में ऐसा नहीं लग सकता है, लेकिन चुनौती वास्तव में ज्यादातर लोगों की सोच से बड़ी है.

आखिरकार, आम धारणा यह है कि आपको केवल विषय को उत्तरदायी बनाना होगा और ध्वनि, यह मोबाइल-अनुकूलित, सही है? खैर, काफी नहीं। तो आगे की हलचल के बिना, चलो विषय पर सही वापस आते हैं.

भाग 1 के लिए, यहाँ देखें: मोबाइल सबसे पहले कैसे रखें, प्रदर्शन उन्मुख वर्डप्रेस थीम [भाग 1]

6. सभी मोबाइल ब्राउज़रों के लिए डिज़ाइन

यह वास्तव में आश्चर्यजनक है कि HTML कोड का एक टुकड़ा वेब ब्राउज़र के आधार पर कैसे व्यवहार कर सकता है, जिस पर इसे चलाया जा रहा है। और यह दोनों मोबाइल और डेस्कटॉप कंप्यूटर के लिए जाता है। मोबाइल के लिए शायद इतना अधिक है, हालांकि, चूंकि हमारे पास निपटने के लिए सैकड़ों विभिन्न डिवाइस और स्क्रीन चश्मा हैं.

इसलिए, अपने विषय पर काम करते समय, निम्नलिखित के बारे में याद रखना सुनिश्चित करें:

  • जैसे ही आप जाते हैं सभी प्रमुख ब्राउज़रों पर अपने काम का परीक्षण करें – इस पर जल्दी करना समस्या निवारण को बहुत आसान बना देगा, जैसा कि आपके ब्राउज़र परीक्षणों को शुरू करने के विपरीत है जब आपके पास पहले से ही पूरी थीम है।,
  • अपने हाथों को उतने ही उपकरणों पर प्राप्त करें जितना आप कर सकते हैं और देख सकते हैं कि विषय उन पर कैसा व्यवहार करता है (यदि संभव हो तो अलग-अलग स्क्रीन आकार, रिज़ॉल्यूशन और अनुपात का प्रयास करें).

7. यूएक्स मायने रखता है

मोबाइल पर, लोग डेस्कटॉप पर की तुलना में वेबसाइटों से बहुत अलग तरीके से बातचीत करते हैं.

यह बुनियादी लगता है, लेकिन मुझे सिर्फ आपको एक सरल उदाहरण देना चाहिए। जब कोई अपने डेस्कटॉप पर एक पिज्जा स्थान की तलाश में होता है, तो वे संभवतः उन रेस्तरां के बारे में कई विवरणों में रुचि रखते हैं जो वे बाहर की जाँच कर रहे हैं। उदाहरण के लिए, मेनू, गैलरी, संपर्क विवरण और इसी तरह की चीजें.

हालांकि, अगर वे मोबाइल पर एक ही वेबसाइट पर जाते हैं, तो वे शायद केवल एक ही चीज़ की परवाह करते हैं – कैसे स्थान पर जाएं और आरक्षण करने के लिए किस नंबर पर कॉल करें.

यह सब उबलता है कि जब आप मोबाइल के लिए एक विषय का निर्माण कर रहे हैं, तो डिजाइन को साइट के मालिक को उन विशिष्ट तत्वों पर अतिरिक्त ध्यान केंद्रित करने में सक्षम बनाना चाहिए जो मोबाइल आगंतुकों के लिए महत्वपूर्ण हो सकते हैं।.

इसे करने का सबसे आसान तरीका अच्छी तरह से डिज़ाइन किए गए विजेट क्षेत्रों के माध्यम से है जो होमपेज पर दिखाई देते हैं और स्क्रीन के दृश्य क्षेत्र के शीर्ष भाग में रहते हैं (उर्फ उन्हें ऊपर से रखते हुए).

मोबाइल पर रहने के दौरान, लोगों के पास उन सूचनाओं की तलाश के लिए बहुत कम समय होता है जिनकी उन्हें आवश्यकता होती है। यही कारण है कि इस जानकारी को सुलभ बनाने के लिए एक अच्छा मोबाइल डिज़ाइन प्रभावी होना चाहिए.

8. कम ज्यादा है

कम अधिक अवधारणा आसानी से थीम विकास में अधिकांश परिदृश्यों पर लागू की जा सकती है, और जब मोबाइल विषयों की बात आती है, तो इसका मतलब है कि एक महान विषय और एक तथाकथित विषय के बीच का अंतर.

यहां आप कम से अधिक हासिल करने के लिए क्या कर सकते हैं:

  • ब्रांडिंग तत्वों के लिए कम जगह छोड़ें. साइट के लोगो के लिए कुछ स्थान महत्वपूर्ण है, यह स्पष्ट है। हालाँकि, यह अभी भी वास्तविक सामग्री के रूप में महत्वपूर्ण नहीं है, इसलिए सुनिश्चित करें कि लोगो को तह के ऊपर के अधिकांश हिस्से पर कब्जा न करने दें.
  • सुलभ मेनू पेश करें। मेन्यू हमेशा मोबाइल पर एक समस्या रही है। एक तरफ, वेबसाइटों को मेनू की आवश्यकता होती है। लेकिन दूसरे पर, यहां तक ​​कि एक संक्षिप्त मेनू (केवल चार आइटम या तो) आसानी से अधिकांश मोबाइल उपकरणों पर पाठ की दो पंक्तियों का उपयोग कर सकते हैं, जो पृष्ठ के नीचे सामग्री को आगे बढ़ाता है। इसे हल करने के लिए आप यहां क्या कर सकते हैं: (1) मेनू को सामान्य रूप से प्रदर्शित करें यदि यह पाठ की एक पंक्ति के भीतर फिट बैठता है, (2) यदि यह नहीं है तो इसे ड्रॉप-डाउन करें.
  • महत्वहीन मेनू से छुटकारा पाएं। मुझे यह कहते हुए जोखिम है कि अधिकांश समय, पाद मेनू मोबाइल आगंतुक के लिए कोई मूल्य नहीं लाता है। डेस्कटॉप पर, यह एक तरह के कैच-ऑल मेनू के रूप में कार्य करता है, जहाँ आगंतुक अन्य सभी पेजों के लिंक पा सकते हैं, लेकिन मोबाइल पर, शायद ही कोई ऐसा कारण हो जो कोई भी इसका उपयोग करेगा। जब आपकी थीम मोबाइल पर देखी जा रही हो, तो इससे पूरी तरह से छुटकारा पाने पर विचार करें.
  • अतिरिक्त वेबसाइट सुविधाओं के साथ सावधान रहें। जब एक नई वर्डप्रेस थीम में कस्टम सुविधाओं को पेश करने की बात आती है तो अनगिनत संभावनाएं होती हैं। आप छवि स्लाइडर, सोशल मीडिया एकीकरण, कस्टम दीर्घाओं, और कई अन्य चीजों को लागू कर सकते हैं। लेकिन आपको करना चाहिए? हालाँकि उन फ़ीचर आइडियाज़ सभी शानदार हैं, लेकिन वे मोबाइल उपयोगकर्ताओं के लिए कुछ समस्याएँ पैदा कर सकते हैं। यदि आप यह सुनिश्चित करना चाहते हैं कि आपका विषय अधिकांश प्लेटफार्मों पर ठीक से काम करता है, तो देशी का उपयोग करें wp_is_mobile () समारोह। यह आपको मोबाइल और डेस्कटॉप आगंतुकों के बीच अंतर करने की अनुमति देगा, जिससे आप किसी भी समस्या से बचने के लिए पूर्व के इंटरफ़ेस को सरल बना सकते हैं.

9. केवल आवश्यक फाइलें लोड करें

इन दिनों, लोग मोबाइल उपकरणों की एक बड़ी श्रृंखला से वेब का उपयोग कर सकते हैं, इसलिए अनिवार्य रूप से, इनमें से कुछ उपकरण बहुत पुराने हो जाएंगे और आधुनिक वेब सुविधाओं का समर्थन करने में सक्षम नहीं होंगे। इस वजह से, आपको हमेशा यह देखना चाहिए कि किसी दिए गए कार्यक्षमता को निष्पादित करने के लिए कौन से पुस्तकालय या मॉड्यूल की आवश्यकता है.

ऐसा करने के सर्वोत्तम तरीकों में से एक समाधान के माध्यम से है Modernizr. संक्षेप में, यह एक जावास्क्रिप्ट पुस्तकालय है जो उपयोगकर्ता के ब्राउज़र में HTML5 और CSS3 सुविधाओं का पता लगाता है। यह आपको इस बात के आधार पर सशर्त कोड लिखने की अनुमति देता है कि क्या किसी दिए गए फ़ीचर को डिफ़ॉल्ट रूप से ब्राउज़र में शामिल किया गया है या नहीं। फिर, यदि इसकी आवश्यकता है, तो आवश्यक लाइब्रेरीज़ आयात की जा सकती हैं.

modernizr

लेकिन माडर्निज़र सब कुछ के लिए समाधान नहीं होगा। यहां कुछ अन्य दिशानिर्देशों को ध्यान में रखा गया है:

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

10. एक परीक्षण सर्वर पर गति परीक्षण करें

स्थानीय परीक्षण सर्वर होने से विकास के शुरुआती चरणों में काफी अच्छा होगा, लेकिन आपको जल्दी से अधिक उन्नत परीक्षण सेटअप शुरू करने की आवश्यकता होगी.

तथ्य यह है कि आप कभी भी यह नहीं जान पाएंगे कि आपके विषय को तब तक कैसे अनुकूलित किया जाता है जब तक कि आप इसे मुट्ठी भर परीक्षण वातावरणों में स्थापित नहीं करते हैं और देखें कि यह वास्तविक जीवन में कैसा प्रदर्शन करता है.

अभी भी लागत कम रखते हुए, आप सस्ते साझा होस्टिंग खातों की एक जोड़ी पर अपने विषय को स्थापित करके ऐसा कर सकते हैं (चूंकि अधिकांश उपयोगकर्ता संभवतः वैसे भी उन का उपयोग करेंगे)। फिर, आप निम्नलिखित उपकरणों का उपयोग करके विभिन्न परीक्षण चला सकते हैं:

  • पेजस्पीड इनसाइट्स. Google द्वारा निर्मित एक उपकरण। यह आपको दोनों के बारे में अच्छा डेटा देगा, आपके मोबाइल और डेस्कटॉप के प्रदर्शन के साथ-साथ चीजों को बेहतर बनाने के कुछ टिप्स के साथ.
  • पीएसटीपी वेबसाइट स्पीड टेस्ट. यह टूल आपको प्रत्येक व्यक्तिगत स्क्रिप्ट / फ़ाइल को लोड करने में कितना समय लगता है, इस पर आपको पूरी तरह से ब्रेकडाउन देगा.
  • Ghostlab. वेब और मोबाइल के लिए एक साथ सिंक्रनाइज़ किए गए ब्राउज़र परीक्षण के लिए बहुत आसान उपकरण.
  • Mobitest द्वारा मोबाइल प्रदर्शन परीक्षण. आपको वास्तविक मोबाइल उपकरणों पर अपनी साइट का परीक्षण करने की अनुमति देता है, न कि केवल एक सामान्य, मोबाइल वातावरण.
  • BrowserStack. आपको हर लोकप्रिय मोबाइल और डेस्कटॉप ब्राउज़र के हर संस्करण के लिए त्वरित पहुँच प्रदान करता है। इस उपकरण के साथ, आपको आश्चर्य नहीं होगा कि एक पुराने ब्राउज़र पर आपका विषय कैसा दिखने वाला है, आप केवल कुछ क्लिक के साथ एक स्क्रीनशॉट उत्पन्न कर सकते हैं.

PageSpeed

यह एक मोबाइल निर्माण के लिए हमारे 10 कदम गाइड को पूरा करता है, प्रदर्शन उन्मुख वर्डप्रेस थीम। मुझे आशा है कि आपको इसमें से कुछ अच्छे विचार मिलेंगे और इससे आपको अपने अगले विषय को एक सच्चे प्रदर्शन राक्षस में बदलने में मदद मिलेगी!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Это интересно
    Adblock
    detector