What is the difference between mobile and computer?
From desktops to smartphones to an expanding galaxy of different connected screens and devices, we can safely say that access to the world’s information on-demand is part of our lives now, and for the foreseeable future. We’re at the end of the beginning and companies must evolve. People now expect connectivity wherever they are and on whatever device they choose — this is the new norm. It’s time for businesses to catch up and understand their connected customer.
डेस्कटॉप से स्मार्टफोन के लिए विभिन्न जुड़े स्क्रीन और उपकरणों की एक विस्तार आकाशगंगा के लिए, हम सुरक्षित रूप से कह सकते है कि दुनिया की मांग पर जानकारी के लिए उपयोग अब हमारे जीवन का हिस्सा है, और निकट भविष्य के लिए । हम शुरुआत के अंत में कर रहे है और कंपनियों को विकसित करना होगा । लोग अब कनेक्टिविटी की उम्मीद करते हैं जहां भी वे हैं और जो भी डिवाइस चुनते हैं-यह नया आदर्श है । यह व्यवसायों को पकड़ने और उनके जुड़े ग्राहक को समझने का समय है।
1. Smaller screens
Let’s start with one of the most obvious differences: Mobile browser displays are smaller than their desktop counterparts. “Smaller” here means two things:
- Physically smaller: Typically around 3-5 diagonal inches for a phone, although some larger phones can be up to 6, and 9-12 diagonal inches for a tablet. This compares to a typical notebook screen size of 13-17 inches, and a desktop screen size of 20-30 inches.
- Fewer pixels: Most mobile displays currently have fewer pixels than desktop displays. An iPhone 6s retina display is 1334 x 750 pixels, whereas the smallest-screen MacBook has a 2304 x 1440 display.
1. छोटी स्क्रीन
आइए सबसे स्पष्ट मतभेदों में से एक के साथ शुरू करें: मोबाइल ब्राउज़र डिस्प्ले उनके डेस्कटॉप समकक्षों की तुलना में छोटे हैं। "छोटे" यहां दो बातें मतलब है:
1.शारीरिक रूप से छोटे: आम तौर पर एक फोन के लिए 3-5 विकर्ण इंच के आसपास है, हालांकि कुछ बड़े फोन 6 तक हो सकता है, और एक गोली के लिए 9-12 विकर्ण इंच । यह 13-17 इंच के एक ठेठ नोटबुक स्क्रीन आकार, और 20-30 इंच के डेस्कटॉप स्क्रीन आकार की तुलना में है ।
2.कम पिक्सल: अधिकांश मोबाइल डिस्प्ले में वर्तमान में डेस्कटॉप डिस्प्ले की तुलना में कम पिक्सल होते हैं. आईफोन 6एस रेटिना डिस्प्ले 1334 x 750 पिक्सल है, जबकि सबसे छोटी स्क्रीन वाले मैकबुक में 2304 x 1440 डिस्प्ले है।
A smaller display means that the user can see a lot less information at once. Most modern mobile browsers compensate for this by allowing the user to zoom in and out easily, as well as adapting font sizes to make text more readable. Typically, though, the user will need to zoom in if they want to read the text in your page.
A smaller display also pushes more of your page content “below the fold,” requiring users to scroll through your page content more often.
So, for your site to work well on a mobile browser, it needs to: present important information near the top of the page, use an easy-to-read font, and not overwhelm the user with too much content on the page. In addition, the page layout needs to be usable and it needs to look good in a small browser window too. This usually implies a simpler page layout than you might see on a regular website.
एक छोटे डिस्प्ले का मतलब है कि उपयोगकर्ता एक बार में बहुत कम जानकारी देख सकता है। अधिकांश आधुनिक मोबाइल ब्राउज़र उपयोगकर्ता को आसानी से ज़ूम इन और आउट करने की अनुमति देकर इसकी भरपाई करते हैं, साथ ही पाठ को अधिक पठनीय बनाने के लिए फ़ॉन्ट आकार को अनुकूलित करते हैं। आमतौर पर, हालांकि, उपयोगकर्ता को ज़ूम करने की आवश्यकता होगी यदि वे आपके पृष्ठ में पाठ पढ़ना चाहते हैं।
एक छोटा प्रदर्शन आपकी पृष्ठ सामग्री को "गुना के नीचे" भी धकेलता है, जिससे उपयोगकर्ताओं को आपकी पृष्ठ सामग्री के माध्यम से अधिक बार स्क्रॉल करने की आवश्यकता होती है।
इसलिए, आपकी साइट के लिए मोबाइल ब्राउज़र पर अच्छी तरह से काम करने के लिए, इसके लिए जरूरी है: पृष्ठ के शीर्ष के पास महत्वपूर्ण जानकारी प्रस्तुत करें, एक आसान-से-पढ़ने वाले फ़ॉन्ट का उपयोग करें, और उपयोगकर्ता को पृष्ठ पर बहुत अधिक सामग्री के साथ अभिभूत न करें। इसके अलावा, पेज लेआउट को इस् सपर्ण होने की जरूरत है और इसे एक छोटे ब्राउज़र विंडो में भी अच्छा दिखने की जरूरत है। यह आमतौर पर एक सरल पृष्ठ लेआउट का तात्पर्य है जितना आप नियमित वेबसाइट पर देख सकते हैं।
2. Slower processors
Although they are catching up, mobile devices generally have much less processing power than desktop computers. This is for various reasons, including cost and battery life. Therefore, mobile browsers take longer to render pages, and JavaScript-intensive pages can run very slowly.
Consider creating a simpler page layout for mobile browsers that uses less markup and CSS. If your site uses a lot of JavaScript for things like slideshows, interactive forms, and the like, you might want to optimize or minimize your JavaScript so it runs smoothly on mobile browsers.
हालांकि वे पकड़ रहे हैं, मोबाइल उपकरणों में आम तौर पर डेस्कटॉप कंप्यूटर की तुलना में बहुत कम प्रसंस्करण शक्ति होती है। यह लागत और बैटरी जीवन सहित विभिन्न कारणों से है। इसलिए, मोबाइल ब्राउज़रों को पृष्ठों को प्रस्तुत करने में अधिक समय लगता है, और जावास्क्रिप्ट-गहन पृष्ठ बहुत धीरे-धीरे चल सकते हैं।
कम मार्कअप और सीएसएस का उपयोग करने वाले मोबाइल ब्राउज़रों के लिए एक सरल पृष्ठ लेआउट बनाने पर विचार करें। यदि आपकी साइट स्लाइड शो, इंटरैक्टिव रूपों और इस तरह की चीजों के लिए बहुत सारी जावास्क्रिप्ट का उपयोग करती है, तो आप अपने जावास्क्रिप्ट को अनुकूलित या कम करना चाह सकते हैं ताकि यह मोबाइल ब्राउज़र पर सुचारू रूप से चल सके।
3. Less bandwidth
While cellular network speeds are improving all the time, a typical 4G mobile device gets a 5-12 Mbps download rate, compared to an average of over 50 Mbps for broadband internet users.
While cellular network speeds are improving all the time, a typical 4G mobile device gets a 5-12 Mbps download rate, compared to an average of over 50 Mbps for broadband internet users.
It’s always a good idea to make your site as bandwidth-efficient as possible, since every second that your users have to wait for your pages to load will increase their frustration. This is even more important when designing for the mobile web. According to Google, more than half of users will abandon a page if it takes longer than 3 seconds to load.
If your site contains large graphics or embedded videos that take up a lot of bandwidth, then you definitely want to look at creating a responsive, mobile-friendly site with smaller images and lower bit-rate video (or no video at all). Also, if you’re providing downloadable PDFs or other content for your visitors, make sure the content isn’t too big to download comfortably on a mobile device.
3. कम बैंडविड्थ
जबकि सेलुलर नेटवर्क की गति हर समय सुधार कर रहे हैं, एक ठेठ 4G मोबाइल डिवाइस एक 5-12 एमबीपीएस डाउनलोड दर हो जाता है, ब्रॉडबैंड इंटरनेट उपयोगकर्ताओं के लिए ५० एमबीपीएस से अधिक की औसत की तुलना में
जबकि सेलुलर नेटवर्क की गति हर समय सुधार कर रहे हैं, एक ठेठ 4G मोबाइल डिवाइस एक 5-12 एमबीपीएस डाउनलोड दर हो जाता है, ब्रॉडबैंड इंटरनेट उपयोगकर्ताओं के लिए ५० एमबीपीएस से अधिक की औसत की तुलना में ।
अपनी साइट को यथासंभव बैंडविड्थ-कुशल बनाना हमेशा एक अच्छा विचार है, क्योंकि आपके उपयोगकर्ताओं को आपके पृष्ठों को लोड करने के लिए प्रतीक्षा करनी होगी, जिससे उनकी हताशा बढ़ेगी। मोबाइल वेब के लिए डिजाइन करते समय यह और भी महत्वपूर्ण है। गूगल के मुताबिक, अगर लोड होने में 3 सेकंड से ज्यादा का समय लगता है तो आधे से ज्यादा यूजर्स एक पेज को छोड़ देंगे ।
यदि आपकी साइट में बड़े ग्राफिक्स या एम्बेडेड वीडियो हैं जो बहुत सारे बैंडविड्थ लेते हैं, तो आप निश्चित रूप से छोटी छवियों और कम बिट-रेट वीडियो (या कोई वीडियो नहीं) के साथ एक उत्तरदायी, मोबाइल-अनुकूल साइट बनाना चाहते हैं। इसके अलावा, यदि आप अपने आगंतुकों के लिए डाउनलोड करने योग्य पीडीएफ या अन्य सामग्री प्रदान कर रहे हैं, तो सुनिश्चित करें कि मोबाइल डिवाइस पर आराम से डाउनलोड करने के लिए सामग्री बहुत बड़ी नहीं है।
4. Touch input
One important aspect of many mobile devices is touch-based input. Rather than using a mouse, the vast majority of mobile users work with their devices using their fingers (some desktops do as well). This has several implications for mobile site designers, including:
- No hover events:
There is no mouse pointer, so there is no concept of “hovering” over a page element. Navigation menus and other controls that rely on the CSS hover pseudo-class or JavaScript mouse-over/mouse-out events won’t work well on touch devices. Some mobile browsers use various tricks to compensate for this, such as firing a hover event when the user taps the element once, and a click event if they tap again. However, it’s best not to rely on hover events for your mobile site’s functionality. - Less precision:
Clicking a 12-pixel-high text link with a mouse is no problem. Tapping the same link with big sausage fingers is a different story! Users can compensate for this by zooming in, but it’s still awkward. This is one of the best arguments for creating a separate site just for mobile users, since you can then replace those fiddly text links with nice, large, touch-friendly buttons and other controls. - Gestures:
- Most modern touch devices allow the user to perform gestures using one or more fingers, such as swiping, pinching, and so on. You can use gestures to enhance the experience for your mobile users. For example, you can let your users swipe left and right to move between images in a gallery. Many JavaScript frameworks such as jQuery Mobile can generate events for various touch gestures, making it easier to add gesture support to your mobile sites.
4. टच इनपुट
कई मोबाइल उपकरणों का एक महत्वपूर्ण पहलू स्पर्श आधारित इनपुट है। माउस का उपयोग करने के बजाय, अधिकांश मोबाइल उपयोगकर्ता अपनी उंगलियों का उपयोग करके अपने उपकरणों के साथ काम करते हैं (कुछ डेस्कटॉप भी करते हैं)। इसमें मोबाइल साइट डिजाइनरों के लिए कई निहितार्थ हैं, जिनमें शामिल हैं:
कोई माउस पॉइंटर नहीं है, इसलिए पृष्ठ तत्व पर "मंडरा" की कोई अवधारणा नहीं है। नेविगेशन मेनू और अन्य नियंत्रण जो सीएसएस पर भरोसा करते हैं, छद्म वर्ग या जावास्क्रिप्ट माउस-ओवर/माउस-आउट घटनाएं स्पर्श उपकरणों पर अच्छी तरह से काम नहीं करेंगे। कुछ मोबाइल ब्राउज़र इसके लिए क्षतिपूर्ति करने के लिए विभिन्न तरकीबों का उपयोग करते हैं, जैसे कि उपयोगकर्ता द्वारा एक बार तत्व को टैप करने पर होवर इवेंट को फायरिंग करना, और एक क्लिक इवेंट यदि वे फिर से टैप करते हैं। हालांकि, यह सबसे अच्छा है कि आप अपनी मोबाइल साइट की कार्यक्षमता के लिए होवर इवेंट्स पर भरोसा न करें।
माउस के साथ 12-पिक्सेल-हाई टेक्स्ट लिंक पर क्लिक करना कोई समस्या नहीं है। बड़े सॉसेज उंगलियों के साथ एक ही कड़ी दोहन एक अलग कहानी है! उपयोगकर्ता ज़ूम इन करके इसकी भरपाई कर सकते हैं, लेकिन यह अभी भी अजीब है। यह सिर्फ मोबाइल उपयोगकर्ताओं के लिए एक अलग साइट बनाने के लिए सबसे अच्छा तर्क में से एक है, क्योंकि आप तो अच्छा, बड़े, स्पर्श के अनुकूल बटन और अंय नियंत्रण के साथ उन fiddly पाठ लिंक की जगह कर सकते हैं ।
अधिकांश आधुनिक स्पर्श उपकरण उपयोगकर्ता को एक या अधिक उंगलियों का उपयोग करके इशारों को करने की अनुमति देते हैं, जैसे स्वाइप करना, पिंचिंग करना, आदि। आप अपने मोबाइल उपयोगकर्ताओं के लिए अनुभव को बढ़ाने के लिए इशारों का उपयोग कर सकते हैं। उदाहरण के लिए, आप अपने उपयोगकर्ताओं को गैलरी में छवियों के बीच जाने के लिए बाएं और दाएं स्वाइप करने दे सकते हैं। जेक्वेरी मोबाइल जैसे कई जावास्क्रिप्ट फ्रेमवर्क विभिन्न स्पर्श इशारों के लिए घटनाओं को उत्पन्न कर सकते हैं, जिससे आपकी मोबाइल साइटों में इशारा समर्थन जोड़ना आसान हो जाता है
5. Tricky keyboards
Unless you happen to be using an add-on, full-size keyboard with your mobile device, the chances are that you’re typing on a tricky little plastic keyboard or tapping a minuscule on-screen keyboard. While these keyboards are much better than they used to be, typing on them is still far from being a pleasant experience. This means that mobile users hate typing long reams of text. Your mobile site can make life easier for them by:
- Using shorter URLs
- Adding an autocomplete function to text fields and search fields
- Providing an easy way to browse popular pages or products, rather than having to search
- Preemptively filling as much information as possible in web forms
5. मुश्किल कीबोर्ड
जब तक आप अपने मोबाइल डिवाइस के साथ ऐड-ऑन, फुल-साइज कीबोर्ड का उपयोग नहीं करते हैं, तब तक संभावना है कि आप एक मुश्किल छोटे प्लास्टिक कीबोर्ड पर टाइप कर रहे हैं या एक मामूली ऑन-स्क्रीन कीबोर्ड टैप कर रहे हैं। हालांकि ये कीबोर्ड उनके द्वारा किए जाने वाले मुकाबले की तुलना में काफी बेहतर हैं, लेकिन उन पर टाइप करना अभी भी सुखद अनुभव होने से दूर है। इसका मतलब यह है कि मोबाइल उपयोगकर्ताओं को पाठ के लंबे रिम्स टाइपिंग से नफरत है । आपकी मोबाइल साइट उनके लिए जीवन को आसान बना सकती है:
1.छोटे यूआरएल का उपयोग करना
2.टेक्स्ट फ़ील्ड और खोज फ़ील्ड में एक ऑटोकम्प्लीट फ़ंक्शन जोड़ना
3.खोज करने के बजाय लोकप्रिय पृष्ठों या उत्पादों को ब्राउज़ करने का एक आसान तरीका प्रदान करना
4.वेब रूपों में जितना संभव हो उतना जानकारी भरना
6. No, or limited, multitasking
Multitasking — in the sense of being able to run more than one app at once — is finally starting to take off on mobile devices. That said, many devices still can’t multitask, and even those that can, don’t offer the power or flexibility of desktop multitasking.
This poor multitasking support can affect the way you design your mobile websites. For example, consider including Twitter/Facebook sharing buttons on every page of your site, so that users don’t have to copy and paste your page’s URL to a different window or app in order to share the page.
6. नहीं, या सीमित, मल्टीटास्किंग
मल्टीटास्किंग - एक बार में एक से अधिक ऐप चलाने में सक्षम होने के अर्थ में - अंततः मोबाइल उपकरणों पर उतरना शुरू हो रहा है। उस ने कहा, कई डिवाइस अभी भी मल्टीटास्क नहीं कर सकते हैं, और यहां तक कि वे भी जो डेस्कटॉप मल्टीटास्किंग की शक्ति या लचीलापन प्रदान नहीं कर सकते हैं।
यह खराब मल्टीटास्किंग समर्थन आपके मोबाइल वेबसाइटों को डिजाइन करने के तरीके को प्रभावित कर सकता है। उदाहरण के लिए, अपनी साइट के हर पेज पर ट्विटर/फेसबुक शेयरिंग बटन को शामिल करने पर विचार करें, ताकि उपयोगकर्ताओं को पेज साझा करने के लिए अपने पेज के यूआरएल को किसी अन्य विंडो या ऐप पर कॉपी और पेस्ट न करना पड़े।
Comments
Post a Comment
if u have any doubts, please let me know