ImageFlow

hume · 3. Oktober 2010

Hallo, ich wollte auf meiner Seite die Bildergalerie ImageFlow verwenden von dieser Seite: <a class="postlink" href="http://imageflow.finnrudolph.de/">http://imageflow.finnrudolph.de/</a>
wo ich aber ein kleines Problem habe und zwar: Täusche ich mich da oder handelt es sich bei dem Script um eine XHTML Seite und ein paar VS so siehts zumindest in der Installation aus: <a class="postlink" href="http://finnrudolph.de/ImageFlow/Installation">http://finnrudolph.de/ImageFlow/Installation</a> nun folgendes wollte es in meiner HTML Seite einbauen und natürlich wie ich bin überprüfe ich nun auch ob der Code valide ist (eine reine Angewohnheit von mir) und nun sehe ich da dass der Code nicht valide ist. Ich kann mir natürlich nicht vorstellen dass der Anbieter einen invaliden Code anbieten sondern einen Validen xD Bin zum Test genau so vorgegangen wie in der Installation sagen wir so ich hab dass Beispiel genau so kopiert zum testen nun die Frage was mach ich falsch dass es invalide ist?

Hier mal mein Code:

HTML

<!doctype html>
<html>




<head>
    <title>Aiizo - Galerie</title>
              <link href="./design.css" type="text/css" rel="stylesheet" />
              <meta http-equiv="content-type" content="text/html; charset=ISO-8859-2" />
              <meta name="content-language" content="de" />
              <meta name="author"           content="Christian Huml" />
              <meta name="publisher"        content="Christian Huml" />
              <meta name="copyright"        content="Christian Huml" />
              <meta name="keywords"         content="" />
              <meta name="description"      content="" />
              <meta name="page-topic"       content="" />
              <meta name="page-type"        content="" />
              <meta name="language"         content="Deutsch" />
              <meta name="revisit"          content="After 7 days" />
              <meta name="robots"           content="INDEX,FOLLOW" />




              <link rel="stylesheet" href="imageflow.css" type="text/css" />
              <script src="imageflow.js" type="text/javascript"></script>
</head>




<body>
<div id="head">
</div>










<ul id="navigation">
<li> <a href="index.html">Home</a> </li>
<li> <a href="galerie.html">Galerie</a> </li>
<li> <a href="kontakt.html">Kontakt</a> </li>
<li> <a href="rechte.html">Rechte</a> </li>
<li> <a href="zahlung.html">Zahlungsm&ouml;glichkeiten</a> </li>
<li> <a href="archiv.html">Archiv</a> </li>
<li> <a href="agb.html">AGB</a> </li>
<li> <a href="impressum.html">Impressum</a> </li>
</ul>




<div id="inhalt">




<div id="unique_name" class="imageflow">
<img src="dir/image_1.jpg" longdesc="URL_1" width="w_1" height="h_1" alt="Text_1" />
<img src="dir/image_2.jpg" longdesc="URL_2" width="w_2" height="h_2" alt="Text_2" />
<img src="dir/image_3.jpg" longdesc="URL_3" width="w_3" height="h_3" alt="Text_3" />
</div>













</div>







</body>
</html>

Alles anzeigen

lauras · 3. Oktober 2010

Lies mal was da steht:

Zitat von "Der Validator"

Internal encoding declaration iso-8859-2 disagrees with the actual encoding of the document (utf-8).

Spontan würde ich sagen, für dein Encoding kann die Bildergalerie nichts - da musst du dir für dich das richtige rauspicken.

Zitat von "Der Validator"

Bad value w_1 for attribute width on element img: Expected a digit but saw w instead.

Hier hast du nicht gemacht, was die Anleitung dir sagt, ebenso wie bei einigen der folgenden Fehler. width und height brauchen natürlich Zahlen als Werte. Steht in der Anleitung:

Zitat von "Die Anleitung"

The image width and height parameters (w_x and h_x) must be set in the XHTML for full compatibility with the Internet Explorer. Sorry for this extra load of work - every browser but Microsofts Internet Explorer can fetch the right image dimensions via the JavaScript!

Genau das gleiche gilt für den Fehler für das longdesc-Attribut.

Wenn du nicht machst, was in der Anleitung steht, kannst du auch keinen validen Code bekommen, wenn im Basis-Code Platzhalter drinsind, die du natürlich ersetzen musst.

Liebe Grüße
Laura

PS: Vielleicht nächstes Mal probieren, erst zu gucken was die Validatorfehler sind - normalerweise sagt einem der Validator relativ genau, was man falsch gemacht hat. Nur so als Tipp.

hume · 3. Oktober 2010

Zitat

PS: Vielleicht nächstes Mal probieren, erst zu gucken was die Validatorfehler sind - normalerweise sagt einem der Validator relativ genau, was man falsch gemacht hat. Nur so als Tipp.

Ja, da hast du schon recht...
Nun hab ich mit dem longdesc Attribut ein Problem der Validator sagt mir dass das img-Element veraltet ist und wenn ich dass richtig meine ein normales Element auf a verwenden soll. Wie wird dass gemeint?
Soll ich dass Element <a> </a> verwenden?
PS: Die Höhe und die Breite ist nur zum Test..

HTML

<!doctype html>
<html>




<head>
    <title>Aiizo - Galerie</title>
              <link href="./design.css" type="text/css" rel="stylesheet" />
              <meta http-equiv="content-type" content="text/html; charset=utf-8" />
              <meta name="content-language" content="de" />
              <meta name="author"           content="Christian Huml" />
              <meta name="publisher"        content="Christian Huml" />
              <meta name="copyright"        content="Christian Huml" />
              <meta name="keywords"         content="" />
              <meta name="description"      content="" />
              <meta name="page-topic"       content="" />
              <meta name="page-type"        content="" />
              <meta name="language"         content="Deutsch" />
              <meta name="revisit"          content="After 7 days" />
              <meta name="robots"           content="INDEX,FOLLOW" />




              <link rel="stylesheet" href="imageflow.css" type="text/css" />
              <script src="imageflow.js" type="text/javascript"></script>
</head>




<body>
<div id="head">
</div>










<ul id="navigation">
<li> <a href="index.html">Home</a> </li>
<li> <a href="galerie.html">Galerie</a> </li>
<li> <a href="kontakt.html">Kontakt</a> </li>
<li> <a href="rechte.html">Rechte</a> </li>
<li> <a href="zahlung.html">Zahlungsm&ouml;glichkeiten</a> </li>
<li> <a href="archiv.html">Archiv</a> </li>
<li> <a href="agb.html">AGB</a> </li>
<li> <a href="impressum.html">Impressum</a> </li>
</ul>




<div id="inhalt">




<div id="bilder" class="imageflow">
<img src="dir/image_1.jpg" longdesc="bilder.html" width="40" height="60" alt="Text_1"/>
<img src="dir/image_2.jpg" longdesc="bilder.html" width="40" height="60" alt="Text_2" />
<img src="dir/image_3.jpg" longdesc="bilder.html" width="40" height="60" alt="Text_3" />
</div>




domReady(function()
{
	var instanceOne = new ImageFlow();
	instanceOne.init({ ImageFlowID: 'myImageFlow' });
});










</div>







</body>
</html>

Alles anzeigen

lauras · 3. Oktober 2010

Zitat von "Der Validator"

The longdesc attribute on the img element is obsolete. Use a regular a element to link to the description.

Lies was da steht. Weißt du was das longdesc-Attribut bewirken sollte? Dann müsstest du es eigentlich verstehen.

hume · 8. Oktober 2010

Zitat

Lies was da steht. Weißt du was das longdesc-Attribut bewirken sollte? Dann müsstest du es eigentlich verstehen.

Ja, bin zu faul es selbst zu Formulieren also hab ich eine Quelle genommen:

Ausführliche Bildbeschreibungen mit dem longdesc-Attribut
Wenn der Redakteur aus irgendeinem Grund nicht in der Lage ist, den informativen Inhalt eines Bildes in den Fließtext zu integrieren, müssen Sie diese Informationen anderweitig bereitstellen. Zu diesem Zweck gibt es das longdesc-Attribut. Dieses Attribut gibt den Link zu einer Beschreibungsseite an, auf der die Informationen beschrieben werden, die das Bild übermittelt.

Quelle: <a class="postlink" href="http://www.pro-barrierefreiheit.de/entwickler/multimedia/longdesc/">http://www.pro-barrierefreiheit.de/entw ... /longdesc/</a>

Ja, aber dass Element IMG ist veraltet?!

Sarkkan · 8. Oktober 2010

Zitat von "hume"

Ja, aber dass Element IMG ist veraltet?!

Wo steht das? O_o
Die schreibweiße <IMG> ist veraltet/beziehungsweise xhtml aber wieso sollte das <img>-Element veraltet sein?

Außerdem ließ dir beim nächsten mal doch mal bitte den gesamten Text einer Beschreibung durch und Zitiere den gesamten Text..

Zitat von "http://www.pro-barrierefreiheit.de/entwickler/multimedia/longdesc/"

Leider ist bisher die Unterstützung für dieses Attribut in den Browsern mangelhaft. Einige Browser weisen darauf hin, wenn man einen Rechtsklick auf das Bild macht und „Eigenschaften“ auswählt. Es ist für den unerfahrenen Nutzer daher oft nicht ersichtlich, dass für das Bild eine ausführliche Bildbeschreibung hinterlegt wurde.

Achja und zu deinem "Problem" wegen dem Element und der Alternative, die dir der W3C-Validator gegeben hat:
Ja, es ist genauso wie du es gesagt hast, du sollst einfach <a> verwenden.
(Also so:

Code

<a href="#" title="Zur Bildbeschreibung"><img src="#" width="#" height="#" alt="#" /></a>

PS:

Zitat von "hume"

...und natürlich wie ich bin überprüfe ich nun auch ob der Code valide ist (eine reine Angewohnheit von mir) und nun sehe ich da dass der Code nicht valide ist. Ich kann mir natürlich nicht vorstellen dass der Anbieter einen invaliden Code anbieten sondern einen Validen xD

Wieso sollte das nicht so sein?
Die Standard-Designs von Joomla beispielsweise sind alle Invalide,..
Außerdem können sich die Standards geändert haben,..

Und auch meine Codes werden 100% nicht alle Invalide sein, allein schon weil Aussehen, wie Browser den Code verarbeiten und Standards nicht immer unter einen Hut zu bringen sind.
Allein schon weil ich HTML5 und CSS3 Elemente einbaue habe ich Invaliden Code.

ImageFlow

Jetzt mitmachen!

Teilen