Changes between Initial Version and Version 1 of HTMLFixes

Timestamp:

Jul 20, 2008, 11:46:06 PM (16 years ago)

Author:

simonp

Comment:

--

HTMLFixes

@@ +1 @@
+= Proposal number : ? Proposal title Standardizing the HTML produced by GeoNetwork =
+
+|| '''Date''' || 2008/07/21 ||
+|| '''Contact(s)''' || simonp ||
+|| '''Last edited''' || [[Timestamp]] ||
+|| '''Status''' || draft, being discussed, in progress ||
+|| '''Assigned to release''' || Release number, to be determined ||
+|| '''Resources''' || Simon Pigot, Grant Mckenzie and ? ||
+
+== Overview ==
+
+GeoNetwork currently produces HTML that conforms to a variety of standards eg 4.01 and earlier, xhtml and a number of personal interpretations of these :-). A single html standard needs to be adopted, a document type inserted in our html and, most importantly, a testing framework needs to be adopted which will allow developers to validate the html they produce to ensure that it conforms with the html standard we adopt.
+
+Why is this important? If you don't give guidance to a browser on what type of html to expect and provide correct html then strange problems can occur which are both difficult and time consuming to find and fix. An example is the height="100%" attribute on some html tables. Internet exploder will (occasionally) fail to render tables with this attribute, whilst Firefox ignores it. 
+
+Bolsena meeting agreed top adopt HTML 4.01 strict but did not find a testing framework for developers to use (manual methods were suggested which are too time consuming).
+... 
+
+=== Proposal Type ===
+ * '''Type''': changes in GUI, configuration and testing
+ * '''App''': !GeoNetwork and !Intermap
+ * '''Module''': XSLT presentation layer, configuration layer
+
+=== Links ===
+ * '''Documents''':
+ * '''Email discussions''':
+ * '''Other wiki discussions''': None as yet.
+
+=== Voting History ===
+ * Not submitted for voting yet.
+
+----
+
+== Motivations ==
+See overview above. Motivation of this proposal is to find a validation framework that developers can easily use to ensure compliance.
+
+== Proposal == 
+Implement [JTidyServletFilter http://jtidy.sourceforge.net/multiproject/jtidyservlet/filter.html] and [JTidyServlet http://jtidy.sourceforge.net/multiproject/jtidyservlet/] to provide a simple mechanism for developers to validate the html their functions produce.
+
+The proposal will add the following:
+
+1. The following lines to main.xsl (and later to edit.xsl and modal.xsl):
+
+{{{
+<xsl:output method="html" omit-xml-declaration="yes" doctype-public="-//W3C//DTD HTML 4.01//EN" doctype-system="http://www.w3.org/TR/html4/strict.dtd" indent="yes"/>
+}}}
+
+and in the footer (next to the unicode and browse happy images), displayed (not surprisingly) at the foot of the page:
+
+{{{
+<xsl:comment>jtidy:validationImage</xsl:comment>
+}}}
+
+2. The following configuration lines to (web/geonetwork/WEB-INF/web.xml and web/intermap/WEB-INF/web.xml) support the filter as follows:
+
+
+{{{
+  <filter>
+    <filter-name>JTidyFilter</filter-name>
+    <filter-class>org.w3c.tidy.servlet.filter.JTidyFilter</filter-class>
+    <init-param>
+      <param-name>commentsSubst</param-name>
+      <param-value>true</param-value>
+    </init-param>
+  </filter>
+
+  <servlet>
+    <servlet-name>JTidyServlet</servlet-name>
+    <servlet-class>org.w3c.tidy.servlet.TidyServlet</servlet-class>
+  </servlet>
+
+  <servlet-mapping>
+    <servlet-name>JTidyServlet</servlet-name>
+    <url-pattern>/JTidy</url-pattern>
+  </servlet-mapping>
+
+}}}
+
+and the following jars to web/geonetwork/WEB-INF/lib and web/intermap/WEB-INF/lib:
+
+{{{
+
+}}}
+
+
+The filter and servlet need only be active during development. The lines in the web.xml files should be disabled/removed and the jars removed when building the installer.
+
+3. To add a service to the filter the following steps need to be taken add a mapping to apply the filter to the service you are testing (in the appropriate web.xml file):
+
+{{{
+
+  <filter-mapping>
+    <filter-name>JTidyFilter</filter-name>
+    <url-pattern>*.home</url-pattern>
+  </filter-mapping>
+
+}}}
+
+This example mapping will apply the filter to the geonetwork service ending in .home (eg. /geonetwork/srv/en/main.home which is the geonetwork main page if this filter mapping was added to web/geonetwork/WEB-INF/web.xml).
+
+When you run the service that renders this page, an icon will appear at this place which can be clicked on to get the report output showing the problems with this page. An example for the main page in geonetwork is as follows:
+
+{{{
+#!html
+<center>
+<img src="/geonetwork/wiki/mainpagevalidation.png?format=raw">
+</center>
+}}}
+
+Clicking on this icon will bring up a report on the validity of the html produced by your xslt which might look something like this:
+
+{{{
+JTidy Messages for request:1 processed in 1475 milliseconds
+Validation Errors 0
+Validation Warnings 26
+Line 291,       column 31       WARNING:        <td> attribute "width" has invalid value "224px"
+Line 292,       column 34       WARNING:        <table> attribute "width" has invalid value "224px"
+Line 297,       column 46       WARNING:        <table> attribute "width" has invalid value "211px"
+Line 299,       column 100      WARNING:        <img> attribute "height" has invalid value "246px"
+Line 299,       column 100      WARNING:        <img> attribute "width" has invalid value "9px"
+Line 299,       column 100      WARNING:        <img> lacks "alt" attribute
+Line 313,       column 52       WARNING:        <td> attribute "width" has invalid value "202px"
+Line 317,       column 61       WARNING:        <td> attribute "width" has invalid value "122px"
+Line 326,       column 154      WARNING:        <img> attribute "height" has invalid value "100px"
+Line 326,       column 154      WARNING:        <img> attribute "width" has invalid value "200px"
+Line 326,       column 154      WARNING:        <img> lacks "alt" attribute
+Line 331,       column 156      WARNING:        <img> lacks "alt" attribute
+Line 631,       column 55       WARNING:        <table> attribute "width" has invalid value "211px"
+Line 633,       column 61       WARNING:        <td> attribute "width" has invalid value "30%"
+Line 633,       column 61       WARNING:        <td> attribute "height" has invalid value "29px"
+Line 634,       column 61       WARNING:        <td> attribute "width" has invalid value "36px"
+Line 634,       column 111      WARNING:        <img> attribute "width" has invalid value "36px"
+Line 634,       column 111      WARNING:        <img> lacks "alt" attribute
+Line 635,       column 61       WARNING:        <td> attribute "width" has invalid value "13px"
+Line 635,       column 111      WARNING:        <img> attribute "width" has invalid value "13px"
+Line 635,       column 111      WARNING:        <img> lacks "alt" attribute
+Line 637,       column 61       WARNING:        <td> attribute "width" has invalid value "12px"
+Line 637,       column 111      WARNING:        <img> attribute "width" has invalid value "12px"
+Line 637,       column 111      WARNING:        <img> lacks "alt" attribute
+Line 645,       column 288      WARNING:        <img> lacks "alt" attribute
+Line 686,       column 31       WARNING:        <td> attribute "width" has invalid value "100%"
+
+Below is the source used for this validation:
+
+   1 <!DOCTYPE html
+   2   PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+   3 <html>
+   4    <head>
+   5       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+   6       <title>BlueNet MEST Version 1.1 (10/06/08)</title>
+
+......................
+(and so on)
+}}}
+
+It's up to you to then fix the problems with your html and don't forget these immortal words:
+
+"You should see our html producing xslts!" - a GeoNetwork developer at the Bolsena meeting :-)
+
+
+=== Backwards Compatibility Issues ===
+
+None known.
+
+== Risks ==
+
+None known?
+
+== Participants ==
+Simon Pigot - developed validation report process described above.
+Grant Mckenzie - has volunteered to do some work on making the existing pages conformant. 
+