Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Macro name changed from html to html-bobswift during server to cloud migration processing.
Create the web contents to which anyone can access using web accessibility check feature.

Experiencing

HTML
<!-- external modules -->
<script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/formulaParser/formula-parser.min.js'></script>
<script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/SEDocModelParser/SEDocModelParser.min.js'></script>
<script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/SEShapeManager/SEShapeManager.min.js'></script>
<script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/codemirror.min.js'></script>
<script type="text/javascript" src="https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/xml.min.js"></script>
<link rel='stylesheet' href='https://www.synapeditor.com/se/resource/synapeditor/externals/codeMirror/codemirror.min.css'>

<!-- Synap Editor -->
<script src='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.config_en.js'></script>
<script src='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.min.js'></script>
<link href='https://www.synapeditor.com/se/resource/synapeditor/synapeditor.min.css' rel='stylesheet' type='text/css'>

<!-- plugins -->
<script type="text/javascript" src='https://www.synapeditor.com/se/resource/synapeditor/plugins/webAccessibilityChecker/webAccessibilityChecker.min.js'></script>
<link rel='stylesheet' href='https://www.synapeditor.com/se/resource/synapeditor/plugins/webAccessibilityChecker/webAccessibilityChecker.min.css'>

<div style="background-color: #ffffff; width:99%; height:500px;">
        <div id="synapEditor">
            <p>
                <span class="se-drawing-object-wrapper se-image" data-drawing-object-id="se_49f38f9a-888f-425b-b069-257134736430" style="display: inline-block; text-indent: 0px; vertical-align: baseline;">
                    <img src="https://synapeditor.com/se/resource/images/editor/desktop/editor_logo.png" style="vertical-align: bottom; width: 329px; height: 81px;">
                </span>
            </p>
            <table data-template-id="0" style="width: 100%; margin: 0px;">
                <colgroup>
                    <col style="width: 40%;">
                    <col style="width: 50%;">
                </colgroup>
                <tbody>
                    <tr>
                        <th scope="col" style="background: rgb(242, 242, 242); font-weight: bold; font-family: Nanum; font-size: 13px; text-align: center; padding: 7px 0px; margin: 0px; border: 1px solid rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span>Division</span>
                            </p>
                        </th>
                        <th scope="col" style="background: rgb(242, 242, 242); font-weight: bold; font-family: Nanum; font-size: 13px; text-align: center; padding: 7px 0px; margin: 0px; border: 1px solid rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span>Definition</span>
                            </p>
                        </th>
                    </tr>
                    <tr>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span style="font-weight: bold; color: rgb(61, 127, 18);">Guideline for Enhancement of the Accessibility of the Disabled and the Elderly to Information and Communication</span>
                            </p>
                        </td>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span>To provide availability of information and communication products and services to those who intend to use them.</span>
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <a data-hyperlink-id="758e3650-5ba7-4a9b-919a-ca038b343f35" data-href="http://www.w3.org/WAI/intro/accessibility.php" title="Move to WAI: Web Accessibility Initiative website" target="_blank" href="http://www.w3.org/WAI/intro/accessibility.php" style="text-decoration: underline !important; color: rgb(29, 158, 160) !important;">
                                    <span>Web Accessibility Initiative (WAI)</span>
                                </a>
                            </p>
                        </td>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span>Web accessibility is to assure that the disabled can also use the web, by making the web contents </span>
                                <span>&nbsp;</span>
                                <span style="color: rgb(197, 67, 4); padding: 0px; margin: 0px;">perceivable, operable and understandable</span>
                                <span> for the disabled and robust enough to be utilized regardless of the technology</span>
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <a data-hyperlink-id="3b662b73-3896-4c3a-a79c-e718f9768a6b" data-href="http://en.wikipedia.org/wiki/Web_accessibility" title="Move to Wikipedia website" target="_blank" href="http://en.wikipedia.org/wiki/Web_accessibility" style="text-decoration: underline !important; color: rgb(29, 158, 160) !important;">
                                    <span style="font-weight: bold; color: rgb(61, 127, 18);">Wikipedia</span>
                                </a>
                            </p>
                        </td>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <span>Web accessibility is to allow users using not only the standard browsers but also various user agents easily access to the web page and to ensure that the disabled can also use the web through that</span>
                            </p>
                        </td>
                    </tr>
                    <tr>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);">
                            <p style="margin: 0px;">
                                <a data-hyperlink-id="73ecb492-327a-4c88-acd3-0156491bf5cb" data-href="http://www.nia.or.kr/" title="Move to National Information Society Agency website" target="_blank" href="http://www.nia.or.kr/" style="text-decoration: underline !important; color: rgb(29, 158, 160) !important;">
                                    <span style="font-weight: bold; color: rgb(61, 127, 18);">National Information Society Agency</span>
                                </a>
                            </p>
                        </td>
                        <td style="padding: 7px 15px 7px 10px; margin: 0px; border-width: 1px; border-style: solid; border-color: rgb(0, 0, 0);" class="">
                            <p style="margin: 0px;">
                                <span>To ensure that 
                                <span style="color: rgb(197, 67, 4); padding: 0px; margin: 0px;">any user (the disabled, the elderly, etc.)</span>
                                <span> in any technical environment can access to all the information provided in a website without a special skill</span>
                            </p>
                        </td>
                    </tr>
                </tbody>
            </table>
		</div>
</div>
<script>
		const config = Object.assign(synapEditorConfig, {
			"editor.license":"/se/resource/license.json",
			"editor.toolbar": [
				"new","|", 
				"WebAccessibilityChecker"
			],
			"editor.menu.show": false
			});
		window.editor = new SynapEditor("synapEditor", config, document.getElementById('synapEditor').innerHTML);
</script>