About this Web site

We provide some information about this site for those interested in these kinds of things. We have always developed our site in-house as a means of experimentation with new technologies and user interfaces, throw in a touch of tight-fistedness and we have a generous explanation for the look and feel of the site.

Site History

October 2015: We noted that google were threatening to downgrade search results if a web page failed to pass google's mobile page tester. (They've been doing the same for the EFF's well-intentioned, but misguided, https web campaign for some time, however, we'll fix that when the EFFs sponsored letsencrypt.org starts to issue no-cost certificates (slated for November 2015). Update 2017 3 month validity on letsencrypt certs is a tad paranoid surely) Needless to say our pages failed google's mobile page tester. Google's own advice was, to say the least, a little strange, suggesting (as we read it) that we should revert to a pixel based design since 16 pixels (approx. 12 pt) was the minimum good viewing on small screens. Since we had moved to an ems based design (to allow the user to control their own default font size) years ago (2007) this did not look like progress. Turned out that by simply adding a <meta name="viewport" content="width=device-width, initial-scale=1.0"> tag in the <head> section we passed the test. In practise, to get really viewable pages, as opposed to just passing the test) is was lot more complicated. We read a ton of stuff on Responsive Design (an updated version of circa 2001's liquid CSS designs with the addition of media queries, IOHO). Ho hum. We ended up using an modest extension to our server-side browser sniffing technique to:
1. Selectively add the viewport meta tag.
2. Select from normal or mobile advertizing for those pages that carry it
3. Reduce all images to 320px width for mobile devices.
4. Suppress both right and left menus for mobile devices.
5. To minimize screen real estate, while proving CSS navigation, we adopted the wheeze of using a ⊕ glyph in the top right hand corner. Tapping this will drop down a multi-level menu to assist site navigation. We are not comitted to any particular glyph, we would be happy to change to something else if it would help reach a consensus, but would like to think we could adopt some sort of standard way of indicating this menu service across web sites to simplify the user's job. Why use a character glyph rather that a menu graphic. One charcater plus a class attribute is about 10% or less than a small graphic, and takes less screen space. Every little helps.
December 2013: We started publishing validated HTML5 pages. The policy is that when we are doing a major page change we convert to HTML5, otherwise leave it as validated HTML 4.01. We defined what changes we had to make to do HTML5 page conversion. Very site specific obviously. Mileage for others may vary.
October 2013: After a serious turn off from W3C standards with the HTML 5 betrayal around 2010 we stopped doing page validation. Period. All our careful preparatory work for XHTML (the then current W3C future proofing recommendation) was causing page warnings, and even page errors, on almost every page (all that closed tag stuff for img, br and input). Fast forward to 2013 and, while we still continue to believe that HTML5 will stabilize around the end of the next millenium, it's time for hope to triumph over experience again. We have validated all pages to be HTML 4.01 compliant (after undoing all our previous XHTML preparatory work - not trivial) and may experiment with a couple of HTML5 pages from time to time. In the meantime, every time we revisit a page we do a quick HTML 5 check, and then validate and publish as HTML 4.01.
October 2013 - Added popout/flyout CSS menus to the left hand side menus on most tech section pages in an attempt to make navigation quicker. As a side effect of this change we have also stopped all work on keeping MSIE 5/6 current. Our web stats tell us that traffic is almost non existent. We are close to being DOM 2/CSS2 only and with Opera's decision to move to WebKit based rendering another quirk will shortly disappear.
September 2013 - After another mail injection attack we finally decided to limit the use of our mail this page feature. Implemented using a PHP enhacement to an existing script and an SQLite3 database (nice technolgy) to limit usage from any IP address in a given period and to permanently ban IP addresses which contravene the limit plus a small additional threshold. Sad day for us. Sad day for the Internet.
March 2013 - We are not big on social media, but recognize that many others are, including some of our readers. We cleaned up the top right hand pane to allow click through to add page links to a selected set of social media sites and took the opportunity to clean up the page features at the same time by placing print, mail page, font size increase, font size decrease into a single box. Again to try and provide a consistent page interface for regular readers and users.
November 2012 - Change to advertising policy on our Tech Stuff pages. We use a single graphic advertising slot at the top of the central pane. While we do not like to carry advertising, we only do it on the free (tech stuff) part of the site and it does help to pay for its bandwidth usage. We feel this single location provides the minimum visual disruption to readers and users, while providing us in turn with a minimum income. Minimums all round.
November 2010 - Finally removed a problem of unsightly --> text and a lack of multi-level drop-down, fly-out menus for MSIE 7+ browser users. Apologies for the long delay in fixing this problem - entirely related to the handling of MSIE conditional statements that changed from MSIE 6.0 to MSIE 7+. Shocking oversight.
October 2007 - Addition of printer friendly style sheet for all pages.
September 2007 - Addition of an RSS (2.0) Feed covering our tech section. We would have liked to add an Atom feed as well but decided that is was not - at this time - worth the effort. There is just too much momentum in RSS 2.0 and - while we would like to support the IETF standard Atom - we could not find a simple OS publishing tool to provide both formats.
September 2007 - Change to 1.0em for central pane character size and addition of a line-height 1.3em in order to improve readability for the visually impaired. This has the effect of defining the size of the font to that defaulted for the font style in the users browser or, where the browser supports the feature, to that defined by the user. All major browsers set this default to 12pt for major font types such as sans-serif and serif which is normally reasonable for most users. CSS class definitions used in this central pane now use a % value for the font not an absolute value (such as 10pt), thus, if a smaller font is required it is defined as 80%, a larger one 140% and so on. This has the effect of preserving the users font size override, thus improving accessibility. 2013 Update: While updating our style sheet for HTML5 conversion it was discovered that most browsers use a very small default point size (~8pt) for monospace fonts (Courier New and others) which means the em technique is not effective. Further, the div definition which sets the font size (in our case to 1.0 em) can only contain one font style, thus it is impossible to set or override the basic monospace default to a more reasonable default.
May 2006 - Change of CSS pop-outs/pop-downs to support all browsers including MSIE 5/5.5/6 which allows elimination of Javascript for almost all page layout function. Implementation of MSIE conditional comments to handle all specific MSIE css/code/layout quirks. Complicated somewhat by the need to handle Opera as MSIE differently. Change to default page generation with the objective of providing better support for a wider range of browsers. Handling of MSIE 7 as a W3C compliant browser.
May 2006 - Overhaul our 'mail this page' script (PHP) due to an injection attack. The script now does extensive checks for various injection methods.
Mid 2005 - progressive conversion to Ruby for all new web development scripts. We will keep enhancing the PHP stuff but are not developing anything new in PHP.
Fall 2004 - Addition of a third level menu for W3C browsers (Gecko and Opera 7.4+) only for both the home page (side pop-out menu) and all other pages (top pop-down-menu).
Fall 2003 - Adoption of CSS for pop-up/pop-down menus for Gecko (Mozilla and clones) and Opera 7.4x+ browsers. Change to the graphics in all page banners to reflect the site content.
Summer 2003 - Adoption of CSS for liquid page layout and incremental conversion to CSS for all site features. Progressive elimination of Javascript for User Interface functions. De-commited Netscape 4.x new development. Added Opera 7.x support.
2002 - Facelift to make site lighter and cleaner. > 1,000 pages took about 4 hours due to CSS1 usage. Initial implementation of table-based liquid page design. Addition of Javascript drop-down menus on all pages.
1999 - Major site overhaul. Tech Stuff section started. Conversion to simple HTML editor (HTMLKit in our case) for all page development. Addition of Javascript and pop-out menus. Substantial reduction in average page size. Limited use of CSS1 style sheets. Use of SSI/XSSI for page creation. Removal of Frames. Removal of Frontpage framework.
1997 - Site rework - extensive addition of material to cover new products. Conversion to Frontpage publishing framework.
1995 - initial Frame based web site. In-house development. HotMetal HTML Editor.

We have six objectives for the site:

Provide simple, clean and consistent navigation.
Provide a contact location on every page - if you want to tell us something we want to make it as easy as possible.
Lightweight 'look n' feel' to site.
Sensible use of technology - leading edge wherver sensible (but never bleeding edge).
Fast page load - pages are typically 50 to 90% smaller than they were.
An increasing 'Tech Stuff' section as a resource for the community

Comments are welcome as always (use the 'mail us' navigation at the top or the comments section at the foot of the page).

Technology

If you are interested, the site currently uses the following technologies:

CSS2/3 for page layout in all browsers.
CSS2/3 for pop-up menus on all pages when used with Gecko, MSIE 5/6/7/8/9/10/11 and Opera 7+, Webkit (Chrome, Safari etc.) browsers. (This is part of our general move away from use of javascript)
Client Side Javascript for the various calculators (wireless and acoustic) and IP Address manipulation (IPv4 and IPv6) we provide.
Client Side Javascript for certain residual function which we cannot currently eliminate, such as page printing, and email name mangling.
Client Side Javascript, DHTML and CSS for the pop-up menus on older (pre V7) MSIE and compatible browsers.
Client Side Javascript and PHP (server-side) for the mail this page feature.
Extended Server Side Includes (XSSI) (an Apache feature) to simplify page construction and to generate browser specific pages (server-side sniffing).
PHP Server Side applications for Feedback pages.

One of the more interesting side-effects of the design strategy adopted in 1999 is that depending on the browser you are using you will get a different dynamically generated page and page look. This was originally an artefact of the pre W3C browser incompatibilities (largely, but not entirely in 2015, a thing of the past). The biggest difference in 2015 is that we drastically changed the look on mobile devices. (if you are into this stuff.)

CSS Technology

CSS Technology Most web sites these days use CSS so it's not too much of a surprise that this site does also. The reason we even use this stupid button is simply to indicate that we have used CSS since 1999, had a major epiphany in summer 2003 with CSS page layout (if you are interested) and a veritable damascene moment in Fall 2003 over CSS menus (yawn). Leading edge (but not bleeding edge) at the time. Today, meh. But we still like to remember our adventurous past.

Our Buttons

We use a number of buttons to indicate the features available on the page. Most browsers display a tooltip to indicate the functionality provided but in case not, here is a brief description:

Mail Us Clicking this button takes you to a page that allows you to directly mail Zytrax. Useful if you do not an email client configured or are using another device to access the web and are keen/desperate to tell us something or ask a question.

Mail a Friend Clicking this button allows you to quicly mail a reference to the page you are on to a friend. Sadly, due to spam injection dangers, there are now limits to how often you can do this over a short period (currently 5 times in a single day).

Print page Clicking this button will print the page by removing both left and right hand menus and any advertising that may appear on the page. It uses a short Javascript function to trigger the printing. If you just want to remove the menus and use the whole scree/window to display test use the full-width button.

decrease font size Clicking this button will reduce the font size used on the page. We define all fonts in em units so if you change your browser's default font size, the page will always display fonts relative to that size - it will not override your defined selection. The default font size on most desktop browsers is 12pt (approx 16px).

Increase font size Clicking this button will increase the font size on the page. We define all fonts in em units so if you change your browser's default font size, the page will always display fonts relative to that size - it will not override your defined selection. The default font size on most desktop browsers is 12pt (approx 16px).

View full width Clicking this button will remove both left hand and right hand menus and allow the body text (the stuff you are, nominally, interested in) to use the whole screen or window width.

This button indicates an RSS 2.0 Feed is available. Hovering over the button will show instructions as to how to utilise the service. In the event these do not display the following process should be used.

If your browser and OS supports the service, just drag and drop the image into your RSS Feed Reader.
Alternatively right click with the mouse and depending on the browser use either 'Copy Link URL' or 'Copy Shortcut'. Paste into your RSS Feed Reader.
If everything fails, click the image link and copy the URL from the Address line of your browser and paste into your RSS Feed Reader.

Navigation Symbols

We try to keep them to a minimum and use them consistently. Everyone thinks they have the most obvious symbols on the planet ... but no-one does. We are no exception.

⊕	Appears only on smartphones or devices that indicate they are mobile. Tapping the symbol will expose a multi-level CSS menu. This, we feel, optimizes screen real estate in normal page viewing.
	Go Back to.. a specific page (text explains where) or use the 'Back' button in your Browser to return where you came from.
	Go to ... additional information (arrow may be black, blue or white)
	Go to top of page... or page contents
	Go to location below on this page
links	We normally use blue and under-line when you mouse-over a link. If you mouse over a link that opens a new window it will look like this.
Home	Click the ZYTRAX Logo on any page to go to our home page.

Well, we said there were not that many ..

Go to Home Page

Problems, comments, suggestions, corrections (including broken links) or something to add? Please take the time from a busy life to 'mail us' (at top of screen), the webmaster (below) or info-support at zytrax. You will have a warm inner glow for the rest of the day.