एक वेबसाइट का मोबाइल संस्करण: आठ स्थान यह अक्सर टूट जाता है

आधे से अधिक विज़िट फोन से आते हैं, और जांच डेस्कटॉप पर होती है

एक साइट मालिक अपनी साइट को एक बड़ी स्क्रीन पर देखता है, जिसमें तेज इंटरनेट, एक माउस और एक गर्म कैश होता है। उनका आगंतुक आमतौर पर एक ट्रेन पर, एक हाथ का उपयोग करते हुए एक फोन पर होता है।

इसके कारण महीनों के लिए गलती का एक पूरा वर्ग अदृश्य रहता है। क्योंकि वे ढूंढना मुश्किल है, लेकिन क्योंकि कोई भी पक्ष से नहीं दिखता है जहां वे मौजूद हैं।

यह लगभग हमेशा बनाया जा रहा है मोबाइल संस्करण से बदतर बनाया गया है। पहले विस्तृत स्क्रीन लेआउट, फिर इसे फोन के लिए नीचे निचोड़ें। squeezing वास्तव में जहां चीजें टूट जाती हैं।

नीचे: आठ स्थान जो अक्सर टूट जाते हैं, आवृत्ति के क्रम में और आधे घंटे में अपनी खुद की साइट की जांच करने का एक तरीका जो इसकी पुष्टि करने के बजाय वास्तविक समस्याओं को ढूंढता है।

क्यों ठीक दिखता है एक चेक नहीं है

चेकिंग का सबसे आम तरीका साइट को अपने फोन और स्क्रॉलिंग पर खुल रहा है। यह केवल कच्चे लेआउट दोषों को पकड़ता है और सब कुछ याद करता है।

आपका फोन औसत फोन नहीं है। यह नया है, स्क्रीन बड़ा है, कनेक्शन तेज़ है, और आधे साइट पहले से ही पिछली यात्राओं से कैश किया गया है।

और महत्वपूर्ण रूप से: आप जानते हैं कि कहां टैप करना है। आप एक बटन, रीडिंग लेबल के लिए शिकार नहीं हैं, या सोच रहे हैं कि क्या खुल जाएगा। तीन चीजें वास्तव में क्या एक अजनबी के मोबाइल अनुभव के होते हैं।

एक वास्तविक जांच समाप्त करने के लिए एक विशिष्ट कार्य अंत पूरा कर रहा है: एक मूल्य प्राप्त करें, एक जांच प्रस्तुत करें, एक कॉल करें। और कब तक यह हुआ।

होम वाईफाई के बजाय मोबाइल डेटा पर अलग से चेक करें। गति अंतर पांच गुना हो सकता है, और आधे समस्याएँ केवल उसी तरह दिखाई देती हैं।

बटन: आकार और उन्हें मारना

सबसे आम गलती और ठीक करने के लिए सबसे सस्ता है।

एक उंगली एक कर्सर नहीं है। टैप करने योग्य क्षेत्र को बटन दिखने से काफी बड़ा होना चाहिए: लगभग एक सेंटीमीटर का एक वर्ग एक तरफ गाइड है। पाठ की एक पंक्ति की ऊंचाई को जोड़ने के लिए यह नहीं मिलता है।

दूसरी परेशानी बटन एक दूसरे के खिलाफ फ्लश रखा है। किसी भी अंतराल के साथ दो पड़ोसी तत्वों का मतलब है कि लोग नियमित रूप से गलत हो जाते हैं, और हमेशा नोटिस नहीं करते हैं।

तीसरा ब्राउज़र बार के तहत एक बटन है। एक फोन स्क्रीन के नीचे अंतरफलक से संबंधित है, और एक तत्व नीचे तक पिन आधा छिपा हुआ समाप्त होता है।

और एक चौथा, कम स्पष्ट एक: एक फोन नंबर जो टैप करते समय डायल नहीं करता है। नंबर को सादे पाठ के रूप में लिखना और इसे एक लिंक का मतलब है कि किसी को एक-हाथ का चयन करने और कॉपी करने के लिए मजबूर करना।

प्रपत्र: जहाँ पूछताछ खो जाती है

एक फोन पर एक रूप जहां अधिकांश लोग इसे यात्रा के अंत में बनाने के लिए दूर हो जाते हैं।

प्रत्येक अतिरिक्त क्षेत्र की लागत डेस्कटॉप से अधिक है: टाइपिंग अजीब है, स्क्रीन छोटा है, चारों ओर सब कुछ विचलित है। क्या आप किसी को वापस बुलाने की जरूरत है?

प्रत्येक क्षेत्र में कौन-सा कीबोर्ड खुलता है। एक फोन क्षेत्र में संख्यात्मक कीबोर्ड को लाना चाहिए, एक ईमेल क्षेत्र जिसे संकेत के साथ, साधारण नहीं। यह मार्कअप की एक पंक्ति है और आराम में उल्लेखनीय अंतर है।

जब कीबोर्ड आधे स्क्रीन को कवर करता है तो क्या होता है। अक्सर क्षेत्र को इसके नीचे समाप्त होने में टाइप किया जाता है, और व्यक्ति अंधा टंक रहा है।

और जांचें कि प्रस्तुतीकरण स्क्रॉल के बिना दिखाई दे रहा है। यदि आपको धन्यवाद संदेश viewport के ऊपर दिखाई देता है, तो लोग इसे नहीं देखेंगे और दूसरे समय बटन दबाएगा।

तालिकाओं, मूल्य सूचियों और कुछ भी चौड़ा

दोष का दूसरा सबसे आम स्रोत और यदि आपके पास सूची है तो परिणाम में पहला।

एक छह स्तंभ तालिका किसी भी तरह से एक फोन फिट नहीं है। दो विकल्प हैं: इसे अपने खुद के कंटेनर के अंदर क्षैतिज स्क्रॉल देना, या इसे कार्ड के रूप में पुनर्निर्माण करना जहां प्रत्येक पंक्ति एक ब्लॉक बन जाती है।

क्या किया जा सकता है, यह क्या है? फिर पूरा पृष्ठ स्क्रॉल करता है, और कोई भी मेनू और हेडर के साथ टेबल के दाहिने हाथ के किनारे को देखने की कोशिश करता है।

इसी तरह व्यापक छवियों, कोड ब्लॉक और एम्बेडेड नक्शे के लिए जाता है। स्क्रीन की तुलना में व्यापक कोई भी तत्व पृष्ठ को खींचने के बजाय खुद को स्क्रॉल करना पड़ता है।

यह परीक्षण करने के लिए एक इशारा लेता है: पृष्ठ पर कहीं भी स्वाइप करें। यदि पृष्ठ को स्थानांतरित किया गया है, तो आपके पास एक तत्व है जो इसे तोड़ देता है।

पॉपअप

डेस्कटॉप पर एक पॉपअप स्क्रीन का हिस्सा शामिल है। फोन पर यह सभी को कवर करता है।

इसलिए कठिन के रूप में इलाज के लिए एक नियम: फोन पर एक पॉपअप पर्याप्त आकार के एक करीबी बटन के माध्यम से पहले प्रयास पर बंद होना चाहिए, और उसी सत्र में फिर से प्रकट नहीं होना चाहिए।

पॉपअप जो तुरंत आगमन पर दिखाई देते हैं वे सबसे हानिकारक हैं। खोज से आने वाले कुछ लोगों ने अभी तक काम नहीं किया है कि वे सही जगह पर हैं और पहले से ही कुछ खारिज कर चुके हैं। केवल एक अनुपात छोड़ देता है।

अपनी खुद की एक श्रेणी सहमति और अधिसूचना एक दूसरे के शीर्ष पर स्टैकिंग को प्रेरित करती है। एक छोटी स्क्रीन पर एक बार दो संवादों का मतलब है कि सामग्री बिल्कुल भी दिखाई नहीं देती है।

एक व्यावहारिक समझौता: प्रस्ताव तुरंत नहीं दिखाते, लेकिन किसी ने आधे रास्ते में स्क्रॉल किया है या पृष्ठ पर कम से कम आधे मिनट खर्च किया है।

पाठ: आकार, रेखा लंबाई, विपरीत

तीन चीजें जो स्वाद की तरह दिखती हैं और यह तय करती हैं कि कोई पढ़ता है या नहीं।

आकार: एक फोन पर छोटे पाठ पढ़ा नहीं जाता है, यह बड़े पैमाने पर pinched हो जाता है, और यह परेशान है। शरीर पाठ एक डेस्कटॉप से भी छोटा नहीं होना चाहिए।

लाइन की लंबाई: एक संकीर्ण स्क्रीन लाइनों पर अपने दम पर कम हो जाते हैं, लेकिन साइड मार्जिन अक्सर बहुत व्यापक हो जाते हैं। पाठ कक्ष की जरूरत है, लेकिन आधे स्क्रीन की कीमत पर नहीं।

इसके विपरीत: सफेद रंग पर पीला ग्रे एक अच्छा मॉनिटर घर के अंदर पर सुरुचिपूर्ण दिखता है और सूरज की रोशनी में एक फोन पर गायब हो जाता है। इसे बाहर की जाँच करना पड़ता है, न कि डेस्क पर।

और Zooming अक्षम नहीं है। कुछ साइटें लेआउट स्थिरता के कारण चुटकी से ज़ूम को बंद कर देती हैं - खराब दृष्टि वाले लोगों के लिए जो साइट को अनुपयोगी बनाती हैं।

क्या विशेष रूप से एक फोन को धीमा कर देता है

मोबाइल गति डिग्री में नहीं बल्कि तरह से भिन्न होती है: बछड़े अलग होते हैं।

छवियाँ एक व्यापक स्क्रीन पर एक हजार पिक्सेल पर क्या प्रदर्शित होता है, उसे फोन पर आधा करना पड़ता है। यदि साइट सभी को एक फ़ाइल प्रदान करती है, तो फोन डाउनलोड करता है जो इसका उपयोग नहीं कर सकता है।

तृतीय-पक्ष लिपियों। चैट, काउंटर, समीक्षा विजेट, नक्शे। प्रत्येक शक्तिशाली कंप्यूटर पर अयोग्य है और साथ में वे औसत फोन पर प्रतीक्षा करने के सेकंड तक जोड़ते हैं।

फ़ॉन्ट्स यदि टेक्स्ट डाउनलोड करने के लिए फ़ॉन्ट के लिए इंतजार करता है, तो कोई खाली स्थान पर देख रहे कई सेकंड खर्च करता है। यह एक लाइन में कॉन्फ़िगर किया गया है, और यह लाइन लगभग हमेशा भूल गई है।

और सब कुछ एक बार में लोड हो रहा है। पहली स्क्रीन के नीचे जो भी बैठता है वह स्क्रॉल पर लोड होना चाहिए। डेस्कटॉप पर फर्क मुश्किल से दिखाई देता है; एक फोन पर यह निर्णायक है।

कैसे ठीक से जांचें

चार तरीके, सबसे सटीक करने के लिए सबसे सस्ता।

डेस्कटॉप से फोन की चौड़ाई तक ब्राउज़र विंडो को सिकोड़ें। एक मिनट में कैच क्रूड लेआउट दोष, लेकिन उंगलियों या गति के बारे में कुछ भी नहीं।

ब्राउज़र में डिवाइस मोड। सत्य के करीब: यह माउस के बजाय स्क्रीन आकार, पिक्सेल घनत्व और स्पर्श का अनुकरण करता है। प्रारूपों और बटन लक्ष्यों का परीक्षण करने का एक अच्छा तरीका।

मोबाइल डेटा पर अपना खुद का फ़ोन। वास्तविक गति देखने का एकमात्र तरीका। कैश क्लियर के साथ - एक निजी विंडो में साइट को खोलें।

और किसी और का फ़ोन, जो आपके से बेहतर रूप से पुराना है। सभी की सबसे ईमानदार जांच, और यह नियमित रूप से बताता है कि क्या कुछ नहीं करता है।

उत्तरदायी लेआउट या एक अलग मोबाइल साइट

एक सवाल जो प्रतियोगिता में इस्तेमाल किया जाता था और अब एक स्पष्ट जवाब है।

अपने पते पर एक अलग मोबाइल साइट एक पुराना समाधान है। इसका मतलब पृष्ठों के दो सेट, पाठ के दो सेट और एक स्थायी जोखिम है कि वे विविध हैं।

एक उत्तरदायी लेआउट उन पृष्ठों का एक सेट है जो स्क्रीन चौड़ाई तक पहुंचते हैं। एक पता, एक पाठ, अद्यतन करते समय एक नौकरी।

खोज इंजन अपने मोबाइल संस्करण द्वारा एक साइट का न्याय करते हैं: यह प्राथमिक रूप से इलाज किया जाता है। जिसका मतलब है कि आप कॉम्पैक्टनेस के लिए फोन पर छिपाई गई सामग्री सभी पर खोज के लिए मौजूद नहीं हो सकती है।

व्यावहारिक परिणाम: मोबाइल संस्करण पर पाठ और लिंक छिपाना नहीं है। उन्हें विस्तारणीय ब्लॉकों में मिलाना ठीक है; उन्हें पूरी तरह से हटाने नहीं है।

आधे घंटे की चेकलिस्ट

एक फोन लें, वाईफाई बंद करें, और बिंदुओं के माध्यम से काम करें।

साइट को एक निजी विंडो में खोलें और उस समय जब तक सामग्री दिखाई न दे तब तक कितनी देर तक।

साइट की अपनी खोज का उपयोग किए बिना किसी भी सेवा की कीमत ज्ञात करें।

अंत में एक जांच सबमिट करें और पुष्टि के लिए प्रतीक्षा करें।

फोन नंबर टैप करें और डायलर ओपन की जांच करें।

कई पृष्ठों पर स्वाइप साइडवे और देखें कि क्या पृष्ठ स्वयं चल रहा है।

एक तालिका या मूल्य सूची के साथ एक पृष्ठ खोलें और दाहिने हाथ के किनारे को पढ़ने की कोशिश करें।

और एक धूप दिन के बाहर साइट ले लो। आधे विपरीत समस्याएं केवल वहाँ दिखाई देती हैं।