JP2011180916A - Web page diagnosis efficiency-improving system, web page diagnosis efficiency-improving method, and program - Google Patents

Abstract

<P>PROBLEM TO BE SOLVED: To provide a Web page diagnosis efficiency-improving system, a web page diagnosis efficiency-improving method, and a program for shortening a time for diagnosis in diagnosing entire web pages of a large-scale Web site. <P>SOLUTION: When an invoked file to be a file invoked by an HTML, such as an image, a video, a sound, or an HTML file, is used at a plurality of places in a Web site, a diagnosis result by a man about the invoked-file is reused. That is, the diagnosis result of the invoked-file is used for a diagnosis result of a plurality of Web pages inside the Web site. <P>COPYRIGHT: (C)2011,JPO&INPIT

Description

  In the present invention, when diagnosing the degree to which the target web page considers accessibility, the degree to which each HTML element included in any web page is common to the web pages in the web site The present invention relates to a web page diagnostic efficiency improvement system for determining whether a web page is being used.

  Various information can be obtained by the spread of the Internet. One of the main uses of the Internet is browsing web pages. A web page is composed of an HTML file, a style sheet, an image, a video, and the like, and generally displays text and an image on a browser as described in the HTML file.

  However, web pages are not only used by browsers, but are also used by various software and systems such as voice reading software. It is required to design a web page so as to be compatible with various software and systems, that is, various browsers, that is, ensuring accessibility. In particular, public sites such as local governments are required to support web accessibility, and the number of sites that consider accessibility is increasing. From the viewpoint of accessibility, it is necessary to point out an unfavorable design portion and prompt correction, and a check tool that can be automatically checked has been developed (for example, see Patent Document 1).

JP 2006-171544 A

  A conventional check tool that checks (diagnose) whether accessibility is taken into consideration can point out an unfavorable design part from the viewpoint of accessibility. Items to be diagnosed (diagnostic items) are created based on guidelines such as JIS standards (JIS X 8341-3) and WCAG 2.0 (Web Content Accessibility Guidelines 2.0). By using the check tool, it is possible to find an undesired design portion and correct the design portion.

  However, although it is possible to simplify the diagnosis by discovering an unfavorable design from the usage of the HTML tag or the like, it may be necessary to make a human judgment as to whether the accessibility is finally taken into consideration.

  For example, one of the good design methods is an item of attaching alternative text to an image. By attaching an alternative text to an image, a blind user who cannot use image information can acquire image information by reading the alternative text with synthesized speech using voice reading software. At this time, it is difficult for the check tool to automatically determine whether or not the alternative text appropriately represents the information of the image, and it is necessary for humans to determine it by looking. In this way, when a file such as an image, video, or sound is designated, human judgment is often required.

  One website is composed of a plurality of web pages, and one web page is composed of a plurality of HTML elements such as images. Since one website may be composed of tens of thousands of web pages, it is very time consuming to diagnose all the web pages of such a large website.

  An object of the present invention is to provide a web page diagnosis efficiency improvement system, a web page diagnosis efficiency improvement method, and a program capable of shortening the diagnosis time when diagnosing all web pages of a large-scale website. .

  The present invention uses the diagnosis result of a called file, which is a file called from HTML, such as a file such as an image, video, audio, or HTML file, as the diagnosis result of a plurality of web pages in the website. If diagnosis is performed once for the call file, it is not necessary to perform diagnosis multiple times. Therefore, it is possible to reduce the time for diagnosing all the web pages of the website.

  According to the present invention, when a called file that is a file called from HTML (file such as an image, a video, a sound, an HTML file, etc.) is used at a plurality of locations in a website, a human has already performed. Since the diagnosis result can be used as a diagnosis result, there is no need to make a duplicate diagnosis, and therefore, the time for diagnosing a web page can be shortened.

  Also, in the present invention, when there are a plurality of diagnostic items for the same called file, if the diagnostic items are displayed at the same time, the called file can be diagnosed at one time, thereby reducing the time required for the diagnosis. There is an effect that can be.

It is a block diagram which shows the web page diagnostic efficiency improvement system 10 which is Example 1 of this invention. It is a flowchart which shows operation | movement of the web page diagnostic efficiency improvement system 10, and is a flowchart which shows the operation | movement which diagnoses a called file and a related matter (alternative text etc.). It is a flowchart which shows operation | movement of the web page diagnostic efficiency improvement system 10, and is a flowchart which shows the operation | movement which applies the diagnostic result shown to FIGS. 2-1 to the same diagnostic object, and makes a diagnosis efficient. It is a figure which shows the example of diagnostic object web page data. It is a figure which shows the example of a diagnostic detail screen. It is a figure which shows the analysis result of the web page whose URL ID = 1, and is a figure which shows the list of called files. It is a figure which shows the state which put all the analysis results of the diagnostic object website into one, ie, the state which rearranged all the analysis results in order with small ID of the called file. It is a figure which shows the example of the diagnostic detail screen of a diagnostic target web page. It is a figure which shows the example of the diagnostic result relevant to the called file in a diagnostic object website. It is a figure which shows the example of the diagnostic result screen of a diagnostic object web page. It is an example of a diagnostic object type and a diagnostic item.

  The modes for carrying out the invention are the following examples.

  FIG. 1 is a block diagram showing a web page diagnosis efficiency improvement system 10 that is Embodiment 1 of the present invention.

  The web page diagnosis efficiency improvement system 10 includes a transmission / reception unit 11, a control unit 12, an information analysis unit 13, an information configuration unit 14, an information storage unit 15, an information input unit 16, and an information output unit 17. . The web page diagnosis efficiency improvement system 10 corresponds to the PC main body, communicates with the web server WS1 via the network NW1, and receives and displays the web page. The information input unit 16 corresponds to an input system such as a keyboard and a mouse, and the information output unit 17 corresponds to a monitor and a speaker.

  In the first embodiment, a called file that is a file such as an image or a video specified in a diagnosis target web page is extracted from the diagnosis target web page, and a diagnosis result for the same image or video is shared. It is an example.

  The information analysis unit 13 is an example of an extraction unit that constitutes a web page and extracts a called file that is a file called from HTML. The control means 12 is an example of a called file ID assigning means for assigning the called file ID to the called file. The information storage unit 15 is an example of a diagnostic result storage unit that stores a diagnostic result for the called file. The control means 12 and the information output means 17 are examples of diagnostic result display means for displaying a diagnostic result for a called file with the same called file ID.

  Next, the operation of the web page diagnostic efficiency improvement system 10 will be described.

  FIG. 2A is a flowchart illustrating an operation of the web page diagnosis efficiency improvement system 10, and is a flowchart illustrating an operation of diagnosing a called file and related items (alternative text or the like).

  FIG. 2-2 is a flowchart showing the operation of the web page diagnosis efficiency improvement system 10, and is a flowchart showing an operation of applying the diagnosis result shown in FIG. 2-1 to the same diagnosis target to improve the diagnosis efficiency.

  FIG. 3 is a diagram illustrating an example of diagnosis target web page data.

  In S <b> 1, the web page diagnosis efficiency improvement system 10 reads out the diagnosis target web page data recorded in advance in the information storage unit 15 and shown in FIG. 3. Here, the diagnosis target web page data is prepared as a list of URLs as shown in FIG. 3. However, only the URL of the top page is shown, and all of the subordinate web pages may be the diagnosis target. In addition, if there is a linguistic difference such as an English page and a Japanese page, they may be treated as different web pages, so only the URL of the top page is shown, and the subordinate Japanese web page, or An English web page may be designated. Since the main language is specified in the “lang” attribute of the “body” element, it is possible to automatically determine whether the page is an English page or a Japanese page.

  It is possible in a conventional accessibility check tool to extract a design part that is not preferable from the viewpoint of accessibility in a web page. The web page is described in a markup language such as HTML. Markup languages clearly describe the meaning of an object by tagging. For example, there are the following HTML formats for images.

  <img source = “picture1.jpg” alt = “Volleyball tournament photos”>

  This means that the picture picture1.jpg is displayed, and the alternative text is “Photo of Volleyball Tournament”. The voice-to-speech software reads the alternative text “Volleyball Tournament Photo” with synthesized voice instead of reading the image.

  When diagnosing whether or not this part is properly designed, syntax analysis is performed by searching for img, source, etc. in the source file, thereby obtaining the image file name and alternative text. Subsequently, when diagnosing whether or not the alternative text appropriately represents the meaning of the image, it is necessary for a human to compare and determine the image and the alternative text. In other words, since the technology for extracting the meaning of an image is still under development, it is necessary for a human to compare the image with the alternative text and determine the image.

  On the other hand, there are images that should be ignored by assistive technologies such as assistive technologies and voice-reading software. For example, a decorative image used for layout is an image that should be ignored by assistive technology because there is no information conveyed by the image. In such a case, it is described as follows.

  <img source = “image / spacer1.jpg” alt = “”>

  Since the contents of the alt attribute, that is, the alternative text is blank, nothing is read out. In this case, human judgment is required to diagnose whether the alternative text is appropriate.

  In addition, if there are characters in the image, humans can also determine diagnostic items for the image itself, such as diagnostic items for diagnosing whether the contrast between the character color and the background color is sufficient. This is a necessary diagnostic item. In addition, in the case of an image, a diagnosis item for diagnosing whether or not an undesired image such as fast blinking is included therein, a diagnosis item for diagnosing whether a caption is prepared, etc. also require human judgment. It is a diagnostic item. For such diagnostic items related to image content and video content, diagnosis using a conventional check tool is still under development, and human diagnosis is required.

  By the way, in the same website, the same image is often used in common. In particular, if only a single image is prepared for the layout, etc., and this prepared image can be used in common on the website, it is efficient and management has many advantages. Often used in web pages, and the same image may be used in multiple locations within a web page. Or, the same image is often used for images such as banner advertisements on other pages. Hereinafter, a file called from an HTML file, such as an image or a video, is referred to as a “called file”.

  In S1, for the URL in the first line in FIG. 3, after the transmission / reception means 11 receives a web page from the web server WS1 via the network NW1, in S2, the received web page data is transferred to the control means 12 in S2. Through the information storage means 15. In S 3, the information analysis unit 13 analyzes the content included in the recorded web page, and the analysis result is recorded in the information storage unit 15.

  Next, the analysis method in Example 1 is demonstrated.

The web page is generally composed of an HTML document. Various kinds of HTML elements are included in the HTML document, and a part indicating a called file such as an image or a video is searched for in various HTML elements. When specifying an image with an img element,
<img source = “image / picture1.jpg” alt = “Volleyball Tournament Photos”>
Therefore, the img element is extracted, and further, the value of the source attribute of the img element is extracted. picture1. It can be seen that an image jpg exists under the image directory. Further, the alternative text recorded as the value of the alt attribute is also extracted.

  FIG. 5 is a diagram showing an analysis result of a web page with URL ID = 1, and a diagram showing a list of called files.

  This result is recorded as shown in the first row of FIG. However, FIG. 5 is a diagram showing the analysis result of the web page with URL ID = 1 in FIG. 3, and is a diagram showing a list of called files.

If the image is as follows,
<img source = “image1 / spacer1.jpg” alt = “”>
Since the alt attribute value, that is, the alternative text is blank, “(blank)” is recorded in the column of the alternative text, for example, as shown in the second line of FIG. And if it ’s a video, for example,
<object data = ”movie / movie1.mpeg” type = ”application / mpeg”> Climbing footage </ object>
For example, this result is recorded as shown in the seventh line of FIG.

If it is an audio file, for example,
<embed src = ”sound / sound1.wav”><noembed> Bonenkai speech </ noembed>
Therefore, this result is recorded as shown in the 10th line of FIG. In this way, a list of called files specified in the target web page can be created as shown in FIG.

  Here, the type of the called file can be obtained from the extension of the file, the HTML element, and the MIME type. For example, if the MIME type is image / gif in the object file, the type of the called file can be obtained as an image. Information for obtaining the type is recorded in the information storage unit 15 in advance.

  If the URL and the file name are the same, the same called file is designated. For this reason, it is sufficient to diagnose the called file to be diagnosed only once. The same called file ID is assigned to the same called file. The file name on the second line and the file name on the third line in FIG. gif but the URL is different. Since different called files are designated, different IDs are assigned as IDs of the called files. The files in the third, fourth, and fifth lines in FIG. 5 have all the called file IDs “3”, indicating the same called file.

  Furthermore, alternative text is required if the called file is a non-text element. If it is an img element, the alt attribute value is an alternative text, and if it is an object element, the contents of the object element are the alternative text. The alternative text is also added to FIG.

  As shown in the first line and the eleventh line shown in FIG. 5, even if the called file is the same, the alternative text may be different. As described above, even if the called files are the same, if the alternative texts are different, it is necessary to distinguish them from each other. In this case, the element ID is used. If the URL, file name, HTML element, MIME type, and alternative text are all the same, the same ID is assigned to the “element ID”, and the URL, file name, HTML element, MIME type, alternative text are given. If one of them is different, it is a newly assigned ID.

  The first line and the eleventh line in FIG. 5 have the same ID of the called file but different element IDs.

  Next, in S4, since the URL ID = 1 is not the last target web page, the process returns to S1. The analysis similar to the analysis in S1 to S3 is sequentially executed for each of the diagnosis target web pages shown in FIG. 3 until the analysis of all the web pages specified in FIG.

  It should be noted that the ID of the called file is assigned to each type of called file so that there is no duplication. That is, when the ID of the called file is determined, the called file is specified.

  When the analysis of all web pages is completed in S4, the process proceeds to S5. At this time, analysis results similar to the analysis results shown in FIG. 5 are completed for all target web pages.

  In S5, the analysis results are combined into one for each called file in the website and recorded in the information storage unit 15. Specifically, all the analysis results are combined into one and rearranged in ascending order of the ID of the called file.

  FIG. 6 is a diagram illustrating a state in which all analysis results of the diagnosis target website are combined into one, that is, a state in which all analysis results are rearranged in ascending order of the ID of the called file.

  That is, the result shown in FIG. 6 is a state in which the diagnosis has not yet been executed, and the content of the diagnosis target website is clarified and the same called files are simply collected. That is, the state shown in FIG. 6 is a stage before diagnosis.

  In S6, the called file used at a plurality of locations is displayed, and the diagnostician inputs the diagnostic result. That is, first of all, a called file used in a plurality of locations is extracted from the called files. In this case, it is only necessary to search for a file having the number of uses of 2 or more from the analysis results shown in FIG.

  FIG. 7 is a diagram illustrating a diagnosis detail screen in the embodiment.

  In order to diagnose the extracted called file, a diagnostic details screen shown in FIG. 7 is displayed, and diagnostic items related to the called file are displayed at a time. FIG. 7 summarizes diagnostic items (“contrast is sufficient?”, “Does not blink?”, “Decorative image?”) For the called file with the called file ID = 1. The diagnosis person diagnoses those diagnosis items, and inputs the diagnosis result by inputting characters or selecting from the options. A plurality of diagnosis items are displayed in the column “Diagnosis by Diagnosis” shown in FIG. Thus, if a plurality of diagnostic items for images are listed, diagnosis for one image can be executed at a time. FIG. 7 shows a screen after inputting the diagnosis result.

  In S7, diagnostic items related to the called file, such as alternative text, are displayed, and the diagnostician makes a diagnosis. In each of the called files, the example shown in FIG. 4A diagnoses whether the alternative text is appropriate. The diagnostician makes a diagnosis by comparing the image of the called file with the alternative text. When inputting a diagnosis result, it is input by inputting characters or selecting from choices. FIG. 4 (1) shows a screen after inputting the diagnosis result. Here, since the diagnosis items for the called file (“is the contrast sufficient?”, “Does it blink?”, “Is it an image for decoration?”) Have already been diagnosed in S6, FIG. In 1), “Diagnosed” is also displayed.

  It should be noted that the diagnosis items for the called file (“Contrast is sufficient?”, “Does it blink?”, “Is it an image for decoration?”) Are not executed in S6, but are collected in S7. You may make it perform. In this case, the diagnostic items of the called file are displayed on the right side of FIG. 4 (2), and the diagnostician diagnoses the diagnostic items, inputs characters, selects from the options, and inputs the diagnostic results. FIG. 4 (2) shows a screen after inputting the diagnosis result. Once this diagnosis has been performed, “Diagnosed” is displayed as shown in FIG. 4 (1), so there is no need to perform the same diagnosis.

  If the alternative text is also diagnosed as “appropriate” in FIG. 4 (2), in other cases such as FIG. 4 (1), that is, when the ID of the called file is 1 and the alternative text is different, It may be “appropriate”. This is possible because the data in FIG. 6 shows that the alternative text is different. Alternatively, when the alternative text is different in the data of FIG. 6, FIG. 4 (1) and FIG. 4 (2) may be displayed at the same time to facilitate diagnosis of which alternative text is correct. Thus, in Example 1, diagnosis can be performed quickly. The display screen as described above is created by the information composition unit 14 based on the information stored in the information storage unit 15 and displayed by the information output unit 17.

  In S8, the diagnostician confirms that the diagnosis of all called files has been completed. If not completed, the process returns to S6, and if the diagnosis is completed, the process proceeds to the next.

  FIG. 8 is a diagram illustrating an example of a diagnosis result related to the called file in the diagnosis target website.

  Then, in FIG. 8, in the column of the called file diagnosis result, whether or not the called file is created in accordance with the guidelines and the alternative text of the called file is appropriate, It is added to the column of the alternative text diagnosis result.

  According to FIG. 8, the diagnosis result as to whether or not the called file is observing the guideline is described in the “callable file diagnosis result” column, and if the guideline is observed, “appropriate” is described. If it is not observed, “Inappropriate” is described. In addition, the diagnosis result of the alternative text is described in the column of “Alternative text diagnosis result”, “appropriate” is described if it is an appropriate alternative text, and “unsuitable” is described if it is not an appropriate alternative text. ing.

  Next, a method peculiar to the embodiment for diagnosing a called file will be described before a diagnosis generally performed using a diagnostic tool.

  First, a diagnosis result relating to the called file is acquired, and a diagnosis is not necessary when the diagnosis is performed using the diagnosis tool. In S1 to S8, a diagnosis result regarding the called file can be obtained. If this result is used, diagnosis using a diagnostic tool can be performed as shown in the flowchart of FIG. When diagnosing the called file, diagnosis performed using a diagnostic tool may be executed simultaneously. That is, when a called file that has not been diagnosed appears in the diagnosis using the diagnostic tool shown in FIG. 2-2, the process proceeds to the flowchart in FIG. You may return to diagnosis 2. At this time, the diagnosis result of FIG. 2-1 is reflected.

  In S11, each web page is diagnosed using a diagnostic tool. In this case, the diagnostic tool is stored in a storage unit such as the information storage unit 15 and the control unit 12 automatically executes the diagnosis. The diagnostic tool diagnoses the web page information stored in the information storage unit 15. The target URL may be input via the information input unit 16, or the diagnosis target web page data shown in FIG.

  FIG. 9 is a diagram illustrating an example of a diagnosis result screen of a diagnosis target web page.

  In S12, the result is displayed as shown in FIG. That is, the diagnosis items that can be automatically checked according to the guideline are described as “automatic” in the column of the diagnosis method, and the diagnosis result is described. For example, in FIG. 9, in the item “Is element has alt attribute?” With diagnosis ID = 1, text search is performed for the img element in the HTML file, and whether there is an alt attribute in the text search. And check it. If there is an alt attribute, “appropriate” is displayed as the result, and “improper” is described if there is no alt attribute. The diagnosis item of diagnosis ID = 2 is “Is the alt element value of the img element appropriate?” However, since the diagnostician must determine whether the alt attribute value is appropriate or not, “manual” is displayed in the diagnosis method column. Is described. “Manual” indicates a diagnosed item in which diagnosis is performed in S1 to S8 and a diagnosis result is input. In S <b> 13, it is determined whether or not the diagnosis person has input the diagnosis result for the diagnosis item that needs the diagnosis of the diagnosis person. In the item of diagnosis ID = 98, the column of diagnosis method and diagnosis result is “confirmation required”. That is, since it is an item that must be determined by human eyes, “Confirmation Required” is displayed in the columns of the diagnosis method and the diagnosis result. In this case, the diagnostician inputs a diagnosis result in S13. When a person makes a diagnosis, the diagnosis result screen shown in FIG. 9 is updated. The “Diagnosis Method” column is changed from “Confirmation Required” to “Manual”, and the “Diagnosis Result” column is changed from “Confirmation Required” to “Appropriate” or “Unsuitable”.

  FIG. 10 is a diagram illustrating examples of diagnosis target types and diagnosis items.

  The diagnostic items corresponding to the type of the called file are collected as shown in FIG. 10 and stored in advance in the information storage unit 15. If the type of the called file is known, the related diagnostic items can be known, so that the diagnosis is completed once and the diagnosis can be made more efficient.

  In S14, it is determined whether there is no diagnostic item to be confirmed. When there are no diagnostic items to be confirmed and results are entered in all the diagnostic items, the diagnosis of the web page ends.

  According to the above embodiment, since a plurality of diagnosis items corresponding to one called file can be diagnosed at a time, it is possible to diagnose efficiently.

  In addition, according to the above-described embodiment, once diagnosis is performed on the called file, the diagnosis result is displayed on the diagnosis screen performed in step S11. Therefore, it is necessary to execute a plurality of diagnoses on the same called file. Since there is no duplicate diagnosis, the diagnosis can be performed efficiently. That is, the said Example applies the same diagnostic result with respect to the to-be-called file with same ID of the extracted to-be-called file in all the web pages in the website used as a diagnosis object. That is, the diagnosis result shown in FIG. 2-1 is applied to the same diagnosis target as shown in S13 of FIG. 2-2.

  Moreover, in the said Example, if a means is substituted to a process, it can grasp | ascertain as invention of a method. That is, in the above embodiment, a web page is configured, and an extraction process in which an extraction unit extracts a called file that is a file called from HTML, and the ID of the called file is assigned to the called file. The ID granting step of the called file given by the ID granting unit, the diagnostic result storing step of storing the diagnostic result for the called file in the diagnostic result storing unit, and the called file having the same ID of the called file It is an example of the web page diagnostic efficiency improvement method which has a diagnostic result display process which a diagnostic result display means displays a diagnostic result.

  In this case, when a different alternative text is set for the called file having the same ID of the extracted called file, confirmation of the diagnostician is requested. In addition, the diagnosis result is shared by all target websites for the called files having the same ID of the extracted called file. Further, a plurality of target diagnosis items are simultaneously displayed for the called files having the same ID of the extracted called file.

  Moreover, the said Example can be grasped | ascertained as invention of a program. That is, the said Example is an example of the program which makes a computer perform the said web page diagnostic efficiency improvement method.

10 ... Web page diagnosis efficiency improvement system,
11: Transmission / reception means,
12 ... Control means,
13: Information analysis means,
14: Information composition means,
15: Information storage means,
16: Information input means,
17: Information output means.

Claims (9)

Extraction means for configuring a web page and extracting a called file that is a file called from HTML;
A called file ID giving means for giving the called file ID to the called file;
Diagnostic result storage means for storing a diagnostic result for the called file;
Diagnostic result display means for displaying a diagnostic result for a called file having the same ID of the called file;
A web page diagnosis efficiency improving system characterized by comprising: In claim 1,
A web page diagnosis efficiency improvement system which asks for confirmation of a diagnostician when different alternative texts are set for a called file having the same ID of the extracted called file. In claim 1,
A web page diagnosis efficiency improvement system, wherein the same diagnosis result is applied to a called file having the same ID of the extracted called file in all web pages in a target website. In claim 1,
A web page diagnosis efficiency improvement system that simultaneously displays a plurality of target diagnosis items for a called file having the same ID of the extracted called file. An extraction step in which the extraction means extracts a called file that is a file that is configured from a web page and is called from HTML;
A called file ID assigning step in which the called file ID assigning means assigns the called file ID to the called file;
A diagnostic result storage step of storing a diagnostic result for the called file in a diagnostic result storage means;
A diagnostic result display step in which a diagnostic result display means displays a diagnostic result for the called file having the same ID of the called file;
A web page diagnosis efficiency improving method characterized by comprising: In claim 5,
A web page diagnosis efficiency improvement method that requests diagnosis by a diagnostician when different alternative texts are set for a called file having the same ID of the extracted called file. In claim 5,
A method for improving the efficiency of web page diagnosis, characterized in that a diagnosis result is shared by all target websites with respect to a called file having the same ID of the extracted called file. In claim 5,
A web page diagnosis efficiency improvement method, wherein a plurality of target diagnosis items are simultaneously displayed for a called file having the same ID of the extracted called file.   The program which makes a computer perform the web page diagnostic efficiency improvement method of any one of Claims 5-8.

Images