[Piwik-hackers] HTML cleanup

Milian Wolff mail at milianw.de
Fri Jun 13 21:41:38 CEST 2008


Hi Developers!

I want to get involved with Piwik by cleaning up your pretty nasty HTML code. 
See also http://dev.piwik.org/trac/ticket/124

Just now I've gone quickly over the source and fixed mostly trivial things, 
like non closed tags (<link>, <img>, <input>, <br>, ...), empty `alt=""` 
attributes for `<img>` tags (required!) or ampersand entities (you have to 
use &amp; in HTML!). I'm down to 18 errors for the Home site (see also 
below). The login page is valid XHTML.

Since I do not have an SVN account I cannot commit my changes, hence this 
email with the patch attached. If you want me to split it up, just tell me 
how you want to have it served :)

Some questions:

1. Because of the ampersand issue (see above) I needed to patch some smarty 
plugins to use `htmlspecialchars()`. Do you have an internal function with 
possibly extended functionality for that which is preferred?
2. How can I make sure in `plugins/Home/templates/menu.tpl`, that the 
`<ul>...</ul>` section is skipped for non-existing/empty $level2.name's ? 
I.e. it's never good to have empty junk-tags around.
I tried `{if $level2.name}` which did not work. This applies btw. to the 
dashboard menu entry. This is one of the 18 errors left for the Home page.
3. It's good practice to specify the language in the `<html>` attribute - how 
can I get the current chosen language code?
4. You use the name attribute of the `<a>` tag in 
`plugins/Home/templates/menu.tpl` and `.../menu.js` to store the AjaxURL. 
Quick and dirty. Very dirty. Since the name attribute has quite some 
restrictions, just like the ID attribute. I'd like to rewrite this by 
generating a json object in `menu.tpl` which associates some proper menu-ids 
with their respective AjaxURLs - would that be ok? This would eliminate the 
last 17 errors from the Home page and bring us at least a valid HTML template 
there.

But there is still much to do, since most of the HTML (even if valid) is still 
a mess:

- superfluous wealth of `<br />` tags instead of proper CSS styles
- deprecated elements, i.e. center
- senseless stuff like `<span id="h1">` instead of `<h1>`
- presentational markup: `<b>` and `<i>` vs. `<strong>` and `<em>`
- inline CSS - evil since not easily themable, use proper classes / IDs / 
ancestor selectors to style them via external CSS files
- mixture of JavaScript and Templates, it would be much more sane to separate 
the two and put the JavaScripts right at the bottom of the page (i.e. right 
before `</html>`).
- possibly more I've spotted while skimming through the files and have since 
forgotten


So that's basically it for now. Comments? Patch review? Hate? Praise`

Until then and keep on working on Piwik, the world needs it!
-- 
Milian Wolff
http://milianw.de
OpenPGP key: CD1D1393
-------------- next part --------------
A non-text attachment was scrubbed...
Name: htmlcleanup_part1.patch
Type: text/x-diff
Size: 68679 bytes
Desc: not available
Url : http://lists.piwik.org/pipermail/piwik-hackers/attachments/20080613/85a54700/attachment-0001.patch 
-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: application/pgp-signature
Size: 189 bytes
Desc: This is a digitally signed message part.
Url : http://lists.piwik.org/pipermail/piwik-hackers/attachments/20080613/85a54700/attachment-0001.pgp 


More information about the Piwik-hackers mailing list