मालवेअर हे अनाहूत किंवा धोकादायक प्रोग्राम आहेत जे...
आज आम्ही ऑप्टिमायझेशन टिप्सचा एक संच तुमच्या लक्षात आणून देतो, ज्याची प्रभावीता वास्तविक आणि अतिशय विश्वासार्ह प्रकरणांद्वारे समर्थित आहे.
आपण कदाचित काही अभ्यासांच्या परिणामांशी आधीच परिचित आहात, परंतु आम्ही त्यांना थोड्या वेगळ्या कोनातून पाहण्याचा प्रयत्न करू.
1. "तीन-क्लिक नियम" विसरा
त्याच्या पुस्तकात आपली प्रतिभा घेऊन वेब (2001) जेफ्री झेल्डमन, वेब डिझाईनच्या जगात एक प्रसिद्ध व्यक्ती, "तीन-क्लिक नियम एक अंतर्ज्ञानी आणि तार्किक श्रेणीबद्ध रचना असलेल्या वेबसाइट तयार करण्यात मदत करते" ही कल्पना पुढे मांडली. म्हणजेच, जर वापरकर्त्याला ते शोधत असलेल्या सामग्रीच्या भागामध्ये प्रवेश करण्यासाठी तीनपेक्षा जास्त क्लिक करण्याची आवश्यकता असल्यास, त्यांना निराशा येऊ लागते कारण त्यासाठी खूप प्रयत्न करावे लागतात आणि वेळेचा अपव्यय समजला जातो.
तथापि, प्रत्यक्षात, लक्ष्यित कृती पूर्ण करण्यासाठी खरोखर प्रेरित असलेले बहुतेक वापरकर्ते केवळ लक्ष्य साध्य न करता तीन क्लिक केल्यामुळे थांबण्याचा विचार करणार नाहीत. जर तुम्ही वापरकर्त्याच्या निराशेची मुख्य कारणे पाहिली तर तुम्हाला असे दिसून येईल की जास्त क्लिक ही मोठी भूमिका बजावत नाहीत.
आणि मग प्रश्न उद्भवतो: तीन-क्लिक नियमाला काही वैज्ञानिक किंवा अनुभवजन्य आधार आहे का? दुसऱ्या शब्दांत, असे कोणतेही अभ्यास आहेत का जे असे दर्शवतात की तीन क्लिकनंतर वापरकर्ते निराश होतात?
ब्रिटिश वेब डिझायनर जोशुआ पोर्टर यांनी केलेल्या अभ्यासानुसार, जे वापरकर्ते तीन क्लिकनंतर शोधत असलेली सामग्री शोधत नाहीत त्यांना शोध थांबवण्याची शक्यता कमी असते. शिवाय, अभ्यासादरम्यान, काही विषयांनी 25 क्लिक केले.
यश (निळा) आणि अयशस्वी (लाल) प्रकरणांमध्ये क्लिकची संख्या आणि पूर्ण झालेल्या कार्यांची टक्केवारी यांच्यातील संबंध
शेवटी, मुख्य भूमिका क्लिकच्या संख्येने नव्हे तर इंटरफेसच्या सोयीद्वारे खेळली जाते. जर ते सोपे आणि स्पष्ट असेल तर, एखाद्या व्यक्तीला ते वापरण्यास आनंद होईल, जरी त्याला ध्येय साध्य करण्यासाठी 15 क्लिक लागतील. आणि जर वेबसाइट तीन-क्लिक नियम पाळत असेल, परंतु खराब डिझाइन आणि अंमलात आणली असेल, तर एखाद्या व्यक्तीला ती अजिबात वापरायची नसेल.
2. F-पॅटर्न लक्षात ठेवा
जेकोब नील्सन यांनी एक अभ्यास केला ज्यामध्ये 230 हून अधिक इंटरनेट वापरकर्त्यांनी विविध वेब पृष्ठे पाहिल्यावर डोळ्यांचा मागोवा घेणे (ओक्युलोग्राफी) केले गेले. परिणामी, असे दिसून आले की कर्सरी दृश्यादरम्यान, वापरकर्त्यांची नजर एफ-आकाराच्या मार्गावर फिरते.
जाकोब निल्सन द्वारे वेबसाइट पृष्ठ दृश्यांचा उष्णता नकाशा
आयटूल्सने डिड-इट आणि एन्क्वायरो या दोन मार्केटिंग कंपन्यांच्या सहकार्याने असाच अभ्यास केला. 50 विषयांनी त्यात भाग घेतला, ज्यापैकी प्रत्येकाला स्वतःला निकालांसह परिचित करण्यास सांगितले गेले Google शोध. परिणामी, सर्व 50 विषयांची नजर वरच्या डाव्या कोपर्यावर केंद्रित होती आणि उष्णता नकाशाएफ-आकार होता.
Google परिणाम पृष्ठ पहा हीटमॅप
डिझाइनर आणि कॉपीरायटर यांनी सामग्री तयार करताना आणि मांडताना हा डेटा विचारात घ्यावा. म्हणून, वेब पृष्ठाची मुख्य सामग्री लेआउटच्या डाव्या बाजूला ठेवली पाहिजे. आपण लक्ष दिल्यास, आपण पहाल की सर्वात लोकप्रिय संसाधनांवर, शीर्षकानंतर बिंदूंची सूची किंवा समान एफ-आकार असलेल्या लहान परिच्छेदांचा संच आहे. पटकन स्किमिंग करताना हे निश्चितपणे मजकूर अधिक वाचनीय बनवते.
3. लोडिंग गती महत्त्वाची आहे
वाट पाहणे कोणालाही आवडत नाही. इंटरनेट वापरकर्ते, म्हणजे, आपण सर्व, अत्यंत अधीर लोक आहोत, त्यामुळे तुम्ही त्यांना विनाकारण वाट पाहण्यास भाग पाडू नये. तुमच्या वेबसाइटवर किंवा लँडिंग पेजवर काम करताना, पेज लोड होण्याच्या गतीकडे लक्ष द्या आणि तुम्हाला पश्चात्ताप होणार नाही.
तर, काही वर्षांपूर्वी तज्ञ मायक्रोसॉफ्टत्यांचा वापर करून अभ्यास केला बिंग शोध इंजिन. अभ्यासाचा उद्देश पृष्ठ लोड गती आणि वापरकर्त्याचे समाधान, प्रति अभ्यागत सरासरी कमाई आणि क्लिक-थ्रू डेटा यासारख्या अनेक मेट्रिक्समधील संबंध ओळखणे हा होता.
अभ्यासात खालील परस्परसंबंध आढळले: पृष्ठ लोड लेटन्सीमध्ये 2-सेकंद वाढीमुळे वापरकर्त्याच्या समाधानात 3.8% घट झाली आणि महसुलात अंदाजे 4.3% घट झाली. त्याच वेळी, वापरकर्त्यांनी केलेल्या एकूण क्लिकची संख्या 4.4% कमी झाली आहे. नफ्यात 4.3% घट ही एक लहान तोटा वाटू शकते, परंतु केव्हा आम्ही बोलत आहोतबहु-दशलक्ष आणि बहु-अब्ज डॉलर्सच्या कॉर्पोरेशन्सबद्दल, प्रत्येक टक्केवारीचा परिणाम मोठ्या रकमेमध्ये होतो जो कोणालाही गमावू इच्छित नाही.
ms मध्ये पृष्ठ लोड होण्यास होणारा विलंब आणि खालील निर्देशकांमधील बदल (डावीकडून उजवीकडे): 1) प्रति 1 वापरकर्ता (%) अद्वितीय विनंत्यांची संख्या; 2) क्वेरी सुधारणांची संख्या (%); 3) प्रति 1 वापरकर्ता नफा (%); 4) एकूण क्लिकची संख्या (%); 5) वापरकर्ता समाधान (%); 6) क्लिक पूर्ण करण्यासाठी वेळ (ms).
हे उदाहरण दाखवते की वापरकर्ते खरोखरच अधीर आहेत आणि ते खूप वेळ वाट पाहणारे संसाधन सोडून देण्यास इच्छुक आहेत. आपण आपल्या साइटच्या लोडिंग गतीबद्दल देखील चिंतित असले पाहिजे कारण Google ने अलीकडेच शोध परिणामांची रँकिंग करताना हा घटक विचारात घेतला आहे.
सुदैवाने, अशी अनेक साधने आहेत जी पृष्ठ लोडिंग आणि कार्यप्रदर्शन गती सुधारण्यास मदत करू शकतात, जसे की Google च्या पृष्ठ गती किंवा Yahoo चे YSlow.
4. मजकूर अधिक वाचनीय बनवा
सुप्रसिद्ध उपयोगिता तज्ञ जेकोब निल्सन यांनी एक अभ्यास केला ज्यामध्ये त्यांनी त्यांच्या वेबसाइटवरील अभ्यागतांच्या मजकूर समजण्याच्या वैशिष्ट्यांचा अभ्यास केला आणि असे दिसून आले की लोक त्यांच्या समोर असलेली ऑनलाइन सामग्री क्वचितच वाचतात. सरासरी वेब पृष्ठावरील अभ्यागत (अंदाजे 593 शब्द) 20-28% मजकूर वाचतात. मजकूराच्या व्हॉल्यूममध्ये आणखी वाढ झाल्यामुळे, हा आकडा हळूहळू 10% पर्यंत कमी होतो.
पृष्ठावरील शब्दांची संख्या आणि वापरकर्ता वाचू शकणाऱ्या त्या संख्येची कमाल टक्केवारी यांच्यातील संबंध (प्रति मिनिट 250 शब्द वाचण्याच्या वेगाने)
अशी अनेक तंत्रे आहेत जी तुम्हाला तुमच्या साइटच्या सामग्रीकडे अधिक वापरकर्त्यांचे लक्ष वेधण्यात मदत करू शकतात. मजकूराची वाचनीयता वाढवण्यासाठी ते उकळतात. हे, विशेषतः, निवड आहे कीवर्ड, याद्या आणि वारंवार उपशीर्षक वापरणे आणि मजकूराचे साध्या, लहान परिच्छेदांमध्ये विभाजन करणे.
5. "फोल्ड लाईन" वर लक्ष केंद्रित करू नका
- भाषांतर
- ट्यूटोरियल
तुमच्या कपड्यांद्वारे तुमचे स्वागत केले जाते आणि तुमच्या मनाने तुमचे स्वागत केले जाते. ही जुनी म्हण इतर गोष्टींबरोबरच प्रथम छापांच्या महत्त्वाबद्दल बोलते. हे केवळ लोकांसाठीच नाही तर त्यांच्यासाठीही खरे आहे सॉफ्टवेअर उत्पादने- वेबसाइट्स आणि मोबाइल अनुप्रयोग. पैकी एक सर्वात महत्वाचे क्षणनेटवर्क प्रकल्पाच्या आकर्षकतेची निर्मिती म्हणजे त्याचा वापर सुलभता - उपयोगिता. आणि जेव्हा एखादी व्यक्ती प्रथम साइट किंवा अनुप्रयोगाशी परिचित होते, तेव्हा त्याचे पहिले इंप्रेशन बहुतेकदा ठरवतात की तो या उत्पादनाकडे पुन्हा पुन्हा परत येईल की नाही. दुसऱ्या शब्दांत, उपयोगिता ही वेबसाइटच्या मुख्य गुणधर्मांपैकी एक आहे जी प्रेक्षक तयार करते (किंवा नष्ट करते). आपल्या वेबसाइट किंवा मोबाइल ॲप अनुभवाच्या सर्वात महत्त्वाच्या टप्प्यांवर वापरकर्त्याच्या वर्तनाची काही सामान्य आणि अनेकदा दुर्लक्षित केलेली परिस्थिती आणि उपयोगिता सुधारण्याचे मार्ग पाहू या.
स्पष्ट आणि माहितीपूर्ण संवाद
1. फॉन्ट आकार निवडा
लोक मोबाईल डिव्हाइसेस वापरून आणि काही साइटसाठी वेबवर सर्फिंग करत आहेत मोबाइल आवृत्तीमुख्य बनले. आणि हे फॉन्ट आकारासाठी त्याची आवश्यकता ठरवते, कारण स्मार्टफोन आणि टॅब्लेटच्या स्क्रीन पेक्षा खूपच लहान आहेत नियमित मॉनिटर्सआणि लॅपटॉप. पसरत आहे अनुकूली डिझाइनफॉन्टच्या समस्येकडे लक्ष वेधण्यात मोठी भूमिका बजावली.बऱ्याचदा, वेबसाइट निर्माते बटणे, चिन्ह, टॅब आणि इतर क्लिक करण्यायोग्य वस्तूंच्या वापराच्या सुलभतेवर लक्ष केंद्रित करतात. परंतु मजकूर हायपरलिंक्सवर क्लिक करण्याची सोय काहींना आठवते. म्हणून, नेहमी आपल्या बोटांनी हायपरलिंक्स दाबण्याच्या आरामाच्या “लाइव्ह” चाचण्या करा.
2. माहितीपूर्ण त्रुटी संदेश लिहा
बरेच लोक त्रुटी संदेशांसाठी शब्दांच्या निवडीकडे दुर्लक्ष करतात, त्यांना काहीतरी दुय्यम मानतात. विकासकांना सहसा कसे टाळायचे हे माहित असते चुकीच्या कृतीत्यांच्या उत्पादनांमध्ये, आणि त्यामुळे क्वचितच असे संदेश आढळतात.परंतु वास्तविक वापरकर्ते याचा अभिमान बाळगू शकत नाहीत.
एरर मेसेज दिसल्यानंतर काय करावे हे जर वापरकर्त्याला चांगले समजत नसेल, तर तो तुमचे उत्पादन पूर्णपणे सोडून देऊ शकतो. म्हणून, संदेश मजकूर खेळकर असू शकतो, परंतु कमीतकमी ते वापरकर्त्यांना त्वरीत कारण शोधण्यात आणि भविष्यात अपयश टाळण्यास मदत करेल.
विशेष अटी टाळण्याचा प्रयत्न करा, सामान्य शब्दात संदेश लिहा, स्पष्ट भाषेत. वापरकर्त्याची माहिती डंप करण्याची आवश्यकता नाही जी तो वापरू शकत नाही. इच्छित असल्यास, प्रमाणीकरण त्रुटी देखील त्यांना अधिक अनुकूल बनविण्यासाठी पुन्हा शब्दांकित केल्या जाऊ शकतात. एका लोकप्रिय वरून समान स्क्रीनच्या दोन आवृत्त्यांची तुलना करा ऑपरेटिंग सिस्टम:
इनपुट फॉर्मची सोय
3. तुमची पासवर्ड आवश्यकता सुलभ करा
आज वापरकर्त्यांना तयार करण्याची आवश्यकता आहे जटिल पासवर्ड. परंतु हे सकारात्मकतेने, प्रोत्साहनासह केले पाहिजे, आणि दुर्दम्य कठोर स्थिती म्हणून नाही. बरेच इनपुट फॉर्म खूप छान दिसतात, परंतु पूर्णपणे गैरसोयीचे असतात. जरी या इंटरफेस घटकाची सोय संपूर्ण उत्पादनाच्या यशावर निर्णायक प्रभाव टाकू शकते. वाईट निर्णयवापरकर्त्यांना त्यांचे लॉगिन आणि पासवर्ड एंटर करण्याच्या टप्प्यावर किंवा चेकआउट दरम्यान आधीच दूर करू शकते. म्हणून, फॉर्मच्या वापराच्या सुलभतेकडे लक्ष देणे आवश्यक आहे.
उदाहरणार्थ, ऐतिहासिकदृष्ट्या, निवडक बॉक्स शैली करणे कठीण आहे. बर्याच बाबतीत, विकासक लपविण्याचा प्रयत्न करतात मानक वस्तूआणि त्यांना अधिक योग्य DOM घटकांमध्ये क्लोन करा. या प्रकरणात, "क्लोन" मधील डेटा मूळ घटकांच्या इनपुटमध्ये हस्तांतरित केला जातो.
नियमित ड्रॉप-डाउन मेनूच्या डिझाइनवर नियंत्रण ठेवण्यासाठी तुम्हाला बराच वेळ घालवावा लागेल. पण खेळ मेणबत्ती किमतीची आहे? ते आपण विसरता कामा नये मोबाइल वापरकर्तेखूप लवकर त्यांच्या देखावा आणि वागणूक अंगवळणी मानक घटकइंटरफेस त्यांच्या ऑपरेटिंग सिस्टममध्ये वापरला जातो.
उदाहरणार्थ, विंडोज वापरकर्तेमोबाइलची अपेक्षा आहे की जेव्हा तुम्ही ड्रॉप-डाउन मेनू निवडता, तेव्हा पर्यायांची सूची पूर्ण स्क्रीनमध्ये उघडेल, फील्डपासूनच वेगळी. असताना Android वापरकर्तेपाहण्याची अपेक्षा आहे मॉडेल विंडो. आणि जर, आपल्या डिझाइन कल्पनांच्या फायद्यासाठी, आपण अशा अपेक्षा पूर्ण करत नाही, तर वापरकर्ते आपल्या निराकरणाची अजिबात प्रशंसा करणार नाहीत. त्यांना तुमचे उत्पादन वापरण्यास कठीण वेळ लागेल, ज्यामुळे त्यांच्या अनुभवावर नकारात्मक परिणाम होईल. दुसऱ्या शब्दांत, मानक घटकांची रचना बदलून आपण तयार कराल अधिक समस्याआपण ठरवण्यापेक्षा.
4. योग्य इनपुट फॉर्म वापरा
बरेच लोक इनपुट फील्डमध्ये डेटा फॉरमॅटिंग वापरण्याचा सल्ला देतात. उदाहरणार्थ, तुम्ही इनपुट, इनपुट जोडल्यास, तुम्ही टाइप करताच लेआउट आपोआप स्विच होईल. तथापि, हे विचित्र दिसते आणि अजिबात मदत करत नाही, परंतु फॉर्म भरण्यात हस्तक्षेप करते.तुमच्याकडे अनेक इनपुट फील्ड असल्यास, त्यांना एक डेटा प्रकार नियुक्त करणे चांगले आहे. वापरकर्त्यासाठी हे खूप सोपे आहे जेव्हा प्रविष्ट करताना समान लेआउट वापरला जातो आणि अक्षरांपासून अंकांवर आणि मागे उडी मारणे केवळ अतिरिक्त गोंधळ वाढवते.
वापरा विविध प्रकार HTML 5 मध्ये इनपुट फक्त तेव्हाच सल्ला दिला जातो जेव्हा स्क्रीनवर शक्य तितक्या कमी फील्ड असतात. उत्तम उदाहरण- दोन-घटक Google प्रमाणीकरण: फक्त एक फील्ड आहे ज्यामध्ये तुम्ही फक्त संख्या प्रविष्ट करू शकता. ते येथे अतिशय योग्य असेल स्वयंचलित स्विचिंगडिजिटल लेआउटवर.
पण अधिक जटिल फॉर्मकीबोर्डची अशी "उपयुक्तता" आणि "पहल" त्रासदायक असू शकते, कारण ते वापरकर्त्याला मानसिकरित्या स्विच करण्यास भाग पाडते आणि संज्ञानात्मक भार वाढवते. विशेषत: अक्षरांपासून अंकांवर स्विच करताना आणि त्याउलट:
5. प्रथमच ज्वलंत आणि संस्मरणीय अनुभव तयार करा
जर एखादा नवागत पहिल्या सेकंदापासून आपल्या साइटवर किंवा अनुप्रयोगाबद्दल निराश झाला असेल तर पाहुण्यांना भेटताना हे मालकाच्या असभ्यतेसारखे आहे. मेजवानी कितीही स्वादिष्ट असली तरी मीटिंग हताशपणे उध्वस्त होईल.डेव्हलपर त्याच्या उत्पादनाच्या प्राथमिक वापरासाठी काही परिस्थिती सहजपणे गमावू शकतो. उदाहरणार्थ, आयकॉन किंवा विभागांनी भरलेल्या स्क्रीनला अंतर्ज्ञानी म्हणणे कठीण आहे. तुम्ही प्रथम वापराचा अनुभव मऊ करू शकता, उदाहरणार्थ, उपयुक्त इशारे आणि चेतावणी संदेशांसह, जे सहजपणे बंद केले जाऊ शकतात.
6. भूत तपशीलात आहे
सर्व प्रकारच्या छोट्या-छोट्या गोष्टी तुमचे उत्पादन शिकणे सोपे बनवण्यासाठी खूप पुढे जाऊ शकतात. उदाहरणार्थ, नेहमीचा मानक कर्सरअगदी पहिल्या इनपुट फील्डमध्ये तुम्हाला इंटरफेसमध्ये जलद आणि वेदनारहित डुबकी मारण्याची परवानगी मिळेल. आदर्शपणे, वापरकर्त्याने साइट किंवा ऍप्लिकेशन ऑटोपायलटवर नेव्हिगेट केले पाहिजे.नवीन वापरकर्त्यांना तुमच्या उत्पादनाचा अनुभव नसणे म्हणजे काही कार्ये गंभीर अडचणी निर्माण करू शकतात. पासून पेपरक्लिप लक्षात ठेवा मायक्रोसॉफ्ट ऑफिस, जी अचानक बाहेर आली आणि तिला मदतीची ऑफर दिली, जी अधिक त्रासदायक होती.
यशस्वी पहिल्या वापरकर्त्याच्या अनुभवाचे मार्गदर्शन करणे हे एका कडवट मार्गावर चालण्यासारखे आहे - सर्वकाही व्यवस्थित करणे खूप कठीण आहे, परंतु जर तुम्ही यशस्वी झालात, तर ते वापरकर्त्याच्या ओळखीने पुरस्कृत करण्यापेक्षा अधिक आहे. उदाहरणार्थ, Stumbleupon प्रकल्प नवशिक्यांना त्याच्या मूलभूत क्षमता शिकवण्यात खूप यशस्वी आहे.
शिकण्याची प्रक्रिया अंतर्भूत करणे हा एक चांगला उपाय असू शकतो सामान्य प्रक्रियाउत्पादनाचा वापर. उदाहरणार्थ, मध्ये अक्षरे संग्रहित करताना मेल अर्जतुम्ही संदेश प्रदर्शित करू शकता “तुम्ही Ctrl + K वापरून संग्रहण सुरू करू शकता हे तुम्हाला माहीत आहे का?” हा दृष्टिकोन पारंपारिक "संपूर्ण अनुप्रयोग विहंगावलोकन" शैलीच्या धड्यांच्या तुलनेत अधिक सौम्य प्रशिक्षण अनुभवासाठी अनुमती देतो.
7. मायक्रोकॉपीचा उपयोग विचार म्हणून करू नये.
"मायक्रोकॉपींग" म्हणजे अनुप्रयोगांमध्ये वापरल्या जाणाऱ्या सर्व छोट्या सूचना आणि पुष्टीकरणांचा संदर्भ.- "काळजी करू नका, आम्ही तुमचा मेलिंग पत्ता लीक होऊ देणार नाही"
- "पेमेंटसाठी तुम्हाला बँक कार्डची गरज नाही"
उदाहरणार्थ, बँक कार्ड लिंक करणे किंवा प्रदान करणे ईमेलबर्याच वापरकर्त्यांसाठी ही एक विवादास्पद समस्या आहे. आणि जोपर्यंत तुम्ही वेळ-चाचणी केलेल्या, प्रतिष्ठित ब्रँडचे प्रतिनिधित्व करत नाही तोपर्यंत, लोक तुम्हाला अशी माहिती देण्यापासून नेहमी सावध राहतील. मायक्रोकॉपी वापरकर्त्याच्या शंकांचे निरसन करण्यात मदत करू शकतात
8. नेहमी संदर्भ द्या
वापरकर्ते संदर्भाच्या अभावाचा तिरस्कार करतात. माहितीचा प्रवाह लक्षात घेऊन त्यांना सतत सामना करावा लागतो, लोक स्क्रीनवरील अनावश्यक सर्व गोष्टींपासून अमूर्त करण्याचा प्रयत्न करतात आणि विशिष्ट गोष्टींवर लक्ष केंद्रित करतात. फॅशन मध्ये कधी आली अंतहीन स्क्रोलिंग, बऱ्याच साइट्सना एक समस्या आली: वापरकर्त्याने चुकून कुठेतरी क्लिक करताच, वर्तमान स्थिती रीसेट केली गेली. हे विशेषतः अशा प्रकरणांमध्ये अप्रिय आहे जेव्हा एखाद्या व्यक्तीने साइटची सामग्री खूप खाली स्क्रोल केली आहे. फक्त पाच स्क्रोलिंग स्क्रीननंतर, एक अपघाती क्लिक चिडचिड होऊ शकते.आज बऱ्याच साइट्स मॉडेल्स आणि एकल-पृष्ठ अनुप्रयोगांच्या वैशिष्ट्यपूर्ण इतर योजनांचा वापर करून ही समस्या सोडवतात. उदाहरणार्थ, Pinterest वर, आपण टाइलवर क्लिक करता तेव्हा ते नवीन पृष्ठ नाही तर एक मॉडेल उघडते. हे आपल्याला न गमावता विशिष्ट रेकॉर्डच्या तपशीलांचा अभ्यास करण्यास अनुमती देते वर्तमान स्थितीआणि नवीन पृष्ठ लोड होण्याची प्रतीक्षा न करता.
मोबाईलवर फेसबुक ॲपसमान दृष्टीकोन वापरला जातो: जर तुम्ही अल्बममधील फोटोवर क्लिक केले तर ते पूर्ण-स्क्रीन मॉडेलमध्ये लोड होईल. असे दिसते जवळजवळजणू काही नवीन पृष्ठ उघडले आहे, परंतु जेव्हा तुम्ही बॅक बटण दाबता तेव्हा तुम्हाला हळूवारपणे संदर्भाकडे परत आणले जाते.
जेव्हा स्क्रीन सामग्री अनपेक्षितपणे बदलते तेव्हा वापरकर्त्यांना, विशेषतः मोबाइल वापरकर्त्यांना ते आवडत नाही. हे केवळ वापरकर्त्याच्या स्पष्ट कृतींच्या प्रतिसादात केले पाहिजे. उदाहरणार्थ, बातम्या फीड Twitter आणि Facebook वर जबरदस्तीने अपडेट केले जातात. अन्यथा, आपण संदेश वाचत असताना आणि त्याच वेळी आपल्याला एक अप्रिय परिस्थिती मिळेल पार्श्वभूमी प्रक्रियाफीड रीफ्रेश करते आणि तुम्हाला नवीन संदेशांच्या गुच्छासह डंप करते जे तुम्ही आधी वाचलेले दफन करतात. हे वाऱ्याच्या झुळूकासारखं वृत्तपत्र तुमच्या हातातून काढून टाकल्यासारखं आहे.
सुदैवाने, नवीन संदेश दिसल्यावर Twitter नाजूकपणे वापरकर्त्याला सूचित करते आणि वापरकर्त्याने डाउनलोड आदेश देण्याची प्रतीक्षा करते. म्हणजेच, स्क्रीनवरील सामग्री बदलण्यावर व्यक्तीचे पूर्ण नियंत्रण असते आणि तो गोंधळलेला नाही.
15. मोठ्या, जटिल कार्यांना लहान ऑपरेशन्समध्ये विभाजित करा
पूर्ण पानाचा फॉर्म भरणे कोणालाही आवडत नाही. म्हणून, सर्व प्रकारच्या सेटिंग्ज विभाग, नोंदणी फॉर्म आणि प्रोफाइलला फक्त लहान ब्लॉक्समध्ये तार्किक विभागणीचा फायदा होईल. कार्ड, विभाग, टॅब वापरा, बाजूचे पटल. एका पृष्ठावर अनेक लॉजिकल ब्लॉक्स असले तरीही एखाद्या व्यक्तीला असंख्य फिलिंगची आवश्यकता समजणे सोपे होईल.तार्किक ब्लॉक्समध्ये विभागणे व्यक्तिनिष्ठपणे असंख्य फील्ड सेट करणे आणि भरण्याचे कार्य सुलभ करते आणि अप्रिय कामाची भावना टाळते. हे विशेषतः मोबाइल अनुप्रयोग आणि वेबसाइट आवृत्त्यांसाठी महत्त्वाचे आहे.
उदाहरणार्थ, Facebook ने गोपनीयता सेटिंग्जच्या गटबद्धतेसाठी त्यांना कॉन्फिगर करणे सोपे करण्यासाठी अनेक वर्षे घालवली आहेत. परंतु एकेकाळी हे इतके क्षुल्लक कार्य होते की अनेकांनी या सेटिंग्जला स्पर्श केला नाही. त्यांची विभागांमध्ये विभागणी करून, ही पृष्ठे टाळण्याऐवजी त्यांच्याशी संलग्न असलेल्या वापरकर्त्यांची टक्केवारी वाढली आहे.
विभाजनाचे आणखी एक चांगले उदाहरण मोठे कार्यलॉजिकल ब्लॉक्ससाठी - ऑर्डरिंग प्रक्रिया. बऱ्याच वेब ऍप्लिकेशन्ससाठी, ही प्रक्रिया एक महत्त्वाचा मुद्दा बनते, प्रकल्पाच्या यशाचे सूचक. ऑर्डर देताना टप्प्याटप्प्याने विभागले जाते, नंतर ते त्यामधून जात असताना, वापरकर्त्यांना प्रगती, प्रगतीची भावना मिळते, जरी सर्वकाही सुरळीत होत नसले तरीही.
तसेच, तार्किक ब्लॉक्समध्ये विभाजित केल्याने उदयोन्मुख समस्या शोधणे आणि सोडवणे सोपे होते. शेवटी, “तुम्ही कृपया खालील चार मुद्दे दुरुस्त करू शकाल का?” सारख्या संदेशाशी कोणीही व्यवहार करू इच्छित नाही.
जर तुम्ही वापरकर्त्याला सर्व फील्ड भरण्यासाठी किंवा सेटिंग्ज कॉन्फिगर करण्यास भाग पाडत असाल तर एका, जटिलपणे आयोजित पृष्ठावर, तर तुम्ही तुमची अंडी एका टोपलीत टाकत आहात. कोणतीही त्रुटी इतर सर्व डेटा पाठविण्यापासून प्रतिबंधित करेल.
देणगीच्या प्रकारांबद्दलही असेच म्हणता येईल, विशेषत: मोबाइल प्रकल्पांमध्ये. तुम्हाला कदाचित वापरकर्त्याने असा विचार करावा असे वाटते: “हो, याला वेळ लागतो” ऐवजी “व्वा, किती सोपे आहे”. फॉर्मची उपयोगिता सुधारणे थेट प्रकल्पाच्या नफ्यावर परिणाम करते.
वैयक्तिकरित्या विचार केल्यास वरीलपैकी बहुतेक मुद्दे अगदी सोपे आहेत. पण जर तुम्ही दररोज हे काम करत असाल तर तुमचे डोळे अनेकदा अस्पष्ट होतात. म्हणूनच, "नवीन वापरकर्त्याच्या" नजरेतून मागे पडणे, अमूर्तपणे आणि आपल्या विचारधारेकडे पाहणे सक्षम असणे महत्वाचे आहे.
टॅग: टॅग जोडा
सक्रिय वापरात असलेल्या वेब संसाधनांसाठी, साइटची उपयोगिता सुधारणे आहे उत्तम प्रकारेरूपांतरण वाढवा आणि सुधारणा करा वर्तणूक घटक. सेवेमध्ये वर्तमानाचे विश्लेषण करणे समाविष्ट आहे कामगिरी वैशिष्ट्येसाइट, सुधारणेसाठी शिफारसी तयार करणे, क्लायंटसह कामांच्या सूचीवर सहमत होणे आणि खरेतर, कार्य करणे.
वेबसाइट उपयोगिता सेवांची किंमत
उपयोगिता सुधारणा: संबंधित सेवा
वेब स्टुडिओद्वारे प्रदान केलेल्या सेवांची विस्तृत श्रेणी आहे जी उपयोगिता सुधारणा म्हणून वर्गीकृत केली जाऊ शकते. खाली सूचीबद्ध केलेल्या बहुतेक सेवा सर्वसमावेशक किंवा स्वतंत्र सेवा म्हणून ऑर्डर केल्या जाऊ शकतात.
- उपयोगिता ऑडिट. सुधारणा कार्याचा पहिला टप्पा म्हणजे समस्या क्षेत्र ओळखणे आणि ऑप्टिमायझेशनसाठी मुख्य वेक्टर तयार करणे. विशेषज्ञ संसाधनाची सखोल चाचणी घेतो आणि सर्व आढळलेल्या समस्या आणि सुधारणेसाठी शिफारसी दर्शविणारा अहवाल तयार करतो.
- साइटची सुधारणा. क्लायंटच्या इच्छेनुसार उणीवा दूर करणे आणि कार्यक्षमता बदलणे यांचा समावेश असलेली सेवा. जर आम्ही आयोजित केलेल्या उपयोगिता लेखापरीक्षणातील डेटाचा तांत्रिक तपशील म्हणून पुनरावृत्तीचा आधार म्हणून वापर केला, तर आम्हाला उपयोगिता सुधारण्याचे काम मिळेल.
- वेबसाइट पुन्हा डिझाइन करा. बऱ्याचदा, साइटच्या वापरकर्त्याच्या अनुभवातील समस्या खराब झाल्यामुळे असतात डिझाइन उपाय, म्हणून, उपयोगिता सुधारण्यासाठी, संसाधनाच्या डिझाइनमध्ये पूर्ण किंवा आंशिक बदल आवश्यक असू शकतात.
- सामग्रीसह भरणे. अनुपस्थिती दर्जेदार सामग्री, जे रहदारी आकर्षित करू शकते आणि वापरकर्त्याच्या विनंत्या पूर्ण करू शकते, हे देखील वेबसाइटच्या खराब कामगिरीचे एक कारण आहे.
म्हणून, जरी स्टुडिओ थेट "उपयोगिता सुधारणा" सेवा ऑफर करत नसला तरीही, आपण साध्य करू शकता इच्छित परिणामयोग्य वैयक्तिक सेवा ऑर्डर करून.
उपयोगिता सुधारण्याचे परिणाम
समस्येचे निराकरण झाले आहे असा दावा करण्यासाठी, विश्लेषण डेटाद्वारे सुधारणेची पुष्टी करणे आवश्यक आहे. यशस्वी उपयोगिता सुधारण्याची चिन्हे आहेत:
- अभ्यागत साइटवर घालवणारा वेळ वाढवणे. जर लोक साइटवर जास्त काळ राहू लागले तर उघडा अधिक पृष्ठे, याचा अर्थ साइट वापरण्यास अधिक सोयीस्कर बनली आहे आणि ध्येय साध्य झाले आहे.
- कमी झालेला बाऊन्स रेट. जेव्हा वापरकर्ता वेबसाइटमध्ये प्रवेश करतो आणि साइटवर कुठेही न जाता लगेच पृष्ठ सोडतो, तेव्हा याला "बाउन्स" म्हणतात. अशा परिस्थिती जितक्या कमी असतील तितकी ही साइट लोकांसाठी अधिक मनोरंजक असेल.
- वाढलेले रूपांतरण. प्रत्येक साइटवर विशिष्ट लक्ष्य क्रिया असते: ऑर्डर परत कॉल करा, एखादे उत्पादन खरेदी करणे, वेबसाइटवर नोंदणी करणे, कार्यक्रमात भाग घेणे इ. कसे चांगले गुणोत्तरअभ्यागतांच्या एकूण संख्येत रूपांतरणे - साइट जितकी अधिक कार्यक्षमतेने कार्य करते.
उपयोगिता मोहीम यशस्वीपणे राबवली - चांगला मार्गतुमच्या वेब प्रोजेक्टवर परतावा वाढवा.
सेवेबद्दल प्रश्न आहेत? कंत्राटदार निवडण्यासाठी मदत हवी आहे? टिप्पण्यांमध्ये प्रश्न विचारा आणि आमचे विशेषज्ञ तपशीलवार सल्ला देतील.
त्यांचे स्वागत त्यांच्या कपड्यांद्वारे केले जाते, किंवा अधिक स्पष्टपणे, तुमची साइट कशी दिसते आणि ती किती वापरकर्ता-अनुकूल आहे. आम्ही पूर्वी याबद्दल लिहिले आहे. आता साइटवरील कोणत्या घटकांवर काम करणे आवश्यक आहे याबद्दल बोलूया जेणेकरून ग्राहक खरेदी करण्यापूर्वी जाऊ नयेत.
तर, तुम्ही तुमच्या वेबसाइटची उपयोगिता कशी सुधारू शकता?
1. साइट शीर्षलेख तयार करा
टोपी शक्य तितक्या आरामदायक आणि प्रभावी होण्यासाठी, त्यात खालील घटक असणे आवश्यक आहे:
वर्णन करणारा
या लहान वर्णनकंपनी ऑफर. उदाहरणार्थ, “मॉस्को प्रदेशात लाकडापासून घरे बांधणे”, “आरोग्यदायी अन्नाची डिलिव्हरी” किंवा “कस्टम-मेड लग्नाचे कपडे”. साइटला भेट दिल्यानंतर, वापरकर्त्याने त्याला काय ऑफर केले जात आहे आणि ही ऑफर त्याच्या गरजा पूर्ण करते की नाही हे पहिल्या सेकंदात समजून घेणे आवश्यक आहे. सर्वोत्तम ठिकाणवर्णनकर्त्याच्या स्थानासाठी - लोगोच्या उजवीकडे किंवा त्याच्या खाली.
रूपांतरण घटक
यामध्ये "कॉल ऑर्डर करा", "विनंती सोडा", तसेच "कार्ट" (ऑनलाइन स्टोअरच्या बाबतीत) सारखी बटणे समाविष्ट आहेत. "कचरा" चिन्ह पारंपारिकपणे उजवीकडे स्थित आहे वरचा कोपरासाइट शीर्षलेख. त्यात जोडलेल्या वस्तूंची संख्या आणि/किंवा खरेदीची रक्कम प्रतिबिंबित केली पाहिजे.
काही विषयांमध्ये, उदाहरणार्थ “बनवणे प्लास्टिकच्या खिडक्या" आणि "फर्निचर टू ऑर्डर", मापनकर्त्याला कॉल करण्यासाठी बटणे देखील संबंधित आहेत. वापरकर्त्यांचे लक्ष वेधण्यासाठी, बटणे वेगळी असणे आणि वापरकर्त्यांचे लक्ष आकर्षित करणे आवश्यक आहे.
संपर्क
आम्ही शिफारस करतो की तुम्ही वेबसाइटवर एक, कमाल दोन फोन नंबर सूचित करा. त्यापैकी एक “8 (800)…” फॉरमॅटमध्ये असल्यास ते इष्टतम आहे, कारण ते प्रदेशांमधून कॉल करण्यासाठी विनामूल्य आहे. मोठ्या संख्येने वापरकर्त्यांमध्ये संभ्रम निर्माण होतो आणि हेडर दृश्यमानपणे गोंधळात टाकते.
साइट असल्यास वैयक्तिक खाते, उजवीकडे नोंदणी/लॉगिन ब्लॉक ठेवा. हे उपयोगिता आणि वर्तणूक कार्यक्षमतेत लक्षणीय सुधारणा करण्यात मदत करेल.
वर्णनकर्ता, रूपांतरण घटक आणि संपर्कांसह वेबसाइट शीर्षलेखांची आणखी काही उदाहरणे पाहू:
जेणेकरून स्क्रोल करताना महत्वाची माहितीनेहमी दृश्यमान राहते, साइट शीर्षलेख सुरक्षित करा. आपल्याला काय लक्ष देणे आवश्यक आहे:
- शीर्षलेख उंचीने लहान असावा (सरासरी 40 ते 70 px पर्यंत) जेणेकरून दृश्यात व्यत्यय येऊ नये;
- मुख्य पृष्ठावर जाण्यासाठी एक बटण आहे;
- कंपनीशी संपर्क साधण्यासाठी टेलिफोन नंबर आणि/किंवा "कॉलची विनंती करा" बटण असेल;
- साठी "कचरा" चिन्ह आहे जलद संक्रमणत्यात आणि ऑर्डर देणे (ऑनलाइन स्टोअरसाठी).
अनेकदा फिक्स्ड कॅप असते क्षैतिज मेनूकॅटलॉगच्या मुख्य विभागांच्या लिंकसह. हे नेव्हिगेशन सुलभ करते आणि साइटची उपयोगिता सुधारते.
स्क्रोलिंग दरम्यान पिन केलेल्या शीर्षलेखांची येथे उदाहरणे आहेत:
2. साइटच्या मुख्य पृष्ठावर कार्य करा
कार्य मुख्यपृष्ठ- द्रुत आणि प्रभावीपणे "उत्पादन समोरासमोर दाखवा", म्हणजे ऑफरबद्दल थोडक्यात बोला, ऑर्डर करण्यास प्रवृत्त करा आणि ते कसे पूर्ण करायचे ते दाखवा. म्हणून, तुम्ही ते अर्धे रिकामे ठेवू शकत नाही किंवा त्यावर फक्त SEO मजकूर ठेवू शकत नाही.
मुख्य पृष्ठाची उपयोगिता सुधारण्यासाठी, खालील ब्लॉक्स जोडण्याची शिफारस केली जाते:
चमकदार बॅनर/बॅनर
पाहताना ते पहिल्या स्क्रीनवर असले पाहिजेत. हे बॅनर सर्वात सादर करणे इष्ट आहे उत्तम सौदेआणि/किंवा सेवा अटी, उदाहरणार्थ, विशिष्ट श्रेणींच्या वस्तूंवर सूट, जाहिराती.
फायदे ब्लॉक
वेबसाइटची उपयोगिता सुधारण्यासाठी, कंपनीचे मुख्य फायदे, उत्पादने किंवा सेवा (4-7 शब्द) थोडक्यात आणि संक्षिप्तपणे तयार करणे आणि त्यांची कल्पना करणे महत्वाचे आहे. चिन्हे आयटमच्या सामग्रीशी संबंधित असणे आवश्यक आहे आणि विशिष्ट संबंध निर्माण करणे आवश्यक आहे.
साइटच्या मुख्य विभागांचे दुवे
तेजस्वी आणि आकर्षक प्रतिमा वापरून व्हिज्युअलायझेशन - सर्वोत्तम डिझाइनअशा ब्लॉकसाठी. वापरकर्ता त्याला आवश्यक असलेला विभाग त्वरीत शोधण्यात सक्षम असेल.
3. तुमचे नेव्हिगेशन घटक सुधारा
वापरकर्त्याने त्याला आवश्यक असलेली पृष्ठे सहजपणे शोधली पाहिजेत आणि एकापासून दुसऱ्यावर जावेत. आणि नेव्हिगेशन यास मदत करते. सर्व नेव्हिगेशन घटकांना अंतर्ज्ञानी नावे असावीत आणि ते सोयीस्करपणे स्थित असावेत. हे साइटची उपयोगिता सुधारेल आणि वापरकर्त्याची निष्ठा वाढवेल: ब्राउझिंगची खोली, साइटवर घालवलेला वेळ इ. वाढेल (तुम्ही Yandex.Metrica आणि Google Analytics मध्ये या निर्देशकांचा मागोवा घेऊ शकता).
प्रथम कोणत्या घटकांवर काम करणे आवश्यक आहे ते शोधूया.
मेनू
क्षैतिज मेनू.या मेनूमधील आयटमने वस्तू आणि सेवांच्या श्रेणी प्रतिबिंबित केल्या पाहिजेत. पेक्षा जास्त नसणे प्रत्येक श्रेणीसाठी इष्टतम आहे तीन स्तर. उदाहरणार्थ, साइटवर "डिशेस" विभाग असल्यास, जेव्हा तुम्ही कर्सर त्यावर फिरवाल तेव्हा जास्तीत जास्त दोन याद्या दिसल्या पाहिजेत: "डिशेस" - "टेबल सेटिंगसाठी" - "सॅलाड बाऊल्स", "ग्लासेस", "मग्स", इ.
अधिक जटिल मेनू वापरणे कठीण आहे. काही विषयांसाठी (उदाहरणार्थ, तंत्रज्ञानासाठी मोठ्या संख्येनेपॅरामीटर्स किंवा साठी दागिने) मेनूमध्ये केवळ उत्पादनाच्या प्रकारानुसार नव्हे तर पॅरामीटर्सनुसार टॅगिंग समाविष्ट करणे तर्कसंगत आहे.
अनुलंब मेनू.या मेनूमधील आयटमने साइटची रचना आणि वापरकर्त्याचे स्थान प्रतिबिंबित केले पाहिजे. हे खालील उदाहरणाप्रमाणे बहु-स्तरीय सूची आणि हायलाइटिंग वापरून केले जाऊ शकते.
तळटीप
या तळाचा भागसाइट सहसा दुवे असतात महत्वाचे विभाग, आणि मेनू रचना नेहमी डुप्लिकेट करणे आवश्यक नाही. अनेकदा तळटीपमध्ये मुख्य मेनूमध्ये नसलेल्या पृष्ठांचे दुवे असतात.
तुम्हाला उपयोगिता सुधारायची असल्यास, तळटीपमध्ये खालील ब्लॉक्स ठेवण्याची शिफारस केली जाते:
- संपर्क;
- माहिती पृष्ठांच्या दुव्यांसह ब्लॉक करा (“कंपनीबद्दल”, “फोटो गॅलरी”, “भागीदारी”, “रिक्त जागा” इ.);
- सेवा पृष्ठांच्या लिंकसह ब्लॉक करा (“वितरण”, “पेमेंट”, “परताव्याच्या अटी”, “ हमी सेवा"इ.);
- सोशल नेटवर्क्सवरील कंपनीच्या खात्यांचे दुवे.
फूटर डिझाइनची उदाहरणे:
नेव्हिगेशन बटण "शीर्षावर परत"
हे वापरकर्त्याला पृष्ठावरील कोठूनही लवकर सुरुवात करण्यास मदत करते. हे अशा साइटवर नेव्हिगेशन सुलभ करते आणि वेग वाढवते ज्यांची पृष्ठे स्क्रोल होण्यास बराच वेळ लागतो, उदाहरणार्थ मोठ्या कॅटलॉग असलेल्या साइट. सामान्यतः, हे बटण वरच्या बाणाच्या प्रतिमेसह एक गोल किंवा आयताकृती चिन्ह असते आणि स्थिरपणे पृष्ठाच्या तळाशी (उजवीकडे किंवा डावीकडे), मुख्य सामग्रीच्या बाजूला किंवा त्याच्या शीर्षस्थानी ठेवलेले असते.
सामग्री लिंकिंग
हे मजकूर (कमी वेळा ग्राफिक) सामग्रीमधील दुवे आहेत. माहिती साइटसाठी हे प्राथमिक महत्त्व आहे, जेथे ब्राउझिंग खोली आणि वाचलेल्या सामग्रीची संख्या महत्त्वाची आहे. मजकूरातील दुव्यांसाठी मुख्य आवश्यकता प्रासंगिकता आणि त्यांची मध्यम संख्या आहे.
वैयक्तिक वाक्यांशांमधील दुव्यांचे उदाहरण:
मजकूरात ब्लॉक लिंकिंगचे उदाहरण:
ऑनलाइन स्टोअरसाठी, नेव्हिगेशन घटक जसे की टॅगिंग (कॅटलॉगमधील विशिष्ट उत्पादन गटांचे दुवे), फिल्टर (पॅरामीटर्सवर आधारित निवड कार्यक्षमता) आणि शोध देखील महत्त्वाचे आहेत.
4. उत्पादन/सेवा पृष्ठांवर कार्य करा
अशी पृष्ठे तीन प्रकारांमध्ये विभागली जाऊ शकतात:
- वस्तू किंवा सेवांचे कॅटलॉग;
- उत्पादन कार्ड;
- सेवा पृष्ठे.
चला त्या प्रत्येकाकडे पाहूया.
कॅटलॉग पृष्ठे
उपयोगिता सुधारण्यासाठी, कॅटलॉगमध्ये उत्पादनांचे फोटो, त्यांचे नाव आणि असणे आवश्यक आहे संक्षिप्त वर्णन, किंमत आणि ऑर्डर बटण. याव्यतिरिक्त, एका क्लिकवर वस्तू खरेदी करण्याची क्षमता प्रदान करणे उचित आहे. किंमत आणि ऑर्डर बटण त्यांच्या आकारामुळे आणि विरोधाभासी रंगांमुळे इतर घटकांपेक्षा वेगळे असले पाहिजे.
उत्पादन कॅटलॉगची उदाहरणे:
"समर्पित सर्व्हरचे भाडे" या विषयातील सेवा कॅटलॉगचे उदाहरण:
उत्पादन कार्ड
कार्यक्षमतेच्या दृष्टिकोनातून, त्यापैकी एक सर्वोत्तम मार्गउत्पादन कार्डची संघटना खालीलप्रमाणे आहे:
- उत्पादन प्रतिमा डावीकडे ठेवणे चांगले आहे. वापरकर्ते उत्पादन वेगवेगळ्या कोनातून पाहू शकतात आणि त्यावर झूम वाढवू शकतात. मुख्य फोटोखाली किंवा त्याच्या बाजूला लहान पूर्वावलोकन म्हणून निष्क्रिय फोटो ठेवण्याची शिफारस केली जाते;
- उजवीकडे (वरपासून खालपर्यंत) तुम्ही उत्पादनाचे नाव, किंमत, निवडलेल्या उत्पादनांचे प्रमाण आणि रूपांतरण घटक बदलण्यासाठी कार्यक्षमता ठेवावी. ऑर्डर बटणांपूर्वी, एक लहान वर्णन, मुख्य वैशिष्ट्ये किंवा वितरण आणि देयकाच्या मूलभूत अटी ठेवण्याचा सल्ला दिला जातो.
- फोटो, मुख्य माहितीउत्पादनाविषयी, किंमत आणि ऑर्डर बटण प्रथम पाहण्याच्या स्क्रीनवर सर्वोत्तम ठेवलेले आहेत जेणेकरुन वापरकर्त्याला ते करावे लागणार नाही अनावश्यक कृती- स्क्रोल करा.
- टॅबमधील सर्व निर्दिष्ट ब्लॉक्सच्या खाली तपशीलवार उत्पादन वैशिष्ट्ये ठेवण्याची शिफारस केली जाते.
उत्पादन कार्ड डिझाइन करण्याची उदाहरणे:
सेवा पृष्ठे
- सेवेचे वर्णन करणाऱ्या प्रतिमेसह सेवेचे संक्षिप्त आणि संक्षिप्त वर्णन;
- या कंपनीकडून सेवा ऑर्डर केल्याने वापरकर्त्यासाठी मुख्य फायदे;
- कामाचा पोर्टफोलिओ किंवा पूर्ण झालेल्या प्रकल्पांची उदाहरणे, जर विषय सुचवत असेल;
आज, बरेच डिझायनर ॲनिमेशनला असे काहीतरी मानतात जे डिझाइन अधिक सुंदर आणि दोलायमान बनवते आणि उपयोगिता सुधारण्यासाठी क्वचितच वापरतात. लँडिंग पृष्ठाची उपयोगिता सुधारण्यासाठी, ॲनिमेशन असावे कार्यात्मक घटक, आणि फक्त सजावट नाही. आकर्षक आणि सोयीस्कर अशा दोन्ही प्रकारच्या डिझाइनसाठी ॲनिमेशन कसे वापरायचे हे तुम्हाला शिकायचे असेल, तर हा लेख तुमच्यासाठी आहे.
1. एक संकल्पना तयार करा
प्रत्येक डिझायनर एक कथाकार असतो. जेव्हा तो वेबसाइट तयार करतो, तेव्हा तो त्याच्या अभ्यागतांना एक गोष्ट सांगतो. ॲनिमेशनचा वापर करून आपण ही कथा आणखी मनोरंजक बनवू शकतो.
ॲनिमेशन सामग्रीमध्ये जीवन श्वास घेते, ते अधिक आकर्षक आणि संस्मरणीय बनवते. अशा ॲनिमेशनचे एक चांगले उदाहरण Ikonet वेबसाइटवर आढळू शकते. ॲनिमेशन पेजवर असल्याच्या पहिल्या सेकंदापासून वापरकर्त्याला मोहित करते.
इंटरफेस किंवा साइटशी संवाद कसा साधावा हे वापरकर्त्याला समजावून सांगून ॲनिमेशन मार्गदर्शक म्हणून देखील कार्य करू शकते. त्याद्वारे वापरकर्त्याचे लक्ष महत्त्वाच्या गोष्टींकडे वेधले जाते. उदाहरणार्थ, जर तुम्हाला काही माहिती किंवा कृतीवर जोर द्यायचा असेल, तर ती कुठूनतरी सरकवा आणि अगदी सहज लक्षात येईल. खाली प्रेस्टन झेलरचे उदाहरण पहा. घटक एकावेळी पृष्ठांवर दिसतात, ज्यामुळे वापरकर्त्यांचे लक्ष पृष्ठावरील विशिष्ट भागांकडे वेधले जाते.
2. अभिप्राय द्या
मानवी-संगणक संवाद दोन मुख्य तत्त्वांवर आधारित आहे: वापरकर्ता इनपुट आणि सिस्टम इनपुट. अभिप्राय. सर्व परस्परसंवादी वस्तूंनी योग्य व्हिज्युअल किंवा वापरकर्त्याच्या इनपुटला प्रतिसाद दिला पाहिजे ध्वनी सिग्नल. अशा प्रकारे अभिप्राय प्रदान करतो.
खाली स्लाइड फ्रेमवर्क वापरून तयार केलेला सानुकूल चेकबॉक्स प्रभाव आहे. स्विच वापरताना वापरकर्त्याला दिसणारे सूक्ष्म बाउंसिंग ॲनिमेशन परस्परसंवादाची भावना वाढवते.
स्लाइड्ससह, तुम्ही गोड ॲनिमेशन तयार करू शकता जे होव्हरवर सक्रिय होतात, ज्यामुळे वापरकर्त्यांना वस्तूंशी संवाद साधण्यास प्रोत्साहित केले जाते. बेरी व्हिज्युअलवर एक नजर टाका. जेव्हा तुम्ही मेसेज पाठवा किंवा वरच्या उजव्या कोपऱ्यातील मेनूवर फिरता तेव्हा एक छान ॲनिमेटेड प्रभाव दिसून येतो. यामुळे घटकांमध्ये परस्परसंवादाची भावना निर्माण होते.
ॲनिमेटेड फीडबॅक कसा सुधारू शकतो याचे बफ अँटवर्प हे आणखी एक उत्तम उदाहरण आहे वापरकर्ता अनुभव. जेव्हा अभ्यागत टाइलवर फिरतात तेव्हा प्रदान केलेल्या मजकुरासह अर्ध-पारदर्शक आच्छादन दिसते अतिरिक्त माहितीऑब्जेक्ट बद्दल.
3. कनेक्शन बनवा
तुमच्या लँडिंग पृष्ठावर ॲनिमेशन जोडण्यासाठी एक उत्तम ठिकाण हे संक्रमण बिंदूंवर आहे. बऱ्याच वेळा संक्रमणे अचानक दिसतात, जसे की जेव्हा वापरकर्ते लिंकवर क्लिक करतात आणि एक नवीन विंडो दिसते. अशा बदलांमुळे सहसा संदर्भ गमावला जातो, मेंदूला स्कॅन करणे आवश्यक आहे नवीन पृष्ठ, ते मागील एकाशी कसे संबंधित आहे हे समजून घेण्यासाठी, त्यामुळे वापरकर्त्यांना असे संक्रमण समजणे कठीण वाटू शकते.
चला तीव्र संक्रमणाचे उदाहरण पाहू:
याच्याशी तुलना करा खालील उदाहरण, ज्यामध्ये एक गुळगुळीत ॲनिमेटेड संक्रमण वापरकर्त्यास मार्गदर्शन करते विविध भागस्क्रीन:
दुसरे संक्रमण मऊ आहे. हे विभागांमधील संक्रमणाची प्रक्रिया स्पष्टपणे दर्शवते, वापरकर्त्यांना काय घडत आहे हे समजून घेण्यात आणि त्यांच्यातील कनेक्शन पाहण्यात मदत करते.
हे टप्प्यांमधील संक्रमणे तयार करताना देखील वापरले जाते. खालील उदाहरणातील स्लाइड्समधील गुळगुळीत संक्रमणे सुसंगततेची भावना निर्माण करतात जेणेकरून माहिती एकसंध दिसू नये.
4. कंटाळवाणे कार्ये मनोरंजक करा
आपण आपल्या दैनंदिन दिनचर्यामध्ये खेळकर घटक कसे जोडू शकता याची कल्पना करणे कठीण असू शकते. परंतु ॲनिमेशनमध्ये थोडे आश्चर्य जोडून, आम्ही परिचित संवादाला काहीतरी मजेदार आणि संस्मरणीय बनवू शकतो.
तुम्ही Tympanus' 3D Room Exhibition वेबसाइट उघडल्यास, पहिल्या दृष्टीक्षेपात असे दिसते की ते इतर वेब गॅलरींपेक्षा वेगळे नाही. परंतु पृष्ठाशी संवाद साधल्यानंतर लगेचच तुमची छाप बदलेल. तुम्ही तुमचा कर्सर हलवल्यास, तुम्हाला पेज हलताना दिसेल आणि हा प्रभाव 3D जागेची भावना निर्माण करेल. तुम्ही एका पानावरून दुसऱ्या पानावर जाताना ही भावना तीव्र होत जाते. हे असे आहे की तुम्ही त्रिमितीय जागेत एका खोलीतून दुसऱ्या खोलीत प्रवास करत आहात.
आता 3D इफेक्ट्स पेक्षा अधिक परिचित गोष्टींबद्दल बोलूया - आकारांबद्दल. फॉर्म भरणे कोणाला आवडते? बहुधा कोणीच नाही. तथापि, फॉर्म भरणे हे इंटरनेटवरील सर्वात सामान्य कार्यांपैकी एक आहे. तुम्ही हा उपक्रम मजेदार कसा बनवू शकता?
खालील चित्र पहा, यती डोळे मिटून घेते कारण वापरकर्ता त्यांचा पासवर्ड टाकू लागतो. हा ॲनिमेटेड प्रभाव आश्चर्यचकित करणारा आणि उत्थान करणारा आहे, विशेषत: जर तुम्ही प्रथमच पाहिला असेल.
सर्वात शेवटी, तुम्ही स्क्रोलिंग केवळ दृष्यदृष्ट्या मनोरंजकच नाही तर वाचकांसाठी उपयुक्त देखील बनवू शकता. खाली , एक संवादात्मक प्रवास आहे ज्यामध्ये नकाशावरील मार्ग पृष्ठावरील सामग्रीनुसार ॲनिमेटेड आहे. कल्पनेची सुसंगतता व्हिज्युअल प्रभावआणि स्थान वापरकर्त्यांना माहिती वाचण्याची आणि नकाशावर त्यांच्या हालचाली पाहण्याची परवानगी देते.
ॲनिमेशन सर्वात उपयुक्त ठरेल त्या पृष्ठावरील स्थान निश्चित करणे केवळ अर्धी कथा आहे. महान मूल्यॲनिमेशन अंमलबजावणी देखील आहे. या विभागात तुम्ही व्यावसायिक स्तरावर वस्तूंचे योग्य प्रकारे ॲनिमेट कसे करायचे ते शिकाल.
1. एकाच वेळी अनेक ऑब्जेक्ट्स ॲनिमेट करू नका
जेव्हा एकाच वेळी अनेक वस्तू हलतात तेव्हा वापरकर्त्यासाठी लक्ष केंद्रित करणे कठीण होते. कारण माणसाचे डोळे एका वस्तूवरून दुसऱ्या वस्तूकडे जातील आणि मेंदूला लागेल अतिरिक्त वेळकाय होत आहे हे समजून घेण्यासाठी (विशेषत: जर हालचाल खूप लवकर होत असेल तर). म्हणून, ॲनिमेशन योग्यरित्या लागू करणे खूप महत्वाचे आहे.
संक्रमण कोरिओग्राफीची संकल्पना समजून घेणे महत्वाचे आहे, जे हालचालींचा एक क्रम आहे जो इंटरफेस बदलत असताना लक्ष केंद्रित करते. एकाच वेळी हलणाऱ्या घटकांची संख्या कमी करा. एका वेळी दोन किंवा तीन पेक्षा जास्त हलणारे भाग वापरू नका. तुम्हाला तीनपेक्षा जास्त ऑब्जेक्ट हलवायचे असल्यास, त्यांचे गट करा आणि त्याऐवजी एक म्हणून ॲनिमेट करा वैयक्तिक घटक.
वेब डिझाइनमध्ये स्लाइड्स अत्यंत उपयुक्त आहेत कारण ते तुम्हाला कमी हालचाल वापरण्याची परवानगी देतात. स्लाइड्समध्ये उपस्थित असलेले प्रत्येक ॲनिमेटेड प्रभाव सामग्री प्रभावीपणे सादर करण्यासाठी काळजीपूर्वक डिझाइन केले गेले आहे.
2. ॲनिमेशन लँडिंग पृष्ठाच्या वैयक्तिक वैशिष्ट्यांशी विरोधाभास नसावे
प्रत्येक वेळी तुम्ही डिझाइनमध्ये ॲनिमेशन जोडता तेव्हा तुम्ही ते अधिक अर्थपूर्ण बनवता. त्याच्या देखावामुख्यत्वे निवडलेल्यावर अवलंबून असेल ॲनिमेटेड प्रभाव.
जेव्हा लोक उत्पादनाशी संवाद साधतात तेव्हा त्यांच्या काही अपेक्षा असतात. कल्पना करा की बँकिंग सेवेसाठी लँडिंग पृष्ठ तयार करताना, तुम्ही तुमच्या डेटा संकलन फॉर्मसाठी बाऊन्सिंग ॲनिमेशन वापरण्याचा निर्णय घ्या. बरेच वापरकर्ते त्यांचे तपशील प्रदान करण्यास घाबरतील कारण फॉर्म पुरेसे गंभीर दिसत नाही.
स्लाइड फ्रेमवर्क 10 ॲनिमेटेड शैली प्रदान करते जसे की स्टॅक, झेन, फिल्म, कार्ड्स आणि झूम. विविध प्रभावांसह प्रयोग करा आणि तुमच्या सर्व निकषांना अनुकूल असा एक निवडा.
3. तुमची वेळ सेट करा
जेव्हा ॲनिमेशन तयार करण्याची वेळ येते तेव्हा सर्व काही असते. तो अक्षरशः ॲनिमेशनचे भवितव्य ठरवतो. जेव्हा तुम्ही ॲनिमेशनवर काम करत असता, तेव्हा तुम्ही तुमचा एक तृतीयांश वेळ योग्य ॲनिमेटेड इफेक्ट्स शोधण्यात घालवता आणि उर्वरित वेळ ॲनिमेशन सुंदर दिसण्यासाठी वेळ निवडण्यात घालवता.
इष्टतम UI ॲनिमेशन गती 200 आणि 500 मिलीसेकंद दरम्यान आहे. 1 सेकंदापेक्षा कमी काळ टिकणारे ॲनिमेशन तात्काळ मानले जाते, तर 5 सेकंदांपेक्षा जास्त काळ टिकणारे ॲनिमेशन काढलेले वाटू शकते.
ॲनिमेटेड इफेक्ट तयार करण्याच्या बाबतीत, ॲनिमेशन कसे समजले जाते यावर वेळेचा थेट परिणाम होतो. हे डिझाइनरना ॲनिमेशन अधिक नैसर्गिक आणि नैसर्गिक बनविण्यात मदत करते.
4. प्रवेशयोग्यतेबद्दल विसरू नका
ॲनिमेशन ही दुधारी तलवार आहे. दुसऱ्या गटासाठी समस्या निर्माण करताना ते वापरकर्त्यांच्या एका गटासाठी उपयोगिता सुधारू शकते. सोडा ऍपल iOS 7 काय करू नये याचे उदाहरण बनले. ऑपरेटिंग सिस्टम रिलीज झाल्यानंतर लवकरच, आयफोन वापरकर्तेॲनिमेटेड संक्रमणामुळे चक्कर येणे आणि डोळ्यांवर ताण येतो असे नोंदवले.
तुम्हाला जनतेला लक्ष्य करावे लागेल आणि दृष्टी समस्या इत्यादीसारख्या अपंगत्वाचा विचार करावा लागेल. तुमची रचना WCAG मार्गदर्शक तत्त्वांचे पालन करते हे नेहमी तपासा. वापरकर्त्याच्या विनंत्या आणि टिप्पण्यांचा मागोवा घ्या.
एक विशेष CSS मीडिया वैशिष्ट्य, “prefers-reduced-motion,” अशा परिस्थितींचा मागोवा घेण्यास मदत करते जेथे वापरकर्ता ॲनिमेशनची संख्या कमी करण्याची विनंती करतो.
याशिवाय, सर्व वापरकर्त्यांना, दृष्टीदोष असलेल्यांसह, तुमच्या डिझाइनशी संवाद साधण्यात कोणतीही अडचण येणार नाही याची पडताळणी करण्यासाठी तुम्ही उपयोगिता चाचणी आयोजित केली पाहिजे.
5. तुमच्या डिझाइन सोल्यूशन्सची चाचणी घ्या
चाचणी करताना लक्षात ठेवण्यासाठी येथे काही टिपा आहेत:
- वेगवेगळ्या उपकरणांवर चाचणी.
स्क्रीन आकार, स्क्रीन घनता, कार्यप्रदर्शन यासारखी अनेक हार्डवेअर वैशिष्ट्ये GPUआणि याप्रमाणे, ॲनिमेशन कार्यक्षमतेवर लक्षणीय परिणाम करू शकतात. परिणामी, मालक अधिक आहे गुणवत्ता स्क्रीनजुन्या डिव्हाइसच्या मालकापेक्षा वेगळे चित्र दिसेल. या घटकांचा विचार करा आणि तुमचे ॲनिमेशन ऑप्टिमाइझ करा जेणेकरून ते सर्व डिव्हाइसवर छान दिसेल.
- मोबाईल फोनवर चाचणी घ्या.
बहुतेक वेबसाइट पीसीवर तयार केल्या जातात आणि तपासल्या जातात. साठी चाचणीचा अभाव मोबाइल उपकरणेवापरकर्त्यांसाठी अनेक समस्या निर्माण करू शकतात कारण काही ॲनिमेटेड तंत्रे पीसीवर उत्तम काम करतात परंतु मोबाइल डिव्हाइसवर नाहीत. वापरकर्त्यांना नकारात्मक अनुभव येण्यापासून रोखण्यासाठी, तुमची रचना डेस्कटॉप आणि मोबाइल दोन्ही डिव्हाइसवर उत्तम काम करते याची खात्री करा.
- मंद गतीने ॲनिमेशन पहा
जेव्हा ॲनिमेशन (विशेषतः एक जटिल) पूर्ण वेगाने चालत असेल तेव्हा त्रुटी लक्षात घेणे कठीण आहे. परंतु जेव्हा तुम्ही ॲनिमेशनचा वेग कमी करता (म्हणा, वेगाचा एक दशांश), अशा अपूर्णता स्पष्ट होतात. तुम्ही स्लो-मो व्हिडिओ देखील बनवू शकता आणि ते तुमच्या मित्रांना दाखवून त्यांचे मत जाणून घेऊ शकता.
6. ॲनिमेशन सुरुवातीला विकसित केले पाहिजे
अनेक डिझाइनर ॲनिमेशनचा विचार करतात अनावश्यक कार्यकारण ते ओव्हरलोड होते वापरकर्ता इंटरफेसआणि ते गुंतागुंती करते. बहुतेक प्रकरणांमध्ये हे घडते, परंतु केवळ डिझाइनर डिझाइन प्रक्रियेच्या शेवटी ॲनिमेशन जोडतात म्हणून. कोणत्याही उद्देशाशिवाय यादृच्छिक हालचालीमुळे अभ्यागतांना फायदा होणार नाही आणि बहुधा विचलित आणि त्रासदायक असेल.
ॲनिमेशन उपयुक्त आणि व्यावहारिक बनवण्यासाठी, तुमच्या डिझाइनमध्ये लवकर वेळ घालवा. ॲनिमेशन कुठे तार्किक आणि नैसर्गिक दिसेल हे ठरवणे फार महत्वाचे आहे.
निष्कर्ष
चांगले डिझाइन केलेले आणि उच्च-गुणवत्तेचे ॲनिमेशन लँडिंग पृष्ठ केवळ अधिक आकर्षक बनवत नाही तर अधिक वापरकर्ता-अनुकूल देखील बनवते. योग्यरित्या पूर्ण केल्यावर, ॲनिमेशन तुमच्या लँडिंग पृष्ठाच्या परस्परसंवादाला संस्मरणीय आणि आकर्षक अनुभवात बदलू शकते.
