4. Linkovi
Elektronsko poslovanje
Elektronsko poslovanje
Riječ koju
vidi korisnik
Otvarajući tag sa atributom
Stranica na koju vodi link
Linkovi ka drugim sajtovima Linkovi se kreiraju korištenjem <a> taga. Korisnici mogu
kliknuti na sadržaj koji se nalazi između otvarajućeg <a>
i zatvarajućeg </a> taga. I ovaj tag se precizira atributom
“href” tj.stranicom na koju vodi link.
Zatvarajući tag
Elektronsko poslovanje
Primjer
Elektronsko poslovanje
Konbinacija liste i linkova
Elektronsko poslovanje
Lokacije strana
u “podfolderima”
Otac
unuk
djed
sin
Elektronsko poslovanje
Riječ koju
vidi
korisnik
Otvarajući tag sa
atributom
Stranica
na istom
sajtu
Linkovi ka drugim stranicama na istom sajtu
Linkovi se kreiraju i na druge stranice istog sajta.
Prvo moramo imati kreiranu drugu stranu da bismo
napravili link ka njoj.
Zatvarajući
tag
Elektronsko poslovanje
Riječi koje
vidi
korisnik
Otvarajući tag sa
atributom
E-mail na
koji se
šalje
Linkovi za E-mail
Ova vrsta link omogućava pokretanje slanja email-a
klikom na link. Primjer u nastavku
Zatvarajući
tag
Elektronsko poslovanje
Riječ koju
vidi
korisnik
Otvarajući tag sa
atributom
Stranica
na istom
sajtu
Otvaranje linkova u novom blank prozoru
Linkovi se mogu otvoriti u istom i novom prozoru.
Možete koristiti desni klik mišem ali možete koristiti i tag
za linkove sa podešavanjem parametra.
Zatvarajući
tag
Novi
atribut
target
5. Ubacivanje
slika
Elektronsko poslovanje
Kakve slike trebaju biti?
Elektronsko poslovanje
•Bitne
• Povezane sa informacijama ili da sadržavaju
informacije
• Prepoznatljive
•Prilagođene bojana sajta
Izvori
• Vlastite fotografifje
• Društvene mreže
• Sajtovi (stock images)
1. http://www.istockphoto.com/
2. http://www.veer.com/
3. http://eu.fotolia.com/
4. http://www.freeimages.com/
Elektronsko poslovanje
Naslov
slike
Otvarajući
tag img
Tekst.
objašnjenje
Dodavanje slika (JPEG)
Za dodavanje slika koristimo element <img>. Ovo je “prazni” tj.
samozatvarajući element i nema zatvarajućeg taga. Ovaj element
ima sledeće atribute:
1. src – informacija o tome gdje se slika nalazi
2. alt – tekstualno objašnjenje slike kada ju ne možemo vidjeti
3. Title – informacija o slici kada ih ne vidimo u tekstu pored
Nema
zatvarajućeh
samo /
Izvor slike
i tip
Elektronsko poslovanje
Visina Širina
Dodatni atributi
Često ćete koristiti i dva dodatna atributa
1. Height – specizirate visinu fotografije u pikselima
2. Width – specizirate širinu fotografije u pikselima
Elektronsko poslovanje
Pozicija slike
u odnosu na
tekst
Elektronsko poslovanje
Poravnanje kao atribut slike
U HTML se isključivo u CSS-u podešava poravnanje.
Ovjde ćemo preći zbog slučaja “starijih” verzija
1. Lijevo poravnanje align=“left”
2. Desno poravnanje align=“right”
3. Gornje poravnanje align=“top”
4. Srednje poravnanje align=“middle”
5. Donje poravnanje align=“bottom”
Bitne napomene za slike
Elektronsko poslovanje
•Sačuvajte slikeu odgovarajućem formatu
•Sačuvajte slike u odgovarajućoj veličini
•Koristite odgovarajuću rezoluciju
•Pazite kdo isjecanja
•Osvjetljenost i transparentnost
Alati za pripremu slika
• Paint
• Adobe PhotoShop
•Paint.net
1. http://www.photoshop.com/
2. http://www.pixlr.com/
3. http://www.splashup.com/
4. http://www.ipiccy.com/
Elektronsko poslovanje
Figurecaption je unutar
figure elementa!
Figure element
Figure element
HTML 5 je uveo novi <figure> element koji se sastoji od slike i
njenog opisa a jedan naslov/natpis u okviru ovog elementa se može
vezati za više slika.
<figurecaption> element je takođe dodan u HTML5 da bi autori
mogli dodati naslov slikama. Stariji browser-i ga ne prepoznaju.
Top Related