Enhancement of Website Usability for Mobile Phones
产品使用体验 英语作文
产品使用体验英语作文Title: Enhancing Product User Experience: A Comprehensive Approach。
In the realm of product development, user experience (UX) holds paramount importance. It is the cornerstone upon which the success and longevity of a product stand.Crafting a seamless and delightful user experience involves a myriad of factors, ranging from intuitive design to efficient functionality. In this essay, we delve into the essence of product user experience and explore strategiesto enhance it.Firstly, understanding the user is pivotal. Conducting thorough user research enables designers to grasp the needs, preferences, and pain points of the target audience. By employing techniques such as surveys, interviews, and usability testing, insights are gleaned to inform thedesign process. Armed with this knowledge, designers can tailor the product to cater to the specific requirements ofthe users, thus laying the foundation for a gratifying user experience.Furthermore, simplicity breeds usability. Adopting a minimalist approach to design not only enhances aesthetic appeal but also fosters ease of use. Clutter-freeinterfaces with intuitive navigation empower users to accomplish tasks effortlessly. Strive for clarity in design elements, keeping them concise and easily comprehensible. By streamlining the user journey and minimizing cognitive load, friction is reduced, paving the way for a fluid and enjoyable user experience.Moreover, responsiveness is key in today's fast-paced digital landscape. Users expect instantaneous feedback and seamless interactions across various devices and platforms. Implementing responsive design principles ensures that the product adapts seamlessly to different screen sizes and resolutions, optimizing the user experience regardless of the device being used. Swift loading times and smooth transitions further elevate user satisfaction, fostering a positive perception of the product.In addition to functionality, emotional engagementplays a crucial role in shaping user experience. Incorporating elements of delight and surprise evokes positive emotions, forging a deeper connection between the user and the product. Thoughtful micro-interactions,playful animations, and personalized experiences resonate with users on an emotional level, leaving a lasting impression. By infusing personality into the product design, it transcends being merely functional to becoming anintegral part of the user's daily life.Accessibility is another fundamental aspect that cannot be overlooked. Ensuring inclusivity by designing with accessibility in mind broadens the reach of the product, catering to users with diverse needs and abilities. Implementing features such as alternative text for images, keyboard navigation, and adjustable font sizes enhances usability for all users, regardless of any physical or cognitive limitations they may have. By championing accessibility, the product becomes more inclusive and empowers users to participate fully in the digitalexperience.Continuous iteration based on user feedback isessential for refining and optimizing the user experience. Embrace a user-centric approach by soliciting feedback through various channels and iteratively improving the product based on insights gathered. Utilize analytics tools to track user behavior and identify pain points or areasfor enhancement. By prioritizing user feedback and iteratively refining the product, it evolves in tandem with user needs, ensuring its relevance and efficacy over time.In conclusion, enhancing product user experience is a multifaceted endeavor that requires a holistic approach encompassing user research, intuitive design, responsiveness, emotional engagement, accessibility, and continuous iteration. By prioritizing the needs and preferences of the users and striving for excellence in every facet of design and functionality, a truly exceptional user experience can be achieved, setting the stage for the success and longevity of the product in the ever-evolving landscape of technology and innovation.。
互联网改变了我们的购物方式英语作文
互联网改变了我们的购物方式英语作文The Internet has completely revolutionized the way we shop. Gone are the days when we had to physically go to a store to purchase goods. Now, with just a few clicks, we can buy almost anything we want from the comfort of our own homes. The convenience and ease of online shopping have completely changed the way we approach the purchasing process.One of the biggest ways that the Internet has changed our shopping habits is through the rise of e-commerce websites. Websites like Amazon, eBay, and Alibaba have made it incredibly easy for consumers to browse through a wide variety of products and make purchases in a matter of minutes. These websites often offer a wider selection of products than traditionalbrick-and-mortar stores, allowing us to find exactly what we're looking for with ease.In addition to e-commerce websites, social media platforms have also played a significant role in changing the way we shop. Influencers and celebrities often promote products on platforms like Instagram and TikTok, leading to a rise in social commerce. Many consumers now make purchases directly through social media platforms, without ever visiting a traditional website or store.Another way that the Internet has changed our shopping habits is through the rise of mobile shopping. With the advent of smartphones, consumers can now shop on the go, anytime and anywhere. Mobile shopping apps make it easy to browse and buy products with just a few taps on a screen, further increasing the convenience of online shopping.Furthermore, the Internet has also made it easier for consumers to compare prices and read reviews before making a purchase. Websites like Google Shopping and PriceGrabber allow consumers to quickly compare prices across multiple retailers, ensuring that they get the best deal possible. Similarly, online reviews and ratings provide valuable insights into the quality and reliability of products, helping consumers make informed decisions before making a purchase.Overall, the Internet has had a profound impact on the way we shop. It has made shopping more convenient, accessible, and efficient than ever before. With the rise of e-commerce, social commerce, mobile shopping, and price comparison tools, the way we shop will continue to evolve and change in the digital age. The Internet has truly transformed our shopping habits, making it easier than ever to find and purchase the products we need.。
Web可用性举例
The Breathing ProblemInsidious Ailment?We need a metaphor to make a subtle, but important point. We have friends who've lived in Los Angeles. They report that when the smog in Los Angeles is light, they don't feel like they’re suffering.However, epidemiologists say Los Angeleans suffer health effects similar to a pack-a-day smoking habit. They are paying the price of low awareness.Similarly, when using an e-commerce Web site, we may not feel like we’re suffering. However, many new Netizens fail to get the full benefit of the Web offering due to poor usability. What’s going on?We suggest that sub-optimal usability, like smog, indeed has an endemic nature that goes largely unnoticed. We may not see “poor usability” just as we may not “see” light smog. There is a visibility problem. (Granted, fly-ing into Los Angeles, we see the smog clearly from that exalted perspec-tive.) And as with smog, individuals with varying degrees of sensitivity and knowledge will complain at different points of the pollution or usability index. Wouldn’t it be nice for e-commerce managers to “breath easier” at night knowing their site has a clean bill of health for usability issues?Diagnosis :In the market place, managers rank competitiveness closely with ease of use. A recent study of 212 web sites on an electronic shopping center showed that managers selected these 3 top priorities out of 33 choices: 1.Enhance competitiveness or create strategic advantage.2.Enable easier access to information.3.Provide new products or services to customers (Lederer, Mirchandani, & Sims, 1998, p. 95)A systematic, scientific approach to e-commerce design uses human factors or ergonomic principles to minimize the visual, intellectual, mental, and physical “effort” users exert. While research shows that users typically fail to recognize "good" from "bad" design (Andre and Wickens, 1995), the market place ultimately proves a stern and accurate judge. Note, however,that using the market place as a usability monitor costs a lot of money. Locating Symptoms:How be competitive? How be “easier”? Aye,here’s the rub. Every webmaster seeks these. But uninformed, intuitive design works like smog – it grows into a pervasive but insidious and oftenWeb Usability Illustrated:Breathing Easier with Your Usable E-Commerce Site— published in The Journal of Economic Commerce , Volume 11 Number 4unseen problem. Symptoms appear as part of the “competitive gradient” as users instinctively gravi-tate to software that provides faster productivity, fewer errors, less learning effort, and greater sub-jective satisfaction: all human factors or ergonomic goals. An epidemic of missed e-commerce oppor-tunity arises for all sites within the gradient. How can we identify the invisible problems of difficult usability? We need a usability smog monitor such as a trained professional.Surface Treatments:Some commentators define usability as providing features such as help facili-ties and FAQ (frequently asked questions) pages (Lohse and Spiller, 1998). However, one could ask if a site were designed well, why should a user need "help?" The issue remains: what constitutes usable e-commerce design? User oriented func-tions like comparison shopping (Baty and Lee, 1995) are important. But the designs of the func-tions demand as much if not more attention. Note that the design given in the comparison shopping article by Baty and Lee would never pass muster from a usability specialist – it’s unusable. (It requires "window thrashing" among numerous product windows.) In the last half of this article we’ll give you examples of usability issues we observe in our work as interface design specialists. First, however, let’s try to document signs of usability smog in the e-commerce traffic zone.Is E-Commerce Thwarted by Usability Issues?Evidence suggests that for an individual netizen (web-user), e-commerce usage grows with sheer experience on the web. Obviously, continued use of the web offers more chances to learn about e-commerce opportunities. How-ever, more and more new users come to the web who have already learned about e-commerce opportunities from their reading of print advertising. Thus, even with knowledge about e-commerce, novice netizens remained shy about e-shopping. Why? It may be "usability problems" that hold users back. Let’s contrast e-commerce usage among experts versus novices in one important survey.Some DataBackground The Spring, 1998 GVU 9th WWW User Survey covered over 10,000 US (84%) European (6%), Canadian (5%) and Oceania (2%) self-selected web users. New users with less than one year on the internet constituted 18% (novices); 45% used the internet for 1 to 3 years. 37% had 4 or more years experience (experts). Generally, users were fairly experienced: 88% used the web daily and 26% used it more than 20 hours per week. Connections were adequate: 87% used 28Kb/sec or faster. Of those who made purchases on the Web, 33% spent between $100 and $500; 30% spent over $500.Buyer Reluctance GVU reports that 60% used the Web to seek product purchase information. However, in most product categories, less than 40% made a purchase in the last six months. Respondents gave these three top reasons for aban-doning a Web site during personal shopping:• Could not find the item: 56% (professional • shopping: 62%)• Site disorganized or confusing: 54% (61%)• Pages downloaded too slowly: 53% (60%)The second two reasons clearly reflect usability problems. A high “smog” index overcame these shoppers.Novices Shop Less Novices lack web experi-ence. For example, among Web users who find the item they want, 43% of expert respondents order all or most of the time, while only 26% of the novices do. Note that both experts and novices had found the item they wanted, but novices order less. This may reflect a lack of ease-of-use. Experience compensates for low usability. But novices without experience succumb to the “smog.”Experience Counts During the 6 months between the 8th and 9th GVU survey, users collectively ordered more frequently – probably because of more experience as well as increased product offer-ings and advertising. After finding the item, users placed an order…• Most of the time (increased from ~14% (8th sur-vey) to 27% of respondents (9th survey))• Half the time (increased from 12% to 19%)• Never (reduced from 27% to 13%)All these statistics taken together, plus the rather small increases in the last paragraph, reflect a lack of shopping health due to usability smogGiven a Web context, optimal usability design will reduce the need for experience and expertise. In contrast, the current survey shows a considerable range of usage frequency among levels of user experience. 80% of experts indicated they used information searches in quest of all or most of their professional purchases, while 65% of intermediate users did so, and only 50% of novices used such searches. With better usability, we should see greater use of information searches among novices and intermediates. Experts may also increase their usage.Collective experience also counts in the category of “time spent searching.” From the 8th to the 9th survey, about 5% of users moved from the 5-15 minute search category to the less-than-5-minutes category. However, we see that the six months between surveys accelerated expert performance better than novice performance. More experts than novices moved to the under-5-minutes category, implying that interface design has not reduced learning effort for novices. “Smog alert.”Benefits of E-CommerceThe same GVU report offers this insight into the perceived value of Web-based shopping. Respondents gave these motivations for personal shopping of products and services. Most categories offer usability design challenges above and beyond just providing the functions.•Get detailed information on products: 87% (pro-fessional shopping 92%)•Make price comparison: 80% (83%)•Learn availability of products and services: 78% (79%)•Convenience: 78% (76%)•No pressure from sales person: 66% (58%)•Saving time: 64% (62%)•Get vendor information: 61% 75%)• Get reviews and expert recommendations: 31% (43%)BibliographyAndre, A. D. and Wickens, C. D. (1995). When users want what's not best for them.Ergonomics in Design 4(4), 10-14.Baty, B. B. and Lee, R. M. (1995). InterShop: Enhancing the vendor/customer dialectic in electronic shopping.Journal of Management Information Systems 11(4), 9-31.GVU (Graphic, Visualization, & Usability Center) (1998). 9th WWW User Survey.Georgia Tech Research Corporation, Atlanta, GA.Lederer. A. L., Mirchandani, D. A., Sims, K. (1998). Using WISs to enhance muni-cations of the ACM 41(7), 94-95.Lohse, G. L. and Spiller, P. (1998). Electronic munications of the ACM 41(7), 81-87. Schaffer, E. M. (1998). How to design usable Web sites–3 day seminar.Human Factors International, Inc., Fairfield, IA, 52556.。
Improving Website Navigation with Mega Menus
Improving Website Navigation with MegaMenusIn today's digital age, having a user-friendly website is crucial for attracting and retaining visitors. One way to improve website navigation is by incorporating mega menus. Mega menus are large, multi-column menus that display navigation options in a structured and organized manner. By implementing mega menus, websites can enhance user experience, increase engagement, and ultimately drive conversion rates.One of the main benefits of using mega menus is that they provide a more visually appealing and organized way to display a large amount of content. Instead of overwhelming visitors with a long list of menu items, mega menus allow for a clean and structured layout that makes it easier for users to find the information they are looking for. This can significantly improve the overall user experience and encourage visitors to spend more time on your website.Another advantage of mega menus is that they can help reduce the number of clicks required to navigate through a website. With traditional drop-down menus, users may need to click through multiple levels of navigation to find what they are looking for. However, mega menus can display all relevant options in one panel, allowing users to quickly access the information they need without having to navigate through multiple pages.Furthermore, mega menus can also improve the accessibility of a website. By organizing content into categories and subcategories, users with disabilities or those using screen readers can easily navigate through the site and find the information they are looking for. This can help make your website more inclusive and user-friendly for all visitors.From a marketing perspective, mega menus can also be beneficial for increasing engagement and driving conversions. By highlighting key products or services in the mega menu, websites can showcase their most popular offerings and encourage visitorsto explore further. This can lead to increased click-through rates and ultimately drive more conversions.In conclusion, incorporating mega menus into your website can have a significant impact on improving navigation, enhancing user experience, and ultimately driving conversions. By providing a visually appealing and organized way for users to navigate through your site, mega menus can help make your website more user-friendly, accessible, and engaging. Consider implementing mega menus on your website to create a seamless and enjoyable browsing experience for your visitors.。
小b网站英语考研作文
小B网站英语考研作文：提升英语写作能力的新途径In the era of digitalization and information explosion, the internet has become an indispensable tool for students preparing for the English postgraduate entrance examination. Among the numerous online resources, Xiao B website stands out as a valuable platform for enhancing English writing skills. This article explores the role of Xiao B website in assisting students in their English writing preparation for the postgraduate entrance examination, analyzing its unique features and the strategies it offers to enhance writing proficiency.Firstly, Xiao B website provides a vast repository of writing materials and samples. Whether it's essay topics, writing templates, or sample essays, the website offers a comprehensive collection that caters to the needs of students preparing for the exam. These materials are carefully categorized and easily accessible, making it convenient for students to find relevant information quickly. Moreover, the samples are often written by expertsor high-scoring candidates, providing valuable insightsinto effective writing techniques and strategies.Secondly, Xiao B website offers personalized guidance and feedback. Unlike traditional textbooks or offline resources, the website allows students to submit their own writing samples and receive personalized feedback from experienced teachers or mentors. This feature isparticularly beneficial as it helps students identify their weaknesses and areas of improvement. The feedback is often detailed and constructive, providing specific suggestions for revision and enhancement.Thirdly, Xiao B website emphasizes the importance of practice and repetition. It encourages students to engage in regular writing exercises and provides a platform for them to share and discuss their work. This interactive approach not only enhances writing skills but also helps students develop a critical eye for evaluating and improving their own work. The website also hosts writing competitions and challenges, providing an additional incentive for students to hone their writing abilities.However, it's worth noting that while Xiao B website is a valuable resource, it should not be the sole source of preparation. Students should complement their online learning with offline reading, practice, and revision. Additionally, they should be mindful of the quality and authenticity of the information they find on the internet, as not all resources are created equal.In conclusion, Xiao B website is a powerful tool for students preparing for the English postgraduate entrance examination. It provides a wealth of writing materials, personalized guidance, and a platform for practice and interaction. By leveraging this resource effectively, students can significantly enhance their English writing skills and increase their chances of success in the exam. **小B网站英语考研作文：提升英语写作能力的新途径** 在数字化和信息爆炸的时代，互联网已成为考研英语备考学生不可或缺的工具。
考博英语-试卷268
考博英语-试卷268(总分：114.00，做题时间：90分钟)一、 Structure and Vocabulary(总题数：20，分数：40.00)1.The mayor was asked to______his speech in order to allow his audience to raise questions. （分数：2.00）A.constrainB.conductC.condense √D.converge解析：解析：C选项condense意为“精简，浓缩”。
根据句意“市长被要求缩短讲话，以便让他的听众提问”，故选C。
其他三项中，A选项constrain“限制”；B选项conduct“控制，实施”；D选项con—verge“聚集”，都不符合句意。
2.The new technological revolution in American newspapers has brought increased ______, a wider range of publications and an expansion of newspaper jobs.（分数：2.00）A.circulation √B.reproductionC.manipulationD.penetration解析：解析：A选项circulation意为“发行量”。
根据句意“美国报纸的新技术革命带来了发行量激增、覆盖面拓宽和对新闻工作者需求的增加”，故选A。
其他三项中，B选项reproduction“复制；生殖”；C 选项manipulation“操纵，控制”；D选项penetration“渗透”，都不符合句意。
3.If I had a car of my own, I______it to your sister yesterday.（分数：2.00）A.will lendB.would lendC.should lendD.would have lent √解析：解析：考查虚拟语气。
关于改进网站的英语作文
Title: Enhancing Website Experience for UsersIn the digital age, websites play a pivotal role in shaping our online experiences. As technology evolves and user preferences change, it's crucial for website owners to continually improve and enhance their platforms to meet the needs and expectations of their audience. Here are some strategies for enhancing a website:1. **User-Friendly Design**: The first step in improving a website is to ensure that it has a user-friendly design. This includes intuitive navigation, clear layout, and responsive design that adapts seamlessly to different devices and screen sizes. By making it easy for users to find what they're looking for, you can enhance their browsing experience and encourage them to stay longer on your site.2. **Optimized Content**: Content is king when it comes to attracting and retaining visitors to your website. Make sure that your content is relevant, informative, and engaging. Use high-quality images, videos, and graphics to enhance visual appeal, and optimize your content for search engines to improve visibility and attract organic traffic.3. **Fast Loading Speed**: In today's fast-paced world, users have little patience for slow-loading websites. To improve user experience, optimize your website's loading speed by minimizing unnecessary elements, compressing images, and leveraging browser caching.A fast-loading website not only improves user satisfaction but also boosts search engine rankings.4. **Mobile Optimization**: With an increasing number of users accessing the internet on mobile devices, it's essential to optimize your website for mobile responsiveness. Ensure that your website is mobile-friendly, with easy navigation, fast loading speed, and content that is legible and accessible on smaller screens. A mobile-optimized website not only improves user experience but also enhances your site's visibility in mobile search results.5. **Interactive Features**: Incorporating interactive features such as live chat, quizzes, polls, and interactive maps can help engage users and make their experience more enjoyable. Interactive elements encourage user interaction and foster a sense of community, keeping visitors coming back for more.6. **Feedback Mechanism**: Finally, it's essential to have a feedback mechanism in place to gather input from users and identify areas for improvement. Encourage users to provide feedback through surveys, contact forms, or social media channels, and use this information to make informed decisions about website enhancements.In conclusion, by focusing on user-friendly design, optimized content, fast loading speed, mobile optimization, interactive features, and feedback mechanisms, website owners can enhance the overall user experience and ensure that their website remains relevant and engaging in an increasingly competitive online landscape.。
英语作文-如何在互联网上获取最新的健康知识传播效果评估网络社区规划
英语作文-如何在互联网上获取最新的健康知识传播效果评估网络社区规划With the rapid development of the internet, it has become increasingly convenient for people to access and disseminate information. This is especially true when it comes to health knowledge. The internet has become a valuable resource for individuals seeking the latest information on health-related topics. In order to effectively evaluate the spread of health knowledge on the internet, it is essential to plan and implement a well-designed network community. In this article, we will discuss how to obtain the latest health knowledge on the internet and evaluate the effectiveness of its dissemination.Firstly, to obtain the latest health knowledge on the internet, it is important to follow reliable sources. There are numerous websites, blogs, and forums dedicated to health topics. However, not all of them provide accurate and up-to-date information. It is crucial to choose reputable sources such as government health agencies, renowned medical institutions, and trusted health professionals. These sources are more likely to provide reliable information that is based on scientific research and evidence.In addition to following reliable sources, it is also beneficial to join online health communities. These communities consist of individuals who share a common interest in health and wellness. By participating in such communities, individuals can exchange knowledge, discuss health-related topics, and learn from each other's experiences. Online health communities often have moderators who ensure the accuracy and quality of the information shared. This creates a supportive and trustworthy environment for individuals seeking the latest health knowledge.Furthermore, social media platforms can also be utilized to access the latest health knowledge. Many health organizations and professionals have accounts on platforms such as Facebook, Twitter, and Instagram. These platforms provide a convenient way to stay updated on the latest health news, research findings, and expert opinions. By following relevant accounts and hashtags, individuals can receive regular updates andengage in discussions with other users. However, it is important to critically evaluate the information shared on social media, as not all of it may be accurate or evidence-based.Now, let's discuss the evaluation of the dissemination of health knowledge on the internet. One way to assess the effectiveness of knowledge dissemination is through the analysis of website traffic and user engagement. By tracking the number of visitors, page views, and time spent on the website, one can gauge the level of interest and interaction with the health content. Additionally, monitoring user comments, likes, and shares can provide insights into the impact and relevance of the information shared.Another evaluation method is through surveys and feedback from the online community. By conducting surveys or soliciting feedback from users, it is possible to gather valuable insights on the usefulness and credibility of the health knowledge disseminated. This feedback can help identify areas for improvement and ensure that the information provided meets the needs and expectations of the target audience.Furthermore, monitoring the impact of health knowledge dissemination can be done through tracking health-related behaviors and outcomes. For example, by analyzing data on the adoption of healthy habits, changes in health indicators, and the prevalence of diseases, it is possible to assess the effectiveness of the information shared. This data can be collected through surveys, medical records, or even wearable devices that track individuals' health status.In conclusion, the internet provides a vast amount of health knowledge that can be accessed and disseminated. To obtain the latest health information, it is important to follow reliable sources, join online health communities, and utilize social media platforms. Evaluating the effectiveness of knowledge dissemination can be achieved through website traffic analysis, user engagement, surveys, feedback, and monitoring health-related behaviors and outcomes. By continuously improving the dissemination of health knowledge on the internet, we can contribute to the promotion of public health and well-being.。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Beat Gebistorf Enhancement of website usability for mobile phones/tag/top/Master ThesisNovember2010until May2011Professor:Prof.Dr.Roger WattenhoferAdvisor ETH:Samuel WeltenAdvisors Namics AG:Johannes Waibel,Damian Amherd&Roman ZolletIIAbstract2009more than half of the Internet users accessed the web with a mobile phone[6].Nonetheless,in March201179%of Google's largest advertisers did not provide a mobile optimised website[31]which would be necessary to be useful for mobile phones.Desktop versions of websites are not use-ful for mobile phones as they are developed for a di erent context.Mobile phones have smaller screens,worse input methods,and a lower bandwidth than desktop PCs.Additionally,mobile phones are used on the go. Hence,mobile phones need websites which are optimised for them to get the best usability.To face the huge potential of optimising websites for mobile phones this master thesis provides two approaches:one approach ad-dresses the development of mobile websites which can be assisted with a mobile JavaScript framework whereas the other approach modi es existing websites according to the user's need with a proxy.Both approaches enhance the usability of websites for mobile phones at two di erent points.The rst approach concerns the development of websites.Therefore ve mobile JavaScript frameworks were evaluated which support mobile op-timised website development.jQuery Mobile as the best one was taken to carry out a reference implementation.The reference implementation showed that one can imitate the native Helvetia Notfall-App application with a mo-bile website without many constraints.The second approach concerns the delivery of an existing website between the server and the client device.Hereby a proxy modi es websites on behalf of the mobile phone and delivers the optimised content to the client afterwards.A prototype of a mobile proxy called MOCUSI was implemented in this thesis.It allows mobile phone users to view an arbitrary website with customised modi cations applied.Finally a usability test was conducted to verify the usability of the proxy solution.It showed that50% of the tested persons would use a system like MOCUSI in the future.25% would even use it daily.IIIKurzbeschriebIm Jahre2009gri en mehr als die Hälfte der Internetnutzer via Mobil-telefon auf das Web zu[6].Trotzdem verfügten im März201179%der grössten Werbekunden von Google nichtüber eine mobil optimierte Webseite [31],welche nötig wäre,um auf Mobiltelefonen nützlich zu sein.Desktop Ver-sionen von Webseiten sind nicht nützlich für Mobiltelefone da sie für einen anderen Kontext entwickelt wurden.Mobiltelefone besitzen kleinere Bild-schirme,schlechtere Eingabemethoden und weniger Bandbreite als Desktop PCs.Zudem werden Mobiltelefone unterwegs eingesetzt.Daher benötigen Mobiltelefone optimierte Webseiten um die beste Benutzer-freundlichkeit zu erreichen.Um das grosse Potenzial von optimierten Webseiten für Mobiltelefone zu nutzen,untersucht diese Masterarbeit zwei Vorgehensweisen:die eine betri t die Entwicklung von Webseiten für Mobiltelefone,welche durch JavaScript Programmier-umgebungen für Mobiltelefone untersützt werden kann,die andere verändert vorhandene Webseiten gemäss den Bedürfnissen des Be-nutzers mit einem Proxy.Beide Ansätze verbessern die Benutzer-freundlichkeit von Webseiten für Mobiltelefone an unterschiedlichen Stellen. Der erste Ansatz betri t die Entwicklung von Webseiten.Dazu wurden in dieser Arbeit fünf JavaScript Programmierumgebungen für Mobil-telefone evaluiert,welche die Entwicklung von mobil optimierten Webseiten unterstützen.jQuery Mobile,der Evaluationssieger,wurde gewählt um eine Referenzimplementation durchzuführen.Die Referenzimplementation zeigte, dass man mit wenigen Einschränkungen die native Helvetia Notfall-App Applikation mithilfe einer Webseite für Mobiltelefone imitieren kann.Der zweite Ansatz betri t die Auslieferung existierender Web-seiten zwischen dem Server und dem Mobiltelefon.Dabei verändert ein Proxy Webseiten stellvertretend für ein Mobiltelefon und liefert den op-timierten Inhalt an den Benutzer aus.MOCUSI,ein Proxy Prototyp,wurde in dieser Arbeit implementiert.MOCUSI erlaubt es Nutzern von Mobil-telefonen beliebige Webseiten mit benutzerde nierten Modi kationen an-zuzeigen.Zum Schluss wurde eine Nutzerstudie durchgeführt um die Akzep-tanz von MOCUSI zu bestätigen.Die Studie zeigte dass50%der Testper-sonen ein System wie MOCUSI in Zukunft nutzen würden.25%gar täglich.IVAcknowledgementsI will thank rst and foremost my wife,family and friends for their support. Furthermore,I thank my advisors for their helpful advices,constructive dis-cussions,and prompt revisions.I will also thank all tested persons who agreed to attend the usability test of MOCUSI:Irina Gebistorf,Hendrik Grahl,Alex Maier,Manuela Lauchenauer,Mar-tin Schilliger,Ernst Ammann,Fredi Wiedmer,Denis Skeledzic,Prof.Dr. Wattenhofer,Jasmin Smula,Claude Hohl,and Marlis Gebistorf.VVIContents1Introduction11.1Internet on Mobile Phones (1)1.2Mobile Optimised Websites (2)1.3Thesis Foundation (2)1.4Outline (4)2Mobile World52.1Mobile Phones (5)2.2Mobile Phone History (6)2.3Mobile vs.PC (8)2.4Mobile Internet (9)2.4.1The Internet (9)2.4.2Mobile Internet Terms (9)2.4.3Native Application vs.Mobile Website (10)2.4.4Mobile Optimised Websites (12)2.4.5Mobile Website Development (12)2.4.6Web Application Features (15)3Related Work193.1Mobile Website Usability (19)3.1.1Key Problems (20)3.1.2Guidelines (20)3.1.3Website Adaptation (22)3.2Mobile JavaScript Framework(MJF) (24)VII3.3Mobile Proxy (25)4Mobile JavaScript Framework(MJF)274.1MJF Evaluation Criteria (28)4.1.1Criteria De nition (28)4.1.2Unweighted Evaluation (31)4.2Project Speci c Evaluation (31)4.2.1Speci cation (31)4.2.2Criteria Weighting (33)4.2.3Weighted Evaluation (36)4.3Reference Implementation (36)4.3.1Application Concept (36)4.3.2Application Implementation (37)4.3.3Result (38)4.4Recapitulation (39)4.4.1Achievements (39)4.4.2Insights (40)5Mobile Proxy Solution MOCUSI415.1Concept (41)5.2Implementation (48)5.2.1Proxy Side (48)5.2.2Client Side (49)5.2.3Remaining Issues (51)5.2.4Injection Example (51)5.3Usability Test (52)5.3.1Test Con guration (52)5.3.2Result Summary (54)5.4Recapitulation (54)5.4.1Achievements (55)5.4.2Insights (55)VIII6Conclusion576.1Summary (57)6.1.1Achievements (57)6.1.2Insights (59)6.2Future Work (59)A MJF Evaluation:Property Lists61B Reference Implementation67B.1HTML (67)B.2JavaScript (68)B.3CSS (69)B.4Images (69)C Usability Test Sheet71IXList of Tables4.1Unweighted MJF Evaluation (32)4.2Weighted MJF Evaluation (35)A.1JQuery Mobile Properties (62)A.2Sencha Touch Properties (63) Properties (64)A.4Wink Toolkit Properties (65)A.5Jo HTML5Web Apps Properties (66)XList of Figures2.1Evolution of mobile web-related markup languages (8)2.2Optimised website (12)2.3Medium optimised website (12)2.4Not optimised website (12)3.1Website adaptation categories according to Bickmore et al (23)4.1Helvetia start screen (36)4.2Helvetia card information (37)4.3Helvetia map (38)5.1MOCUSI work ow (45)5.2MOCUSI start screen (45)5.3Adaptation modes (45)5.4Custom con gurations (45)5.5Website preview (46)5.6Save bookmark (46)5.7Bookmark list (46)5.8Edit bookmark (46)5.9Add CSS or JS les (46)5.10Information screen (46)5.11Original worldatlas website (52)5.12Worldatlas website with CSS and JavaScript le injection..52XIXII1Introduction"...625million people are exclusively using only a mobile phone to access internet content."(Tomi Ahonen,2011)[6]"Only21%of Google's largest advertisers have a website that is optimized for mobile."(Google Mobile Ads Blog,2011)[31]9%of the world population use exclusively mobile phones to access Internet content.Nonetheless,many websites do not provide a mobile version to enhance the usability of the website for mobile phones.Just one in ve of Google's largest advertisers does so.This thesis will address this problem and will show solutions to enhance the usability of websites for mobile phones.1.1Internet on Mobile Phones"The Internet is by far the most popular source of information..."[51].The Internet is the6th mass media after print,recordings,cinema,radio,and tv.Mobile is labelled as the7th mass media.Amazingly,the mobile media grows by far faster than the rst six mass media did[5]."54%of all people alive on the planet have a mobile phone"[6].Tomi Aho-nen stated that there are more mobile phone subscriptions than people who use toothbrushes."Today in US and Western Europe,90percent of mobile subscribers have an Internet-ready phone"[44].Mobile phones with Internet access combine the12CHAPTER1.INTRODUCTION last two mass media to achieve mobility in conjunction with the popularity of information fetching from the web.1.2Mobile Optimised WebsitesDespite the technological improvements and the growing mobile market many websites provide still just a desktop optimised version.Before2007this was the most meaningful way to go as mobile devices had signi cant limitations and were at most able to display extremely reduced versions of a website.This changed in2007as the iPhone was released and allowed to browse web-sites in a feasible way by allowing zooming and scrolling of websites.Hence, websites became useable although not really useful.Nonetheless,desktop versions of websites are not useful for mobile phones as they are developed for a di erent context.Mobile phones in contrast to desktop PCs are mobile,have a small screen,limited input methods and a lower bandwidth.Much of the provided content and layout of desktop websites constrain mobile phone users more than they help.Es-pecially by stressing the network connection.In the years after the rst iPhone was released mobile phones with Internet access gained importance[44].At the same time native applications became very popular.Native applications were developed speci cally for a mobile phone and its context.They were not just useable but also useful. Consequently,users preferred using native applications and not websites if they had to choose.But native applications have an important drawback. They are platform dependent.1.3Thesis FoundationWe think that mobile optimised websites bear a huge potential if they com-bine the cross platform compatibility of websites with the usability of na-tive application's user interface and general mobile usability considerations. Hence this master thesis focuses on mobile websites and to enhance their usability.1.3.THESIS FOUNDATION3GoalsThe goals of the thesis are as follows:•Providing guidance for mobile website developers to enhance the us-ability of websites for mobile phones.•Providing a solution for users to enhance the usability of existing web-sites on mobile phones.ApproachesThere are two possible approaches to enhance the usability of websites for mobile phones.Either to generate mobile websites from the beginning or to modify existing websites.Development The rst approach handles the development of a website and starts at the source where the website is generated.The enhancement of usability can hereby be achieved by following guidelines at developing the website.Such guidelines are described in Section3.1.2. Furthermore,frameworks are available which help developing websites to enhanced usability for mobile phones(see Chapter4).The reference implementation at the end of Chapter4shows how far a speci c native application can be imitated with the help of a framework.Delivery The second approach handles the delivery and rendering of an existing website.Websites can be modi ed on their way from the server to the client by a proxy or by the client itself.These modi cations of the website are applied to enhance the usability for the client mobile phone. As heavy website modi cations are computing intensive and proxies have enough computation power one should prefer proxy solutions.A prototype proxy solution called MOCUSI1was implemented within this thesis and is explained in Chapter5.Expected resultsWe expect that this thesis will provide the following results:•A listing of guidelines to enhance the usability of websites for mobile phones.1MOCUSI stands for MObile CUstomised webSItes.4CHAPTER1.INTRODUCTION •An evaluation of state of the art frameworks which is reusable for future projects.•A reference implementation with the best evaluated framework showing that a speci c native application can be imitated as a web application without many constraints.•A proxy implementation which allows users of mobile phones to cus-tomise existing websites according to their needs.•A usability test which veri es the usefulness of the proxy implementa-tion for mobile phone users.1.4OutlineIn the following this thesis provides details and facts concerning the world of mobile phones in Chapter2.Chapter3discusses related work.It introduces the usability guidelines used within the thesis,lists a categorisation of website adaptation approaches and describes the improvements this thesis provides compared to related work. In Chapter4the most popular Mobile JavaScript Frameworks(MJF)are evaluated.The framework with the best score is taken to realise a reference implementation.The reference implementation mimics the existing Helvetia Notfall-App2and identi es how well a website can mimic a speci c native application.Chapter5explains the mobile proxy implementation MOCUSI which en-hances website usability for mobile phones by modifying existing websites. The chapter furthermore describes the conducted usability test of MOCUSI. Finally Chapter6concludes the thesis by summarising the achievements and insights and list possible future work at the end.2Helvetia is a Swiss insurance agency.The app helps in emergency situations.More information on http://www.helvetia.ch/service/mobile/iphone-app.html.2Mobile World"Fundamentally,'mobile'refers to the user,and not the device or the appli-cation."(Barbara Ballard,Designing the Mobile User Experience,2007) The following chapter will role up the world of mobile phones and introduce the most important facts related to the thesis.2.1Mobile PhonesThis thesis discusses the enhancement of mobile website usability.The topic can be applied to various mobile devices from Internet capable wristwatches to full featured laptops which would be out of scope of a master thesis. Therefore the scope is narrowed to mobile phones.In this thesis mobile phones are de ned as portable cell phones which t in a trouser pocket.Mobile phones are chosen because more than half of all people have one[6] and because of the limitations they nonetheless have compared to desktop PCs.Hence tablets and netbooks are less challenging because they are more similar to desktop PCs.Although tablets and netbooks are not covered in this thesis the approaches to enhance usability of websites for them can also be derived from this thesis. The main di erences are the fewer constraints,e.g.tablet screen sizes are generally not much smaller than of PC screens.The capabilities and features of modern mobile phones enable their user to56CHAPTER2.MOBILE WORLD handle appointments,tasks,messages,take photos,navigate through cities, play games,make phone calls,and browse the Internet.90%of mobile subscribers in the US and Western Europe have an Internet ready phone [44].The awareness of users for the help mobile phones provide for daily life was enforced by the appearance of the iPhone in the year2007[22].The importance of mobile phones gets con rmed by some impressive numbers from Tomi Ahonen in[6]this year:•About6.9billion people are alive.•5.2billion active mobile phone accounts exist.•"54%of all people alive on the planet have a mobile phone."•In2010the mobile telecommunication industry generated$1.2trillion.•According to Ahonen,80%of all2.0billion Internet users access In-ternet content exclusively with their mobile phone or in combination with a PC.31%use exclusively a mobile phone to access the Internet.2.2Mobile Phone HistoryThe mobile phone history started in the year1973with the rst handheld cellular phone.In the following,the eras and important dates are listed according to[22].•1973-1988:In the brick era the rst cordless and portable telephones appeared.They had to be carried in suitcases.•1979:The rst generation(1G)network was launched in Japan by NTT as the rst commercially automated cellular network.It based on analog transmissions.•1988-1998:In the candy bar era long,thin,rectangular mobile phones appeared which were small enough to t in a pocket.Candy bar phones were capable of using the Short Message Service(SMS).These phones are often associated with2G and Global System for Mobile Communications(GSM)networks.•1991:The2G network introduced a new way to communicate with SMS text messages.It is based on digital transmissions.•1996:Nokia9000Communicator was the rst mobile phone with the capability to access the Internet.2.2.MOBILE PHONE HISTORY7•1998:The rst Wireless Application Protocol(W AP)1.0standard was released.WAP browsers are browsers for small mobile devices.WAP1.x bases on the Wireless Markup Language(WML)(see Figure2.2).Standard Internet websites need to be"translated"by a proxyin WML to be viewable on WAP browsers.•1998-2008:In the feature phone era mobile devices got new fea-tures like listening to music,taking photos,and using the Internet.In this era GSM was extended with General Packet Radio Service (GPRS),which is most often referred to as2.5G.With the feature phones the Internet reached mobile devices.But no one used it due to high prices,poor marketing,and inconsistent rendering.•2001:The3G network can mainly be distinguished from2G by its use of packet switching rather than circuit switching for data transmission.The higher connection speed of3G allows media streaming of radio or even television content.•2002:Release of W AP 2.0which uses XHTML Mobile Pro le,a subset of the Extensible Hypertext Markup Language(XHTML).•2002-today:The smartphone era overlaps the previous and follow-ing era.Smartphones are similar to feature phones but are equipped with a common operating system,a larger screen size,a QWERTY keyboard or stylus for input,and Wi-Fi or another form of high-speed wireless connectivity.•2007-today:The touch era started with the introduction of the iPhone.The phones of the touch era changed the everyday perception of the mobile phone usability and capabilities entirely.Mobile phones got an own identity and separated themselves from phones and com-puters.Applications and services appeared which would neither for landline phones nor for desktop computers make sense,e.g.location based phone call to the next restaurant."In less than a year,more than 2,000mobile web applications were made freely available speci cally for the iPhone"[22].•future:The4G network will be introduced to provide a higher data rate.No commercial implementation has yet achieved the target speed of100Mbps to qualify for the4G label.Touch phones Mobile phones featured with touchscreens are in the fol-lowing called touch phones.Gartner predicts that in the year201358%of the sold mobile devices will be equipped with a touchscreen[17].The growing request for touch phones can be seen in the continuous growing market share8CHAPTER2.MOBILE WORLDFigure2.1:Evolution of mobile web-related markup languages(from David Hö er,GNU licence).Since2007HTML5gained importance although it still has draft status.of iPhones and Android phones which are all equipped with touchscreens.[44]2.3Mobile vs.PCThe bene ts of mobile phones compared to desktop PCs are their •size and weight which make them portable,•context aware usage on the go,e.g.location detection on a mountain hike,•short or no boot time which facilitates quick searches,and•feature connections,e.g.searching the nearest Hotel and start a phone call to it.Mobile phones also have some important drawbacks compared to desktop PCs.They have•a smaller screen size,•only a few websites optimised for mobile phones,•reduced input methods(small or no QWERTY keyboard etc.),2.4.MOBILE INTERNET9•less bandwidth,•smaller storage,and•less processing power.Summarising the pros and cons mobile phones bene t from mo-bility and quick context aware usage with the drawback of worse information processing and visualisation rmation is most useful for mobile users if the previously mentioned pros and cons are considered.If information does not utilise the bene ts and treat the draw-back of the mobile context many users will wait until they have access to a desktop device.2.4Mobile Internet2.4.1The InternetA main service of the Internet is to provide websites.The words web and Internet are used exchangeable in the following.Websites base on data tra c handled by the Hypertext Transfer Protocol (HTTP).The data can contain di erent Internet Media Types(MIME-Type) whereas the most important are text,image,video,audio,and applications. The implementation of a website consists mainly of a Hypertext Markup Language(HTML)which structures the content.To additionally provide style or behaviour de nitions Cascading Style Sheet(CSS)and JavaScript (JS)statements are used respectively.HTML5and CSS3are drafts of the World Wide Web Consortium(W3C). The drafts propose extensions and updates to the previous versions.They alleviate the development of website for di erent platforms and browsers.2.4.2Mobile Internet TermsWebsites optimised for modern mobile phones base on the same languages (HTML,CSS,JS)as"normal"websites.Hence mobile optimised websites di er not in the technology but in the way they behave and they are styled. This does not hold for older mobile phones which based on WAP1.x and WML.Websites optimised for modern mobile phones are in the following called mobile websites.The meaning of websites and web pages di ers within this thesis.A website refers to a web appearance of a domain which may contain various web pages.A web page is constricted by visually connected content.After a link navigation a page load leads to a new web page which may be on the10CHAPTER2.MOBILE WORLD same website.Optimising a website means to modify or to adapt it to a device or a context.Desktop optimised websites are websites which were developed with desktop PCs in mind.Website usability refers to the user friendliness of a website under the given circumstances.E.g.mobile website usability has to consider small screens and limited input methods.Website usability is described in more detail in Section3.1.A web application(web app)is a form of a website.A web app has an application nature and has to interact with the user.A website in contrast can only show content without interaction elements.The terms website and web app are used exchangeable in the following.2.4.3Native Application vs.Mobile WebsiteBeside browsing websites modern mobile phones allow to install native ap-plications(native apps).Native apps are compiled programs which have to be downloaded and in-stalled on a device to use them.They are developed for a speci c platform like iOS or Android and use the platform speci c API.Bene ts:•Able to access device sensors and interfaces like a camera,a gyrosensor1 or a light sensor.•Can run o ine if no new data has to be fetched.•Their look and feel is generally snappier than on websites.•New content can be loaded via the Internet.Drawbacks:•Not cross platform compatible.•New applications are controlled by app market authorities.•Application updates are controlled by app market authorities.•Some app markets even dictate an approval process for new applica-tions or updates of applications.1Orientation sensor to measure direction changes.2.4.MOBILE INTERNET11 Mobile websites are platform independent and can be used by all mobile phones containing a browser.Bene ts:•Cross platform compatible.•Able to access a subset of device's sensors and interfaces.They areto detect orientation changes between landscape and portrait,loca-tion detection if the phone is featured with GPS2,and using the localstorage.•With the HTML5application cache it is possible to run a websiteo ine.Drawbacks:•Limited access to sensors and interfaces of devices.•Slower animations and transitions.•Slower execution.The focus of the thesis will be on mobile websites based on the following reasons:•Mobile websites allow to browse the whole web without installationprocesses in between.•Mobile websites are cross platform compatible and only needs to beimplemented once for all devices.Native apps in contrast are mainlybased on speci c programming languages like Java(Android)or Objective-C(iOS).•Mobile websites can easily be updated without running through anacceptance process in contrast to native apps in app store markets.•Mobile website are useful to fetch a one time information and do notrequire to download and install a native app.This can be illustratedwith the airport ight ers will not install an airportight information app if they y twice a year.They will rather visitthe website.•Mobile websites cover all devices containing a web browser.2Global Positioning System12CHAPTER 2.MOBILE WORLD2.4.4Mobile Optimised WebsitesInformation is spread over the Internet in various forms.Websites,blogs,RSS feeds and many more.Gartners reviews let assume that in the future mobile phones will be a main audience of this information.Despite this trend one can observe that only a small amount of websites is optimised for mobile phones.Unfortunately even some of the seemingly mobile optimised websites are hard to read on small screens or hard to control with the limited input methods of mobile devices.In the following pictures one can see the di erences be-tween a page optimised for mobile phones in Figure 2.2,one with a medium optimisation in Figure 2.3and one that is not optimised in Figure 2.4.Figure 2.2:Optimised website Figure 2.3:Medium optimised website Figure 2.4:Not opti-mised website Most websites optimised for desktop screens are not well usable on mo-bile phones because they were designed for large size screens,full featuredbrowsers e.g.with ash support,and advanced input methods.Too largely sized websites generate much data tra c and will visually either be scaled down by mobile browsers or one has to scroll horizontally and ver-tically or part of the content are cut away.Unsupported content resources like ash or other formats will just be ignored by most mobile browsers or cause an error.To many form elds will upset the user because of awkward input methods.Although many users are used to the situation of websites not being opti-mised for mobile phones,it constrains the usability on mobile phones.2.4.5Mobile Website DevelopmentThere exist several approaches to develop a mobile optimised website.。