Helmi´s Hobbies

Herzlich willkommen auf meiner Seite

Stand: 20.11.25

Lost Places

Ein Besuch der großen, sich selbst überlassenen, Freibadanlage auf Rhodos im Okt. 2025 - Teile: #1 / #2 / #3 / #4.

Miezekatzen

Habe diesen Bereich etwas überarbeitet. Es sind auch neue Miezen online.

Minolta MD Tele Rokkor 135mm / 3.5 von 1977

Viel zu selten habe ich es mit dabei. Leider, denn es ist wirklich gut. Hier ein paar Bilder aus Remmelsohl und Umgebung.

Minolta MD Zoom 35-70mm 3.5 (macro)

kurze Erkundungstour durch Bielstein. Habe eins meiner Minolta Zooms nochmal ausgeführt.

Tokina RMC 75-150mm 3.8

Ganz vergessen - Bilder eines Frühlings-Walks in Niederseßmar mit dem Tokina.

Leitz Wetzlar Elmarit-R 90mm 2.8

Ein kurzer Sonntagmorgen-Spaziergang durch den Ort.

Wiehl - neuer & alter Park

Auch ein Ort an dem ich seit Jahren immer mal wieder gerne hingehe. Wenn ihr durch meine Seite stöbert, findet ihr überall Motive, die ich in Wiehl fotografiert habe.

Single Knips .... unterwegs im Ort

Habe mich dazu entschlossen eine eigene Rubrik für Einzelbilder zu eröffnen, die ich in meinem Wohnort mache.

Fed 2

hier mit einem Industar 61.

Zeiss Ikon Contessa 35 (533/24)

Eine wirklich coole Kamera aus den frühen 50zigern.

Ein Spaziergang in SW

Ich hatte das schon länger vorgehabt - einen Spaziergang in schwarz-weiß

habe Goldie gerettet ....

Eine neue Rubrik ist online: Fotogeschichten.
Vielleicht folgen bald weitere.

Blumenwichtel ....

neue Wichtel-Modelle sind online.

│ weiter zur > Seite 2 < │

Box-Fenster Introduction

Dies ist ein Versuch

Per div-Box öffnen sich Fenster direkt innerhalb der selben Seite bei Klick auf den Buttons 'Mehr', 'Weiter' oder ähnlich. Gerne legen Sie nach diesem Prinzip nur bei Bedarf weitere neue Fenster an bzw. löschen Sie auch nicht benötigte.

Box-Fenster Introduction

Fenster öffnen auf der selben Seite

Per div-Box öffnen sich Fenster direkt innerhalb der selben Seite bei Klick auf den Buttons 'Mehr', 'Weiter' oder ähnlich. Gerne legen Sie nach diesem Prinzip nur bei Bedarf weitere neue Fenster an bzw. löschen Sie auch nicht benötigte.

Neue Fenster anlegen

Hinweis: Der fettgedruckte Teil bei den nachfolgenden Code-Beispielen soll Ihnen bereits zeigen, wie Sie ein neues Fenster anlegen bzw. zum vorhandenen Code hinzufügen!

So sieht die Verlinkung bei den Buttons/Links 'Introduction', 'Service' und 'About Us' in der HTML-Datei aus.

HTML
<label for="open-introduction"><a>Weiter</a></label>
<label for="open-service"><a>Weiter</a></label>
<label for="open-about"><a>Weiter</a></label>
<label for="open-ihr-fenster"><a>Ihr Fenster</a></label>

So sieht also ein einzelner Text-Link zum Fenser öffnen aus:

HTML
<label for="open-ihr-fenster"><a>Ihr Fenster</a></label>

Dieser Text-Link funktioniert schon prima und würde auch reichen, aber um gfls. je nach Situation daraus einen Button zu machen, haben wir für die diesbezügliche Formatierung noch unsere CSS-Klassen 'button' und 'mehr_lesen' darum herum gelegt:

HTML
<div class="button"><span class="mehr_lesen">
<label for="open-ihr-fenster"><a>Ihr Fenster</a></label>
</span></div>

Und hier ist die dazugehörige Einschalt-Funktion dieser Fenster in der CSS-Datei ('boxfenster.css):

CSS
/* schaltfunktion AN / AUS */
input#open-introduction:checked ~ .boxfenster,
input#open-service:checked ~ .boxfenster,
input#open-about:checked ~ .boxfenster ,
input#open-ihr-fenster:checked ~ .boxfenster {
margin:0;
background:rgba(0,0,0,.7);
opacity:1;
}

Das eigentliche Fenster ist in der HTML-Datei dann wie folgt unter Einbindung eines Fenster-Schließen-Buttons gestaltet, hier am Beispiel des 'Introduction-Links':

HTML
<div class="schalter">
<input type="checkbox" id="open-introduction">
<div class="boxfenster">
<div class="boxinhalt">
<label class="button-close" for="open-introduction"><i class="far fa-window-close"></i></label>
. . . Hier steht der Introduction Text . . .
</div></div></div>

Und so würde es entsprechend für ihr neu anzulegendes Fenster aussehen:

HTML
<div class="schalter">
<input type="checkbox" id="open-ihr-fenster">
<div class="boxfenster">
<div class="boxinhalt">
<label class="button-close" for="open-ihr-fenster"><i class="far fa-window-close"></i></label>
. . . Hier steht der Text fuer ihr neues Fenster . . .
</div></div></div>

Box-Fenster Service

More Services 01

Lorem ipsum dolor sit amet, ad graece repudiare elaboraret mei, utamur accumsan phaedrum sea ad. In eos erat iriure vivendum, ex pri laudem omittam, sed vero iriure necessitatibus no. Sit ea hinc discere iudicabit, eligendi perfecto pertinax vel ex. Mea ne minim graece appareat, affert consequat cum cu, an eos falli appareat. In porro voluptua mea, ex vim mediocrem forensibus scripserit, cu sea soleat aeterno tractatos. Audiam moderatius an est.

More Services 02

Ut pro sint phaedrum. At dolores maluisset intellegebat his, vel postulant intellegam an, duo rebum mandamus accusamus et. Audiam iisque bonorum cum an, simul reformidans comprehensam pri ne, at graecis iracundia suscipiantur vix. Eos malis eruditi in, te vel mandamus indoctum accommodare.

Unum reprimique instructior an his, te nullam nostrum vis. Quot principes omittantur eos ut, iudicabit euripidis quo ad, his cibo nostrud dolores et. Mea ad laudem intellegat, eu sumo consul dicunt nec.

More Services 03

Vim no sonet dicunt temporibus, tibique persecuti his in, sit iudico altera euismod cu. Vix te eros vivendo intellegam, sumo facete no pro. Vel causae singulis accusata eu, mea commune copiosae ei, nam vero invenire id. Nec te clita moderatius, natum assum homero eos id. Cu odio corrumpit eam. An posse dicit animal pro, duo falli dicit ponderum ex, an elit delicata gubergren mea.

Box-Fenster Presentation-1

Presentation 1 Info

Die Minions meinen: Me want bananaaa! Underweaaar jiji tatata bala tu pepete para tú bappleees tatata bala tu underweaaar. Pepete hahaha tatata bala tu bananaaaa hana dul sae gelatooo baboiii bappleees poulet tikka masala bananaaaa po kass. Wiiiii underweaaar tatata bala tu tulaliloo uuuhhh. Bee do bee do bee do bee do bee do bee do uuuhhh aaaaaah gelatooo wiiiii bananaaaa bananaaaa.

La bodaaa poulet tikka masala pepete jeje. La bodaaa la bodaaa uuuhhh jiji pepete gelatooo bappleees hahaha daa bappleees. La bodaaa tulaliloo para tú ti aamoo! Tatata bala tu la bodaaa. Minions Ipsum. Me want bananaaa!

Jeje chasy tank yuuu! Pepete poulet tikka masala baboiii. Daa jeje chasy daa jeje bee do bee do bee do gelatooo uuuhhh tatata bala tu daa. Underweaaar pepete jeje jiji. Tatata bala tu bappleees pepete potatoooo hahaha jiji bee do bee do bee do jiji jiji me want bananaaa! Ti aamoo! Hana dul sae poopayee tatata bala tu para tú bee do bee do bee do jeje. Jeje chasy tank yuuu! Butt me want bananaaa! Gelatooo la bodaaa tatata bala tu ti aamoo! Baboiii butt.

Excelsior documenta es profundis

Vamos a la playa
Que hora es
No tengo dinero
El mar es azul

Magna charta bella terra

Lorem bonus at Ipsum

Box-Fenster Presentation-2

Presentation-2 Info

Kevin ist ein großer, länglicher Minion mit zwei Augen und aufsprießenden Haaren. Er trägt meist seine Golfkleidung. Kevin sagt: Uuuuhhh belloo! Wiiiii hana dul sae baboiii me want bananaaa! Chasy butt poopayee tank yuuu! Para tú bappleees tank yuuu! Pepete tank yuuu! Chasy potatoooo. Pepete la bodaaa ti aamoo! Chasy. Jiji bee do bee do bee do po kass tatata bala tu daa bee do bee do bee do uuuhhh bee do bee do bee do jeje hahaha daa. Jiji la bodaaa belloo! Pepete baboiii baboiii potatoooo.

Belloo! Baboiii bappleees poulet tikka masala hana dul sae. Hana dul sae baboiii bee do bee do bee do butt jeje chasy po kass butt tank yuuu! Jiji belloo! Tank yuuu! Poopayee gelatooo daa tulaliloo wiiiii. Potatoooo butt chasy po kass butt.

Daa wiiiii me want bananaaa! Tatata bala tu baboiii underweaaar wiiiii poopayee potatoooo. Po kass belloo! Jiji jeje. Chasy la bodaaa la bodaaa potatoooo gelatooo tulaliloo ti aamoo! Uuuhhh. Hahaha tank yuuu! Me want bananaaa! Uuuhhh underweaaar me want bananaaa!

Arbeiten an der Seite

Umbau Bereich Fotografie - Stand: 29.10.23

In den letzten 2 Wochen war ich fast täglich damit beschäftigt die Seite umzubauen und neu zu gestalten. So habe ich mir zuerst den Bereich "Fotografie" vorgenommen. Eine bessere Gliederung sollte es werden und natürlich dadurch auch etwas übersichtlicher. Ich hoffe, dass ich es, mit meinen bescheidenen Kenntnissen, hinbekommen habe.

* Den Bereich "Fotografie" in nun 4 Themen aufgegliedert:
1. Fotowalk - umgebaut
2. Objektive - total umgebaut. Hier ist die Gruppe der "Normalobjektive" schon abrufbar.
3. Kameras - ist erstellt und online. Hier findet ihr auch die ersten Fotos, die ich mit nem guten alten Kleinbildfilm gemacht habe.
4. Galerie - ist eingerichtet und online. (Die Schmetterlinge fehlen zur Zeit noch. Ich versuche sie schnell wieder online zu stellen)

Besonderen Spass hat mir das Fotografieren mit analogem Film gemacht. Ich bin zwar früher damit gross geworden .... ist aber nach Jahren der Abstinez wieder eine coole Sache die Kamera seiner Jugend zu benutzen. Und JA, sie funktioniert immer noch einwandfrei, meine gute Minolta X-700.

Jetzt kann ich euch nur viel Spass beim stöbern wünschen
Euer Andreas
29.10.23 - 08:17 Uhr

Box-Fenster Presentation-4

Presentation-4 Info

Stuart hat ein Auge, einen Mittelscheitel und ist häufig hungrig.

Stuart schreit: Aaaaaah jeje uuuhhh tatata bala tu belloo! Bee do bee do bee do jiji bappleees potatoooo. Hahaha tank yuuu! Uuuhhh poulet tikka masala la bodaaa hana dul sae belloo! Ti aamoo! Uuuhhh. Poulet tikka masala bee do bee do bee do butt wiiiii poulet tikka masala bee do bee do bee do pepete bee do bee do bee do la bodaaa.

Minions ipsum butt baboiii butt wiiiii. Tank yuuu! poopayee poopayee uuuhhh baboiii baboiii bee do bee do bee do jeje tatata bala tu daa. Me want bananaaa! uuuhhh underweaaar potatoooo bananaaaa aaaaaah aaaaaah. Poopayee baboiii para tú tank yuuu! Aaaaaah bee do bee do bee do. Chasy aaaaaah para tú baboiii jeje. Daa baboiii gelatooo underweaaar uuuhhh la bodaaa. Belloo! chasy butt aaaaaah.

Box-Fenster About

Schrifteinheit REM

Wir verwenden als Schrifteinheit nicht PX, PT oder EM sondern REM. Die Verwendung von REM ermöglicht flexible Schriftgrößen, die sich prozentmässig anpassen. Beim TAG HTML setzen wir in der CSS-Datei die font-Angabe auf 62.5%, welches ca.10 Pixel (px) entspricht.
Hier noch ein Hinweis: Ein Wert von 100% entspricht 16 Pixel (px), wobei 16 Pixel die Standardgröße bei Schriften im Browser ist.

Warum schreiben wir 62.5 % statt 100 % ?
Damit wir nicht ständig die Formel (Pixelwert geteilt durch 16 = rem Wert) anwenden müssen, bei der es krumme, unübersichtliche rem-Werte gibt. Mehr zu der Formel mit Beispiel weiter unten. Es ist so, der umgerechnete Wert läßt sich viel leichter in Bezug zum gewohnten Pixelwert setzen, es erleichtert einfach das Arbeiten. Denn so ergibt sich zum Beispiel:

0.1 rem = 1 px
1 rem = 10 px
1.4 rem = 14 px
2.6 rem = 26 px
30 rem = 300 px

So oder so ähnlich, denn dies ist ein Beispiel, sieht es dann der Code in der CSS-Datei aus:

CSS
html {
font-size:62.5%;
line-height:1.5;
font-family: georgia, helvetica, serif;
}

Dann folgen die Angabe der Schriftgröße und der Überschriften.

CSS
body {font-size:1.7rem}
h1 {font-size:3.4rem}
h2 {font-size:2.5rem}
h3 {font-size:1.9rem}

Nachfolgend zwei Beispiele für die prozentmässige Weitervererbung innerhalb der CSS Media Queries:
Bei der Abfrage der Bildschirmbreite ab 1024 Pixel reicht der geänderte Prozentwert und auch bei der Abfrage ab 1280 Pixel reicht der geänderte Prozentwert.

CSS
@media (min-width: 1024px) {
html {font-size: 68% }
}
@media (min-width: 1280px) {
html {font-size: 72% }
}

Vorteil von REM:
Die Schrift-Werte von z.B. body, h1, h2, h3 müssen nur ein einziges Mal ganz oben im Quellcode und dann nicht mehr wieder angegeben werden und vererben sich im genannten prozentualem Verhältnis einfach weiter. Das gleiche gilt auch für alle anderen HTML-Elemente, die einen Größenwert benötigen, wie z.b. width, height, margin, padding usw., denn wir verwenden die REM-Einheit hier generell im Template.

Ausnahmen von REM:
Wenn wir gelegentlich zusätzlich Pixelwerte (px) verwenden, so hat das folgende Bedeutung:
1. Sehr kleine Werte von 0.1rem oder 0.2rem haben bei der prozentmässigen Weitervererbung keine Auswirkungen.
2. Es ist keine prozentmässige Weitervererbung erwünscht.
Nur als Beispiel verwenden wir für einen Rahmen (border) also 'border:solid 1px black'.

Die allgemeine Formel zur Umrechnung von Pixel zu REM: Man teilt den Pixelwert durch 16 (18/16 = 1.125). Voraussetzung: Die Schriftgröße des Root-Elements ist auf 100% gesetzt und man geht von der 16px Standard-Schriftgröße aus. Beispiel: Die Schriftgröße von 18px entspricht 1.125rem.