Il progetto consiste in un componente per le accesskey, un template XHTML 1.0 strict e alcune piccole patch al core.

Dopo quasi tre mesi di lavoro sono finalmente arrivato a poter pubblicare qualcosa di utilizzabile da tutti, il nuovo Joomla 1.5 conforme alla normativa italiana sull’accessibilità è disponibile per il download sotto licenza GNU/AGPL.

Il codice del progetto Joomla 1.5 FAP è scaricabile (previo login) dal sito ufficiale dei progetti Joomla:

http://joomlacode.org/gf/project/joomlafap1_5

La documentazione è consultabile anche senza aver fatto il login:

http://joomlacode.org/gf/project/joomlafap1_5/frs/?action=FrsReleaseBrowse&frs_package_id=3544

Per vedere all’opera questa nuova versione, fate una visita al sito ufficiale del Parco Nord Milano:

http://www.parconord.milano.it

Happy Joomla!

The advantages of such a system are those of typical webservice:

• fully decoupled from the GUI, the GUI could be written in any language that talks REST
• plain text mapfiles as the storage system

The service is being written in PHP and the RESTFUL part is managed with PHP Tonic library.

A few examples of typical URLs:

• GET http://www.mymaps.com/maps – retrieve a list of mapfiles
• POST http://www.mymaps.com/maps – creates a new mapfile with the JSON data passed on post
• GET http://www.mymaps.com/maps/my_first_map.json – retrieve the map data as JSON
• GET http://www.mymaps.com/maps/my_first_map.xml – retrieve the map data as XML
• GET http://www.mymaps.com/maps/my_first_map.map – retrieve the map data as plain text mapfile
• PUT http://www.mymaps.com/maps/my_first_map.json – alter the map with JSON data
• PUT http://www.mymaps.com/maps/my_first_map.xml – alter the map with XML data
• GET http://www.mymaps.com/maps/my_first_map.xml/layers – retrieve the map layers as XML
• GET http://www.mymaps.com/maps/my_first_map.xml/layers/my_first_layer – retrieve the map layer data as XML

With this project, we are trying to create a lightweight fully accessible Joomla! 1.5 template with the following features:

• Support for multiple skin
• Font resizing with on-page controls
• Skin switcher with high-contrast skin
• Liquid layout with max-width
• Table-less design
• True CSS separation between layout, typography and skin
• XHTML strict W3C validation
• Produce XHTML strict code from the WYSIWYG editor
• Automatic multicolumn layout (two columns or three depending on the presence of rightbar components)
• Access key support
• Form labels, fieldsets and semantic markup
• Clean minimalistic XHTML code (lightweight)

The new template in action, blue skin and high contrast skin

Building an accessible template

The new template override feature available in Joomla! 1.5 allows an easy creation of custom template, we can see an example of such an effort in the Beez template available with the distribution. Unfortunately, this template is not XHTML strict but use the transitional doctype instead.

As discussed in the previous article Joomla 1.5 XHTML Strict Template, most of the core components can now be overridden in the template, but a couple of issues remains: some unvalid code snippets that are still produced in the core and the WYSIWYG editor doesn’t produce valid code that follows the strict doctype. The only solution we have found at the moment is patching the core.

Patching the core

Until Joomla! 1.5 release, core patches to implement accessiblity features in Joomla involved a major rewriting of the core, they are now limited to a few files. We have applied a small core patch for the “img” tag (image) code generation and a bigger patch to the WYSIWYG editor (mostly javascript cleanup routines).

We feel like another patch will be needed in order to implement accesskey support, but we are still considering if a plugin could be developed instead of patching the core.

To do

We have already completed most of the steps listed in the first paragraph. We are still working on fixing some components output in the template and we are exploring the different options for accesskey support.

We will be very happy to hear you opinions and comments about this project.

This enthusiasm could seem not justified, but after a deep dive in the code of the new release you will notice that, if compared with the 1.0 branch, Joomla 1.5 is a true revolution.

A few examples:

• The new code is cleaner and better commented
• The overall structure is more Object Oriented
• There is a first move towards an MVC design patterns, at least inside the components
• You can now build the main template including the blocks (components etc.) through XML-like tags instead of PHP function calls
• Overriding default components and modules can be done in the template itself instead of hacking the core

The last point in the list above is truly new, and represents alone a good motivation to keep a close eye on this wonderful CMS. Changing XHTML code generation in the previous versions was a real nightmare, the code was composed through hundreds of PHP scripts, and there was not a clear sparation between application logic and presentation.

A really odd thing concerning this first pre-release (1.5RC1) is that the templates automatically includes the javascript framework mootools in the template header. This weights 74KB and seems absolutely unuseful in the front-end, I just hope that this libray will be removed from the template in the final release.

From an accessibility point of view, the possibility to alter the produced XHTML code without directly changing the core (this is stlill only partially true, unfortunately) makes much more easier all the work of eliminating unuseful tables, deprecated attributes and the producion of semantically correct code.

Producing an Joomla 1.5 accessible template

We in Italy have a special law about websites for public administrations, it is based on W3C WAI but with some minor “enhancements” and modifications.

We have spent a considerable amount of time and resources on Joomla FAP project, a successfull project aimed to produce a XHTML Strict and WAI compliant Joomla 1.0 version for the italian market.

Starting from this experience, we decided to explore the possibilities of achieving he same objectives with Joomla 1.5.

The necessary steps are more or less the same we have done with Joomla FAP:

• Write a XHTML Strict and WAI compliant template
• Rewrite main components code to eliminate tables, deprecated attributes and semantically incorrect code
• Patch and reconfigure the WYSIWYG editor to prevent invalid code generation

A big difference between older Joomla releases and the new 1.5 is that instead of patching the core of the main components, the most part of this work can be now done inside the template, overriding the views of the single modules.

A couple of unresolved issues remains: some XHTML code fragmenst are still generated through function calls to the core, and in a few cases the generate code contains invalid attributes, in such cases a patch to the core is the only way out.

Some conclusions…

The real good new about our explorations is that after only a few hours of work we have seen this message in the W3C validator:

There is still al lot of testing and work to be done before we can affirm that the objective has been reached, but if we compare this first encouraging results with the hundreds of hours that were necessary to achieve a similar objective with Joomla FAP, we can really foresee a bright future for Joomla 1.5.

Stay tuned!

A simple caching mechanism is also available, since for big vector layers, processing time can be an issue.
Raster layers are supported as network links to WFS MapServer.
Though more testing is required, the server is basically finished and fully functional.

See all the details >>

Il nuovo sito del comune di Filago è stato realizzato con il CMS (Content Management System) Joomla FAP.

Il progetto Joomla FAP consiste in una versione accessibile e tradotta in italiano del noto CMS Joomla, abbiamo lavorato per completare Joomla FAP rendendolo conforme alla legge italiana sull’accessibilità dei siti internet destinati alle pubbliche amministrazioni.

Il risultato è un CMS pienamente conforme per quanto riguarda la parte disponibile al pubblico e parte del pannello di controllo limitatamente all’inserimento dei contenuti.

Il sito del Comune di filago è disponibile qui: http://www.comune.filago.bg.it

Come rendere accessibile Joomla

Il lavoro di “trasformazione” di Joomla è stato portato avanti su un doppio binario:

• preparare un template accessibile
• modificare il core (il nucleo) di Joomla per rimuovere il codice inaccessibile

In entrambi i casi il lavoro è partito dalla prima versione di Joomla FAP, dove era già stato preparato un template accessibile (anche se non conforme al XHTML strict come richiesto dalla legge Stanca) e il core era già stato parzialmente adattato.
Il lavoro sul template è stato probabilmente il meno oneroso, in termini di tempo e difficoltà tecniche. Molto più difficile è stato rimuovere dal core tutti i frammenti di codice non conforme, e in questo non ci è venuto in aiuto il codice di Joomla, che risente di vistosi errori progettuali che mischiano business logic e layout a frammenti di codice HTML.
Il core è stato modificato in diversi punti, sopratutto nel modulo com_content, responsabile della generazione delle pagine degli articoli, dal quale sono state rimosse tutte le tabelle inutili sostituendole con dei tag “div”.

Parecchie modifiche sono state anche fatte all’interno dei tag: molti attributi sono infatti deprecati in XHTML strict e hanno reso necessario lo spostamento degli stessi all’interno di stili inline, laddove possibile.

Il lavoro continua sui componenti

Quello che rende Joomla uno dei CMS più utilizzati al mondo è la grande disponibilità di moduli e componenti di terze parti che ne aumentano le funzionalità, alcuni di questi moduli sono assolutamente indispensabili per un moderno CMS (per es. forum e newsletter).
Il lavoro è quindi continuato su alcuni dei principali moduli per renderli anch’essi accessibli.

Come validare l’input degli utenti

Avere un core e un template accessibili purtroppo non basta: se infatti gli utenti che inseriscono i contenuti non sono vincolati quanto meno al rispetto formale della sintassi del codice XHTML strict, i contenuti da essi inseriti possono invalidare tutto il sito.
Abbiamo quindi modificato in più punti l’editor wysiwyg di Joomla TinyMCE in modo da costringerlo a produrre nei limiti del possibile del codice XHTML strict.
Questo ha comportato la rinuncia all’attributo target nei link, che permette di aprire i collegamenti in una nuova finestra. Tralasciando le diatribe e le perplessità sul merito dell’argomento, questo problema rimane un punto da risolvere, e i mezzi tecnici (facendo ricorso a codice javascript) non mancherebbero.

Conclusioni

Joomla FAP in questa nuova versione rappresenta una ulteriore passo avanti verso un CMS open source ricco di funzionalità, tradotto completamente in italiano e ragionevolmente conforme alla normativa italiana sull’accessibiltà dei siti internet, almeno per quanto riguarda la parte accessibile al pubblico (front-end).
Rimangono alcuni problemi da risolvere e sicuramente molti bug da sistemare, così come un adeguamento del pannello di amministrazione (il back-end) sarebbe sicuramente auspicabile.
Siamo ovviamente disponibili per qualsiasi servizio di installazione e configurazione nonchè per la creazione di moduli e componenti.

Download

Il codice è ospitato sul forge ufficiale di Joomla e scaricabile tramite svn:

svn checkout http://joomlacode.org/svn/joomlafap
Non siamo noi gli amministratori del progetto, per istruzioni su come scaricarlo e installarlo, fate riferimento al sito:

Joomla.it

Supporto commerciale

Siamo disponibili a fornire supporto commerciale su Joomla FAP per:

• installazione
• configurazione e personalizzazione
• creazione moduli e componenti ad hoc
• training
• creazione di temi grafici accessibili

Contattateci per un preventivo gratuito!

Chi non ha mai sentito parlare di Joomla?

Si tratta sicuramente di uno dei piú diffusi CMS open source, forse proprio il piú diffuso, se considerato insieme al suo cugino Mambo.

Purtroppo lo sviluppo di Joomla procede abbastanza lentamente, vista la mole del progetto, e questa lentezza causa non poche difficoltá a chi, come noi in Italia, é costretto ad inseguire le trovate di fantasiosi (e spesso incompetenti) legislatori.

Le pubbliche amministrazioni e l’accessibilitá

Mi riferisco alla legge sull’accessibilitá dei siti web, nota come legge “Stanca” dal nome dell’incompetente del legislatore di turno.

La legge, ha avuto l’innegabile merito di obbligare i creatori di siti web che realizzano siti e applicazioni per le pubbliche amministrazioni al rispetto di una serie di regole tese a favorire l’accesso al web da parte delle persone disabili.

Alcune di queste regole fanno parte del bagaglio di buone pratiche comune a qualsiasi serio professionista del settore e si rifanno a norme internazionali note da diverso tempo ed elaborate da enti prestigiosissimi come il W3C, altre sono invece frutto del tentativo di giustificare l’esistenza di qualche burosauro ministeriale.

Basta cantinari!

Il rispetto di queste norme ha il grande pregio di tagliare automaticamente fuori dal mercato tutti i siti fatti da “l’amico dell’amico” che hanno infestato per anni il web italiano.

Ormai chiunque puó diventare un web publisher semplicemente aprendosi un blog su uno dei tanti fornitori gratuiti, senza doversi preoccupare dei dettagli tecnici, mentre per le applicazioni piú complesse e i progetti di un certo rilievo, la strada rimane aperta solo per i professionisti del settore.

Joomla e l’accessibilitá

Come dicevo poc’anzi, Joomla soffre il fatto di essere un progetto maturo, nato in tempi in cui l’accessibilitá non era ancora in cima alle prioritá degli sviluppatori, l’adeguamento del codice procede a ritmi serrati ma segue le norme e gli standard internazionali e non quelle partorite dalla fervida immaginazione dei nostri geniali tecnocrati.

Se a ció si aggiunge che il codice di Joomla non consente purtroppo una separazione chiara tra business logic e application logic o peggio tra contenuti e presentazione degli stessi, é facile prevedere come passerá probabilmente parecchia acqua sotto i ponti prima che una versione aggiornata di Joomla conforme alla legge “Stanca” sia disponibile in lingua italiana.

La risposta italiana: Joomla FAP

Un gruppo di programmatori italiani riuniti nel sito joomla.it ha quindi intrapreso l’arduo compito di rendere conforme alla legge “Stanca” la versione italiana di Joomla. Da questi sforzi è nato il progetto Joomla FAP (joomla for all people), che però è stato più o meno abbandonato dopo avere comunque fatto dei notevoli passi avanti.

Segue….

The answer is easy, since your ISP normally charge for disk space and not for CPU usage, nowaday it’s the disk space shortage that more freqently happens.

The approach described here, permits you to generate “on the fly” all the scaled images you need for your site, just using standard PHP functions as provided from the GD library.

Before you start

You should check that your php_info(); function output has a section concerning GD: it should look like this:

gd

If you see something similar then you’re ok, else you should check for your PHP installation or change ISP.

This script was tested under Linux, I don’t know if it works under other OS’s (but why should’nt?)

The idea

The idea is quite simple, and is not particularly original (I took some code from other projects), I prepared a flexible script that can both accept parameters via GET or POST requests or read values from already defined variables.

The script can hence works standalone or included from other scripts.

Imagine you have an image that you need to resize on the fly, the image is stored sa images/image1.jpg under your document root, imagine also that the PHP script is called getthumb.php and is stored directly under the document root, to get a resized image 100 px wide you just call this url: http://www.yoursite.com/getthumb.php?width=100&img=image1.jpg

you usually want to mantain height/width ratio without distorcing the image, this is why you can specify only one dimension (x or y) and the script will do all the calculations for you.

Of course you can also save the thumbnail to disk, but this is normally accomplished through a calling script, just define the following vars in the calling script:

 * @param   string  $img_path image file path, relative to this script, if not
 *                            set, the next is checked on GET
 * @param   string  $img urlencoded image file path, relative to this script
 *                      (in vncms should be 2 level depth)
 * @param   integer $width max width
 * @param   integer $height max height
 * @param   string  $jpgfilename optional filename to store image in, if
 *                            not given, image is outputted to the browser

Finally, the code!

 
/**
 * @copyright 2005 Alessandro Pasotti 
 * @license GPL
 * @author  Alessandro Pasotti (some source grabbed somewhere)
 *
 * Read an image file and send a scaled thumbnail to the browser
 * default to 150 px width.
 *
 * This file can also be included, in this case, define vars in the calling script
 *
 * @param   string  $img_path image file path, relative to this script, if not
 *                            set, the next is checked on GET
 * @param   string  $img urlencoded image file path, relative to this script
 *                      (in vncms should be 2 level depth)
 * @param   integer $width max width
 * @param   integer $height max height
 * @param   string  $jpgfilename optional filename to store image in, if
 *                            not given, image is outputted to the browser
 *
 *
 * Example calls:
 *
 * getthumb.php?img=../../images/logo.jpg              --> default to max 150 (w or h)
 * getthumb.php?img=../../images/logo.jpg&height=200   --> resize to 200px height
 *
 *
 */
 
 
// Constants
define('DEF_WIDTH',     150);  // default
define('DEF_HEIGHT',    150);  // default
define('ALLOWED_WIDTH', 1024); // no tampering: set up a max
define('ALLOWED_HEIGHT',768);  // no tampering: set up a max
define('DEF_QUALITY',   90);   // default quality
 
define('DEBUG', false);
 
 
// I put this here to avoid any external dependency
if(!function_exists('__clean')) {
  function __clean($s, $len){
      if(!isset($s)) return null;
      $s = substr($s, 0, $len);
      if(ini_get('gpc_magic_quotes') != 1) $s = addslashes($s);
      $s = escapeshellcmd($s);
      return $s;
  }
}
 
// Get image location if not defined elsewhere
if(!isset($image_path))  $image_path = urldecode(stripslashes(__clean($_GET['img'], 256)));
if(!isset($width))       $width      = __clean($_GET['width'], 4);
if(!isset($height))      $height     = __clean($_GET['height'], 4);
 
// if both are not defined:
if(!$width && !$height) {
  $width = DEF_WIDTH;
  $height= DEF_HEIGHT;
}
 
if($width) $width   =  min(ALLOWED_WIDTH, $width);
else $width = ALLOWED_WIDTH;
if($height) $height =  min(ALLOWED_HEIGHT, $height);
else $height = ALLOWED_HEIGHT;
 
 
define('MAX_HEIGHT', $height);
define('MAX_WIDTH' , $width);
 
 
// Load image
$img = null;
$imginfo = getimagesize($image_path);
$imgtype = $imginfo[2];
 
$ext = strtolower(end(explode('.', $image_path)));
if ($imgtype == IMAGETYPE_JPEG) {
    $img = @imagecreatefromjpeg($image_path);
} else if ($imgtype == IMAGETYPE_PNG) {
    $img = @imagecreatefrompng($image_path);
    //echo "IMGEBASE " . IMAGE_BASE . ' path: ' .  $image_path; exit;
// Only if your version of GD includes GIF support
} else if ($imgtype == IMAGETYPE_GIF) {
    $img = @imagecreatefromgif($image_path);
}
 
// If an image was successfully loaded, test the image for size
if ($img) {
 
    // Get image size and scale ratio
    $width = imagesx($img);
    $height = imagesy($img);
    $scale = min(MAX_WIDTH/$width, MAX_HEIGHT/$height);
    if(defined('DEBUG') && DEBUG) {
      user_error("thumbnails.php - IMAGE: $image_path  WIDTH: $width HEIGHT: $height SCALE: $scale<hr />");
      exit;
    }
 
    // If the image is larger than max shrink it
    if ($scale < 1) {
        $new_width = floor($scale*$width);
        $new_height = floor($scale*$height);
 
        // Create a new temporary image
        $tmp_img = imagecreatetruecolor($new_width, $new_height);
 
        // Copy and resize old image into new image
        imagecopyresized($tmp_img, $img, 0, 0, 0, 0,
                         $new_width, $new_height, $width, $height);
        imagedestroy($img);
        $img = $tmp_img;
    }
}
 
// Create error image if necessary
if (!$img) {
    $img = imagecreate(DEF_WIDTH, DEF_HEIGHT);
    imagecolorallocate($img,255,255,255);
    $c2 = imagecolorallocate($img,255,0,0);
    imageline($img,0,0,DEF_WIDTH,DEF_HEIGHT,$c2);
    imageline($img,DEF_WIDTH,0,0,DEF_HEIGHT,$c2);
}
 
if(!$jpgfilename) {
  // Display the image
  header("Content-type: image/jpg");
  imagejpeg($img, null, DEF_QUALITY);
  exit;
} else {
   if(defined('DEBUG') && DEBUG) {
      echo "thumbnails.php - saving to $jpgfilename<hr>";
  }
  imagejpeg($img, $jpgfilename, DEF_QUALITY);
}

I hope you find this small script useful, it’s really very flexible and you can use it freely as you like.

Happy resizing!