In the occasion of the move to WordPress 2014 after about 8 years with DokuWiki a little retrospective about some stations of the development since 1997…
Note: All screenshots can also be viewed at a larger size – just click them.
1997 – The humble beginnings
In 1997 the public part of the “World Wide Web” was still very young and the access usually happened using analog modems or ISDN with a maximum of 64 kBit/s – to download 1 MB of data, it took at least 2 minutes even with ISDN and usually even more with analog modems. DSL was introduced in Germany not before 1999 with 768 kBit/s download speed in the beginning. Screens which were also affordable for private use had diagonals of 15 or 17 inch and usually a resolution of not more than 800×600 pixels, 1024×768 pixels were already seen as high end technology. Accordingly websites were designed quite simple.
Back then the “prime father” of Firefox, Netscape Navigator, had just been on the market for three years and Microsoft tried to win the “browser war” with the Internet Explorer which was integral part of Windows 95. In 1998 Google appeared and was first just known as a search engine.
One of the big innovations in HTML at the beginning of 1997 besides tables were Java applets (not to be confused with JavaScript, which has nothing in common with Java except the name).
For my first website I had also created a Java appled which displayed a little 3D animation as vector graphics – a rotating “A” with the number of the year 97 and the copyright symbol in the corners. Behind this a sky with stars which moved from the right to the left and created the impression of depth by using pixels at different speeds – a technique which was gladly used in computer games and demos. The whole thing was arranged using a frameless table and some graphically elements and represented what was technically possible at that time.
I’m aware that “Arno’s Home” is the misspelled version of “Arnos Home”. To keep the authenticity I decided to leave it as I used it back then.
By the way – I had used the font for the logo – Brush Script – for my Atari project “Thing” before:
You can find an archived version of the website at https://arnowelzel.de/archive/1997. But since Java is usually not available any longer in browsers I created a video with the animation to give an impression. The quality of the animation is not as good as in the original – but at least you get the idea:
2004 – Inspiration by Sheldon Brown
Windows XP had been introduced at the end of 2001. By 2004 it seemed that Microsoft had won the “browser war” for the time being with the Internet Explorer which was also integral part of Windows XP. But by the end of 2004 Firefox was introduced as an open source successor of the Netscape Navigator with a full page advertisment in the FAZ (see PDF) and a new round in the game “who has the best web browser” had begun. Fast internet connections based on DSL with flatrates became the standard in Germany, at least in areas of high population density, and the web became a mass medium. In that year also Facebook appeared.
That time I also discovered the articles by Sheldon Brown, of which I started to translate some since 2004 and which inspired me to write more extensive articles and guides myself.
A „Wiki Wiki Web“ or just „wiki“ based on my own development already existed in 2004 on the website. Even though it had not been used for every content yet. Wikipedia as the best known application of a wiki already existed since 2001.
2005 – ArnosWiki
Even though sans serif fonts were more comfortable for screen display I had seen the fixed font setting as a limitation of visitors who set their own standard font in their browser. Therefore I removed the setting for a specific font face and size completely. Also the remaining “design” was limited to an absolute minimum and looked more like websites from the starting years. Anyway this was recieved positively by some visitors.
The content had been moved completely to my self-built wiki and accordingly I called the website from then on “ArnosWiki” for the next 9 years. The notation was intentional – words using „camel case“, which means at least two capital letters with one inside the word, had been used by the first „primeval wiki“ as indication for links to pages with the same name inside the wiki.
2006 – Move to DokuWiki
The self-built wiki was technically not more than just one large script (which consisted of about 2000 lines of code to be precise) which was created casually and could not do a lot. For example: If I wanted to embed pictures I first had to upload them via FTP to the server. Also the possible text markup was quite limited – generally it was not much more like a quick hack which I liked to replace with something better.
DokuWiki already existed since 2004 but I noticed it just in 2006 more by accident. From the beginning I was really enthused by the the functionality and the modular structure which DokuWiki still provides today. I took this as motivation to move my website to DokuWiki and also to use a bit more “modern” layout. In the same year I also introduced https://de-rec-fahrrad.de based in DokuWiki (also see https://de-rec-fahrrad.de/die-anfaenge – sorry, that website is not bilingual).
A quite helpful aspect of DokuWiki was the template system: The whole layout and functionality could be modified using a custom template. For the first version of my website I used the „Arctic“ template which also provided the sidebar with the navigation. I also did not have to upload pictures using FTP any longer but could now upload them directly in the „media manager“ of DokuWiki.
2007 – New layout and multilingual content
The „Arctic“ template was quite nice already, but I preferred something more individual. Therefore I customized many details of the template. Inspired by the translations of the articles by Sheldon Brown I also started to publish a lot of content in English and customized DokuWiki accordingly, so one could always switch between the languages of an article.
Since I found a single colored background a bit too boring I decided to use a background picture with the word “void”. This was only visible if the content did not require the available space.
Under the title “Already seen?” I also started to indicate new articles – a tentative step towards a „blog“.
2011/2012 – Version for mobile devices, web fonts and blog
I had already started to develop my own design in 2009 which also minded maximum line lengths and visually fitted better my personal imagination. Thereby the layout was flexible and still readable with narrower windows.
At the latest with the introduction of UMTS and according volume-based rates, “mobile” internet had become a more important topic. As I also use Android smartphones personally since 2011 I developed an additional layout for mobile devices. For this also a separate subdomain was used to which one got redirected if needed. Although visitors could always switch between the two versions using the according link in the head.
Concerning web fonts I was sceptical in the beginning – but meanwhile I changed my mind and embedded my own font as web font for the “desktop” version. A blog was now also an integral part of the website. I used a plugin as a foundation which allowed to display a fixed number of wiki pages from the “blog” section as articles on the start page, sorted descending by the publishing date. Although the implementation generally served its purpose I was not really happy with it.
2014 – WordPress and HTML5
Over the years I had customized DokuWiki functional in many ways to meet my special requirements. Updates to new versions became more and more laborious and I was also not very happy with the additionally added blog function. Furthermore I missed the possibility to prepare longer articles as a draft and publish them not before they got finished. This was motivation enough to look for alternatives and move to WordPress. The official title is now just “Arno Welzel” again after 10 years.
Although WordPress was originally developed as a system for blogs it is also suitable for “regular” websites. Therefore some areas of my website are still self-containt sections with static pages and also the online tools as the spoke length calculator or the QR code generator are still available. WordPress also provides the versioning of all text like DokuWiki so as an author you can always access older versions or let yourself show the differences between the versions.
Along with the move also I also changed from XHTML 1.0 to HTML5 and introduced a “responsive” design which automatically adapts to devices with lesser display width. Therefore the embedded font, meanwhile “Lato” instead of “Proxima Nova”, will also be used on suitable mobile browsers. A separate subdomain for mobile devices including the redirection is no longer neccessary. Anyway the old URL is still accessible and redirects to the regular URL.
A big improvement is the way how pictures are displayed: The according plugin allows an enlarged view using the “Swipebox” script which offers using the keyboard, clickable navigation symbols and touch gestures depending on the device. Also picture galleries which were quite “cumbersome” in DokuWiki can now be created much more elegant in WordPress and also appear using squarish thumbnails.
Due to HTML5 the display on older versions of the Internet Explorer (which means everything older than version 9) is significantly limited. As a compromise for Internet Explorer 8 (or older versions) I have included the JavaScript library html5shiv and some customized CSS rules a “conditional comment”. Newer browsers (including Internet Explorer 9 or later) will just ignore that. Anyway the website will still be usable even without such aids – it will just not look very nice likely. But who uses such an old browser has to live with such limitations.
2016 – No longer supporting Windows XP and Internet Explorer 8 or older
In sommer 2016 the number of visitors using Internet Explorer 8 was only about 0.1%. Therefore I decided to stop supporting this really old software from that time on. The website now also always uses HTTPS (which requires browsers supporting SNI) and html5shiv will also not be used any longer.
2019 – More own development
Pictures are now displayed with my own plugin “Lightbox with PhotoSwipe” and I became maintainer of some other plugins for WordPress. The server has also moved and now uses HTTP/2.
