Archivi tag: html

HTML: Come inserire un link in un’immagine

Ecco come inserire un link in una foto usando il linguaggio html…

Il piu’ classico dei casi in cui si usa una tecnica del genere è per creare i codici HTML dei nostri banner, per questa guida analizzeremo questo caso, ovviamente possiamo estendere questo metodo per qualsiasi immagine (sia essa icona, banner o una qualsiasi fotografia).

Tutto quello che ci occorre è una foto e un indirizzo web da associare alla fotografia… eccoli:

banner.png

Questa immagine è caricata nel web all’indirizzo: //programmifree.myblog.it/images/banner.png

l’indirizzo web che vogliamo collegare alla foto è: http://programmifree.myblog.it

Di sicuro ci occorre utilizzare il tag <a> e il tag <img>, maggiori informazioni possiamo trovarle qui:

http://www.w3schools.com/TAGS/tag_a.asp

http://www.w3schools.com/TAGS/tag_img.asp


Sulla base di quanto acquisito leggendo le guide sui tag <a> e <img> proviamo a scrivere questo codice:

<a href=”http://programmifree.myblog.it/ target=”_blank><img src=”//programmifree.myblog.it/images/banner.png/></a>

Ora cerchiamo di tradurre in lingua italiana questa porzione di codice HTML:

<a href=”http://programmifree.myblog.it/ target=”_blank>

significa da questo punto in poi crea un link (il tag <a>) all’indirizzo http://programmifree.myblog.it/ (specificato da href) ed aprilo in una nuova finestra del browser predefinito (target=”_blank”)

<img src=”//programmifree.myblog.it/images/banner.png/>

significa inserisci l’immagine (tag <img>) caricata nell’indirizzo web //programmifree.myblog.it/images/banner.png (specificato da src che significa “source”)

</a>

significa fine degli effetti del tag <a>

Vediamo ora l’effetto che crea questo codice HTML:


 

Kompozer: un editor HTML opensource

La miriade di progetti opesource non poteva non includere un editor HTML… Kompozer, questo editor è di tipo WYSIWYG (What You See Is What You Get, quello che vedi è quello che ottieni) nato dalle ceneri di NVU (il cui sviluppo si è arrestato) si è rapidamente evoluto e arricchito di molte funzioni utili ed interessanti.

Kompozer oltre a dare dei validi strumenti ai neofiti, che conoscono poco o niente di HTML, per realizzare pagine e siti web offre anche la possibilità di poter inserire nei propri progetti javascript e di poter gestire i fogli di stile CSS. Un’altra piccola chicca di Kompozer è il fatto di poter fare l’upload dei propri lavori nel web utilizzando il client FTP incorporato…

Kompozer è funzionante sia in ambiente windows, linux e mac ed è disponibile anche il package per tradurre questo programma in italiano il tutto sul sito ufficiale del progetto.

Kompozer.png

Sito web: http://kompozer.net/

Download Kompozer: http://kompozer.net/download.php

 

Guide correlate: