A Study On A Lightweight Web SVG Button Accessibility Optimization Method

SVG(Scalable vector graphics)is a code-controlled lightweight image file format whose superior features are favored by web developers,so the use of SVG to implement button elements has gradually become a mainstream means of web development.However,as SVG buttons are widely used on all kinds of web pages,their accessibility problems are also exposed.The root of the accessibility problem of SVG buttons on web pages is that web developers do not make accessibility changes in the process of developing web pages due to various reasons.In addition,most of the existing accessibility optimization methods are oriented towards the development process,with complex model structures and optimization suggestions for developers only,which cannot meet the optimization requirements of automation,light weight and immediacy.Therefore,this paper researches and implements the accessibility optimization of web SVG buttons with these three optimization requirements as guidelines.(1)An empirical study for web pages and visually impaired users was conducted to understand the current state of the field and audience appeal of the research questions.The study first explored the accessibility of SVG buttons,the accessibility problem types,and the association with website categories,using the home pages of 1200 highly visited websites as the research target,in order to assess the current status of SVG button accessibility on web pages.Secondly,we conducted semi-structured interviews with seven visually impaired users,and obtained 81 responses to a questionnaire to understand the attitudes and demands of visually impaired users on the accessibility of SVG buttons.(2)A lightweight automated web page SVG buttons classification and accessibility optimization method is proposed.The method first manually annotates the web empirical research data,constructs 18 commonly used categories,and expands the size of the category datasets and preprocesses the datasets.Next,the SVGs in the category datasets are sampled with high-frequency features and redundant features are removed,and the category feature sets are transformed into category feature templates,and sub-templates are further refined for the categories with multiple typical feature distributions.Then the category feature templates are used to match and classify the SVG buttons to be optimized.Finally,the SVG and web categories are analyzed together and accessibility attributes are injected into the SVG buttons to achieve optimization of the overall accessibility of the web page.In addition,this paper implements a local method prototype and conceptualizes three kinds of deployment of the method.Through experimental verification,the SVG button classification and accessibility optimization method for web pages proposed in this paper can effectively improve the accessibility of web pages and SVG buttons.Compared with five baseline methods,the SVG classification process of this paper’s method has significantly improved in terms of accuracy,precision,recall and F1-score,and is at the leading level in terms of running cost in both time and space,which verifies the effectiveness of the SVG classification method.At the same time,the results of user experiments show that the accessibility of optimized web pages is significantly improved,and the quality of description labels is also affirmed by users,thus verifying the effectiveness of the accessibility optimization method.In summary,the results of the experiments show that this method can effectively optimize the accessibility of SVG buttons on web pages.