ABSTRACT
Mobile devices have become a primary means of accessing the Internet. Unfortunately, many websites are not designed to be mobile friendly. This results in problems such as unreadable text, cluttered navigation, and content overflowing a device's viewport; all of which can lead to a frustrating and poor user experience. Existing techniques are limited in helping developers repair these mobile friendly problems. To address this limitation of prior work, we designed a novel automated approach for repairing mobile friendly problems in web pages. Our empirical evaluation showed that our approach was able to successfully resolve mobile friendly problems in 95% of the evaluation subjects. In a user study, participants preferred our repaired versions of the subjects and also considered the repaired pages to be more readable than the originals.
- StackOverflow Search --- Mobile Friendly Problems with Bootstrap. Retrieved Aug 2017 from https://stackoverflow.com/search?q=bootstrap+mobile+problemGoogle Scholar
- Abdulmajeed Alameer, Sonal Mahajan, and William G.J. Halfond. 2016. Detecting and Localizing Internationalization Presentation Failures in Web Applications. In Proceeding of the 9th IEEE International Conference on Software Testing, Verification, and Validation (ICST).Google Scholar
- Alexa. 2017. Alexa Top 50 Websites by Category. Retrieved Aug 2017 from https://www.alexa.com/topsites/categoryGoogle Scholar
- Bing. 2017. Bing Mobile Friendly Test Tool. Retrieved Aug 2017 from https://www.bing.com/webmaster/tools/mobile-friendlinessGoogle Scholar
- bMobilized. 2017. bMobilized Website. Retrieved Aug 2017 from http://bmobilized.com/Google Scholar
- Browserstack. 2017. BrowserStack for Testing Mobile Websites. Retrieved Aug 2017 from https://www.browserstack.com/Google Scholar
- Deng Cai, Shipeng Yu, Ji-Rong Wen, and Wei-Ying Ma. 2003. VIPS: a Vision-based Page Segmentation Algorithm. Technical Report.Google Scholar
- Deepayan Chakrabarti, Ravi Kumar, and Kunal Punera. 2008. A Graph-theoretic Approach to Webpage Segmentation. In Proceedings of the 17th International Conference on World Wide Web (WWW '08). Google ScholarDigital Library
- Shauvik Roy Choudhary, Mukul R. Prasad, and Alessandro Orso. 2012. Cross-Check: Combining Crawling and Differencing to Better Detect Cross-browser Incompatibilities in Web Applications. In Proceedings of the IEEE Fifth International Conference on Software Testing, Verification and Validation (ICST). IEEE Computer Society, Washington, DC, USA, 171--180. Google ScholarDigital Library
- Chrome. 2017. Chrome Reader Mode. Retrieved Aug 2017 from https://github.com/chromium/dom-distillerGoogle Scholar
- Duda. 2017. Duda Website. Retrieved Aug 2017 from https://www.dudamobile.com/Google Scholar
- eMarketer. 2017. Estimates for Digital Users. Retrieved Aug 2017 from https://www.emarketer.com/Article/eMarketer-Releases-Updated-Estimates-US-Digital-Users/1015275Google Scholar
- Firefox. 2017. Firefox Reader Mode. Retrieved Aug 2017 from https://support.mozilla.org/en-US/kb/firefox-reader-view-clutter-free-web-pagesGoogle Scholar
- Google. 2017. Google Mobile Friendly Problem Types. Retrieved Aug 2017 from https://support.google.com/webmasters/answer/6352293Google Scholar
- Google. 2017. Google Mobile Friendly Test Tool. Retrieved Aug 2017 from https://search.google.com/test/mobile-friendlyGoogle Scholar
- Google. 2017. Google PageSpeed Insights Tool. Retrieved Aug 2017 from https://developers.google.com/speed/pagespeed/insights/Google Scholar
- Google. 2017. Google Search Ranking based on Mobile Friendliness. Retrieved Aug 2017 from https://support.google.com/adsense/answer/6196932?hl=enGoogle Scholar
- Google. 2017. Google Study for Mobile Usage. Retrieved Aug 2017 from https://developers.google.com/search/mobile-sites/Google Scholar
- Google. 2018. Consumer Study. Retrieved Feb 2018 from https://www.consumerbarometer.com/en/insights/?countryCode=USGoogle Scholar
- Google. 2018. Content Sizing. Retrieved Feb 2018 from https://developers.google.com/web/fundamentals/design-and-ux/responsive/Google Scholar
- Sonal Mahajan. 2017. MF<scp>ix</scp> Project. Retrieved Aug 2017 from https://github.com/USC-SQL/mfixGoogle Scholar
- Sonal Mahajan, Abdulmajeed Alameer, Phil McMinn, and William G.J. Halfond. 2017. Automated Repair of Layout Cross Browser Issues using Search-Based Techniques. In Proceedings of the 26th International Symposium on Software Testing and Analysis (ISSTA). Google ScholarDigital Library
- Sonal Mahajan, Abdulmajeed Alameer, Phil McMinn, and William G.J. Halfond. 2017. XFix: Automated Tool for Repair of Layout Cross Browser Issues. In Proceedings of the 26th International Symposium on Software Testing and Analysis (ISSTA) - Tool Track. Google ScholarDigital Library
- Sonal Mahajan and William G. J. Halfond. 2014. Finding HTML Presentation Failures Using Image Comparison Techniques. In Proceedings of the 29th IEEE/ACM International Conference on Automated Software Engineering (ASE) - New Ideas track. Google ScholarDigital Library
- Sonal Mahajan and William G. J. Halfond. 2015. Detection and Localization of HTML Presentation Failures Using Computer Vision-Based Techniques. In Proceedings of the 8th IEEE International Conference on Software Testing, Verification and Validation (ICST).Google Scholar
- Sonal Mahajan and William G. J. Halfond. 2015. WebSee: A Tool for Debugging HTML Presentation Failures. In Proceedings of the 8th IEEE International Conference on Software Testing, Verification and Validation (ICST) - Tool track.Google Scholar
- Sonal Mahajan, Bailan Li, Pooyan Behnamghader, and William G. J. Halfond. 2016. Using Visual Symptoms for Debugging Presentation Failures in Web Applications. In Proceedings of the 9th IEEE International Conference on Software Testing, Verification and Validation (ICST).Google Scholar
- Sonal Mahajan, Bailan Li, and William G. J. Halfond. 2014. Root Cause Analysis for HTML Presentation Failures Using Search-based Techniques. In Proceedings of the 7th International Workshop on Search-Based Software Testing (SBST). Google ScholarDigital Library
- Mobify. 2017. Mobify Website. Retrieved Aug 2017 from https://www.mobify.com/Google Scholar
- Mobilifyit. 2017. Mobilifyit Website. Retrieved Aug 2017 from http://www.mobilifyit.com/Google Scholar
- Hung Viet Nguyen, Hoan Anh Nguyen, Tung Thanh Nguyen, and Tien N.Nguyen. 2011. Auto-locating and Fix-propagating for HTML Validation Errors to PHP Server-side Code. In Proceedings of the 2011 26th IEEE/ACM International Conference on Automated Software Engineering (ASE). IEEE Computer Society, Washington, DC, USA, 13--22. Google ScholarDigital Library
- Pavel Panchekha and Emina Torlak. 2016. Automated Reasoning for Web Page Layout. In Proceedings of the ACM SIGPLAN International Conference on Object-Oriented Programming, Systems, Languages, and Applications (OOPSLA). Google ScholarDigital Library
- Richard Romero and Adam Berger. 2004. Automatic Partitioning of Web Pages Using Clustering. In Proceedings of Mobile Human-Computer Interaction - MobileHCI 2004: 6th International Symposium.Google ScholarCross Ref
- Shauvik Roy Choudhary, Mukul R. Prasad, and Alessandro Orso. 2013. X-PERT: Accurate Identification of Cross-browser Issues in Web Applications. In Proceedings of the 2013 International Conference on Software Engineering (ICSE). 702--711. Google ScholarDigital Library
- Shauvik Roy Choudhary, Husayn Versee, and Alessandro Orso. 2010. WEBDIFF: Automated Identification of Cross-browser Issues in Web Applications. In Proceedings of the IEEE International Conference on Software Maintenance (ICSM). 1--10. Google ScholarDigital Library
- Safari. 2017. Safari Reader Mode. Retrieved Aug 2017 from https://en.wikipedia.org/wiki/Safari_(web_browser)Google Scholar
- Hesam Samimi, Max Schäfer, Shay Artzi, Todd Millstein, Frank Tip, and Laurie Hendren. 2012. Automated Repair of HTML Generation Errors in PHP Applications Using String Constraint Solving. In Proceedings of the International Conference on Software Engineering (ICSE). 277--287. Google ScholarDigital Library
- AndrÃl's Sanoja and StÃiphane GanÃğarski. 2014. Block-o-Matic: A web page segmentation framework. In Proceedings of the International Conference on Multimedia Computing and Systems (ICMCS).Google ScholarCross Ref
- SauceLabs. 2017. SauceLabs for Testing Mobile Websites. Retrieved Aug 2017 from https://saucelabs.com/Google Scholar
- Statcounter. 2017. Mobile Market Share. Retrieved Aug 2017 from http://gs.statcounter.com/platform-market-share/desktop-mobile/worldwide/#monthly-201407-201707Google Scholar
- Michael Tamm. 2009. Fighting layout bugs. https://code.google.com/p/fighting-layout-bugs/.Google Scholar
- Thomas Walsh, Gregory Kapfhammer, and Phil McMinn. 2017. Automated Layout Failure Detection for Responsive Web Pages without an Explicit Oracle. In Proceedings of the 26th International Symposium on Software Testing and Analysis (ISSTA). Google ScholarDigital Library
- Thomas A. Walsh, Phil McMinn, and Gregory M. Kapfhammer. 2015. Automatic Detection of Potential Layout Faults Following Changes to Responsive Web Pages. In International Conference on Automated Software Engineering (ASE). ACM, 709--714.Google Scholar
- Xiaoyin Wang, Lu Zhang, Tao Xie, Hong Mei, and Jiasu Sun. 2010. Locating Need-to-Translate Constant Strings in Web Applications. In Proceedings of the Eighteenth ACM SIGSOFT International Symposium on Foundations of Software Engineering (FSE '10). Google ScholarDigital Library
- Xiaoyin Wang, Lu Zhang, Tao Xie, Yingfei Xiong, and Hong Mei. 2012. Automating Presentation Changes in Dynamic Web Applications via Collaborative Hybrid Analysis. In Proceedings of the ACM SIGSOFT 20th International Symposium on the Foundations of Software Engineering (FSE). ACM, New York, NY, USA, 16:1--16:11. Google ScholarDigital Library
- WompMobile. 2017. WompMobile Website. Retrieved Aug 2017 from http://www.wompmobile.com/Google Scholar
Index Terms
- Automated repair of mobile friendly problems in web pages
Recommendations
Automated repair of layout cross browser issues using search-based techniques
ISSTA 2017: Proceedings of the 26th ACM SIGSOFT International Symposium on Software Testing and AnalysisA consistent cross-browser user experience is crucial for the success of a website. Layout Cross Browser Issues (XBIs) can severely undermine a website’s success by causing web pages to render incorrectly in certain browsers, thereby negatively ...
Automatic Usability Evaluation of Mobile Web Pages with XML
Recently, mobile browsing on the World Wide Web is growing rapidly. The growth has created a surge in the number of Web pages designed for mobile devices. To increase the usability of mobile browsing, the Mobile Web Best Practices have been proposed to ...
XFix: an automated tool for the repair of layout cross browser issues
ISSTA 2017: Proceedings of the 26th ACM SIGSOFT International Symposium on Software Testing and AnalysisDifferences in the rendering of a website across different browsers can cause inconsistencies in its appearance and usability, resulting in Layout Cross Browser Issues (XBIs). Such XBIs can negatively impact the functionality of a website as well as ...
Comments