Information Technology
DE | ENContact

Technology

Design

I decided to develop the whole homepage using open source software. I do not use any proprietary frameworks, and rely completely on the very basic technology around the Apache web server with PHP and MySQL on the server side and Javascript on the client side (in the browser). The Nosco homepage is hosted by a public provider on a Unix system with Apache/PHP/MySQL.

The pages are designed as simple as possible. All pages are in a final state, there are no pages "under construction". I rather left pages out than published unfinished pages. I paid great attention to a good accessibility. The pages and especially the fonts should be scalable without any distortion of the pages.

I wrote many pages in two languages: English and German. One reason was again an increased accessibility. Another reason was to experiment with the implementation of multilingual pages. I should note that the multilingual pages are not exact one-to-one translations; they are only "semantically" equivalent. Some pages are available only in one language, they will not be translated into the other language. The user switches between the languages by clicking the respective identifier (DE or EN) on the top of the page. In a first version I passed the selected language as an URL parameter (?lang=en or ?lang=de) between the pages. In the current version I maintain different branches for the respective language (.../en/... and .../de/...) in the file system. I think that this approach is the better one.

The main navigation between the pages is established by the pull-down menus that are consistent over all pages. The menus are implemented using CSS, especially the hover techniques. This elegant implementation unfortunately does not work with Internet Explorer 6 (and below), so a Javascript support is necessary for this browser.

The pages are requested using the HTTP/GET protocol with the exception of the Contact page: a submitted comment uses the HTTP/POST protocol. The Ajax techniques are used when the Calculator page communicates with the server and a Sudoku puzzle is requested from the server.

On the Contact page I introduced the CAPTCHA guard, more as a curiosity than a necessity: I wanted to know how CAPTCHA can be implemented. The realization is very easy with true type fonts and the GD graphics in PHP.

Programming Environment and Implementation Techniques

I develop the pages on a PC with Windows XP. I use the excellent xampp bundle with Apache, PHP, MySQL, etc. as a local Web server on Windows. This allows me to completely develop and test my pages locally on my PC.

I write most pages (HTML, PHP, Javascript) with the slim Crimson text editor. I debug HTML and Javascript with the debuggers integrated in modern browsers (Firebug in Firefox 3.6, Developer Tools in Internet Explorer 8, Developer Tools in Google Chrome 4). I debug simple PHP programs by putting echo/print statements into the code. I use the NetBeans IDE for developing and debugging complex PHP programs. I switched from Eclipse to NetBeans. The integration of the PHP plugin in NetBeans is absolutely seamless and does not have any problems with missing packages as I often experienced with Eclipse. I use NetBeans also for all kind of offline programming in C++ and Java (and seldom Python).

For administrative work I use mostly Unix tools under Cygwin. I apply bash scripting only for the very simplest tasks and use Python for all other tasks. I have learned Python recently and prefer it to Perl that I used before. Python is an elegant language that appeals to a mathematician. Pythons programs can be not only easily written but - in contrast to Perl - also easily read and maintained.

I test all Web pages locally on my PC as far as possible. I check the structure of the HTML documents using a simple Python program built on the HTMLParser class. I check the spelling with the GNU Aspell. The corresponding calls in the bash shell are:

aspell check --mode=html -d en_US ENGLISH_FILE.html
aspell check --mode=html -d de_CH --encoding=iso-8859-1 GERMAN_FILE.html 

I check Javascript programs using the "lint" programs JSLint and JavaScript Lint. JSLint is started in a Windows ("DOS") shell:

C:\Windows\System32\cscript C:\Programs\Javascript\jslint.js < FILE.js

JavaScript Lint is started in a Cygwin (bash) shell:

/cygdrive/c/Programs/Javascript/jsl-0.3.0/jsl.exe -process FILE.js

Before I deploy the pages to the Internet Web server, I compile all Javascript programs using Google's Closure Compiler. The call in a Cygwin shell is:

java -jar C:\Programs\Javascript\Closure\compiler.jar \
--compilation_level ADVANCED_OPTIMIZATIONS \
--js=FILE_1.js \
--js=FILE_2.js \
--js=FILE_N.js \
--js_output_file=FILE.jsc

I maintain the software versions using Subversion with the Tortoise GUI.

After I deploy the pages to the Internet Web server, I check them with the W3C Validator. All pages are valid XHTML 1.0 documents. See also the Nosco Sitemap.