diff options
Diffstat (limited to 'www/index.html')
| -rw-r--r-- | www/index.html | 198 |
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> - <a href="http://wiki.neo-layout.org/wiki/Einführung">Einführung</a> - <a href="./download.html">Download</a> - <a href="http://wiki.neo-layout.org/wiki/Benutzerhandbuch">Benutzerhandbuch</a> - <a href="./about.html">Impressum</a> - <a href="http://wiki.neo-layout.org/wiki/links">Links</a> +<!-- 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> + <a href="http://wiki.neo-layout.org/wiki/Einführung">Einführung</a> + <a href="./download.html">Download</a> + <a href="http://wiki.neo-layout.org/wiki/Benutzerhandbuch">Benutzerhandbuch</a> + <a href="./about.html">Impressum</a> + <a href="http://wiki.neo-layout.org/wiki/links">Links</a> </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> -<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> „ , ” , « , » , ∫ , √ , α , β , …<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> + <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> + + + |