HTML und Javascript-Seite auf Deutsch
HTML und Javascript-Seite auf Deutsch

HTML and Javascript

Here I would like to give some hints about Javascript that I did not find elsewhere or that I consider important for other reasons.

HTTP is unsecure

(?) Question mark! Google states this. Yes, HTTP is unsecure if you enter passwords or personal data and someone develops enough interest to invest into substantial effort to get it. This would not apply to my site. It contains only information I published willingly and no personal data or passwords are involved when you use it. It contains only information wich is of no political relevance and should be legal in any country of the world. I could not think of a reason why anyone would want to see how you or any other $PERSON_OF_INTEREST would click through my site. The information that you do could not be avoided using HTTPS. Just the data you enter and the exact pages would not be obvious then. But even the pages can be determined since every page has an individual size.

Google Chrome will start marking my site as unsecure in july 2018. I'm hosting my site on a free account which does not allow SSL. I do not earn money with it and therefore can not pay money for a SSL server or a certificate (and not for google ads of course). If Google starts degrading my site for this, it will propably vanish sooner or later. This would not do any harm to me (although I would of course feel sorry) but it would be bad for the people that could profit from my site. In this way, free knowledge and open source would vanish not only from my site. Well, indeed it does not vanish but Google can make it really hard to find! It's a pitty but money rules. People like me generally do not pay for Google ads and there is no space for us in Google's internet.

So thousands of sites will be marked 'unsecure' without bearing any danger. This will lead to users ignoring the 'unsecure' and beeing trapped by really unsecure sites. Who wins? I'm sure google knows the answer... probably it's Google!

Bullshit by Design

This is my résumé about javascript.

A programming language in which you do not have to declare or typecast variables is an error by design.

Luckily I did not have to write much code in javascript but nevertheless I ran into some pitfalls and wasted hours searching for errors that just would not be there in a 'reasonable' language:

Starting with ECMA5 which was published 2008 it is possible to eliminate the second point by using 'use strict'. Well, better late than never but Windows XP isn't dead even nowadays. At least, it is the best Windows ever in my opinion. You won't believe how many hits I get from XP xlients...

SI-Prefix

When I searched for it, I expected tens of sites that would deal with it but I found not a single one with useful content. Odd, isn't it? Find here a little javascript that allows input in SI prefixes and formats output in even such.
It converts input like 1k3, 1.2M or even insane like 1e6u into a corresponding javascript number and formats output in a suitable SI notation.
The script is not a proof of fine programming art but it is fairly useful and I hope you enjoy it. If you find an error or want to suggest an extension, feel free to drop me an email.

Again, I must express this script worked for me but I cannot be made responsible for every possible kind of usage or user input (users are very creative!). If you use this script you do this on your own risk and responsibility!

I have been using this script in various of my electronic calculators and it worked fine.

SSI, UTF and BOM

I use Server-Side-Includes to include the menu in my web pages.
Now, I have wasted hours to figure out why in some of my pages there was a gap above the logo.

The answer: my favourite editor created the include file as UTF with BOM, so the include produced an extra line above the logo! So I just reloaded the file, changed encoding to UTF without BOM and all worked perfectly fine!

Sitemap.xml

Have you ever been annoyed that Google asks you to submit a "Sitemap.xml"-File? Whose brain might have breeded this kind of nonsense? Google can (and will) create a sitemap just based on your internal links. If you have dead pages wich are not linked from your domain, it is your fault. Even Xenu can do this. Though, a sitmap in wich every single page has a priority of 0.8 will probably lead to degradation.

The only advantage would be you can actively specify a weight of certain pages. This could have been solved by a simple meta tag without the urge to generate a separate file wich, unless you work absolutely accurate, never will reflect your entire site or even cites pages that do not longer exist (what would probably lead to degradation).

I did not submit a sitemap nor will I do in the future, thats just too much work for me! For me, it is not important to be listed under the first hits on Google. It might be important for the users profiting from my site but not for me. If you operate an online shop things may seem different. If so, have fun with the sitemap.xml...

More than one H1 per page

Why not? The title of the page is noted in the title-tag. Why should there be one single h1 that sounds exactly like the title? This is nonsense. A html-page is not one chapter in a book, it's a page and a page may contain more than one headline (or even none at all). Why should I create a layout in wich h2 looks exactly like h1?

There are voices that claim Yahoo (like Bing) would reduce pages with more than one h1 in rank. Well, the hits I get from Yahoo and Bing make less than 1% so even if, that simply really does not matter for me! At least Google seems to support my opinion :-)

May be, this is a self-emphasizing process and the reason why I have so few hits from Yahoo and Bing is because I have more than one H1 on some pages but I would not risk to gain 10% more hits from Yahoo without being sure not to loose 10% from Google.

In my experience, there is only one search engine you should optimize your website for. You know the name. Anything else is meaningless.

Tooltips

I found lots of magnificant CSS code that produces really nice tool tips but not a single one that works if the element is at the left or at the right. In any case the tooltip would appear cut off. The only way I can think of is a simple <span> with a title tag containing the tool tip. It always works since the browser is responsible for display. You have no control about how it is displayed but you are sure, it will show up. This is better than to control the layout but not to be sure it will display at all...

Web and TTF Font LCD 5x7

For my Eload-Page I wanted a font similar to a 5x7 Display with a HD44780.

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ

abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ

I just made it myself with FontForge and provide it for download as TTF and as WOFF. Free for any use except for sale. Pimp up your printed user documentation or your Website, private or commercial, anything you want, it's free!

I tried to get pixel level accuracy but characters above 127 are not yet implemented. Instead, I added some characters that I use as soft characters in my projects:

CharacterPositionHTML
Antenna161 (0xa1)&iexcl;
µ181 (oxb5)&micro;
Ω937 (0x3a9)&Omega;

Be aware that the size of the font (especially on devices with limited physical resolution like web pages) may affect the visual appearance. You might want to change it for some percent to get a better user experience.

Web- and TTF-Font LED/LCD 7-Segment

While designing my digital weigh scale it was desirable to have a font representing the display via a 7-segment display in a realistic way.

Since I did not find one in the web I hereby offer my self-designed one for download as TTF or as WOFF.

Design example:
rE5Et. CLEAr. don't touch. 5YNC. 1234567890. YE5. no. N0. N0. Abort. 51-23=28.

Here as well as above, free for any use except selling for profit!

Of course you can select foreground and background color at will to represent your desires, i.e. for a LCD:
rE5Et. CLEAr. don't touch. 5YNC. 1234567890. YE5. no. N0. N0. Abort. 51-23=28.

Note: This is not a complete Font for writing! It only consists of charactars displayable by a 7-segment Display. So it has a capital 'A' but not a lower case one. It has a lower case letter 'b' but not a capital one. It has a closing bracket but not an opening one which would look exactly like a capital letter 'C'! And of course it does not contain an 'x', 'w' or 'v' since these symbols cannot be displayed on a 7-segment display! To use a capital letter 'O' you would have to chose a number '0', for a capital letter 'I', take a number '1'. Noone will notice the difference. It's just 7-segment! You can't do it any better! But you can test out your 7-segment display evaluating with this font. Have fun with it!