[bulletproof] Hinweiszeile gleich unterm Banner

Hier können Probleme und alles andere in Deutscher Sprache gelöst werden.
Post Reply
geri
Regular
Posts: 89
Joined: Wed Feb 25, 2009 11:33 am
Contact:

[bulletproof] Hinweiszeile gleich unterm Banner

Post by geri » Thu Jun 18, 2009 12:13 pm

Hallo!

Ich möchte gerne gleich unterm Banner oder vielleicht in die Navigationsleiste
eine Hinweiszeile integrieren, die schnell und leicht erkennbar ist und auch statisch ist.

Das Problem: meine Seite ist ein fotoblog (http://www.geri.at)
und die Vorschaubilder "relativ" groß,
aaaaber manche Leute vermuten nicht, dass es ein link ist,
der zu einer größeren Version des Bildes führt.

Daruf möchte ich gerne hinweisen mit einem Text
wie z.B: "alle Bilder sind zum Anklicken" oder so...

Evtl. gibt's dafür auch noch andere Lösungen?

Für Vorschläge wäre ich sehr dankbar!

Greets
Geri

User avatar
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by yellowled » Thu Jun 18, 2009 12:16 pm

geri wrote:Das Problem: meine Seite ist ein fotoblog (http://www.geri.at) und die Vorschaubilder "relativ" groß, aaaaber manche Leute vermuten nicht, dass es ein link ist, der zu einer größeren Version des Bildes führt.

Beste Lösung: Eben diese Links deutlicher ausgestalten. Und evtl. zusätzlich einfach einen HTML-Klotz mit entsprechendem Text in die Seitenleiste stecken.

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

geri
Regular
Posts: 89
Joined: Wed Feb 25, 2009 11:33 am
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by geri » Thu Jun 18, 2009 12:53 pm

Das mit dem html-Klotz hatte ich auch schon im Gedanken, wollte es aber als letzte Lösung...

Nur auch leider keine Idee wie man Vorschaubilder deutlicher ausgestalten könnte
damit sie als links erkannt werden.

greets
Geri

User avatar
onli
Regular
Posts: 2371
Joined: Tue Sep 09, 2008 10:04 pm
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by onli » Thu Jun 18, 2009 1:26 pm

Du könntest einen blauen Rahmen drumrum-setzen, oder wahrscheinlich schöner, wenn der Fokus auf den Bilder liegt: Sie unterstreichen wenn die Maus drüber fährt oder eine ähnliche Reaktion.
Gruß

geri
Regular
Posts: 89
Joined: Wed Feb 25, 2009 11:33 am
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by geri » Thu Jun 18, 2009 2:02 pm

onli wrote:Du könntest einen blauen Rahmen drumrum-setzen,


Uh, das gefällt mir!!!

Mit der Idee sämliche links (außer der Nav. Leiste) orange darzustellen hatte ich mal geliebäugelt,
blieb aber dabei, weil ich mich als Anti-Programmierer mit der Umsetzung nicht so leicht tu...

Könnte mir vorstellen, dass (wenn alle links dann orange sind) ein oranger Rahmen, der beim Drüberfahren entsteht, als Effekt gut ausshen würde.

Der Html Klotz als Hinweis ganz oben würde dann zusätzlich helfen

Leiser Gedanke an mich selbst: das Orange solte eher dezent sein...

Hat da wer mal nen Code?

duckundweg :lol:

Greets
Geri

User avatar
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by yellowled » Thu Jun 18, 2009 4:33 pm

geri wrote:Nur auch leider keine Idee wie man Vorschaubilder deutlicher ausgestalten könnte
damit sie als links erkannt werden.

Deine Lösung mit dem Rahmen müsste etwa so gehen:

Code: Select all

a.serendipity_image_link:hover,
a.serendipity_image_link:focus {
    border: 3px solid #fff; /* hab jetz ma weiß gewählt, Farbe ggf. ändern */
    display: block;
}


Ich bin mir nur nicht sicher, wie gut sich das mit LightBox verträgt.

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

User avatar
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by yellowled » Thu Jun 18, 2009 5:26 pm

Ehe Du das probierst, vergiß es. Der Code aus meinem letzten Post funktioniert nicht, und ganz so einfach ist des Rätsels Lösung auch nicht.

Das Kernproblem ist recht simpel: Einen Rahmen beim Überfahren mit der Maus erzeugt man durch :hover (bzw. ergänzend für Tastaturnutzung durch :focus), das kann man aber nur dem Link zuweisen, nicht dem Bild an sich. Dazu aber muss sichergestellt sein, dass der Link immer das Bild, welches ja z.B. theoretisch links, rechts oder gar nicht gefloatet sein kann, umschließt.

Und genau dafür schüttele ich nicht "mal eben" Code aus dem Ärmel, das dauert ein wenig :)

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

geri
Regular
Posts: 89
Joined: Wed Feb 25, 2009 11:33 am
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by geri » Thu Jun 18, 2009 6:27 pm

Hallo!

Erstmal: DANKE für die Bemühungen!

Aber bitte keinen Stress!

Ich werde in den nächsten Tagen einen html-Klotz hinzufügen als Hinweis,
das müsst eigentlich reichen!

Ich glaub da gäb's wichtigere Sachen als einen Rahmen...

Meine 2te Priorität wär eigentlich "alle links sind orange" außer die Nav. Leiste.
Das wär mir ehrlich gesagt lieber und den Rahmen lass ma untern Tisch fallen...

Thx!

Greets
Geri

User avatar
yellowled
Regular
Posts: 7111
Joined: Fri Jan 13, 2006 11:46 am
Location: Eutin, Germany
Contact:

Re: [bulletproof] Hinweiszeile gleich unterm Banner

Post by yellowled » Thu Jun 25, 2009 7:36 pm

geri wrote:Meine 2te Priorität wär eigentlich "alle links sind orange" außer die Nav. Leiste.

Das ist doch simpel. Erstmal alles orange machen:

Code: Select all

a:link,
a:visited {
    color: #fcaf4c;
    text-decoration: none;
}

a:hover,
a:focus,
a:active { text-decoration: underline; }


Ich hab mal angenommen, es handele sich um dasselbe orange wie nebenan im twitter-Thread. Außerdem Links bei hover/focus unterstreichen, sonst nicht -- sollte man immer machen, um das abzuheben.

So. Und nun zurück-marsch-marsch für die Navigation ... äääähmmm ... dafür hast Du doch, soweit ich sehe, schon die richtigen Anweisungen in der user.css?

YL
amazon Wishlist - Serendipity-Podcast (German only, sorry)

Post Reply