El primer que hem de tenir en compte són les extensions de format que són vàlides per utilitzar una imatge en una pàgina web. Les que es fan servir més, són els formats gif, png i jpg. gif i png, són molt similars, fan servir pocs colors (256) i per això tenen poca qualitat, però pesen molt poc i això és bo a l'hora de carregar ràpid en una pàgina. Jpg, més colors, més qualitat i més pes. png és una extensió que Macromedia desenvolupament per pàgines web i que a poc a poc aquesta trobant el seu lloc. En aquest mateix format hi ha diverses qualitats d'imatge, però el més usat és el que és similar al que coneixem com gif.

Per inserir una imatge, primer seria convenient que creéssim al lloc una carpeta a propòsit per a elles.

Prement amb el botó dret del ratolí, sobre la carpeta del lloc a la columna de la dreta, al menú que es desplega, clic a la carpeta Nova:

Per defecte Dreamweaver la cridés untitled. Mentre encara està seleccionada i el cursor fluctua, podem canviar el nom:

Si per qualsevol motiu, va deixar d'estar seleccionada i no veiem el cursor farem un clic, sobre ella, seguit d'un altre clic. i el cursor tornarà a fluctuar i podrem posar el nom que desitgem.

* Nota: No fer doble clic, si no un i després un altre

També podem simplement anar a la carpeta del lloc i crear-la, apareixerà a la columna quan tornem al Dream.

Serà en aquesta carpeta que anirem guardant totes les imatges que anem a usar per construir la pàgina. Podem guardar des del programa que fem servir com a editor d'imatges, o disseny gràfic, dur-les a la carpeta amb el conegut copiar / enganxar ... etc ... Quan la carpeta contingui algun arxiu, veurem un quadret amb el signe més al seu costat.

Anem doncs a Inserir / Imatge.

Apareix aquest quadre de diàleg, com encara no tenim cap imatge, utilitzarem l'Explorador de Windows, jo tinc el gif a la carpeta Els meus documents:

Prement la icona Vista prèvia, podrem veure les imatges si no coneixem bé el nom premem sobre ella i acceptem. Apareixerà un missatge com el següent:

i ens mostrarà les carpetes disponibles en el nostre Lloc:

* Nota: Si us va aparèixer una carpeta com es veu en la captura, _notes no us preocupeu d'ella, podem fins i tot esborrar-val? més endavant explicarem perquè serveix, però per ara ... la ignorem o millor la esborrem i així no hi ha confusions val?

clic a Obre

clic a desar. En fer-ho, al mateix temps que la imatge queda guardada també ja es col · loca en el document:

Una altra forma d'inserir imatges és, seleccionar la imatge des de la carpeta, a la columna dreta i mantenint-la premuda, arrossegar-la fins la posició on volem col · locar.

Tant en inserir una imatge, com al arrossegar, ens sortirà un missatge on posar un text alternatiu.

* Nota: Text Alternatiu: Això és per si, per algun motiu la imatge no es carrega en un navegador. El Mozilla, veureu que no mostra res, si la imatge no es carrega, no surt la creueta aquella, simplement no surt res. Si posem un text alternatiu .. (Per exemple, en una captura jo sòl posar img 1, o captura 1, o el mateix nom que tingui la imatge) O no posar res, també es pot donant a cancel · lar. Encara que de cara a una web, és aconsellable acostumar i anar fent-ho.

Podem més tard afegir-lo, seleccionant la imatge i en Propietats:

Finalment, de vegades pot passar que havent guardat una imatge en la seva carpeta corresponent, en anar a inserir, no la vegem des de la columna d'Arxius, a la dreta de la pantalla. Actualitzem la columna fent clic en la fletxa circular blau:

o com veiem en la captura, prémer la tecla F5, això ho tindrem en compte amb arxius i imatges també ok? i apareixerà.