summaryrefslogtreecommitdiffstats
path: root/www/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'www/index.html')
-rw-r--r--www/index.html198
1 files changed, 126 insertions, 72 deletions
diff --git a/www/index.html b/www/index.html
index 9b3375a..1ea9c31 100644
--- a/www/index.html
+++ b/www/index.html
@@ -3,136 +3,190 @@
<html>
<head>
-<title>Neo – Neues Deutsches Tastaturlayout</title>
-<meta http-equiv="content-type" content="text/html; charset=UTF-8">
-<link rel="shortcut icon" href="./favicon.png">
-<link rel="stylesheet" type="text/css" href="stylesheet.css">
+ <title>Neo – Neues Deutsches Tastaturlayout</title>
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
+ <link rel="shortcut icon" href="./favicon.png">
+ <link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
-<p>
-<div style="1111oben!!line-height:2em; margin-bottom:3em;" id="linkbutton">
- <object data="./neo-logo.svg" type="image/svg+xml"
- style="width:20mm; height:6mm; vertical-align:middle; padding-right:1em;">
- <param name="src" value="./neo-logo.svg">
- <img src="./neo-logo.png" style="vertical-align:middle" 1style="height:2em; width:7em; flow:right;" alt="Neo">
- </object>
-
- <a href="http://wiki.neo-layout.org">Wiki</a> &nbsp;
- <a href="http://wiki.neo-layout.org/wiki/Einführung">Einführung</a> &nbsp;
- <a href="./download.html">Download</a> &nbsp;
- <a href="http://wiki.neo-layout.org/wiki/Benutzerhandbuch">Benutzerhandbuch</a> &nbsp;
- <a href="./about.html">Impressum</a> &nbsp;
- <a href="http://wiki.neo-layout.org/wiki/links">Links</a> &nbsp;
+<!-- hintergrundverschönerungen /-->
+ <div style="position:absolute; right:2em; top:180px; background-image:url(./verzierung_vertikal_rechts.png); width:100px; height:197px; text-align:center; z-index:0;"></div>
+ <div style="position:absolute; left:2em; top:180px; background-image:url(./verzierung_vertikal_links.png); width:100px; height:228px; text-align:center; z-index:0;"></div>
+<!-- /hintergrundverschönerungen /-->
+
+<p>
+<div style="margin-bottom:3em; z-index:100;" id="linkbutton">
+ <object data="./neo-logo.svg" type="image/svg+xml" style="width:20mm; height:6mm; vertical-align:middle; padding-right:1em;">
+ <param name="src" value="./neo-logo.svg">
+ <img src="./neo-logo.png" style="vertical-align:middle" 1style="height:2em; width:7em; flow:right;" alt="Neo">
+ </object>
+
+ <a href="http://wiki.neo-layout.org">Wiki</a> &nbsp;
+ <a href="http://wiki.neo-layout.org/wiki/Einführung">Einführung</a> &nbsp;
+ <a href="./download.html">Download</a> &nbsp;
+ <a href="http://wiki.neo-layout.org/wiki/Benutzerhandbuch">Benutzerhandbuch</a> &nbsp;
+ <a href="./about.html">Impressum</a> &nbsp;
+ <a href="http://wiki.neo-layout.org/wiki/links">Links</a> &nbsp;
</div>
</p>
-<div style="position:relative; top:-.6em; margin-bottom:1em;">
- <img src="tastentierchen_baustelle.png"/>
- <h1 style="line-height:1em;">Willkommen zum neuen Schreibgefühl!</h1>
- <div style="position:relative; top:-.8em; margin-left:1em; color:#999; font-style:italic;">Ergonomischer, schneller und entspannter schreiben:</div>
-</div>
-<p><font style="color:#222">Neo ist ein neue Tastaturbelegung, die </font>extra für die Deutsche Sprache<font style="color:#222"> optimiert ist. Ihre Hauptmerkmale sind:</font></p>
-<ul>
- <li>
- <font style="color:#222">Optimierungen bezüglich deutscher </font>
- Zweier- und Dreier-Zeichenfolgen</li>
- <li>Programmiertasten
- <font style="color:#222">sind gut erreichbar</font></li>
- <li><font style="color:#222">Neue Zeichen, wie </font>«,»,∫,√,µ<font style="color:#222"> sind direkt einzugeben</font></li>
-</ul>
-<div id="linkbutton"><a href="i" style="AAAAAAAdisplay:block;">Warum neo besser ist als qwertz</a></div>
-<br>
- <br>
-<hr>
+<div style="text-align:center;">
-<div style="text-align:center; 111float:left">
+<!--
-<div style="min-width:650px; overflow:visible;">
-<div id="linkbutton" style="text-align:center; ">
-<a href="i" style=""><font style="color:#F42">Ebene1</font></a>
-<a href="i" style="">Ebene2</a>
-<a href="i" style="">Ebene3</a>
-<a href="i" style="">Ebene4</a>
-<a href="i" style="">Ebene5</a>
+ <div style="position:relative; top:-.6em; margin-bottom:1em;">
+ <h1 style="line-height:1em;">Willkommen zum neuen Schreibgefühl!</h1>
+ <div style="position:relative; top:-.8em; margin-left:1em; color:#999; font-style:italic;">Ergonomischer, schneller und entspannter schreiben:</div>
+ </div>
-</div>
-</div>
+/-->
-<div><img src="./tastatur_ebene1.png"/></div>
+<!-- =================== Temporär: Baustelleninfo =============== /-->
+
+ <div istyle="float:left;">
+ <img src="./tastentierchen_baustelle_ohne_zigarette.png" alt="Baustellenbild" />
+ </div>
+
+
+
+ <div style="background-color:#fDD; border-color:#f00; margin:2em; padding:2em; border-style:solid; border-width:2px;; text-size:+2">
+ Momentan ist die Webpräsenz eine große Baustelle. Deswegen:<br>
+ <a href="./baustelleninfos.html">Installationsinfos und Einsteigerübersicht hier!</a>
+ </div>
+
+
+<!-- ========= ENDE ==== Temporär: Baustelleninfo =============== /-->
-<!--
-<1div style="background-image:url(./hintergrund_button.png); width:650px; text-align:center;">
-/-->
-<div id="linkbutton" style="min-width:650px; overflow:visible; text-align:center;">
-<a href="i" style="">Konzeptidee zur Ebene1</a> &nbsp; &nbsp;
-<a href="" > <img src="tastatur_ebene1_shift.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
-<a href="" > <img src="tastatur_ebene1_mod3.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
-<a href="" > <img src="tastatur_ebene1_mod4.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
-<br>
-<a href="i" style="">Tastenverteilung an beliebigem Text testen</a>
-</div>
+ <div style="text-align:left;">
+
+ <p>
+ <font style="color:#222">Neo ist ein neue Tastaturbelegung, die </font>extra für die Deutsche Sprache<font style="color:#222"> optimiert ist. Ihre Hauptmerkmale sind:</font>
+ </p>
+
+ <ul>
+ <li><font style="color:#222">Optimierungen bezüglich deutscher</font> Zweier- und Dreier-Zeichenfolgen</li>
+ <li>Programmiertasten <font style="color:#222">sind gut erreichbar</font></li>
+ <li><font style="color:#222">Neue Zeichen, wie </font>&nbsp;„ , ” , « , » , ∫ , √ , α , β , …<font style="color:#222"> sind direkt einzugeben</font></li>
+ </ul>
+
+ <div id="linkbutton">
+ <a href="i" >Warum neo besser ist als qwertz</a>
+ </div>
+
+ </div>
+
-</div>
</div>
-<hr style="clear:left">
+
+<br>
+<br>
+<hr>
+
+<div style="display:block; background-image:url(./tastatur_blass_gerastert.png); background-position: top center;" >
+ <div style="text-align:center; ">
-<div style="position:absolute; top:22px; left:0px; width:100%; height:70px; background-image:url(./tastentier-reihe.png); background-repeat:repeat-x; 111opacity:.5; "></div>
-<div style="position:absolute; top:0px; right:0px; width:11px; height:100%; background-image:url(./schatten_rechts.png); background-repeat:repeat-y; background-attachment:scroll; "></div>
-<div style="position:absolute; top:0px; left:0px; width:100%; height:50px; background-image:url(./schatten_oben.png); background-repeat:repeat-x; "></div>
-<div style="position:absolute; top:0px; left:0px; width:50px; height:100%; background-image:url(./schatten_links.png); background-repeat:repeat-y; background-attachment:fixed; "></div>
-<div style="position:absolute; top:0px; left:0px; width:50px; height:50px; background-image:url(./schatten_links_oben.png); background-repeat:no-repeat; "></div>
-<div style="position:absolute; top:11px; right:0px; width:11px; height:11px; background-image:url(./schatten_rechts_oben-versetzt.png); background-repeat:no-repeat; "></div>
+ <div style="min-width:650px; overflow:visible;">
+ <div id="linkbutton" style="text-align:center; ">
+ <a href="i" style=""><font style="color:#F42">Ebene1</font></a>
+ <a href="i" style="">Ebene2</a>
+ <a href="i" style="">Ebene3</a>
+ <a href="i" style="">Ebene4</a>
+ <a href="i" style="">Ebene5</a>
+ </div>
+ </div>
+ <div>
+ <img src="./tastatur_ebene1.png"/>
+ </div>
+ <div id="linkbutton" style="min-width:650px; overflow:visible; text-align:center;">
+ <a href="i" style="">Konzeptidee zur Ebene1</a> &nbsp; &nbsp;
+ <a href="" > <img src="tastatur_ebene1_shift.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
+ <a href="" > <img src="tastatur_ebene1_mod3.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
+ <a href="" > <img src="tastatur_ebene1_mod4.png" style="vertical-align:middle; border-width:0px; margin:2px; background-image:url(./hintergrund_button_hover.png);" /></a>
+
+ <br>
+
+ <a href="i" style="">Tastenverteilung an beliebigem Text testen</a>
+ </div>
+
+
+ </div>
+</div>
<!--
-<div style="position:absolute; bottom:10px; right:50px; z-index:15"><img src="tastentier.png"></div>
+</div>
/-->
+<hr style="clear:both">
+<!-- =================== Hintergrundbilder (Seitenränder) =============== /-->
+<div style="position:absolute; top:22px; left:0px; width:100%; height:70px;
+ background-image:url(./tastentier-reihe.png); background-repeat:repeat-x;">
+</div>
+<div style="position:fixed; top:0px; right:0px; width:11px; height:100%;
+ background-image:url(./schatten_rechts.png); background-repeat:repeat-y; background-attachment:scroll; ">
+</div>
-<div style="text-align:center;">
-<img src="./tastentier_zufrieden2.png" style=";">
+<div style="position:absolute; top:0px; left:0px; width:100%; height:50px;
+ background-image:url(./schatten_oben.png); background-repeat:repeat-x; ">
+</div>
+
+<div style="position:fixed; top:0px; left:0px; width:50px; height:100%;
+ background-image:url(./schatten_links.png); background-repeat:repeat-y; background-attachment:fixed; ">
</div>
+<div style="position:absolute; top:0px; left:0px; width:50px; height:50px;
+ background-image:url(./schatten_links_oben.png); background-repeat:no-repeat; ">
+</div>
+<div style="position:absolute; top:11px; right:0px; width:11px; height:11px;
+ background-image:url(./schatten_rechts_oben-versetzt.png); background-repeat:no-repeat; ">
+</div>
+<!-- ============ ENDE == Hintergrundbilder (Seitenränder) =============== /-->
-<!--
-<img src="./tastenhervorhebung.png">
-/-->
+<!--
+<div style="text-align:center;">
+ <img src="./tastentier_zufrieden2.png" align="middle" style=";">
+</div>
+
+/-->
</body>
</html>
+
+
+