![Page 1: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/1.jpg)
1
Uvod u Web Design
![Page 2: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/2.jpg)
2
Izrada Web stranica pomoću Microsoft FrontPage-a
![Page 3: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/3.jpg)
3
Pregled gradiva
Internetski servisi
Izrada web stranica
HTML osnove
Obrada teksta, slike, tabele
Napredne teme (CSS, DHTML, …)
![Page 4: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/4.jpg)
4
Internetski servisi
Elektronska pošta
Napredno korištenje Outlook-a
koncepcija weba
![Page 5: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/5.jpg)
5
Koncepcija WWW-a
Distribuirani multimedijski mrežni informacijski servis
Temelji se na modelu-klijent server
Omogućuje pretraživanje, dobavljanje i pohranjivanje informacija
Koristi se načelom hiperteksta
Uključuje tekst, sliku, zvučni i video zapis
![Page 6: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/6.jpg)
6
Koncepcija WWW-a (1)
Model klijent - server
Klijent je program ili računar koje traži podatke
server je program ili računar koje upravlja podacima
Komunikacija između klijenta i servera odvija se po nekom od protokola
![Page 7: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/7.jpg)
7
Koncepcija WWW-a (2)
KLIJENT
MOLIM
IZVOLIIZVOLI
WWW
server
FTP
server
HTTP, MAIL server
IZV
OL
I
![Page 8: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/8.jpg)
8
Koncepcija WWW-a (3)
HTML
(Hyper Text Markup Language)
• Simbolički jezik za oblikovanje hiperteksta.
• Hipertekst je tekst koji sadrži veze.
• Standardi: HTML 1.0, 2.0, 3.0, 3.2, 4.0,
4.01, XHTML 1.0,….
![Page 9: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/9.jpg)
9
Koncepcija WWW-a (4)
URL
(Uniform Resource Locator)
jednoznačni način adresiranja bilo kojeg resursa na mreži
adresu čine:
primjer HTTP URL-a:
protokol://ime_servera/lokacija/ime_datotekehttp://informatika.efzg.hr/satnica/četvrtagodina.htm
![Page 10: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/10.jpg)
10
Koncepcija WWW-a (5)
HTTP
(Hyper Text Transport Protocol)
protokol za komunikaciju između WWW klijenta i servera
služi primarno za prenos dokumenta (hiperteksta), ali i svih drugih oblika dokumenata
![Page 11: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/11.jpg)
11
Kako radi WWW server
WWW server ne interpretira podatke i ne kontaktira s drugim serverima; taj zadatak je prepušten klijentu!
WWW server samo distribuira podatke
![Page 12: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/12.jpg)
12
Kako radi WWW server
klijent
HTTP
URLWWW server
HTTP
HTML
![Page 13: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/13.jpg)
13
HTML - struktura dokumenta
![Page 14: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/14.jpg)
14
HTML - struktura dokumenta
... <tag attribute=“value”...>...</tag>...
Tekst i oznake
Vrijednost atributa
Naziv atributa
Naziv oznake
![Page 15: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/15.jpg)
15
Minimalni HTML dokument
<HTML>
<HEAD>
<TITLE>Naslov</TITLE>
</HEAD>
<BODY>
Ovdje se upisuje vidljivi dio teksta
...
</BODY>
</HTML>
![Page 16: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/16.jpg)
16
Microsoft FrontPageopis interfejsa, osnove rada s programom
FrontPage - Microsoftov program za izraduweb stranica
KonfiguracijaPC Pentium 75 MHz ili noviji
Operativni sistem95/98 ili noviji / 24 MB RAMNT 4.O ili noviji / 40 MB RAM
Hard disk - 167 MB
![Page 17: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/17.jpg)
17
Microsoft FrontPageopis interfejsa, osnove rada s programom
Otvaranje FrontPagea
– otvorite meni Start
– na meniu Start odaberite Programs
– na idućem meniu kliknite na
MICROSOFT FRONTPAGE
![Page 18: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/18.jpg)
18
Microsoft FrontPageopis interfejsa, osnove rada s programom
![Page 19: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/19.jpg)
19
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija naslova – naziv programa i direktorijagdje je smještena našastranica
Linija menia – sadrži glavni meni s 10padajućih podmenia
Linija alata – omogućava brzo obavljanječestih akcija
Linija formatiranja – služi za formatiranjeteksta
![Page 20: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/20.jpg)
20
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija radnog prikaza – nudi tri različitaprikaza naše stranice
Normal – uređivanje stranice
HTML – izvorni kod HTML stranice
Preview – izgled stranice u WWWeksploreru
Linija naziva – naziv radne stranice
Linija statusa – vrijeme učitavanja stranice
![Page 21: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/21.jpg)
21
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
PAGE
• prikaz radne stranice
![Page 22: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/22.jpg)
22
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
FOLDERS
• prikaz popisa
datoteka i mapa gdje
se nalazi web
![Page 23: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/23.jpg)
23
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
REPORTS
• kompletan izvještaj o
webu
![Page 24: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/24.jpg)
24
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
NAVIGATION
• trenutna organizacija
weba
(strukturno i slikovno)
![Page 25: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/25.jpg)
25
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
HYPERLINKS
• prikaz hiperveza na
webu
![Page 26: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/26.jpg)
26
Microsoft FrontPageopis interfejsa, osnove rada s programom
Linija organizacijskog prikaza
TASKS
• lista svih postavljenih
taskova povezanih sa
radnom stranicom
![Page 27: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/27.jpg)
27
Tehnologija izrade i publiciranja web stranice
“Najvažniji korak” – odlučiti se za informacijekoje ćemo staviti na web
prikupiti radni materijal(slike, multimediju, linkove)
napraviti koncept stranica(shematski nacrtati na papiru)
izraditi stranicu lokalno na PC (FrontPage)i prenijeti je pod nadzor WWW servera
![Page 28: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/28.jpg)
28
Tehnologija izrade i publiciranja web stranice
Što nam je potrebno?
Editor slika (Photoshop, Image Composer)
HTML editor (FrontPage)
WWW eksplorer (Internet Explorer, Netscape)
![Page 29: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/29.jpg)
29
Izrada jednostavne web stranice
1. Upotreba čarobnjaka
FILE – NEW – WEB
![Page 30: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/30.jpg)
30
Izrada jednostavne web stranice
• U okviru za dijalog
NEW na kartici WEB
SITES odaberemo
jedan od ponuđenih
čarobnjaka
![Page 31: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/31.jpg)
31
Izrada jednostavne web stranice
• lokacija weba na disku
C:/My Documents/My Webs/Myweb
Možemo promijeniti ime
• FrontPage sam kreira dvije mape
_PRIVATE i IMAGES, te početnu
stranicu INDEX.HTM
![Page 32: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/32.jpg)
32
Izrada jednostavne web stranice
2. Upotreba predložaka
• Dodavanje novih web stranica
- Otvorite meni FILE
- Na meniu FILE odaberemo NEW
- Na idućem meniu odaberemo PAGE
![Page 33: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/33.jpg)
33
Izrada jednostavne web stranice
• U okviru za dijalog NEW
odaberemo karticu
GENERAL
![Page 34: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/34.jpg)
34
Izrada jednostavne web stranice
• Unos elementa TITLE
• desnim klikom miša na radnoj stranici
otvaramo meni
• odaberemo PAGE PROPERTIES
![Page 35: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/35.jpg)
35
Izrada jednostavne web stranice
• u okviru za dijalog PAGE
PROPERTIES odaberemo
karticu GENERAL
![Page 36: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/36.jpg)
36
Izrada jednostavne web stranice
FORMATIRANJE TEKSTA
unos elementa H (Heading)
odabir fonta (stil, veličina, boja)
odabir izgleda paragrafa (poravnanje, razmaci između redova, uvlake)
odabir izgleda listi
![Page 37: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/37.jpg)
37
Izrada jednostavne web stranice
• Unos elementa H (Heading)
- označimo tekst
- odaberemo element H (Heading 1…6)
![Page 38: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/38.jpg)
38
Izrada jednostavne web stranice
FORMAT – FONT – okvir za dijalog FONT
• vrsta fonta
• stil
• veličina
• boja
• efekti
1. Odabir fonta
![Page 39: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/39.jpg)
39
Izrada jednostavne web stranice
2. Odabir izgleda paragrafa
FORMAT – PARAGRAF– kartica za
dijalog PARAGRAF
• poravnanje
• uvlake
• razmak između
redova i riječi
![Page 40: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/40.jpg)
40
Izrada jednostavne web stranice
3. Odabir izgleda listi
FORMAT – BULLETS AND
NUMBERING
![Page 41: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/41.jpg)
41
Izrada jednostavne web stranice
• U okviru za dijalog
BULLETS AND
NUMBERING
odaberemo karticu
PICTURE BULLETS
![Page 42: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/42.jpg)
42
Izrada jednostavne web stranice
U okviru za dijalog
BULLETS AND
NUMBERING odaberemo
karticu PLAIN BULLETS
![Page 43: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/43.jpg)
43
Izrada jednostavne web stranice
U okviru za dijalog
BULLETS AND
NUMBERING
odaberemo karticu
NUMBERS
![Page 44: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/44.jpg)
44
Izrada jednostavne web stranice
![Page 45: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/45.jpg)
45
Upravljanje linkovima
![Page 46: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/46.jpg)
46
Upravljanje linkovima
INSERT – HYPERLINK
Odabir linka sa linije alata
![Page 47: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/47.jpg)
47
Upravljanje linkovima1. Na drugi web
• kartica za
dijalog CREATE
HYPERLINK
![Page 48: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/48.jpg)
48
Upravljanje linkovima2. Na drugu stranicu
![Page 49: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/49.jpg)
49
Upravljanje linkovima3. Na e–mail adresu
![Page 50: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/50.jpg)
50
Upravljanje linkovima4. Na drugu stranicu koju tek trebamo kreirati
![Page 51: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/51.jpg)
51
Upravljanje linkovima4. Na drugu stranicu koju tek trebamo kreirati.
• CTRL + S
snimamo stranicu i
pohranjujemo je u naš
web
![Page 52: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/52.jpg)
52
Upravljanje linkovima5. Unutar iste stranice
• postavimo kursor na vrh stranice i pritisnemo ENTER
• pomaknemo se natrag do novo–kreiranog odlomka
•s menia INSERT odaberemo BOOKMARK
• u okviru za dijalog BOOKMARK
u okviru BOOKMARK NAME
upišemo the top
![Page 53: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/53.jpg)
53
Upravljanje linkovima
5. Unutar iste stranice
• pomaknemo se prema dnu stranice i napišemo
npr. “NATRAG NA VRH”
• označimo mišem i pritisnomo ikonu HYPERLINK
![Page 54: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/54.jpg)
54
Upravljanje linkovima
![Page 55: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/55.jpg)
55
Elementi grafike
![Page 56: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/56.jpg)
56
Elementi grafike
1. Boja teksta, pozadine i linkova
FORMAT – BACKGROUND
![Page 57: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/57.jpg)
57
Elementi grafike
• u okviru za
dijalog odaberite
karticu
BACKGROUND
![Page 58: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/58.jpg)
58
Elementi grafike
2. Horizontalne crte
INSERT – HORIZONTAL LINE
![Page 59: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/59.jpg)
59
Elementi grafike
3. Slike unutar teksta
INSERT – PICTURE
– FROM FILE
![Page 60: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/60.jpg)
60
Elementi grafike• nakon što se slika pojavila na našoj radnoj stranici izvršavamo
snimanje CTRL + S
• otvara nam se okvir za dijalog SAVE EMBEDDED FILES
![Page 61: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/61.jpg)
61
Elementi grafike
• klikom miša na sliku pozivamo navigacijsku traku
PICTURES
![Page 62: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/62.jpg)
62
Elementi grafike
4. Slika kao polazište linka
• postupak je isti kao i kod teksta, samo što
sada umjesto teksta označimo sliku
(kliknemo mišem) i pozovemo okvir za
dijalog CREATE HYPERLINK
![Page 63: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/63.jpg)
63
Elementi grafike
Clip Art
u meniu INSERT odaberemo PICTURE
u meniu odaberemo CLIP ART
otvara nam se okvir za dijalog CLIP ART GALLERY
izaberemo željeni CLIP ART
![Page 64: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/64.jpg)
64
tabele
1. Draw table
TABLE – DRAW TABLE
![Page 65: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/65.jpg)
65
tabele
![Page 66: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/66.jpg)
66
tabele2. Linija alata
![Page 67: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/67.jpg)
67
tabele
3. Insert table
TABLE – INSERT – TABLE
![Page 68: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/68.jpg)
68
tabele
• okvir za dijalog
INSERT TABLE
![Page 69: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/69.jpg)
69
tabele
• Formatiranje tabele
![Page 70: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/70.jpg)
70
tabele
• formatiranje tabele
1. na nivou cijele tabele
2. na nivou ćelija
![Page 71: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/71.jpg)
71
tabele1. Formatiranje na nivou cijele tabele
• okvir za dijalog
TABLE PROPERTIES
![Page 72: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/72.jpg)
72
tabele
2. Formatiranje na nivou ćelija
• okvir za dijalog
CELL PROPERTIES
![Page 73: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/73.jpg)
73
tabele
Česte akcije formatiranja
umetanje redova i kolonaTABLE – INSERT – ROWS AND COLUMNS
brisanje ćelija TABLE – DELETE CELLS
spajanje ćelija TABLE – MERGE CELLS
razdvajanje ćelija TABLE – SPLIT CELLS
![Page 74: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/74.jpg)
74
Okviri
Kreiranje stranice sa okvirima
FILE – NEW – PAGE
otvara nam se okvir za dijalog NEW
odaberite karticu FRAME PAGES
![Page 75: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/75.jpg)
75
Okviri
![Page 76: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/76.jpg)
76
Okviri
![Page 77: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/77.jpg)
77
Okviri• opcija
TARGET FRAME
![Page 78: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/78.jpg)
78
Okviri
Formatiranje okvira
razdvajanje okvira
brisanje okvira
• otvaramo okvir za dijalog
FRAME PROPERTIES
FRAMES
![Page 79: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/79.jpg)
79
Okviri
![Page 80: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/80.jpg)
80
grafičke mape CLIENT-SIDE IMAGEMAPS
![Page 81: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/81.jpg)
81
grafičke mape CLIENT- SIDE IMAGEMAPS
odaberemo željenu sliku
klikom na sliku otvara nam se navigacijska traka PICTURES
alatima za odabir označimo dio slike
otvara nam se okvir za dijalog CREATE HYPERLINK
![Page 82: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/82.jpg)
82
Upotreba srpskog jezika i pisma u izradi stranica
FILE – PROPERTIES
![Page 83: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/83.jpg)
83
Upotreba srpskog jezika i pisma u izradi stranica
• u okviru za dijalog PAGE
PROPERTIES odaberemo
karticu LANGUAGE
Central European
(ISO 8859–2)
![Page 84: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/84.jpg)
84
Upotreba srpskog jezika i pisma u izradi stranica
• provjeriti u HTML prikazu
![Page 85: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/85.jpg)
85
Podešavanje radne okoline
![Page 86: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/86.jpg)
86
Podešavanje radne okoline
![Page 87: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/87.jpg)
87
Dopunske mogućnosti
rad s tabelama i grafikonima
rad s bazama podataka
dodavanje raznih efekata na stranicu
dodavanje raznih formi
izbor raznih grafičkih rješenja
preuzimanje dokumenata iz drugih programa
provjera pravopisa
rad s Cascading Style Sheets (CSS)
![Page 88: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/88.jpg)
88
Dopunske mogućnosti
![Page 89: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/89.jpg)
89
Styles and Styles Sheets
<HTML><HEAD><TITLE> Primjer naredbe STYLE </TITLE>
<STYLE>
BODY {BACKGROUND: silver}
H2 {TEXT-ALIGN: ’center’; COLOR: ‘white’}
P {TEXT-INDENT: ‘+10%’}
</STYLE>
</HEAD><BODY>
</body></HTML>
![Page 90: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/90.jpg)
90
Styles and Styles Sheets
<HTML><HEAD><TITLE> Primjer naredbe STYLE </TITLE>
<LINK>REL=StyleSheet HREF=‘normalpg.css’ TYPE=‘text/css’
</HEAD><BODY>
</body></HTML>
<STYLE>
P { font-family: arial, tahoma, verdana}
</STYLE>
![Page 91: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/91.jpg)
91
Styles and Styles Sheets
{ font face=‘arial, tahoma, verdana’ size=10pt, 5cm, 24px, 50%}
<style>
H2 {font-family: arial, tahoma;
font-size: 10pt;
font-style: italic;
color: #FF0033;}
</style>
![Page 92: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/92.jpg)
92
Default Style Sheets
<STYLE TYPE=‘text/css’>
p { font-size:12 pt }
</STYLE>
![Page 93: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/93.jpg)
93
CLASS atribut
P { font-family: arial, tahoma, verdana}
P.warning { color: red; border: thick double black }
P.note { color: green; background: url(clouds.gif) }
P.big { font-size: 150%}
<H3 CLASS=‘big’> ……… </H3>
<P CLASS=‘note’> neki tekst </P>
![Page 94: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/94.jpg)
94
Pseudo-class
A:link { color: red }
A:visited { color: gray }
A:active { color: black }
<style type="text/css">
A:link { text-decoration : none; }
A:visited { text-decoration : none; }
A:hover { text-decoration : underline; }
</style>
![Page 95: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/95.jpg)
95
Mogući mehanizmi publiciranja web stranica FTP, HTTP
publiciranje weba korištenjem FTPftp://www.server.com
publiciranje weba korištenjem HTTPhttp://www.server.com
![Page 96: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/96.jpg)
96
Mogući mehanizmi publiciranja web stranica FTP, HTTP
FILE – PUBLISH WEB
• okvir za
dijalog
PUBLISH
WEB
![Page 97: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/97.jpg)
97
Medij, stil, izraz
WWW je zaseban medij koji ima ličneestetske zakonitosti i pravila dobrog oblikovanja, različita od onih koji vrijede za film, televiziju, riječ...
![Page 98: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/98.jpg)
98
Medij, stil, izraz
Stil
ne pretjerivati ni s jednim stilskim elementom
prilagoditi elemente multimedije poruci
linkove stavljati na završetke misli ili ideja
koristiti navigacijske linkove
grafički elementi sami po sebi moraju biti jasni
![Page 99: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/99.jpg)
99
Medij, stil, izraz
Izraz
znati što se hoće poručiti
jezik prilagoditi nivou publike
formulirati poruku jasnim i sažetim riječima
organizirati sadržaj i ne okolišati oko teme
podijeliti materijal u stranice
![Page 100: Uvod u Web Design - mf-bl.commf-bl.com/upload/documents/Dokumenti/Predmeti/Informacione... · 20 Microsoft FrontPage opis interfejsa, osnove rada s programom Linija radnog prikaza](https://reader030.vdocuments.net/reader030/viewer/2022020120/5a789ab87f8b9ae91b8cbd61/html5/thumbnails/100.jpg)
100
Sažetak
Napomena:
Brisanje weba ili pojedinih stranica je trajna i nepovratna akcija
Brisanje:
otvoriti web koji želimo obrisati
prikazati popis mapa (FOLDERS LIST)
desnom tipkom miša kliknuti na glavnu mapu
s objektnog menia odabrati DELETE