A summer internship project report on Design and Implementation of Framework for Bank s Mobile Websites Carried out at Institute for Development and Research in Banking Technology During th May 5 th July, Submitted By: Kanojia Sushil Kumar Ramashankar B-Tech (Computer Science and Engineering), Final Year Admission no. JE Indian School of Mines Dhanbad, Jharkhand - 86 Under the Guidance of Dr. V. N. Sastry Professor IDRBT, Hyderabad. Date of Submission: 5th July,
ABSTRACT Mobile banking is the system to perform banking related financial tasks through mobile phones or tablets. Mobile banking can be done through SMS, Web apps or Mobile Websites. It is inefficient to have different bank apps or remember their SMS code, so there is a need of common mobile website framework through which banks can come closer to customers. Currently there are different mobile website and application frameworks present in the web industry, but they lack some features like portability, connectivity oriented content delivery, responsive to all mobile devices independent of device type, optimizations and so on. Till now, neither any initiative nor any specific mobile banking related framework has been developed, to satisfy the customer needs for mobile banking through compatible mobile websites, keeping this thing in mind the project work has been carried out. In this project work, the main objective is to overcome these shortcomings, to design mobile banking oriented framework and implement the same. The project initially explains the identification of different problems faced by the Indian public sector banks and some private sector banks like ICICI and HDFC banks in their websites through analysis of their mobile/normal web pages. In subsequent to this, recommendations are proposed to overcome these issues and in order to do so a mobile framework has been proposed and designed which takes cares of these issues. The implementation of designed framework is presented briefly in the later section. The project work is concluded with advantages of the designed framework and future works to be done in order to improve the framework and embed extra features to it, thus increasing its usability at different levels. P a g e
CERTIFICATE This is to certify that the report entitled Design and Implementation of Framework for Bank s Mobile Websites submitted by Kanojia Sushil Kumar Ramashankar, JE, B-Tech (Computer Science and Engineering) - Final Year, Indian School of Mines, Dhanbad, Jharkhand to Institute of Development and Research in Banking Technology (IDRBT) is a bonafide work carried out by him under my supervision and guidance. Date: Project Guide Dr. V.N.Sastry (Professor, IDRBT) P a g e
ACKNOWLEDGEMENTS From the first step, this project involved the collection and analysis of information from a wide variety of sources and the efforts of many people along and beyond me. Thus it would not have been possible to achieve the results reported in this document without their help, support and encouragement. I like to express my gratitude to the following people for their help in the work leading to this report: Dr. V. N. Sastry, Professor, IDRBT, Hyderabad. Project Guide: For considering me for this project and providing me continuous mentoring and support to complete this project, for his useful comments on the subject matter and for the knowledge I gained by sharing ideas with him and showing me right path to achieve project goal. Shri. B. Sambamurthy, Director, IDRBT, Hyderabad. For providing excellent labs and library. Research Scholar Mr Shriharsha and Mr Virendra Yadav, Mobile Banking Security Lab, IDRBT, Hyderabad. For encouraging me throughout this project and clearing my doubts that arouse being at lab. My parents and all friends specially school friends For providing moral support and a helping hand whenever required. I thank IDRBT for providing me with necessary infrastructure and technical support that was required for this project. Kanojia Sushil Kumar Ramashankar B. Tech. (Final Year) Computer Science and Engineering Admission no. JE Indian School of Mines, Dhanbad. P a g e
TABLE OF CONTENTS ABSTRACT... CERTIFICATE... ACKNOWLEDGEMENTS... TABLE OF CONTENTS... 5 CHAPTER : INTRODUCTION... 7. CHAPTERS OVERVIEW... 8. LITERATURE SURVEY... 9. BACKGROUND.... RELATED WORK..... Working of Mobile website tools....5 OBJECTIVES....6 MOTIVATION... CHAPTER : ANALYSIS AND COMPARISON OF MOBILE WEBSITES OF BANKS IN INDIA.... CHALLENGES FACED BY CUSTOMER AND BANKS OF INDIA..... Problems faced by bank s customers while accessing bank s mobile websites..... Problems faced by banks satisfying customer needs through bank s mobile websites... 5. TOOLS REQUIRED FOR ANALYSIS OF MOBILE WEBSITES... 6. ANALYSIS OF INDIAN PUBLIC SECTOR AND SOME PRIVATE SECTOR BANK S MOBILE WEBSITES... 7.. Analysis of Mobile Websites of Banks in India through WC Mobile Compatibility Scores..... Similarity between WC and Mobiready Mobile Compatibility Score Evaluation process.... IDENTIFIED PROBLEMS IN MOBILE WEBSITES OF BANKS IN INDIA... CHAPTER : PROPOSED RECOMMENDATIONS FOR INDIAN BANK S MOBILE WEBSITES.... COMMON RECOMMENDATIONS FOR ALL BANKS IN INDIA.... PROBLEMS FACED WHILE IMPLEMENTING PROPOSED RECOMMENDATIONS OF MOBILE WEBSITES OF BANKS IN INDIA... 5. EXISTING MOBILE FRAMEWORKS AND THEIR WEAKNESSES... 5.. Tasks unable to handle by current Mobile Website Frameworks... 6 CHAPTER : PROPOSED FRAMEWORK OF MOBILE WEBSITES OF BANKS IN INDIA... 7. TARGETS ACHIEVED BY THE DESIGNED FRAMEWORK... 7. CHARACTERISTICS OF DESIGNED FRAMEWORK FOR BANK S MOBILE WEBSITES... 8. TOOLS/SETUP REQUIRED PRIOR TO IMPLEMENTATION... 9 CHAPTER 5: IMPLEMENTATION OF PROPOSED FRAMEWORK OF MOBILE WEBSITES OF BANKS IN INDIA... 5. MOBILE WEBSITE FRAMEWORK THROUGH IDRBT SERVER... 5.. Flowchart and Working of the Designed Mobile Websites Framework... 5. MOBILE WEBSITE FRAMEWORK THROUGH BANK S SERVERS... 5. IDRBT A BANK S MOBILE INFORMATION PORTAL... 5 5.. Background... 5 5.. Need for Mobile Information Portal... 5 5 P a g e
5.. Setup and Working of Mobile Information Portal... 5 5.. Screenshot of designed IDRBT s Information Portal... 7 5. SCREENSHOTS OF DESIGNED FRAMEWORK OF MOBILE WEBSITES OF BANKS IN INDIA... 8 5.. Designed Framework Elements... 8 CHAPTER 6: CONCLUSION AND FUTURE WORK... REFERENCES... 5 6 P a g e
7 P a g e Chapter : Introduction A web document consisting of either text, images, videos, audios or anything is called a webpage. A collection of web pages hosted on a web domain, to serve the audience is called Website. In short, Website is a collection of web elements like images, videos, etc. presented in webpages. They are mostly written in Hypertext Markup language (HTML) and are designed using different web development tools available. Website brings people together thus connecting them with each other by sharing information. Websites are broadly classified into two categories Normal (Desktop) Websites and Mobile Websites. Later they are differentiated into different types based on usage. Website usability plays a vital role in the success of a product, institution or person. Good usability helps to provide a seamless experience for visitors and improves the chances of success. It is one of the factors that sets a professionally designed website apart from the rest. This can be achieved only when the website follows some characteristics for its type. It can help to make a website a success. Normal websites must have certain characteristics to serve the people such as Clean, Simple and visually appealing design, visuality of the content and features, support at different environment e.g. for different screen resolution, easy navigation, and fresh content and proper information flow throughout the site. All these characteristics makes the audience stick to that website and thus it improves the efficiency of the website. In the similar way, Mobile websites do have certain characteristics like faster page loading, compatible to all mobiles, Mobile browser consistency, well-formatted content that can be easily scanned, well planned information architecture, valid mark-up & clean code, Effective Navigation like Multiple ways to explore content, good internal linking, informative header and footer and most important accessible to all users irrespective of mobile size and shape and its connectivity. Mobile websites are those which are meant to be accessed not only on mobile devices but also on the tablet devices. Mobile websites development is on peak of web development due to its usability and reach by common people. So there is a need to develop efficient mobile websites in order to serve the audience at major level. Seeing this the banks are making efforts to increase their reach by using the mobile websites and thus bringing mobile banking into action for new generation. Mobile related services offer people to enjoy its services at any time anywhere without any difficulties. This has made people to keep all their data safely in their pockets. One of this service is the Mobile Banking feature offered by various banks to do transactions and other bank related tasks from anywhere thus reducing the horde at the nearest bank. In simple words, Mobile Banking is the system through which one can perform all his/her financial and banking related tasks through mobile devices and tablets. Mobile banking facilities are being provided by different banks through different channels like Short Messaging Services (SMSs), Web Applications, Telephone and Mobile websites. Among this the basic approach is to use mobile websites so that it can meet the needs of different users instead of making user to have different applications or efforts required to remember SMS codes.
When thought about mobile banking through banks websites the customer has to face many problems related to its usability, efficiency and robustness. Considering these aspects it was felt necessary to create a common solution through which customers need not depend on different mobile banking applications and would have a common way to interact with the banks. So it was thought necessary to build a common interface for the customer of the banks through compatible mobile websites.. Chapters Overview The project report starts with the ongoing developments in the mobile banking technology in the first chapter and is then concluded with the need of the new framework. In the second chapter the emphasis is given to the analysis of the problems faced by current banks mobile websites. During the project s problem detection phase, a deep analysis was made by calculating the mobile compatibility index of different public and some private sector banks in India, which is later concluded by the problems faced by the current bank s mobile websites. Next chapter, illustrates the recommendations to all the banks independently and on the whole a common must follow recommendations are proposed to all banks for their bank s mobile websites. Chapter fourth, focuses on how to bring into action the proposed recommendations and problems related with current frameworks. Chapter fifth, is the most important section of the report as it shows the design of the framework in order to achieve and apply the proposed recommendations and have a compatible mobile website. Later it also shows, the extent to which it can be used on different platforms and for different purposes thus providing a detailed description of the designed framework. The implementation of the framework is just mentioned into the subsequent chapter and finally the chapter is concluded with the advantages of the designed framework. Later the report mentions the future work to be made in order to improve and enhance the designed framework and how it can be made at a gateway level. 8 P a g e
. Literature Survey Website is the new path for the success of any person s product or business. When it comes to represent one at the global level websites are the one which stand to their expectation, but when it comes to serve globally to every common person then Mobile websites are first considered rather than desktop websites. Mobile websites have changed the way people interact and share information at everyone s reach.one of such is the Mobile banking through the mobile websites which many banks are considering to make their customer enjoy the banking services from anywhere anytime. Mobile banking through mobile websites basically focuses on the ease of using the banking services on the mobile handsets irrespective of device and location. Designing of compatible mobile website requires study of current web technologies for modern devices and having prior knowledge of web developing languages for the older devices like java enabled phones. Any WAP enabled mobile devices must feature to enjoy banking facilities provided by respective banks on their mobile devices. Mobile banking was first started through the SMS services by the banks by providing different messaging codes in order to carry bank s transactions and get account information on the mobile phones. Later with the introduction of WAP enabled phones and mobile web in 999, first the European banks started to offer mobile banking on this platform to their customers. Till the mobile banking was considered to be SMS based but due to the success in the web technologies and advancements in the growing market of smartphones, it made banks to realize the need of banking through mobile web based applications.so banks preferred respective mobile applications for their mobile banking. Now, after a considerable growth in web technologies like HTML5, CSS, JQuery, Ajax, etc. and support on wide range of mobile devices, the banks are moving towards the mobile banking through their respective mobile websites. By doing so they are increasing the customers share and making them well satisfied, thus working along with the giant technology for better banking services. Indian banks mostly lack in terms of providing mobile banking facilities through mobile websites due to inefficiency of incorporating the web technologies and in availability of common banking framework for bank s mobile websites. According to the data sourced from Bain, Research Now and Bain along with GMI NPS surveys in, India achieves 5 th position in terms of mobile banking with a nearly 7% usage which is quite low. This is a major concern and now banks are moving into the banking services through mobile websites with cross platform support and security. 9 P a g e
. Background To design a compatible mobile website there are many frameworks existing which are designed to do so but each one has different pros and cons according to its usage. According to Mob Partner (http://blog.mobpartner.com/) on th June,, some of the important frameworks that are most commonly used for different mobile websites design are:- JQuery Mobile Instead of writing unique apps for each mobile device or OS, the jquery mobile framework allows you to design a single highly-branded web site or application that will work on all popular smartphones, tablets and desktop platforms. URL: http://jquerymobile.com/ M-Project It is a Mobile HTML5 JavaScript Framework that helps you build great mobile apps, easy and fast. The framework follows the popular model-view-controller (MVC) software architecture pattern, a huge selling point for many developers. It support all devices: smartphones, tablets and even desktops. URL: http://www.the-m-project.org/ Emobc Wide support for different mobile devices and it has a drag-drop feature in order to create mobile applications more efficiently. URL: www.emobc.com Wink Wink stands for Webapp INnovation Kit and is a toolkit which will help you build great mobile web apps for ios (ipod, iphone, ipad), Android, BlackBerry, Bada and now Windows Phone 7. Moreover it is adapted for Firefox mobile and Opera mobile. URL: http://www.winktoolkit.org/ Sencha Touch It is a high-performance HTML5 mobile application framework. Built for enabling worldclass user experiences, Sencha Touch enables developers to build powerful apps that work on ios, Android, BlackBerry, Windows Phone, and more. URL: http://www.sencha.com/products/touch P a g e
Application Craft It was developed using pure web technologies. It has Drag-and-drop UI design, coding, deployment.one can choose cloud as a mean to develop website or web apps from anywhere. It can also reduce strain on the budgeting issues but it costs. URL: http://www.applicationcraft.com/ DHTMLX Touch It is a free HTML5-based JavaScript library designed specifically for the creation of mobile web applications that work across platforms. As an HTML5-based framework, it comes with a complete feature set of User Interface widgets and other elements also. URL: http://dhtmlx.com/touch/. Related Work On account of site owners who do not have any prior knowledge of web technologies there are different tools available accordingly to the ease of usage, which can be proved beneficial and cost effective for the low and medium size industries to create a mobile friendly version of their respective normal websites. According to the post appeared on the American Express OPEN Forum in the year, some of the known tools which can be used to create a compatible mobile version of the normal websites are discussed below as:- Mobify It allows you to create a mobile version of your website through an intuitive and userfriendly graphical user interface (GUI). Most preferred for the e-commerce through its m- commerce tools. It embeds its logo on created websites and it also offers website reports but only at premium levels. URL: http://mobify.me/ Wirenode It is used by many companies, a mobile website generator that has helped more than 5, websites create mobile-device-friendly versions of their sites. It offers with hosting mobile websites also custom domain and upgrades are provided when paid. URL: http://www.wirenode.com/ Mippin Mobilizer It is a no-frills tool all you have to do is enter your site's RSS feed URL, configure some Options, sign up for an account, install some code on your site, and you're done! When mobile site is configured a live preview is shown to monitor the changes. URL: http://mippin.com/web/maker/mobilize.jsp?from=blog&new= P a g e
Onbile It promises that one can have a mobile version of his site in five minutes or less. It delivers this promise by giving you an intuitive user interface for constructing your mobile site and a custom-generated script to paste into your index page for redirecting user to mobile version of the site. It also has nearly templates to design mobile website. URL: http://www.onbile.com/ Winksite It is used to create mobile community for owner s website. It even generates a personalized two-dimensional QR-code readable by mobile devices with QR scanners and used to automatically pull up text, photos, videos, music and URLs. URL: http://winksite.com/site/index.cfm MobilePress It is mainly for the mobile conversion of the Wordpress sites. URL: http://mobilepress.co.za/ iwebkit - It is used for creating ipad/iphone apps. URL: http://iwebkit.net/.. Working of Mobile website tools The above discussed tools mostly have graphical user interfaces, along with availability of copyand-paste code blocks facility. Some of them also features drag and drop in order to create same. Most of them provide easy installation on the owner s site and easy to use open source mobile tools posed by them. These mobile tools work by the detection of the user agents through different means thus finding whether the customer is mobile or desktop user. If the user agent is a mobile browser, users are redirected to website's mobile version. Most commonly, websites practices assign the mobile version of ones current site with an M-sub-domain (e.g. m.onlinebank.com) Doing so, the traffic and load on a particular website is reduced thus differentiating users at two different locations with compatible mobile browsing experience. The consequences faced and the problems encountered while using these frameworks discussed later in subsequent chapters while taking into consideration the framework to be used for making compatible mobile websites and tools used for evaluation/testing of banks mobile websites. P a g e
.5 Objectives The main objective of this project work, was dependent on the problems faced by the Indian public sector bank s mobile websites and was to design and implement framework to solve these issues. While achieving the main objective the work undergoes for other objectives as. Identification of the problem statement.. Analysis of all Indian public sector banks and some private sector banks.. Identification of the issues with these bank s mobile websites.. Proposing recommendations to respective banks to solve these issues. 5. Identifying Issues with existing framework and ways to overcome these issues. 6. Design of framework to apply and use proposed recommendations. 7. Implementation of the framework at basic level..6 Motivation The advancements in the web technologies and their use at different levels initially made us to consider this project. The Analysis phase mostly motivates to carry this project, because it shows the problems being currently faced by all the Indian public sector bank s mobile websites. So in order to solve listed issues and contribute to the betterment of the Indian banks, it was necessary to provide a common framework for bank s mobile websites, which can give a boom to mobile banking in India and thus creating a healthy customer-bank relationship. P a g e
Chapter : Analysis and Comparison of Mobile Websites of Banks in India Moving from normal websites to mobile websites raises numerous issues to be faced by the banks when trying to avail the mobile banking service through mobile websites. In this phase, problems are presented, that are faced by customers and mobile banking websites of Indian public sector banks and some major private sector banks like ICICI and HDFC in terms of mobile compatibility, performance, data delivery and so on, by analysing and evaluating their mobile websites and in absence to it their net banking pages are considered.. Challenges faced by Customer and Banks of India It involves challenges faced from customer point of view to access content of mobile website same as that of normal websites and from banks point of view to provide those contents efficiently in order to satisfy customer needs, prior to design of respective mobile websites... Problems faced by bank s customers while accessing bank s mobile websites Unavailability of complete information regarding different bank services, topics, etc. Missing features that are provided into desktop site Displaying unsupported data format Scattering of information and unsuitable display of pages Less user responsive while accessing Mismatched and poor user interface of website leading to bad performance Slow site navigation or no navigation Irrelevant content delivery Loading of pages for long time Unavailability of access controls e.g. Access Keys P a g e
.. Problems faced by banks satisfying customer needs through bank s mobile websites Removal of required Information Design Challenge which web technologies to use? User Interface How to make mobile website supported on every mobile handset Performance Issues : Reducing page loading time Delivery of complete content and information Response to the user clicks and events Less use or compilation of external resources Compatibility issues : Responsive to every mobile handsets (Java/Smartphones/Android/iPhone) Connectivity related content (GPRS/EDGE/G/G/G,WiFi) Optimized and supported images and design for mobiles WC principles and guidelines for mobile websites and so on. 5 P a g e
. Tools required for analysis of Mobile Websites There are different resources available for testing and evaluation purpose of mobile websites, which can be used to check the compatibility index of bank s mobile website. Testing and evaluating mobile website through these resources gives satisfaction regarding its platform support, portability, interactivity, and robustness and so on. Mobile Web Best Practices. WC, the standards body for many of the web's technologies (such as CSS, HTML and JavaScript), has a document that outlines mobile web best practices. This is aimed at web developers and is a WC Web Standard that helps people design and deliver content that works well on mobile devices. URL: http://www.w.org/tr/mobile-bp/ WC mobileok Checker WC s official tool for checking a mobile site's "mobile-friendliness. It rates mobile websites depending on different issues as described in the WC mobile website standards URL: validator.w.org/mobile/ MobiReady This tool tests user/banks site for dotmobi compliance and WC mobileok Compliance, sets of mobile website standards that ensure an optimal and accessible mobile-site user experience. It also looks for errors and gives you a user-friendly report of any errors discovered. URL: http://ready.mobi/launch.jsp?locale=en_en ipad Peek An ipad Emulator to show how the websites looks on different apple devices URL: http://ipadpeek.com/ Google Chrome Inspector It is an inbuilt feature provided by Google Chrome browser (one can access by pressing Ctrl+Shift+I, while in browser window). It features emulation part for testing website at different resolutions and different devices. It also has console where errors and warnings can be identified and corrected later. 6 P a g e
. Analysis of Indian Public sector and some Private sector bank s mobile websites The project work started with the analysis of all Indian public sector bank s mobile websites, based on the parameters and the standards recommended by the WC (World Wide Web Consortium), for display of user friendly mobile websites compatible on mobile devices. WC recommends best practices for Web content when accessed from mobile devices through the basic document - The Mobile Web Best Practices.. It also considers The WC mobileok Basic Tests. document, which defines machine tests based on the Best Practices to ease Mobile Web content authoring. Using all the above standards, the Indian public sector bank s mobile websites were tested, evaluated and rated by compiling the issues faced by them, detected using different tools discussed above. The problems faced by Banks s mobile websites were grouped into five types namely critical, severe, medium, low issues and finally in warnings and other issues. The main issues which were taken into consideration were as. Critical Issues Page not Found - Presence of non-existing pages or invalid links Large Page Size - Page size greater than Kb thereby increasing page load time Use of External Resources - Using more than external resources Invalid Markup - This is encountered when missing tags or invalid tags are noticed UseMap (Image Map)- Usage of image maps creates problems on unsupported device Invalid image formats Usage of unsupported image e.g. apng image format. Severe issues Table Layout - Informal use of tables as they are not rendered properly by all mobiles Nested Tables - They cause scattering of data on unsupported devices Unstructured Object and Scripts - Improper structuring of tags and other objects No XHTML Mobile Profile Validation Most commonly used mobile page validation Invalid Content Format Support (CSS Syntax) Popups - Use of Popups through scripts makes devices wait for data rendering. Medium Issues No Caching Resized Images (Graphics not as per requirement) - Usage of irregular image sizes Inconsistent declaration of Character Encoding Too many Whitespaces/Comments - Leads to unnecessary increase in document size 7 P a g e
No Access Keys - Use of keypad in absence of pointing devices Page size limit - Page size between 5kb to kb Large no. of External Resources - More than external resources No Doctype Declaration - Mobile browser unable to select the type of page to display Use of Frames - Use to display external pages HTTP errors. Low Issues Missing image attributes Missing height and width attributes Invalid Markup unassigned ending tags to some elements Absolute Measures in styling Using pixel values rather than em or % values Invalid Content Format Support (Images OR application/xhtml+xml) Missing 'Alt' attributes for images Page Size Limit Page size greater than kb Unsupported Styles properties - Use of properties like display, border-radius, etc. Use of Event Attributes Inline use of scripting events Used Inline Style Attributes Too much small elements for styling Excess use of tags like <b>, <i>, <u>, etc. 5. Warnings and other Issues Existence of Scripting in the document Existence of Tables Existence of Invalid CSS properties No default Input Method Using input elements without any types Auto Refresh No Page Title No Google sitemap No transform in cache control Preventing transforming of data through proxies No UTF-8 of Character Encoding- Required to encode page language Unknown Link Target support Format Empty href attributes of <a> tags Based on the above issues the Indian public and private sector bank s websites were compared and compatibility index was calculated for all the banks which shows the friendliness of the bank s mobile websites on different mobile devices and tablets. The full report with the issues faced by bank s mobile websites is mentioned into the xml sheet along with this report. 8 P a g e
Note : The bank s name with prefix Net represents that the bank s do not possess a mobile website and so their online banking page is taken into consideration for testing purpose. Also note that this is just the test of the homepages of different Indian public sector bank s mobile website pages and that can be extended to other pages for complete website testing. This testing is independent of the issues faced at server side of the banks. 9 P a g e
.. Analysis of Mobile Websites of Banks in India through WC Mobile Compatibility Scores Fig I: WC Mobile Compatibility Score 9 9 9 8 8 6 9 65 8 58 5 Allahabad Bank Andhra Bank Net Bank of Baroda Net Bank of India Net Bank of Maharashtra Net Canara Bank Central Bank of India Net Corporation Bank Net Dena Bank Net HDFC Bank ICICI Bank IDBI Bank Indian Bank Indian Overseas Bank Oriental Bank of Commerce Net Punjab National Bank Punjab and Sind Bank State Bank of India State Bank of Bikaner and Jaipur Net State Bank of Hyderabad Net State Bank of Mysore Net State Bank of Patiala Net State Bank of Travancore Syndicate Bank Net The above pie diagram shows the compatibility index score provided by the WC using the discussed mobile web standards. It uses nearly all the defined 6 parameters for the mobile website testing guidelines. In the pie diagram, larger the cake size the more friendly or compatible the respective bank s mobile or net banking website is.from the pie chart, it is obvious to see Bank of Baroda takes the largest share with 9% compatibility score but that it made for the online net banking as they do not provide specific mobile banking website. Which is next followed by mobile websites of Indian bank, IDBI bank, Canara bank and net banking site of Bank of India with 5% mobile friendliness score. The ones which fall lowest in this testing are mobile websites of Indian Overseas bank and Punjab National Bank. Also net banking websites of Vijaya Bank, Syndicate Bank and UCO bank are one who have very less score nearly % for the compatibility on different mobile handsets. State Bank of India with % compatibility score. Other remaining websites are rated between % to % mobile compatibility score. P a g e
.. Analysis of Mobile Websites of Banks in India through Mobiready Mobile Compatibility Scores Fig II: Mobiready Mobile Comapatibility Score 67 8. 5.6 8.6.6.8 6.6 66.8 8.66.8 66. 68. 6 5. 8.6 6.6 56 69. 5. 6.6 9. 75 Allahabad Bank Andhra Bank Net Bank of Baroda Net Bank of India Net Bank of Maharashtra Net Canara Bank Central Bank of India Net Corporation Bank Net Dena Bank Net HDFC Bank ICICI Bank IDBI Bank Indian Bank Indian Overseas Bank Oriental Bank of Commerce Net Punjab National Bank Punjab and Sind Bank State Bank of India State Bank of Bikaner and Jaipur Net State Bank of Hyderabad Net State Bank of Mysore Net State Bank of Patiala Net State Bank of Travancore Syndicate Bank Net Union Bank of India Net United Bank of India UCO Bank Net Vijaya Bank Net This pie diagram shows the Mobiready score, calculated for compatibility of the mobile website on the different mobile handsets but this takes into consideration only the essential guidelines provided by WC for mobile web standards rather than considering every parameters of the test. It also uses some other testing parameters for mobile webpages like Google sitemap and transform in cache control. According to Mobiready score, net banking website of Corporation bank is considered better among others with 75% compatibility score. The other banks following to it are Indian Bank, Bank of India, State bank of India, Allahabad bank and United bank of India with compatibinty score between 65% to 7%.It states that UCO bank, Indian Overseas bank and Vijaya bank are one which lowest and thus less compatible on mobile devices which may cause poor display and usability of the website. P a g e
Mobile Compatibility Score (%) Design and Implementation of Framework for Bank s Mobile Websites.. Similarity between WC and Mobiready Mobile Compatibility Score Evaluation process Fig III: Comparison of WC and Mobiready Mobile Compatibilty Score 9 8 7 6 5 9 75 66. 68. 69. 56 6 58 5 5. 9. 6.6 6.6 8 8 5 6 8 8.6. 5 6 67 9 8. 5.6 8.6.6 9 9.8 6.6 66.8 8.6 6.8 Indian banks Mobiready Mobile Compatibility Score WC Mobile Compatibility Score The above statistics shows the comparison of the mobile compatibility score provided by the two medium WC (considering all mobile standards) and Mobiready (considering essential mobile standards along with other mobile parameters).from the above it is seen that the banks websites are failing to achieve good compatibility score when calculated using all defined WC mobile standards. But when only essential parameters are considered then there is a slight increase in the score but not at exponential terms. This shows that the standards defined are true to their nature and can be extended in future for different web pages.net banking of Bank of Baroda falls greatly when compared with latest mobile web standards. Similar case can be found with mobile websites of Indian bank and IDBI bank. The conclusion is that the problems and issues that has been detected through this analysis and website testing phase reveals the actual friendliness of the websites on different platforms, the user interactivity with different bank s mobile websites and the effect of same on customer minds for accessing bank s services through mobile websites. P a g e
. Identified problems in Mobile Websites of Banks in India The analysis phase lists out the common problems faced by the bank s mobile websites in terms of user experience and mobile compatibility score as - Page Size is large and page loading speed is slow Invalid mark up and links (HTTP Errors) Large use of graphics and colours Large use of external resources Use of Tables and tabular data Invalid and erroneous CSS syntax No XHTML Mobile Profile Validation No Caching of non-sensitive pages Inconsistent or no declaration of Character Encoding Use of Inline Styling and scripting attributes Unknown Link Target support Format Use of frames, popups, small style attributes Non-existence of Google sitemap Use of absolute values rather than percentage values in design Missing attributes and other necessary mark-ups.5 Conclusions Now after analysing it was seen that the bank s websites lacks many features, which are necessary for proper functioning of the mobile banking through the mobile websites. This chapter briefly explains the base criteria on which the websites of different banks in India are analysed and different issues faced by the them into categories of critical, severe, medium, and low and other normal issues. Removal of critical and severe issues are do necessary for the proper working of mobile banking websites. Similarly medium, low and different other issues are also equally important if one wants to increase the success rate of the mobile banking through mobile websites. For the same different recommendations are provided to the banks to solve this issues in next chapter. P a g e
Chapter : Proposed Recommendations for Indian Bank s Mobile Websites This project report in this phase proposes recommendations for mobile websites of all public sector banks and some private sector banks, to deal with the problems identified during analysis phase. The proposed recommendations are compiled from various sources by testing and visiting the mobile websites on different tools discussed earlier. Apart from this some recommendations were also made on personal user experience.. Common recommendations for all Banks in India List of common recommendations for all Indian bank s mobile websites - Optimize Images using optimization tools linked with this report. Use Content Negotiation to have both normal and mobile versions available and served depending on the browser capabilities. Uses elements or structures that are allowed in the XHTML Basic. specification and use XHTML Mobile Profile Validation. Do not use pixel measures and do not use absolute units in markup language attribute values and style sheet property values. Try to reduce the number of external and included resources (images/style sheets). Use CSS techniques to control the layout of the page. Make use of cache for the homepage only or the login page but not for sensitive pages. Remove broken links or add content to the links rather than creating HTTP errors Validate your documents through WC Markup Validator published formal grammar pages. Use Alt Attributes for images incase images are disturbed. Avoid Resizing of images. Remove useless whitespaces and comments. Avoid using tables, frames, popups, invalid CSS properties, inline styling, inline event attributes and so on. Use separate pages for scripting rather than embedding them on the same page. Use Doctype in order to send data as supported by the device. Use default character encoding method (UTF-8,UTF-6,UTF-,ASCII). Add default input method for the input elements. Use Google sitemap and transform cache control for fast access of regular pages. P a g e
. Problems faced while implementing proposed recommendations of Mobile Websites of Banks in India As banks are provided with the recommendations report but the problem may arise for selecting the right path to apply proposed recommendations and increase the potentiality of the respective mobile websites. If one is aware of the existing mobile website frameworks they can choose any one of them which suits their need, but for those who are unfamiliar with mobile websites framework may choose improper or irrelevant framework thus again leading to the same problems in some or other way. Different questions may arise in bank s mind regarding the framework, if they try to use them as- How to implement these recommendations using the selected framework? Do selected framework will be good and customizable? Do that framework can be used on any mobile device? Is it reliable and meet WC standards? If not, which mobile framework should be chosen from existing ones?. Existing Mobile Frameworks and their weaknesses As discussed earlier in the introduction chapter, there are different mobile frameworks which can be used to make a mobile compatible websites and can overcome some of the issues faced by the banking mobile websites. Also tools are designed to make use of this framework and design a mobile compatible websites in a quick time but with a user pain. All the tools and frameworks discussed initially, has some or other weaknesses like no cross platform support, writing of codes, dragging codes rather than elements, use of excess plugins and generating the design rather than having a conversion mechanism for mobile websites. Apart from this they are also unable to handle situations listed in next sub-section. 5 P a g e
.. Tasks unable to be handled by current Mobile Website Frameworks Automatic conversion to mobile compatible website rather than generating manually its mobile version Optimization of the images Connectivity oriented content (GPRS/G/G) Appending of the meta tags related to caching and other details Reducing the CSS syntax by deleting or replacing with the alternatives Handling of the tabular information Automatic removal of comments and whitespaces Flow of information related to services and features offered by banks Adding Default Input Method for the input elements Adding security measures to input elements Assigning of access key support Portability and robustness to different mobile devices After examining the available frameworks and the weaknesses possessed by them, it was felt extreme important to develop a suitable framework so as to full fill the requirements of the banking mobile websites. Currently, there is no specific banking oriented mobile website framework which can concentrate on bank orientated mobile design having features like full content, low page load, cross platform support with best user experience interface. This makes the project report most crucial as it aims to cover the above qualities by designing a bank oriented mobile website framework which is presented in the next chapter. 6 P a g e
Chapter : Proposed Framework of Mobile Websites of Banks in India The Proposed Mobile Website Framework is designed keeping in mind the bank s mobile website simplicity for better customer experience. The framework is made initially with only important features possess by the banking website focussing on the design of website rather than security of the website. For the security attacks at login, registration and other things measures are been taken so as to make framework stiff to its working rather than leading to poor performance. The design phase focuses on the targets the framework achieves and the working of the framework using the flowchart and other diagrams.. Targets achieved by the designed Framework Automatic conversion to compatible mobile website page format Content delivery according to the connectivity type Automatic image compression Automatic comments and whitespace removal Automatic appending of Meta details like caching, encoding, description, keywords, etc. Support for different screen resolutions Bank Related themes Navigation through simple menu, sidebars and options Custom designed of all input elements with placeholders and input icons Support for Ajax feature Use of HTML5 geo location to find nearest Banks and ATMs Use of HTML5 features in order to provide content rich websites for the supported mobile phones. Use of slideshows, HTML5 audio and video support for compatible smartphones and fallback for others. Support for animation for compatible mobile devices 7 P a g e
. Characteristics of Designed Framework for Bank s Mobile Websites Cross platform suppport for different mobile screens Finds images and optimizes them and stores them Provide content based on connectivity and supported screen resolutions Light captcha system for security Removes whitespaces, comments and tidy things up Scans meta data and stores for appending meta details Information Portal for banks Plugins like ATM and Bank Locator, ImagedataURI,etc. scans webpage to find links and forms to be appended Mobile Website Framework Appending element design framework to manage complete page and its styling. Figure : Features included in designed Bank's Mobile Websites Framework 8 P a g e
The framework designed is made by using the web technologies like HTML, HTML5, CSS, CSS, JQuery, JavaScript, PHP, MySQL and Ajax. The use of the web technologies according to the device support is taken into care, for example Java phones are not provided with HTML5 audio/video support, Smartphones are supplied with connectivity oriented content i.e. If customer s mobile supports new web features then they are provided with it, else they are kept with what their mobile deserves. Thus, making a balance between customer needs and bank s content supply for the same. The framework provides the additional support to the mobile devices with the included plugins like ATM and bank Locator within km of the customer s location. It also provides generalized plugins for image optimization and image compression depending on the image quality. For the images less than Kb, a plugin is designed to convert those images into Data URI format thus reducing the number of network requests. A light captcha system plugin based on Data URI is also included with framework. Tools/Setup required prior to Implementation Client Side WAP enabled Mobile Phone (Java/Android/Smartphone/iPhone) Working Mobile Connectivity (GPRS/EDGE/G/G/G/Wi-Fi) Geo-location Feature (optional for Bank and ATM search) Server Side A PHP 5.+ supported server Apache or Nigix Server with Gzip compression Imagick Library Installed on Server PHP s GD Library installed on server Designed Framework scripts and style sheets PhpMyAdmin for MySQL Latest JQuery.+ scripts Developers side (To make changes accordingly) Web browser (Google Chrome, Firefox, etc.) PHP Storm by Jetbrains (one stop for all changes) Notepad++ v6.5+ Notepad (windows) and Vim, Gedit, etc. for Linux Systems Wampp, Xampp or Lampp installed on system Apache and MySQL Enabled with installed libraries like Imagick and GD 9 P a g e
Chapter 5: Implementation of Proposed Framework of Mobile Websites of Banks in India The proposed and designed framework can be implemented at both the bank s server side or at the IDRBT s server side. But when it is implemented at the IDRBT server customers may have a very good user experience rather than when the framework is implemented at the respective banks. One thing can be done to handle this is to implement the framework at the bank side and provide the redirection to the IDRBT servers. Currently the implementation of the designed framework is made at the basic level i.e. a conversion process is attached only with singly pages rather than the complete website. It works like a filter i.e. filtering the important data and content of the websites and just compiling all the things which are necessary for the mobile display based on different factors mentioned in the design phase. 5. Mobile Website Framework through IDRBT Server Here the focus is made by using the framework at IDRBT server where it is connected to different banks so as to facilitate the mobile banking with different banks. This can be achieved by using IDRBT as the gateway through which the customer can navigate to different banks services and portals, this phenomenon can proved to be beneficial for IDRBT in order to keep the records of different banks usage and can generate yearly or periodic statististical reports for different banks. Respective Bank s Server SBI HDFC ICICI Other Banks IDRBT Server Figure : Framework Implemented through IDRBT Server P a g e Customer
When a bank s mobile website is accessed through framework established at IDRBT the customers are provided with various other facilities discussed later. From the figure, it is obvious the banks are connected to the IDRBT server to serve the customers any time. In simple words, whenever any customer tries to access the banks mobile website through the IDRBT server they are made available with their own account independent of all other banks account, so that IDRBT can provide the best user experience to the banks customers. 5.. Flowchart and Working of the Designed Mobile Websites Framework IDRBT Server Scanning requested webpage,fetching webpage details,storing details Scanning for essential mobile elements like links and form elements and storing Searching User details from the database Database Name Pass Details Image Compression Plugins Converting and Optimzing images Removing comments and whitespaces, HTML,Javascript,CSS compression (Gzip) Client Side Appending designed elements framework to manage complete page and its styling efficiently Compiling and appending stored data to the mobile webpage Appends content based on connectivity and supported screen resolutions for recognised user or normal content Figure : Flowchart of Framework at IDRBT server P a g e
The framework will start working at the core of the server side whenever any request is made to access the bank s mobile website through IDRBT server. Initially the framework is setup at the IDRBT server with all the installed components for achieving the goal. The complete working can be shown stepwise as. A request is made to the IDRBT server through a mobile device or a tablet for accessing the bank s mobile website. This request is accepted by IDRBT server and now the Mobile Website Framework is called upon to perform its further tasks. First the frameworks makes connection to the IDRBT database for identifying the authorized user i.e. whether a new user or a registered user. During this process customer is moved to the login page with an option to continue without login... If user is registered then the user details regarding its mobile device, connectivity type and other content related information are fetched and stored.. If user is unregistered then he/she is asked to register, which can be skipped for time being thus restricting to some features only. In the next step irrelevant to the first step, here the whole actual webpage of the requested banks website is fetched and scan for the details about the webpage which includes meta tags details related to content type, encoding type, author,description, keywords, title, favicon and other details. Also the webpage scripts and style sheets are stored.. In third step, the framework scans and selects the elements to be displayed depending if the website was using the designed mobile framework or not.. If designed element framework is not used then it scans and stores only links, images and form elements of the current mobile website and moves to next step, else it goes for another level of this step... It addition to above it adds data from important classes and ids defined in elements framework. They are scanned and store. It may include audio, video, slideshow and other content rich stuffs.. This step deals with the compression and conversion of images of the websites. It has two phases based on images size.. All images are compressed using the plugin or the designed tool so as to reduce page size thus reducing page load time. For images less than (Kb)Kilobytes it moves to one more phase of optimization else moves to next step.. Images less than Kb are converted to Data URI format thus reducing the number of network request through ImageDataUri tool..5 Removing of erroneous links, whitespaces and comments is made during this step.6 This step is a dependent phase that is if user was recognised as a registered one then they are provided with connectivity orientated content delivery else normally else no connectivity related content are added and user is moved to next step showing required information and content support P a g e
.7 All the Stored information from the step -5 are now compiled and appended to the actual webpage and moved to the final step.8 This is the final step as it completely organises the content according to the mobile device screen size and the support for the required content which the customer possesses. This creates an optimized and full relative content supported webpage for the customer s mobile or tablet device.. Here the role of the frameworks ends completely and now user can enjoy the optimal bank s mobile website according to his/her mobile type and connectivity type. P a g e
5. Mobile Website Framework through Bank s Servers Bank s Server Customer Figure : Implementation of framework at Bank's Server The implementation of the framework at the respective Bank s server is also easy to setup, but they would not be able to achieve full fledge features by doing so. This bank s problem can be solved by just calling the framework at the IDRBT Server which can be done via redirection or some other means. When framework is called via another bank then the URL of that bank s mobile page is taken as the source and thereafter framework continues as usual by providing webpage directly to customer webpage or to the bank to provide the same. The above two implementation model one at IDRBT server and another at Bank s respective shows the portability features possess by the designed framework and how it can be used to meet anyone s need at different operational means. P a g e
5. IDRBT A Bank s Mobile Information Portal 5.. Background Mobile phones have reached to every nook and corner of the world, unlike which enables one to access everything on their mobile device that can be done through computers. A bank customer would prefer accessing bank information on mobile device more comfortably rather than a computer. Whenever a customer wants to know about the bank s current interest rates, current schemes, news updates and other things related to the bank, then he should first Google it or just move to the respective bank website. But as discussed earlier he would have to undergo numerous issues thus making a user to get frustrated and become unhappy. 5.. Need for Mobile Information Portal One problem may also arise for people who are equipped which low end mobile devices with only support of Java wap applications. During this time, if suppose customer wants to know how to open a saving bank account at ABC bank then he would try to move on the ABC bank s websites and search for the relevant content and may end up without query been solved due to issues faced while accessing mobile websites on his/her mobile handsets. During this time it would prove much beneficial if he was provided with what he was looking for rather showing useless graphics, videos, ads, etc. which can irritate customer and rate bank negative. The problem of moving to different location for getting bank s information can also be removed by keeping a common interface for user. Till now there is a non-existence of any such information portal possessed by any bank in their mobile website. This would create problems for the customers who are redirected to mobile website and also when the main website goes down, etc. 5.. Setup and Working of Mobile Information Portal Information portal is connected and setup in the same manner as that of bank s mobile websites framework in the figure and figure.there is no step required on major basis for both server side and client side. For proper working of the information portal, the information stored about various banks is needed to be updated,to do so banks and IDRBT server are meant have interconnected creating the efficient flow of information for the customers. IDRBT can be used as an Information portal for all Indian banks thus keeping tracks on various banks at one place. The information portal may educate people with different facilities been introduced, thus making people aware about the ongoing banking trends and developments. Mobile Information Portal is to be one place for getting all information about the respective banks on mobile devices and desktops also. It also possess bank oriented themes and bank logo support. 5 P a g e
For the proper working of the IDRBT s Information Portal, it is required that bank co-operate with IDRBT and updates its features, interest rates, schemes, news updates, offers, details, etc. Bank s Server Side or Developer Bank always keeps updating their informational for mobile oriented information portable IDRBT Server Manages various bank information in database or in a XML file Customer As per the Mobile Information Portal Model, the Banks data is updated by someone at the bank level, so an interface is being designed such that he/she can update the bank details and other thing featured in the banks on customer demand. The interface is provided by the IDRBT on its server for the admin of the particular banks to access those information modules. For the same they are provided with unique id and password. As soon as the information is fed and submitted, the data gets append in the XML sheet (currently in this way) or one can make use of databases to store each bank s information. Now whenever user requests IDRBT server for accessing banks information through mobile phones then it loads the necessary data from the file or the database and shows the user. If user is a registered user with IDRBT by means of the mobile website framework which was discussed earlier then, he is provided with content rich information on his/her mobile phones else he is made available with the basic information of the respective bank. This information portal is very essential while accessing contents through mobile device which suffices all user needs. 6 P a g e
5.. Screenshot of designed IDRBT s Information Portal Banks Details Provides information about all banks services and unique services offered by them. Compiled bank information at one place Dependent on mobile connectivity i.e. videos and audios for G and higher connectivity mobiles Frequently asked questions Gallery support Figure 5: Screenshot of IDRBT Information Portal 7 P a g e
5. Screenshots of Designed Framework of Mobile Websites of Banks in India This section consists of all the screen shots of the bank s mobile website framework designed in different sections.it also includes the plugins and tools screenshots. 5.. Designed Framework Elements Figure 6 : Menu, Heading and Paragraph Elements shown in tablet Figure 7: Framework Design responsiveness in mobile Figure 8: Tables elements design for tablet and mobile 8 P a g e
Figure 9: Form elements -text, password, date, email, pin code in mobile device Figure : Form elements search, URL, file, text area in mobile device Figure : Popup with semi-transparent container 9 P a g e
Figure : Form elements Buttons, Radio Checkbox, range, progress Elements Figure : Others Select, Accordion and Tabbed data Container P a g e
Figure : Right Slider for Menu purposes Figure 5: Figure : Left Slider for Menu purposes and Calendar script involved in it Figure 5: Figure : Ajax Loader and slideshows in css and JavaScript P a g e
Now in order to use this framework design, one can just include the scripts link to the existing design and that would complete the styling process of the complete webpage. For the sake of convenience and how to use the designed framework the samples sites are made so that one can understand the usage mechanism. The samples also include the plugins and tools involved with this framework with commented how to use code. To include the scripts in webpage write the following code into the head section of the html, js or php file: For style sheets: <link rel="stylesheet" type="text/css" href="location_of_root_folder/style.css"> -- Main Script <link rel="stylesheet" type="text/css" href="location_of_ ROOT_FOLDER /mstyle.css"> -- Mobile small Script <link rel="stylesheet" type="text/css" href="location_of_ ROOT_FOLDER /javastyle.css"> -- lightest one For JavaScript s: <script src=" LOCATION_OF_ ROOT_FOLDER /jquery.js"></script> or any other jquery version <script type="text/javascript" src=" LOCATION_OF_ ROOT_FOLDER /script.js" ></script> <script type="text/javascript" src=" LOCATION_OF_ ROOT_FOLDER /PLUGINS_ONE.js" ></script> For PHP Files: require_once(' LOCATION_OF_ ROOT_/simple_html_dom.php'); require_once(' LOCATION_OF_ ROOT_/imagedatauri.php'); require_once(' LOCATION_OF_ ROOT_/compress_img.php'); and similarly for other php files. P a g e
Figure 6: Sample Use of Framework to design mobile websites Figure 7: Conversion tool f for normal website to its mobile version Figure 8: Designed Framework for cross platform support P a g e
Figure 9: Mobile user Registration sample using framework design Figure : Mobile user Registration sample using framework design Figure : Mobile Information portal for banks initial selection box to select bank P a g e
Figure : Registration form sample and its filling Figure : Image optimization tools and plugins Figure : Searching the mobile site example 5 P a g e
Figure 7: Login Panel for desktop with labels Figure 5: Image compression and data URI 6 P a g e
Figure 6 : Sample Converted State bank of India Mobile Website Figure 7 : Included Geo location Plugin for nearest bank and atms sample 7 P a g e
Chapter 6: Conclusion and Future Work The project report shows the different identified issues being currently faced by the banks in India. To solve these issues recommendations are proposed and these recommendations will be applied efficiently if and only if the proposed framework is used. Framework also contains optimizations and conversion tools which inbuilt with the framework so no extra effort is to be made for optimization of complete website. Apart from this, the Information Portal design is also proposed which is very beneficial for the bank s mobile websites. The project report can be concluded with the advantages of the designed framework which would show the potential of the framework to bring a better mobile banking experience to the customers via banks mobile websites by proving them a relevant content support. Conclusions Simple to use by just adding IDs and Classes for the current websites. Bank oriented mobile Framework and portable to other mobile websites also. Connectivity based content delivery Support for major range of devices from Java to Smartphones. Information Portal related to features and services provided by banks Search feature to find nearest bank s ATMs Branch details. XHTML Mobile Profile Validation. Overall less overhead for page loading Filling up small security holes caused by exploiting html elements Bringing optimal mobile website for best user experience Providing not only Prevention but also Cure for the existing bank s mobile websites Providing Educational means to learn about banks in India through Information portal This shows that, one can get efficient and user friendly mobile websites and using this banks can make their own mobile websites in a quick way rather than depending on other by just using the included style and scripts as No need of Web Developing Knowledge is required 8 P a g e
Future Work Additional work to be done for the designed Framework for Indian Banks Mobile Websites Implementation at the Gateway Level i.e. anytime request is made by customer, then they are made to pass through IDRBT gateway Account management system at higher level with enabled banking features Transactions features and security for the same More optimization means for transparent gif and png images Mobile Informational Portal with other features like live streaming of bank events. Show unmanageable elements more efficiently (optional) 9 P a g e
Appendix Analysis of Mobile Pages of Indian Public sector Banks and some Private Sector Banks Practices / Banks Allahabad Bank Andhra Bank Net Bank of Baroda Net Bank of India Net Bank of Maharashtra Canara Net Bank Central Bank of India Net Corporation Bank Net Dena Bank Net HDFC Bank ICICI Bank IDBI Bank Indian Bank Indian Overseas Oriental Bank Bank of Commerce Punjab National Net Punjab Bank and Sind Bank State Bank of India State Bank of Bikaner and State Bank of Jaipur Net Hyderabad State Net Bank of Mysore Net State Bank of Patiala Net State Bank of Travancore Syndicate Bank Net Union Bank of India Net United Bank of India UCO Bank Vijaya Net Bank Net MobiReady Score (out of 5) 66. 68. 56 6.6 75 9. 6.6 5. 69. 8.6. 5 6 67 8. 5.6 8.6.6.8 6.6 66.8 8.6 6.8 Mobile User Friendly (WC in %) 8 9 5 58 8 5 6 6 8 9 9 9 Page Size (Kb). 9.6 76. 7.9 +..8 7. 5.6.9 8. 8.6.7.8 6+ 597.5 5..6 6.9 6.7 5.56 8 7.6 9.8 8+ 6. Network Requests 9 5 6+ 5 8 5 6 9 7+ 5 6 7 5 6 5 P a g e
5 P a g e Design and Implementation of Framework for Bank s Mobile Websites Estimated Page Loading Time (in seconds) Good Bad Bad Good Bad Fair Bad Good Bad Bad Bad Fair Good Bad Bad Bad Good Good Bad Bad Bad Bad Good Bad Bad Good Bad Bad WIFI..8...6.9..5.9...5.5.7.78..5.9.5.7..8...7. G.8 6.5.8. 6..69 6.8..8..5..9.6 7..9.6.78.7.59..98.5 7.9 5.8.9. 9. GPRS 5.57.6.7.5. 9.5 5.9.8 5.7 8..9 6.5.5 5.8. 6.85 6. 5. 8..5 8..6.96.88 9.8 6.75 5.. Category wise Failures 7 8 7 5 5 9 5 8 7 7 7 8 9 5 5 5 5 7 7 7 Rely on Web standards 5 6 7 6 6 5 Stay away from known hazards 5 5 5 Be cautious of device limitations Check graphics and colors 5
5 P a g e Design and Implementation of Framework for Bank s Mobile Websites Keep it small Use the network sparingly HTTP errors Think of User on the Go Critical/Urge nt Issues Page Not Found Large Page Size > Kb Use of External Resources > resources Invalid Markup UseMap (Image Map)
5 P a g e Design and Implementation of Framework for Bank s Mobile Websites Invalid image formats Severe Issues Improper Table Layout Nested Tables Unstructured Object and Scripts No XHTML Mobile Profile Validation Invalid Content Format Support (CSS Syntax) Popups Medium Issues
5 P a g e Design and Implementation of Framework for Bank s Mobile Websites No Caching Resized Images (Graphics not as per requirement) Inconsistent declaration of Character Encoding Two many Whitespaces/ Comments No AccessKeys Page size limit (5- kb) Large no. of External Resources No Doctype Declaration Use of Frames HTTP errors
55 P a g e Design and Implementation of Framework for Bank s Mobile Websites Low Issues Missing images atrributes Invalid Markup Absolute Measures in styling Invalid Content Format Support (Images OR application/x html+xml) Missing 'Alt' attributes for images Page Size Limit > Kb Unsupported Styles properties Use of Event Attributes Used Inline Style Attributes Too much small elements for styling
56 P a g e Design and Implementation of Framework for Bank s Mobile Websites Other Issues and Warnings Existence of Scripting Existence of Tables Existence of Invalid CSS properties No default Input Method Auto Refresh No Page Title No Google sitemap No transform in cache control No UTF-8 of Character Encoding
Unknown Link Target support Format 57 P a g e
References. http://validator.w.org/mobile/. http://www.mobilephoneemulator.com/. http://ready.mobi/launch.jsp?locale=en_en. http://mobile-frameworks-comparison-chart.com/ 5. http://en.wikipedia.org/mobile%banking 6. http://jquerymobile.com/ 7. http://www.developereconomics.com/pros-cons-top-5-cross-platform-tools/ 8. http://mashable.com//8//cross-platform-mobile-development-tools/ 9. http://speckyboy.com///7/-new-frameworks-for-web-and-mobile-appdevelopers/. http://www.developereconomics.com/look--mobile-ui-frameworks/. http://sixrevisions.com/javascript/mobile%c%aweb-development-frameworks. http://simplehtmldom.sourceforge.net/manual.htm. http://simplehtmldom.sourceforge.net/manual_api.htm. http://php.net 58 P a g e