Putting stuff before a counter with CSS and associated caveats

I thought this too important to be passed up, so here's only a very rough draft of what I discovered. And because I was only revisiting this subject right about now, I have yet to get my own head around all this, with more detailed explanations.
(Blogger had nasty issues with updating their software, so a number of blogs were in read-only mode and so instead of writing this up I was occupied with other things. The good thing is that Blogger have been very responsive in addressing the posting outage.)

When tallying personal data and opinions for what was ostensibly a list of items in a text file, I wanted to find out how in an ordered HTML list (a numbered list with <OL> tags) I'd be able to use Cascading Style Sheets (CSS) to place some special items before counters (usually numbers, but CSS 2 standard has expanded counters to be much more) as markers of some sort.

The main point was to make a more informative and interesting list... Well, yes, but this turned out to be a far more difficult exercise than I first thought.

For an intro, the following describes the differences in rendering between Mozilla Firefox 2 and Mozilla Firefox 3+. Because these browsers use the Gecko rendering engine, which is used by other browsers, then here's also a quick browser side-by-side of the rendering engine's branches:

Gecko 1.7	Gecko 1.8.1	Gecko 1.9 and newer
Mozilla Firefox 1.0	Mozilla Firefox/IceWeasel 2	Mozilla Firefox/IceWeasel 3+
Mozilla Application Suite 1.7	SeaMonkey 1.1	SeaMonkey 2+
	K-Meleon 1.5	K-Meleon 1.6+

What follows is example CSS code with some comments. I haven't yet had all the time to describe everything, but bear in mind the lede.

OL.Eurovisioon {counter-reset:item; list-style-position:outside}

OL.Eurovisioon LI {display:block;}

/* • display:block ^ loses the browser's automatic numbering;
• The items must be displayed as block, so as to make sure that the later width attribute applies. */

OL.Eurovisioon LI:before {float:left; content:'miskitekst\ ' counter(item) '.'; counter-increment:item; border:solid 1px gray; padding-right:5px; width:82px; text-align:right; line-height:1.1em; color:navy; white-space:nowrap} _{/* these work... */}

/* ^ • Floating them left makes sure that the items are displayed like in a standard ordered list;
• item must be inside counter(), item is also specified for counter-increment;
• text-align:right aligns numbered counters right and so makes it more list-like again;
• white-space:nowrap makes sure that when increasing text size, text inside blocks wouldn't wrap and add in height and take away from the structure.

Caveats:
Once the items are all displayed as text-block or inline, the width attribute does not apply anymore. Displaying as block and floating to right works in Firefox 4 (I'm also assuming 3.0+), but not in SeaMonkey 1.1 and anything with the Gecko 1.8.1 engine (see the above table) and the caveat applies to all older browsers.). Setting the display to text-block or inline fixes the issues in SeaMonkey 1.1, only that setting width attributes does not work then. */

OL.Eurovisioon > LI.plus:before {width:82px; content:'\ sisu\ ' counter(item) '.\ '; text-align:right; color:blue} _{/* somehow works */}

OL.Eurovisioon > LI.plus {list-style-position:outside}
^ Is this really necessary?

Moreover, the list already contains tabular data; including informative content with :before or :after pseudo-classes means that this data won't be indexed and may be lost to search engines. Non-graphical and older browsers won't be able to see such content.

I, of course, thought that I'd never see the day when my own fancy CSS implementation would not be visible with something like SeaMonkey 1.1.19.

The correct rendering is supported by Mozilla Firefox and IceWeasel 3 (probably since 3.0), SeaMonkey 2, Google Chrome (Version 11 does, so I'm assuming a host of earlier versions do, too), and the latest Konqueror, Apple, and Opera fare. Internet Explorer 7 does not support this. Bleh.

So here's the example list:

1. tekst
2. teine tekst
3. kolmas tekst
4. neljas tekst

with corresponding code in HTML:

<OL CLASS=Eurovisioon>
<LI>tekst</LI>
<LI CLASS=plus>teine tekst</LI>
<LI>kolmas tekst</LI>
<LI>neljas tekst</LI>
</OL>

So long I still have to use Mozilla Firefox 1.0, I must still use a simple HTML table. At least the advantage is that most browsers will be able to see the content. The table in question is here.

As the information was laid out in a text file, it nevertheless turned out to be tabular data, which was actually much simpler to organise into a table, rather than implement complex CSS for the same.

Somehow installing, configuring, and using NoScript in K-Meleon 1.5 via Wine

I am assuming that you probably already know how to use Wine and know your way around the computer.

The conditions: Knoppix 4.0.2, because it runs passably with 128 Mb of RAM, in a situation where no swap space is available. This version of Knoppix has a really outdated version of Wine, which makes it difficult to use Windows programs there. There may be people stuck with either that version of Knoppix or that old version of Wine. At least this post provides a case study, which I hope could be of some interest.

The only reasonable place I could find NoScript for K-Meleon 1.5.4 is from extensions.geckozone.org/KMES-NoScriptEn. The version is 1.7.8.0 and it's from 17.06.2008 (that's 2 and 3/4 years old as of April 2011).

First off, change installer's .exe file rights for it to be an executable. Like this from the command line:

chmod u+x "K-Ext(1.1-1.5-1.6)_NoScript(1.7.8.0).exe"
^ u = for current user; + = add/enable; x = executing;
The filename is wrapped in double quotes, because it contains parentheses "()".

In my case, the first round of installation didn't work. Later I specified this target install directory:

z:\mnt\hda1\Program Files\K-Meleon
^ can't remember if I specified an upper- or lowercase letter z

and installation worked after that.

K-Meleon should not be running during installation, so run it after installation.

27.04.2011.–: After a relatively quick-and-dirty article which turned out to be far more specific than originally anticipated and still quick-and-dirty, I've updated the following with information which will make K-Meleon slightly easier to use as it is, with what the setup is and all...

When running K-Meleon through Wine in Knoppix 4.0.2 (remember that it's from 2005 and very outdated) and when you're stuck with such a set-up:

• The NoScript button menu can be used with a mouse by right-clicking on the NoScript button and holding the pointer device button down and dragging the cursor to the necessary command (shortcut menus will otherwise turn off after right-clicking on an item and hovering a mouse cursor over its menu; I've seen this in TWM, don't know how it works in other window managers).
  Other ways:
  • Click on the NoScript button, then use menu hotkeys (underlined) to perform a function;
  • or consider dragging the pointer through the NoScript menu via the main Tools menu.
• Saving configuration changes in the NoScript Options window does not work, because it's impossible to save settings by clicking the OK button, but you can otherwise close the window (saving options may work with newer versions of Wine; haven't tried this myself).
  Workarounds:
  
  • Configuring NoScript is possible only at about:config for settings (use the noscript text pattern in the about:config search bar to get NoScript-specific settings);
  • ^ Consider removing some default domains there from the noscript.default string;
• Worse, the NoScript menu in K-Meleon (at least in the given configuration and set-up) won't show domain names in its menu (Shock! Horror!).
  • Now, the whitelist, which is not shown in about:blank, is only configurable in prefs.js at the local K-Meleon profile folder on the hard drive (from where K-Meleon is run). If you don't know what the prefs.js location of the current profile is, open Preferences, go to "Privacy & Security" preference category, click on the Cache tab and see the "Cache Folder:" entry, which shows the location of the current profile folder.
    An example location is here:
    

    "/mnt/hda1/Program Files/K-Meleon/Profiles/g1bb3r1sh.default"

    So, edit the prefs.js file with a text editor at this line:
     
    user_pref("capability.policy.maonoscript.sites","place.doma.in nam.es here.com in.alphabetic.al ord.er.com ea.ch doma.in na.me separated.wi.th a.space.com and.do not.break.the.li.ne");
     
    Make sure just in case that K-Meleon is not running when editing the file, because if you've saved the file and then exit K-Meleon, then K-Meleon is highly likely to overwrite your changes.
    13.09.2011.

    Given that I had been using K-Meleon like that for a longer while, I created a menu item in the TWM window manager, where I could directly open the prefs.js file from the menu.
  • Alternately, adding sites to whitelists works from the menu (see above), but since the above configuration does not make it possible for the K-Meleon URL bar to function and display addresses, then a user is limited to knowing the site domain and web page address in the following ways:
  • In K-Meleon, the tab bar is typically shown by default, so it should be enough to hover the mouse cursor over a page's tab button: This displays the tool tip, which then shows the site/page title and its partial address.
  • A user might know the site's domain name, if they've entered it themselves (because of limitations, entering a URL goes through editing bookmarks and accessing a bookmark set up for just that).
    A user can specify that only top-level domain names are added, by setting this in NoScript preferences through about:config, only that the whole point of NoScript to me is the fine-grained way in which some subdomains can be whitelisted, so that disruptive ones are duly excluded. Unfortunately, not directly seeing a site's domain name in the URL bar has security implications, including the fact that the non-functioning URL bar doesn't change color when visiting a secure site, though a bottom-right status bar indicator should work. Preferably, only safe sites should be visited. (Avoid clicking e-mail links, if you know they're dubious, but this requires at least some user education and this is where NoScript is useful. There is nevertheless a greater amount of security in running K-Meleon equipped with NoScript, no matter how limited it is, through Wine in Linux than in Windows 9x);
  • Some necessary domain names pulled by a page from (a) differently-named domain/s to fetch scripts and/or stylesheets across sites and subdomains are not displayed anyway (not even in the NoScript menu), so there is no direct way of learning which other domains must be allowed for scripting.
  • Consider disabling NoScript for the duration of the session, if you're using a service which requires logging in and if it's been impossible to learn what are the exact outside domains with necessary scripts.
  • The third option is to import domain names from other NoScript settings in other prefs.js files. This actually works. But what if using a new service that users a non-primary domain name for scripting? Or what if an existing service sometimes changes its subdomains?

Best Gecko-based browser for Windows 9x

The latest and last versions of Gecko-based browsers to run on Vanilla Windows 98/Me (and 95, with updates and other reservations) are

• Mozilla Firefox 2.0.0.20 (Gecko 1.8.1.20, 20081217),
• K-Meleon 1.5.4 (Gecko 1.8.1.24pre, released on 05.03.2010) and
• SeaMonkey 1.1.19 (Gecko 1.8.1.24, released on 16.03.2010).

If there were a competition between the three, then the winner would be SeaMonkey.

The reasons are thus:

• Under similar limited circumstances, SeaMonkey 1.1 is more responsive than Mozilla Firefox  2.

  Here's why: SeaMonkey 1.1's XPFE/XPToolkit-based user interface (UI) technology dates back to Mozilla Application Suite (v1.0 released 05.06.2002, but pre-releases were usable since a year before), while Mozilla Firefox 2.0 (2006) is completely based on a newer toolkit (XUL).

• SeaMonkey 1.1.19 has a newer and more secure Gecko layout engine than Mozilla Firefox 2.0.0.20 and K-Meleon.
• SeaMonkey 1.1 has been supported by the two most important extensions to grace web surfing: Flashblock and NoScript.

  K-Meleon also uses the native Windows API for its UI, meaning that it can't run extensions which normally work in SeaMonkey or Mozilla Firefox.
  
  While K-Meleon comes close with its quick UI responsiveness and its rendering engine, it's only good for websites that are safe and are known to not be resource-intensive. Most of the latter still exist as they are, but the most popular sites (for webmail and news) are regularly redesigned to include more fancy features and are therefore made more demanding by way of including extensive JavaScript and AJAX technologies and often embedding multiple manifestations of the Adobe Flash plugin.

Which is why SeaMonkey 1.1.19 adorned with NoScript and Flashblock extensions is about the best Gecko-based browser solution that there is for Windows 9x, even Windows 95.

The only caveat is that SeaMonkey requires at least 64 Mb of RAM to run passably and at least a 266 MHz CPU. Well, a Navigator-only one-window/one-or-two-tab solution works in a PC with just a slightly lesser CPU.

K-Meleon is best for computers with 32–48 Mb of RAM (certainly less than 64 Mb).
Some words of caution: Java and JavaScript could only be allowed for safe and non-demanding websites. Because of a lack of NoScript or like extension for K-Meleon, JavaScript should be turned off for casual browsing (sometimes even a Google Search result may cause a hiccup). Keeping Java on is only recommended when a user consciously recognizes a real and pressing need to use that plugin (maybe a map application over the web).

On Plugins

Although Adobe Acrobat Reader 6.0.6 (released/updated last in 2003) is about the last version for Windows 98 as far as I know, it is still outdated and so more vulnerable to attacks that use the Reader.

While older computers might best handle even older versions of Acrobat Reader, it's most important to disable Acrobat (Java)Script in the Reader's preferences, no matter the version. This should somehow prevent malicious websites using the Reader as an attack vector.

A complete alternative to using Adobe Reader in old computers is muPDF: It's much less resource intensive, supports the newest PDF document display standard (PDF 1.7) and does not use AcroScript. muPDF does not support interactive PDF elements; this is both a caveat and a security/speed measure. muPDF does capture the file type association in Windows, so when using the app, then it's an either-or situation between it and Acrobat Reader. It should still be a no-brainer in old computers.

pilet.ee-sse ei saa sisse

Juhtus selline lugu, et tegelikult päris modernse, kuid õige pisut aegunud Mozilla Firefoxiga (versioon 3.0.19) läksin pilet.ee kodulehele ning seal tekkis selline veateade:
"invalid security certificate".

Veateade annab võimaluse lisada pilet.ee domeen erandite nimekirja, kuid seda pole tegelikult vaja teha.

Sama veateade võib tulla ka teiste vanemate Gecko-põhiste lehitsejatega, nagu näiteks SeaMonkey (Mozilla edasiarendus), K-Meleon, Galeon, Epiphany jt.

Lahendus:
Tarvis on lehitsejale peale panna Sertifitseerimiskeskuse sertifikaadid siit või siit.

See on suhteliselt lihtne, sest sertifikaatidele tuleb peale klikkida ja siis ilmub programmidialoog, mille kaudu saab sertifikaadid lehitsejasse panna. Saab valida vähemalt, et nende sertifikaatidega saab ära tunda veebisaite.

Tuleb tähele panna, et see protseduur tuleb veateate esinemisel teha igas lehitsejas ja lehitsejaprofiilis eraldi. Lähtuda võib kasvõi sellest, kui lehitsejas niisugune veateade tekib.

Kui niisuguseid asju juhtub ka Internet Exploreriga, tuleb sertifikaat samamoodi peale panna.

Optimize page rendering of Gecko-based browsers

Originally posted on 24.09.2008.

Tips from here.

• nglayout.initialpaint.delay — Set the integer value to 0 if the connection is too slow.
  
  E., 06.12.2010 Edit/Update: The downside is greater CPU usage, so if the computer is slow and/or if there's a slow operating system (Windows 95/98), then don't use this feature.
  
  For example, I have at my wherewithal a 900 MHz computer with 128 Mb RAM and Windows 98SE (the operating system that was supplied by the manufacturer), in which OS the latest Gecko-based browsers can be Mozilla Firefox 2.0.0.20, K-Meleon 1.5.4 and SeaMonkey 1.1.19.
  
  In late 2010 I realized how much more complex have websites become and their rendering really slowed the computer down. Messages about unresponsive scripts have also become more frequent.
  
  The only thoughtful solution to this would be changing the operating system to something lightweight, which supports SeaMonkey 2.0 (such as Linux). More about this in a future post.

Most important settings in optimizing Mozilla Firefox, K-Meleon and other Gecko-based browsers

Usually these two about:config instructions rarely appear together in any entry about optimizing a Gecko-enabled browser, such as Mozilla Firefox, K-Meleon, SeaMonkey and others.

In about:config —
• network.prefetch-next — toggle to false (can be done with a doubleclick)
• browser.sessionhistory.max_total_viewers — change to 0 on computers with low resources or 2 on friskier machines.
In very modern and very fast machines, the default settings can be kept intact.

Update: 28 Coolest Firefox about:config Tricks — Contains instructions both for Windows and Linux users and those who prefer some of the older Firefox UI features.

E., 18.07.2011. Update: Something I very recently found by chance in a version of Firefox on Knoppix 4.0.2, yet which may well exist in other systems and versions:

browser.related.enabled can be set to false, because the preference does very little specifically in anything that is not SeaMonkey (unless someone is using any What's Related-like extension that uses the preference).

Most of the preferences well apply to older versions of Gecko-based browsers, especially those that use Gecko 1.7, 1.8 and 1.8.1 (upwards to Firefox 2, SeaMonkey 1.1 and K-Meleon 1.5.4).

Firefox 4.0/5.0+ (where 5.0 is actually an incremental development because of rapid development practices now at mozilla.org) are less and less likely to require these modifications, because they're typically installed on modern and very modern computers.

L., 22.10.2011. Update:

browser.sessionstore.max_concurrent_tabs — Set to 0

If you're using multiple tabs, then upon session restore all the tabs are restored, but pages are loaded only on the tabs that you open. If you're using more than one window, the last tabs open before closing will still load.

Applies to Mozilla Firefox/Iceweasel/IceCat 4–8 only
08.01.2012. update: The feature was deprecated in version 9.0 of Firefox and corresponding forks. Users who still have version 8.0.1 at most and are happy with how it performs, should turn off the auto-update feature in Preferences.

Other options can be found from about:config entries at MozillaZine Knowledge Base Wiki.

P., 04.03.2012. Update:
This one should be useful for users of LiveCD-s:

plugins.hide_infobar_for_missing_plugin

This should work in Mozilla Firefox/Debian Iceweasel/GNU IceCat 3.0 and SeaMonkey 2.0 or newer (given that the function was first checked in on 02.10.2007).

P., 05.08.2012. Update: browser.sessionstore.interval — Set integer to more than 10000 (milliseconds; default value means 10 seconds) — I sometimes set it to 34000 or even 60000.

This can be useful if you don't want Firefox to interfere with plugin work. (I won't guarantee that it would work as expected, but in theory it sould improve performance. Apply if you think it may help.)