delle immagini come collegamenti?

ciao ,,sapete mentre navigavo ho visto un sito nel quale era presente un 'immagine e se ci clikkavo sopra collegava ad un altra pagina....
quale è il codice per far diventare un immagine un collegamento???

chiedo sopratutto al mio caro biccheddu!!!

devi mettere il tag dell'immagine dentro a quello del link

<a href="pagina.html"><img src="nomeimmagine.jpg"></a>

grazie mille caro dolce palla000 lo testo subito

[acsocmel]

attento a come scrivi il tag img

<img src="nomeimmagine.jpg" alt="some word" />
o così
<img src="nomeimmagine.jpg" alt="some word" width="tot.px" height="tot.px"/>

Scusa, acsocmel, perchè dopo il nome dell'immagine si deve inserire
....alt="some word"width="tot.px" height="tot.px"/> ????
Io nella mia index.html, ho inserito l'indirizzo della pagina dove si deve aprire il collegamento<A href="http//:indirizzopagina">, e di seguito <img src="nomeimmagine.jpg"/></A> , sembra che il collegamento funziona!! forse in seguito potrebbe smettere di aprirsi???
Grazie, buonanotte
Maria

[alemoppo]

alt è la descrizione della foto (quando ci passi sopra con il puntatore.)

width è la larghezza della foto, quindi bisogna sostituirlo con un valore; oppure una variabile di JS {più semplicemente non metterlo per niente per avere la foto con dimensioni originali }

Per essere xHTML valido, invece di questo:

<img src="nomeimmagine.jpg" alt="some word" width="tot.px" height="tot.px"/>

deve essere:

<img src="nomeimmagine.jpg" alt="some word" width="tot.px" height="tot.px" />

.

Oppure, (come penso, perché l'utente da quello che ho capito da altri post è alle prime armi) usare semplicemente HTML {e' pressocché identico }...e quindi non mettere la slash finale

Ciao!

EDIT:
RICORDATE che in quel modo, le immagini avranno un fastisioso contorno. Usate la funzione "cerca" per vedere come evitarla.

{con il pulsante cerca, si sarebbe evitata anche questa discussione }

EDIT1:

height rappresenta l'altezza della foto!

nono, sono tutte cose "opzionali": l'attributo alt serve per sostituire l'immagine se non viene caricata, width e height definiscoo rispettivamente larghezza e altezza e / indica che il tag si chiude (piglonerie dell'xhtml xD)

per approfondimenti sul tag img clicca qui: http://www.w3schools.com/tags/tag_img.asp

[alemoppo]

nono, sono tutte cose "opzionali": l'attributo alt serve per sostituire l'immagine se non viene caricata, width e height definiscoo rispettivamente larghezza e altezza e / indica che il tag si chiude (piglonerie dell'xhtml xD)

Cosa ho detto ???

{più semplicemente non metterlo per niente per avere la foto con dimensioni originali }

{e altro...}

EDIT:

Consiglio pure io una buona guida di HTML, ma a quanto pare il nostro amico non ne vuole sapere (visto in altri post). Almeno la funzione "cerca" per "tentare" di non essere bannati

Ciao!

[acsocmel]

@mariaandmaria
abituarsi a scrivere il codice nella maniera migliore possibile
evita di dover perdere tempo a cercare gli errori che inevitabilmente si commettono
ci fa risparmiare tempo che possiamo utilizzare per scatenare la fantasia
e ci permette di utilizzare nuove soluzioni quando se ne presenta l'occasione, senza dover rimettere mano al codice in maniera pesante

possono benissimo essere interpretate come pignolerie, sapendo che i browser sono di bocca buona, ma ci stiamo avvicinando al momento in cui i siti si trasformeranno in web-applications
allora la ricetta nella pagina consigli potrebbe essere letta dal forno per cucinare o dal frigorifero per ordinare la spesa


e dopo questo delirio notturno, scusatemi vado a riflettere sul destino del mondo :-)

@alemoppo
in xhtml width e height non servono / sono sconsigliati
tutto il contrario dell'html

@alemoppo: scusami, il nono era per mariaandmaria, io e te abbiamo postato praticamente insieme e non ho letto il tuo messaggio =)

[alemoppo]

@alemoppo
in xhtml width e height non servono / sono sconsigliati
tutto il contrario dell'html

Allora perché in questa discussione li hai introdotti proprio te??

attento a come scrivi il tag img

<img src="nomeimmagine.jpg" alt="some word" />
o così
<img src="nomeimmagine.jpg" alt="some word" width="tot.px" height="tot.px"/>

E poi, hai letto qui?:

{più semplicemente non metterlo per niente per avere la foto con dimensioni originali }

allora perché mi hai detto così??

@alemoppo
in xhtml width e height non servono / sono sconsigliati
tutto il contrario dell'html

...Va be: siamo molto OT; quindi non continuo più...

Ciao!

Grazie ragazzi,
le vostre informazioni sono molto interessanti.
Alemoppo parla della funzione cerca per non essere bannati, vado a cercare
e mi ritiro in buon ordine.
Ciao, saluti
Maria

[acsocmel]

mi è scappato uno slash
pardon :)

[darkwolf]

Tanto per fare un po di chiarezza dato che ho letto alcune "inesattezze"

@alemoppo: L'attributo ALT NON è la descrizione della foto (quando ci passi sopra con il puntatore).
Anzi la questione del mini-popup è un comportamento errato di IE (difatti nessun altro browser lo interpreta a quel modo).
Per il minipopup l'attributo corretto è il "title".

@arazz: L'attributo ALT NON serve per sostituire l'immagine se non viene caricata (perlomeno non esattamente).

ALT (da alternativo) serve sopratutto per i browser "testuali" (lynx e vari crawlers) e per eventuali lettori affetti da cecità (utilizzatori di screen-reader).
Quindi, sia per una migliore indicizzazione che per garantire un'alternativa dell'immagine ai lettori ciechi è sempre bene usarlo.
Un altro attributo estremamente utile (ma poco usato) è il longdesc (long description).
Height e width possono essere benissimo omessi se non è necessario ridimensionare l'immagine.
Quindi un link con immagine (accessibile e xhtml valido) dovrebbe essere più o meno così:

<a href="hxxp://link.xx" title="Profilo di darkwolf">
<img src="avatar.gif" alt="Avatar di darkwolf" style="width: 80px; height: 80px; border: 0;" />
</a>

o meglio ancora (massima accessibilità) così:

<a href="hxxp://link.xx" title="Profilo di darkwolf">
<img src="avatar.gif" alt="Avatar di darkwolf" longdesc="descrizione.html" style="width: 80px; height: 80px; border: 0;" />
</a>

descrizione.html dovrebbe contenere una descrizione dettagliata dell'immagine con caratteri cubitali

[alemoppo]

@alemoppo: L'attributo ALT NON è la descrizione della foto (quando ci passi sopra con il puntatore).
Anzi la questione del mini-popup è un comportamento errato di IE (difatti nessun altro browser lo interpreta a quel modo).
Per il minipopup l'attributo corretto è il "title".

Anche firefox

[darkwolf]

Anche firefox

Assolutamente no :P
Che firefox "tarocco" stai usando? :D
http://blog.html.it/12/04/2006/alt-e-tooltip/

[alemoppo]

Il mio firefox:



"Prova": (il puntatore del mouse non si vede, perché è uno screen...)





Ciao!

[darkwolf]

Vedi che sull'avatar c'è sia l'alt che il title :P
Per questo firefox mostra il popup
-

-

-
PS: vedi che siamo a Firefox 3.0.11

[alemoppo]

Fino oggi pensavo che alt.. {sulle guide c'é scritto che è un testo alternativo, ma io lo usavo per far apparire il popup }

Comunque:

PS: vedi che siamo a Firefox 3.0.11

...come sai (ANCORA) ho la 56k: non ho voglia di perdere un' ora o più per scaricarmi lo 3.0.11, anche se firefox me lo chiede 5 volte al giorno

Ciao!

Tanto per fare un po di chiarezza dato che ho letto alcune "inesattezze"

ALT (da alternativo) serve sopratutto per i browser "testuali" (lynx e vari crawlers) e per eventuali lettori affetti da cecità (utilizzatori di screen-reader).
Quindi, sia per una migliore indicizzazione che per garantire un'alternativa dell'immagine ai lettori ciechi è sempre bene usarlo.
Un altro attributo estremamente utile (ma poco usato) è il longdesc (long description).
Height e width possono essere benissimo omessi se non è necessario ridimensionare l'immagine.
Quindi un link con immagine (accessibile e xhtml valido) dovrebbe essere più o meno così:

<a href="hxxp://link.xx" title="Profilo di darkwolf">
<img src="avatar.gif" alt="Avatar di darkwolf" style="width: 80px; height: 80px; border: 0;" />
</a>

o meglio ancora (massima accessibilità) così:

<a href="hxxp://link.xx" title="Profilo di darkwolf">
<img src="avatar.gif" alt="Avatar di darkwolf" longdesc="descrizione.html" style="width: 80px; height: 80px; border: 0;" />
</a>

descrizione.html dovrebbe contenere una descrizione dettagliata dell'immagine con caratteri cubitali

Chiedo scusa darkwolf,
perchè <a href="h....................=" title="Profilo di .......">
non capisco il title in quella posizione????

Io il title l'ho inserito diversamente,
<A href="http://mariaedoardo-edoardomaria.blogspot.com/"target="_blank"><img src="http://mariaandmaria.altervista.org/immagini/mariaandmaria.jpg" title="Queste foglie d'autunno rappresentano me, Maria, nel percorso del mio autunno." alt="Foglie d'autunno" style="width:80px; height:80px; border:0;"/></A>

per favore puoi suggerirmi qual'è la posizione giusta??

[darkwolf]

Per abitudine, nel caso di immagine con link, io metto il title al link e l'alt all'immagine.
Se è solo un'immagine senza link metto all'img l'alt e, solo se necessario, il title.
Nel caso di link testuale metto ovviamente solo il title.
Inomma title al link e alt all'img
-
Sia chiaro che, fondamentalmente, va bene anche metterli entrambi all'immagine.

Per abitudine, nel caso di immagine con link, io metto il title al link e l'alt all'immagine.
Se è solo un'immagine senza link metto all'img l'alt e, solo se necessario, il title.
Nel caso di link testuale metto ovviamente solo il title.
Inomma title al link e alt all'img
-
Sia chiaro che, fondamentalmente, va bene anche metterli entrambi all'immagine.

Darkwolf,
sono ancora più perplessa! Ho messo il title al link, ma non capisco a cosa serve, visto che non apre nessuna finestra popup? chi lo legge??

Scusa la mia ignoranza, ho solo bisogno di capire, per riuscire in seguito a crearmi un sito decente!!

Buona notte,
Maria

[alemoppo]

Darkwolf,
sono ancora più perplessa! Ho messo il title al link, ma non capisco a cosa serve, visto che non apre nessuna finestra popup? chi lo legge??

Scusa la mia ignoranza, ho solo bisogno di capire, per riuscire in seguito a crearmi un sito decente!!

Buona notte,
Maria

Con una cosa del genere:

<html>
<head>
<title>
ciao
</title>
</head>
<body>
<a href='#' title='Questa è la descrizione della foto'>
<img src='immagind.png'>
</a>
</body>
</html>

Non ti appare niente??

(RICORDO che appare solo se metti il mouse sopra la foto e aspetti un attimo )

Ciao!

[QUOTE=alemoppo;674900]Con una cosa del genere:

<html>
<head>
<title>
ciao
</title>
</head>
<body>
<a href='#' title='Questa è la descrizione della foto'>
<img src='immagind.png'>
</a>
</body>
</html>

Non ti appare niente??

Alemoppo,
se inserisco title al link ed elimino alt all'immagine la scritta appare!
ma io volevo eseguire i passaggi che suggerisce Darkwolf, cioè il title al link
e alt all'immagine ma in questo modo si vede solamente la descrizione dell'alt ed allora quella del title a cosa serve??
Ciao, saluti
Maria

[darkwolf]

cioè il title al link
e alt all'immagine ma in questo modo si vede solamente la descrizione dell'alt ed allora quella del title a cosa serve??
Ciao, saluti
Maria

Veramente si dovrebbe vedere solo il title e non l'alt.

Veramente si dovrebbe vedere solo il title e non l'alt.

Ciao Darkwolf
si vede solamente la scritta dell'alt quella del title???

http://mariaandmaria.altervista.org/index.html

le scritte sono due diverse e quella che appare è dell'alt

probabilmente sbaglio!!

Saluti
Maria

[darkwolf]

Con firefox si vede correttamente il title, con IE solo l'alt
Prova a cambiare questo:

<A href="http://mariaedoardo-edoardomaria.blogspot.com/"target="_blank" title="Queste foglie d'autunno rappresentano me, Maria, nel percorso del mio autunno."><img src="http://mariaandmaria.altervista.org/immagini/mariaandmaria.jpg" alt="Foglie d'autunno" style="width:80px; height:80px; border:0;"/></A>

in questo:

<a href="http://mariaedoardo-edoardomaria.blogspot.com/" target="_blank" title="Queste foglie d'autunno rappresentano me, Maria, nel percorso del mio autunno.">
<img src="http://mariaandmaria.altervista.org/immagini/mariaandmaria.jpg" alt="Foglie d'autunno" style="width:80px; height:80px; border:0;" />
</a>

Con firefox si vede correttamente il title, con IE solo l'alt
Prova a cambiare questo:

<A href="http://mariaedoardo-edoardomaria.blogspot.com/"target="_blank" title="Queste foglie d'autunno rappresentano me, Maria, nel percorso del mio autunno."><img src="http://mariaandmaria.altervista.org/immagini/mariaandmaria.jpg" alt="Foglie d'autunno" style="width:80px; height:80px; border:0;"/></A>

in questo:

<a href="http://mariaedoardo-edoardomaria.blogspot.com/" target="_blank" title="Queste foglie d'autunno rappresentano me, Maria, nel percorso del mio autunno.">
<img src="http://mariaandmaria.altervista.org/immagini/mariaandmaria.jpg" alt="Foglie d'autunno" style="width:80px; height:80px; border:0;" />
</a>

Grazie Darkwolf,
non è cambiato nulla, ma non importa, io ho imparato qualcosa e se inserirò
delle immagini eseguirò i passaggi giusti e i browser visualizzeranno al loro modo.

Scusa tanto, saluti
Maria

[alemoppo]

non è cambiato nulla, ma non importa, io ho imparato qualcosa e se inserirò
delle immagini eseguirò i passaggi giusti e i browser visualizzeranno al loro modo.

Come non è cambiato nulla ???

{a me funziona.}

Ti riferisci che non è cambiato il codice o il risultato??

Il codice è cambiato, ed è cambiato anche il risultato
Infatti per IE ha messo l'alt {IE interpreta l'alt}, mentre per gli altri il title, no??

Ciao!

[QUOTE=alemoppo;674992]Come non è cambiato nulla ???

{a me funziona.}

Ti riferisci che non è cambiato il codice o il risultato??

Il codice è cambiato, ed è cambiato anche il risultato
Infatti per IE ha messo l'alt {IE interpreta l'alt}, mentre per gli altri il title, no??



Alemoppo, intendevo dire che si vede solo l'ALT, ma io uso solo IE, per gli altri browser non mi sono ancora organizzata. Per la verità non sò come si fà.
Un pò stupida vero??

Saluti
Maria