16 IZRADA WEB STRANICA

Transcription

1 16 IZRADA WEB STRANICA Kako Internet kao mreža postoji već tridesetak godina tek je sa pojavom World Wide Weba Internet postao ono što je danas. Ono što je Internetu na njegovim počecima nedostajalo bila je udobnost prilikom prikupljanja podataka. Jednostavno nije bilo programa koji bi objedinio pristup do svih usluga na Internetu i korisnici su bili prisiljeni ručno upisivati naredbe. Većina ljudi nije htjela ili nije znala pisati takve nardebe, kojih je trebalo upisati i po desetak da bi se došlo do podataka. Iz tog razloga godine Tim Berners Lee predlaže izradu jedinstvenog hipertekstualnog sistema za distribuciju podataka izmeñu ljudi. Krajem godine počeo se razvijati sam projekt World Wide Weba. Počelo se sa razvojem prvog programa za pristup Webu jednostavnog imena WWW. Ovaj program radio je sa tekstualnim sadržajem. Ubrzo je napisan i prvi broswer sa grafičkim sadržajem, a napisana je i prva verzija već pomenutog HTML jezika. Bila je mnogo jednostavnija od današnje, ali postojanje hiperlinkova za povezivanje dokumenata omogućilo je lako pretraživanje i sasvim dovoljnu dostupnost informacijama. Danas je aktuelna verzija 4.0 koja podržava veliki broj opcija, a neke od njih biće korišćene u narednom poglavlju. Pored HTML-a, razivjane su i napredne tehnologije, koje koristimo za izradu Web stranica. U nastavku ovog poglavlja navešću neke od njih. Ipak, treba napomenuti, da se ove tehnologije uglavnom ne upotrebljuju samostalno, već se u osnovi svega nalazi HTML. CSS 2 je vrlo moćan alat za precizno pozicioniranje slova, tabela i ostalih elemenata na stranici tako da Web stranica može biti na nivou DTP-a (alata za stono izdavaštvo). Izgled stranice isti je i na ekranu i na papiru i ostalim izlaznim ureñajima. Sam HTML jezik nikad nije bio zamišljen kao jezik za grafičko formatiranje stranica pa je uvoñenje CSS-a ispravilo taj nedostatak. Osim što služi za odreñivanje veličina, fonta i boje slova, podršku za audio pretraživače, prednost kombinacije HTML + CSS ogromna je posebno 2 Cascadina Style Sheets 417

2 Visoka poslovna škola strukovnih studija, Novi Sad ako se CSS izdvoji u posebne datoteke. Na taj način vrlo je jednostavno napraviti stilski šablon za ceo Web site i osigurati isti izgled svih stranica prezentacije, bez mnogo truda. Na taj način olakšava se i održavanje stranica. Osim toga CSS je bitan ljudima sa poteškoćama, posebno onima sa oštećenim vidom jer im omogućava da sami odrede izgled stranica tj. povećaju slova, promene boju Tu je još i posebna karakteristika CSS-a precizno i apsolutno pozicioniranje objekata, odlomaka i slova što je bitan nedostatak HTML-a. DHTML 3 nije ništa drugo nego ubacivanje skriptnih programa u HTML kod na Web stranicama, čime se postiže interaktivnost. Odnosno DHTML je naziv za kod stranicama kojima je dinamičnost postignuta nekim od skriptnih jezika. DHTML-om je omogućeno stvaranje animacija, izmena slika, jednostavna interakcija. On omogućava da se korisniku šalje više slojeva informacija za vreme trajanja veze sa serverom. Na početku korisnik vidi samo deo podataka. Ostali podaci se otkrivaju postepeno, tako što korisnik preuzima različite radnje, ne morajući ponovo da se povezuje sa serverom. Obrasci i CGI Obrasci (forms) su polja za unošenje teksta i padajući meniji koji korisnicima omogućavaju da unose podatke koje tražite. Dobijanje podataka od korisnika putem pbrazaca je veoma lako. Mnogo teže je shvatiti šta da radite sa podacima kada ih dobijete. Obrañivanje podataka iz obrauaca zahteva CGI skript 4 i neku aplikaciju. CGI skript (nekada se zove samo CGI) ustvari je program koji podatke šalje aplikaciji koju vi napravite. CGI skript se izvršava na serveru na kom se nalazi vaša Web strana. CGI skriptovi se obično pišu jezicima C i PERL. Java je programski jezik kompanije Sun kojim se mogu praviti animacije, manji interaktivni apleti, jednostavnije igrice. Podržavaju ga gotovo svi browseri. Preuzimanje Java programa, koji se nazivaju alpetima na vaš računar omogućava brzo izvršavanje i interaktivnost, ali istovremeno postavlja pitanje bezbednosti. Iako je Java već veoma raširena, neki korisnici isključuju podršku za Javu u svojim browserima, da bi izbegli probleme. JavaScript, VBScript, JScript su skriptni jezici. Oni nisu pravi programski jezici. Iako ih ljudi često poistovećuju sa Javom, oni 3 Dinamic HTML 4 Common Gateway Interface script skript opšteg interfejsa mrežnog prolaza 418

3 nemaju veze sa Javom. Kod ovih jezika se nekompajlira nego se direktno ubacuje u HTML kod. Ovi skript jezici imaju razne mogućnosti izmena slika, formulari, razne manje animacije. Oni se izvršavaju u našem browseru. ActiveX je tehnologija koju je razivo Microsoft. Omogućava izradu raznih animacija i interaktivnih apleta, tako što izvršava programe koji su napisani u Visual Basicu. Ozbiljan problem ove tehnologije je bezbednost. Flash je program za izradu vektorske animacije kompanije Macromedia. Flash omogućava prikazivanje vektora grafike koji sadrže manje kilobajta od obične grafike (tj. bitmapiranih slika), pa je moguće stvoriti animirane, interaktivne stranice bogate grafikom, koje će se istovremeno veoma brzo učitavati i kod korisnika sa sporijim Internet vezama. Da bi korisnik video ove animacije, potrebno je da ima instaliran Flash Player na svom računaru. Za izradu složenijih flash animacija koristi se jezik ActionScript. Ovaj program je već stekao veliku popularnost meñu Web dizajnerima. Veliki broj Web sajtova sadrži po neku flash animaciju. Takoñe, sve su češći Web sajtovi koji su kompletno izrañeni u Flashu. Oni izgledaju veoma atraktivno, ali zahtevaju malo duže učitavanje od običnih Web strana, koje su urañene samo pomoću HTML-a. Jedina njihova prava mana, je što tekst na ovakvim Web stranicama nije dostupan Internet pretraživačima, i nije ih moguće pretraživati. Da ne bude zabune, strane koje napravimo samo u Flashu Web browser ne može učitati. One moraju biti uvezene pomoću plug-in-ova u HTML, ali taj HTML kod Flash može automatki da generiše. Iako je Flash pre svega namenjen Internetu, on se danas koristi za pravljenje raznih animacija, igrica, pa čak i crtanih filmova, koji zauzimaju malo prostora na disku, zbog već pomenute vektorske grafike. XML 5 predstavlja nadskup HTML-a i podskup opšteg standarda SGML 6 na kom se zasniva HTML. XML omogućava ugradnju složenih struktura podataka na Web stranu. Pomoću XML-a autori mogu da izgrañuju aplikacije za baze podataka i da ih distribuiraju na Webu. ASP, PHP, JSP su serverske tehnologije bez kojih bi bilo nemoguće ispunjavanje raznih obrazaca, formulara i zapisivanje podataka u baze (najčešće se koristi MySQL) Oni se izvršavaju na 5 extensible Markup Language 6 Standard Generalized Marup Language 419

4 Visoka poslovna škola strukovnih studija, Novi Sad serveru i od njih zavisi da li ih neko može pristupati tim podacima ili ne. To su zapravo Internet programski jezici, tj. alati za razvoj Web aplikacija. Kod ovih jezika se takoñe ugrañuje u HTML. Ozbiljnije i veće Web lokacije svoje sajtove sve više izrañuju pomoću ovih tehnologija. U baze podataka se stavljaju tekstualni podaci, ali i ostali fajlovi. Ovim se omogućava mnogo jednotavnija izmena i dodavanje inforamcija i podataka na stranice. Dobar primer može biti Web lokacija sa vestima koje se ažuriraju i po nekoliko puta u jednom satu. Osobe koje dodaju nove vesti ne moraju da poznaju HTML. Oni informacije samo dodaju u baze podataka, a ove tehnologije te nove informacije pokazuju na stranicama korisnika. Naravno, primene ovih tehnologija su široke, a jedna od njih su i Web prodavnice. Kako broj ljudi koji koriste Internet dramatično raste, tako sve veći broj ljudi i organizacija želi da kreira svoj web sajt, jer time dopire do najšire publike. Hypertext Markup Language (HTML) nastao je godine. Ovaj jezik je popularan zato što svako ko ga zna može da kreira web stranu pomoću običnog editora teksta koji postoji na svakom računaru. Medjutim, kreiranje web strane pomoću HTML-a može da potraje dosta dugo. Što je veći broj web sajtova, to ljudi više traže dodatne mogućnosti koje tradicionalni HTML ne podržava. Iako se HTML nije mnogo promenio, pojavile su se nove tehnologije, kao što su Dynamic HTML (DHTML), Cascading Style Sheets (CSS), Extensible Markup Language (XML), JavaScript i drugi programski jezici koji prevazilaze ograničenja koja ima HTML. Pošto sve veći broj ljudi želi da lako kreira web sajt, alati kao što je Microsoft FrontPage postaju nezamenljivi. FrontPage omogućava kreiranje, menjanje i publikovanje datoteka, bez znanja HTML-a ili nekog drugog programskog jezuika. FrontPage omogućava da se koncentrišete na kreiranje sajta dok se on bavi HTML-om. Kako se FrontPage razvijao da bi podržao različite web tehnologije, tako je i program postajao sve lakši za upotrebu. FrontPage 2003 nije izuzetak. Lista nekih osobina koje ima FrontPage: Lako se upotrebljava Poboljšani interfejs, zajedno sa mogućnošću da se pitanja unose direktno iz glavnog prozora, dovodi do toga da je korišćenje FrontPagea lakše nego ikada. Tu su i čarobnjaci koji dalje olakšavaju i ubrzavaju posao. 420

5 Poboljšani alati Osobine kao što je Top 10 List omogućavaju da donesete bitne odluke koje se tiču organizacije sajta. Pomoću komponenata FrontPagea lako možete da dodate polje za pretraživanje, ploču za poruke, foto-galeriju ili nešto drugo. FrontPage sada ima i nove komponente koje automatski ažuriraju informacije sa sajtova MSN, MSNBC, bcentral i drugih. Upravljanje sajtom FrontPage ima vrlo lak metod za konfigurisanje i promenu svih datoteka za veoma kratko vreme. Pomoću FrontPage Weba svi alati za upravljanje sajtom, datoteke, podešavanja i sl. mogu da se postave na jedno mesto. Integracija sa bazom podataka FrontPage olakšava pregled i slanje informacija u bazu podataka. Ako nemate bazu podataka, FrontPage je automatski kreira. Teme Teme su lak način za prilagodjavanje stila sajta. One omogućavaju da podešavate osobine strana na sajtu. Tu se misli na boje, fontove, grafiku, oznake i sl. Interaktivni sadržaj Pomoću samo nekoliko klikova mišem možete da ubacite slike, zvuk ili video na sajt. FrontPage ima ugrañenu podršku za tehnologije animacije, kao što je DHTML, koje omogućavaju da za svoje strane brzo i lako kreirte jednostavne animacije. Pregled izvornog HTML koda FrontPage može direktno da ureñuje HTML kod. Postoji mogućnost da menjate postojeće HTML skriptove i da kopirate sadržaj sa različitih lokacija. Mogućnosti FrontPagea za upotrebu HTML koda odnose se i na druge web tehnologije, kao što su Active Server Pages (ASP), CSS datoteke i druge. Sve ovo može da se menja i uredjuje sa jedne centralne lokacije Meniji FrontPage-a Meniji su liste koje sadrže različite opcije. Nalaze se na liniji menija koja se obično nalazi na vrhu prozora. Meniji mogu da sadrže podmenije, a i neki od podmenija mogu da sadrže dodatne podmenije Palete FrontPage-a 421

6 Visoka poslovna škola strukovnih studija, Novi Sad Palete se intenzivno koriste prilikom kreiranja datoteka pomoću FrontPagea. Palete sadrže ikone dok linija menija sadrži samo imena menija. Na vrhu prozora nalaze see palete Standard i Formatting. One su prikazane na donjoj slici. Slika 16-1 Paleta Standard i Paleta Formatting Postojećim paletama mogu se lako dodati nove, ili se mogu ukloniti postojeće. Ako želite da dodate novu paletu, izaberite View sa linije menija, a onda izaberite opciju Toolbars. Iz podmenija koji se otvara izaberite paletu koju želite da vidite. Najjednostavniji metod dodavanja novih paleta jeste da desnim tasterom miša izaberete neku od postojećih paleta. Tada će se otvoriti pomoćni meni sa spiskom paleta. Izaberite paletu iz menija i ona će se pojaviti u prozoru. U meniju se takoñe nalazi i prozor Customize, koji sadrži tri kartice: Toolbars, Commands, Options. Kartica Toolbars omogućava da sa jednog mesta dodajete ili uklanjate palete 422

7 Slika 16-2 Komunikacioni prozor Customize U prozoru Customize, prikazanom na prethodnoj ilustraciji, postoji dugme New. Ako ga izaberete, moći ćete da kreirate novu paletu na kojoj će se nalaziti ikone koje izaberete iz kartice Commands u prozoru Customize. Sve se to radi jednostavnom tehnikom povuci i pusti (drag-and-drop). Nova korisnička paleta tretira se isto kao regularna Paleta Standard Paleta Standard sadrži neke od funkcija koje se najviše koriste. U tabeli date su sve ikone koje se nalaze na ovoj paleti, zajedno sa njihovim imenima i funkcijama. Ikona Ime Funkcija New Kreira se nova datoteka. Open Save Search Publish Otvara se datoteka. Zapisuje se tekući dokument. Pretražuje se računar u potrazi za datotekama. Postavlja se Web iz FrontPagea na server ili na disk. 423

8 Visoka poslovna škola strukovnih studija, Novi Sad Toggle Pane Print Preview Spelling Cut Copy Paste Format Painter Web Component Table Prebacuje se izmeñu nekoliko pogleda. Štampa se postojeća strana. Pregleda se tekući dokument u pretraživaču. Proverava se tekući dokument u potrazi za pravopisnim greškama. Odseca se deo dokumenta (na primer, tekst ili slika) koji zatim može da se pomeri na drugo mesto. Kopira se element dokumenta tako da može da se postavi i na neko drugo mesto. Postavlja se element dokumenta (koji je predhodno kopiran) na lokaciju koju odredite. Kopira se stil i primenjuje na drugi objekat. Umeću se elementi koji proširuju i ubrzavaju neke opšte poslove web stranice. Umeće se tabela u dokument. Picture Umeće se slika koja se nalazi na Webu ili na disku. Word Art Formatira se tekst pomoću specijalnih 3-D efekata koje možete da podešavate. Hiperlink Refresh Dodaje se link koji povezuje tu stranu sa nekom drugom. Ponovo se učitava dokument. Show Help Prebacuje se na prikazivanje ili sakrivanje oznaka za formatiranje dokumenta. Pokreće se ugrañena pomoć. Tabela 16-3 Ikone i meniji palete Standard Paleta Formatting Ova paleta koristi se za promenu izgleda teksta i ostalih elemenata. U tabeli 16.4 prikazane su ikone ove palete, kao i njihovo ime i funkcija. 424

9 Ikona Ime Funkcija Style Menja se stil teksta, tabela ili bilo čega što izaberete. Font Menja se font. Font Size Bold Italic Underline Text Alignment Change Font Size Numbered List Bulleted List Indent Table Highlight Font Color Menja se veličina teksta. Dodaje se isticanje teksta. Tekst se malo iskošava udesno. Crta se linija ispod teksta. Podešava se poravnanje teksta u dokumentu. Povećava se ili smanjuje veličina fonta. Dodaje se lista sa rednim brojevima. Dodaje se lista sa oznakama. Pomera se tekst ili neki drugi element sleva udesno za izvesnu vrednost. Dodaje se tabela. Bira se korisničko isticanje ili boja pozadine za tekst, tabele itd. Menja se boja fonta. Tabela 16-4 Ikone i meniji palete Formatting Paleta DHTML Effects Na ovoj paleti nalaze se komande za animaciju. Mogu da se animiraju tekst, grafika ili elementi tabele tako da odgovaraju na različite korisničke komande. 425

10 Visoka poslovna škola strukovnih studija, Novi Sad Slika 16-5 DHTML Effects Ime On Apply Funkcija Definiše se kriterijum pod kojim se izvršava animacija. Omogućava se izbor vrste efekta animacuje koji se primenjuje na tekst, slike itd. <Choose Settings> Dalje se formatira efekat animacije koji je izabran. Ne mogu svi efekti animacije da se koriste sa ovim menijem. Tabela 16-6 Paleta DHTML Effects Paleta Drawing Paleta Drawing se, standardno, nalazi u donjem delu prozora. Ona se koristi za crtanje jednostavnih oblika kao što su krugovi i poligoni, za umetanje slika i 3-D teksta, za upotrebu korisniči definisanih oblika kao što su strelice, za dodavanje 3-D objekata, za promenu ispune i boje poligona i sl. Slika 16-7 Paleta Drawing Ikona Ime Funkcija Draw Crta i modifikuje jednostavne oblike. Select Object Selektuje objekte pomoću pokazivača miša. AutoShapes Nude se unapred nacrtane linije, oblici, strelice itd. Line Crta se linija. Arrow Crta se linija sa strelicom. 426

11 Rectangle Oval Text Box Crta se pravougaonik. Crtaju se krug i elipsa. Ubacuje se tekst kao objekat. Insert WordArt Omogućava se ubacivanje korisničkog teksta sa različitim stilovima. Insert Clip Art Umetanje korisničkih slika. Insert From File Fill Color Line Color Font Color Line Style Picture Ubacuju se slike. Definiše se boja ispune nekog objekta. Definiše se boja linije. Definiše se boja slova. Podešava se debljina linija. Dash Style Arrow Style Shadow Style Podešava se izgled isprekidanih linija. Definiše se tip strelice na kraju linije sa strelicom. Objektu se dodaje senka. 3-D Style Oblicima se dodaju trodimenzionalni efekti. Tabela 16-8 Paleta Drawing Paleta Navigation Paleta Navigation pomaže u navigaciji kroz sajt. Ako želite, možete lako da ovećate strukturu koju koristite za navigaciju (način na koji su strane organizovane u odnosu na glavnu stranu), možete da promenite osobine strane, dodate posebne strane ili podesite opcije za prikazivanje. Slika 16-9 Paleta Navigation 427

12 Visoka poslovna škola strukovnih studija, Novi Sad Paleta Pictures Paleta Pictures omogućava da menjate slike. Sa ove palete možete da menjate atribute slika uključujući kontrast, oštrinu, rotaciju itd. Slika Paleta Pictures Ikona Ime Funkcija Insert Picture Ubacuje se slika sa lokacija na disku. From File Text Preko slike se dodaje formatirani tekst. Auto Thumbnail Position Absolutely Bring Forward Send Backward Rotate Left Rotate Right Flip Horizontal Flip Vertical Velika slika se zamenjuje malom. Postoji hiperlink na veliku sliku, koja se pojavljuje kada se klikne mala. Omogućava se pozicioniranje slike sa preciznošću u pikselima. Slika se prebacuje ispred ostalog sadržaja. Slika se premešta na poziciju iza u odnosu na ostali sadržaj. Slika se rotira za 90 stepeni ulevo. Slika se rotira za 90 stepeni udesno. Slika se preslikava po horizontali. Slika se preslikava po vertikali. More Contrast Povećava se kontrast na slici tako što se zatamnuju tamne boje, a osvetljavaju svetle. Less Contrast Smanjuje se kontrast tako što se tamne boje osvetljavaju, a svetle zatamnjuju. More Brightness Osvetljava se slika dodavanjem bele boje. Less Brightness Zatamnjuje se slika dodavanjem crne boje. Crop Odseca se deo slike. 428

13 Line Style Format Picture Set Transparent Color Color Bevel Menja se debljina i tip linije koja se koristi za neki element. Formatiraju se elementi slike, kao što je, na primer, boja. Podešava se boja da bude transparentna. Menja se boja slike tako što slika postaje crno-bela, u sivim tonovima (grayscale). Oko slike se kreira 3-D ivica. Resample Čisti se slika pošto je privremeno bila promenjena njena veličina. Ovo se radi uklanjanjem razuñenih ivica na slici. Select Selektuju se elementi, kao što su slika ili vruće tačke (hot spots). Rectangular Kreira se pravougaona vruća tačka. Hotspot Circular Hotspot Kreira se kružna vruća tačka. Polygonal Hotspot Highlight Hotspots Restore Kreira se poligonalna vruća tačka. Prikazuju se vruće tačke sa belom pozadinom. Slika se vraća na stanje koje je prethodno zapisano. Tabela Ikone palete Pictures Paleta Positioning Ova paleta omogućava da podešavate, sa peciznošću na nivou piksela, mesto gde će se postaviti tekst, slike ili neki drugi objekti. Slika Paleta Positionig Paleta Reporting Paleta Reporting koristi se za generisnje snimka celog sajta. Na osnovu tog snimka možete da nañete informacije o tome koliko prostora sajt zauzima, do toga koliko linija prekida postoji na sajtu. 429

14 Visoka poslovna škola strukovnih studija, Novi Sad Slika Paleta Reporting Paleta Style Paleta Style koristi se za prilagoñavanje stilova dokumenta. Stilovi dokumenta mogu da se kreću od boje teksta pa do širine tabele. Slika Paleta Style Paleta Tables Paleta Tables omogućava dodavanje ili modifikaciju tabela. Sa ove palete možete da spajate ćelije, dodajete ili menjate boje pozadine ćelija itd. Slika Paleta Tables Ikona Ime Funkcija Draw Table Kreiranje nove tabele. Eraser Insert Rows Insert Columns Delete Cells Merge Cells Split Cells Align Top Center Vertically Briše se ćelija ili zid ćelije spajanjem izabranih ćelija. Iznad tekuće ćelije ubacuje se novi red. Levo od izabrane ćelije ubacuje se kolona. Iz tabele se brišu izabrane ćelije. Izabrane ćelije se spajaju. Ćelije se dele u nekoliko novih ćelija, po horizontali i po vertikali. Poravnava se sadržaj ćelije sa vrhom ćelije. Sadržaj ćelije se poravnava sa sredinom ćelije po vertikali. 430

15 Align Bottom Sadržaj ćelije se poravnava sa dnom ćelije. Distribute Rows Visina izabranih ćelija se postavlja Evenly na jednu vrednost. Distribute Columns Širina izabranih ćelija se postavlja Evenly na jednu vrednost. AutoFit Menjaju se visina i širina tabele i prilagoñavaju se sadržaju tabele. Fill Color Podešava se boja pozadine za celu tabelu ili za izabrane ćelije. Table AutoFormat Dodaju se korisnički stilovi koji se Combo odnose na dizajn i boje. Table AutoFormat Obezbeñuje se mogućnost izbora izmeñu korisnički definisanih formata. Fill Down Kopira se sadržaj izabrane ćelije na sve ćelije koje se nalaze ispod nje. Fill Right Kopira se sadržaj izabrane ćelije na druge ćelije po horizontali. Tabela Paleta Tables Paleta Task Pane Ova paleta je mesto sa kojeg možete da obavljate neke opšte poslove. Pojavljuje se sa desne strane prozora FrontPagea Paleta Word Art Paleta WordArt omogućava da dodate i promenite WordArt. WordArt je osobina koja omogućava da dodate korisničke efekte za tekst. Slika Paleta Word Art Upotreba panoa Panoi su nova osobina FrontPagea. Oni pojednostavljuju neke opšte poslove tako da se mogu obaviti pomoću nekoliko klikova mišem. Dva panoa koja možete koristiti su Navigation i Task. Ova dva panoa možete videti ako izaberete opcije View Task Pane ili View Navigation Pane. 431

16 Visoka poslovna škola strukovnih studija, Novi Sad Planiranje i organizovanje web sajta Struktura web sajta Svi web sajtovi sadrže naslovnu stranu (home page). To je prva strana koju posetioci vide kada posete sajt. Ispod naslovne postoji nekoliko strana, koje dalje mogu da imaju svoje podstrane FrontPage Web Jedna od najvažnijih osobina FrontPagea je FrontPage Web. FrontPage Web je direktorijum u kome se alazi ceo sajt. Unutar FrontPage Weba možete da dodajete datoteke, kreirate direktorijume, premeštate datoteke i oavljate ostale osnovne poslove Kreiranje FrontPage Weba 1. Sa linije menija izaberite File New Page or Web. Kada jednom izberete ovu opciju, sa desne strane prozora FrontPagea pojaviće se pano Task. U delu Section panoa Task izaberite Empty Web. 2. Tada će se otvoriti prozor Web Site Templates. Sa desne strane ovog prozora, U polju Specify the location of the new web, možete da izaberete lokaciju na kojoj treba da se nalazi web sajt. Kada jednom izaberete lokaciju, dva puta kliknite ikonu Empty Web, sa leve strane. Slika Prozor Web Site Templates 432

17 3. Zatim će se zatvoriti prozor Web Site Template i FrontPageu će biti potrebno nekoliko sekundi da kreira potrebne direktorijume i datoteke, koje možete pogledati ako kliknete View Folders Kreiranje strana Desnim tasterom miša kliknite negde u Folders View, ali tako da to nije direktorijum ili datoteka. Otvoriće se pomoćni meni. iz njega izaberite opciju New Page. Kreirana strana je prva strana na web sajtu i ona će dobiti ime index.htm Kreiranje direktorijuma Desnim tasterom miša izaberite prazno mesto u prikazu View, a onda izaberite New Folder. Kreiraće se novi direktorijum, kome možete promeniti ime Uvoz datoteka, direktorijuma i web sajtova u web sajt U FrontPage mogu da se uvoze različite datoteke, kao što su datoteke sa slikama, zvukom, videom, dokumentima i sl. Ako želite da uvezete datoteku ili direktorijum, treba da uradite sledeće: Izaberite File Import. Otvoriće se prozor Import. Slika Uvoz datoteka 433

18 Visoka poslovna škola strukovnih studija, Novi Sad Dugme Add File omogućava uvoz datoteka u web sajt. Dugme Add Folder omogućava uvoz direktorijuma, sa kojim će biti dodate i sve datoteke koje se nalaze u njemu. Najefikasniji način za uvoz datoteka i direktorijuma jeste da u tekući FrontPage Web uvezete ceo drugi FrontPage Web.Dugme From Web u prozoru Import ima ovu funkciju Upotreba šablona za web sajtove FrontPage ima nekoliko unapred definisanih šablona koje možete da menjate i koristite. Šabloni FrontPagea omogućavaju da kreirate korisnički formatiran web sajt. Neki web šabloni sa slikama već su podešeni za sajt koji kreirate. Većina ovih šablona odnosi se na kreiranje novog sajta, a neki od njih imaju i čarobnjake koji vode korisnika kroz kreiranje sajta. Šabloni se mogu izabrati iz prozora Web Site Templates do koga se dolazi preko opcije Web Site Templates u panou Task Upotreba šablona za strane Šabloni strana su, u osnovi, isti kao šabloni za web sajtove, osim što pomoću njih nastaju web strane, a ne web sajtovi. Šabloni strana se intenzivno koriste za pojednostavljenje poslova koji se ponavljaju, čime se omogućava da se koncentrišete samo na sadržaj, dok se šabloni brinu o rasporedu ili potrebnom programiranju. Iako upotreba šablona za strane nije obavezna, lakše je da, na primer, modifikujete šablon sa foto-galerijom nego da ručno kreirate foto-galeriju. Šabloni se mogu izabrati iz prozora Page Templates, do koga se dolazi preko opcije Page Templates u panou Task Kreiranje web sajta Osnove HTML-a HTML je nastao godine, kao jezik za generisanje tekstualnih dokumenata za World Wide Web. Od tada je HTML doživeo mnoge nove verzije. Danas ima mogućnosti da podrži slike, zvuk, stilove i još mnogo toga. Kada kreirate nešto u FrontPageu, ako želite, možete da pogledate HTML kod. Ovo ćete uraditi tako što ćete izabrati dugme koje se nalazi u donjem levom uglu ekrana. 434

19 FrontPage kreira HTML datoteke sa ekstenzijom.htm, dok drugi programi i HTML strane koje kreiraju pojedinci imaju ekstenziju.html. Nema razlike izmeñu datoteka sa ekstenzijom.htm i.html. Pretraživači prepoznaju obe vrste datoteka kao HTML dokumete. HTML oznake Slika HTML kod koji je kreiran u FrontPageu Oznake (tagovi) koriste se u HTML-u za označavanje delova koda. Uvek dolaze u parovima. Postoji oznaka za početak (otvaranje) i oznaka za kraj (zatvaranje). Na primer, ako želite da dodate oznaku koja će prikazati tekst kao italic, prvo treba da je otvorite pomoću oznake <i>. Posle toga možete da dodate oznaku za zatvaranje, ili tekst koji treba da bude formatiran na taj način. Oznaka za zatvaranje je ista kao i oznaka za otvaranje, s tom razlikom što joj prethodi kosa crta (/). Tako bi oznaka za zatvaranje oznake italic bila </i>. Slika Primer korišćenja oznake italic HTML atributi Atributi HTML-a su karakteristike objekata koje možete da podešavate. 435

20 Visoka poslovna škola strukovnih studija, Novi Sad Slika Atributi se uvek stavljaju izmeñu oznaka za otvaranje i zatvaranje Atributi u prethodnom tekstu su boja (colour) i font (face). FrontPage piše ove oznake dok kreirate i ureñujete dokument. Ako želite da pogledate kako se HTML odreñenog dokumenta menja tokom rada, onda u toku rada povremeno kliknite karticu HTML u donjem levom uglu prozora Dodavanje i formatiranje teksta Tekst predstavlja pisani sadržaj web sajta, uključujući i zaglavlja, telo teksta, fusnote i sl.tekst se dodaje jednostavnim klikom u dokument i otkucavanjem željenih reči. Tekst možete da dodajete, brišete i radite sa njim sve ostalo što možete da radite u klasičnim programima za obradu teksta. Font podrazumeva skup karaktera istog izgleda, stila, i debljine slova. Izgled se odnosi na oblik slova, a font predstavljaju svi karakteri koji postoje u odreñenom konkretnom stilu. Promena fontova Promena fontova se vrši na paleti Formatting, klikom na strelicu sa desne strane padajuće liste Format. Promena veličine fonta Slika Promena fontova Postoje dva načina za promenu veličine fonta za neki deo teksta: pomoću padajuće liste Font Size i pomoću ikona Increase Font Size 436

21 (A) i Decrease Font Size (A). Metod ikone je dobar za brzo povećanje i smanjenje veličine fonta, ali samo za 1 point. Promena boje fonta Boja fonta se može promeniti pomoću ikone Font Color. Iz padajuće liste se mogu izabrati neke od standardnih ili korisničkih boja. Na dnu menija se nalazi opcija More Colors sa novim bojama koje se mogu upotrebiti. Ona sadrži opciju Custom koja otvara prozor Custom Color u kome se može izabrati boja klikom u polje sa bojama. Umetanje preloma reda Ako u FrontPageu dva puta uzastopno pritisnete ENTER, možete da kucate ponovo posle preskočenog reda. Ovo se naziva hard return (čvrsti prekid). Za razliku od toga, možete i da dodate prelom reda tako da naredni red teksta počinje vrlo blizu prethodnog. Ovo je poznato pod imenom soft return (mekani prekid) i radi se kada pritisnete kombinaciju tastera SHIFT-ENTER. Prozor Font U prozoru Font nalaze se naprednije opcije za upotrebu fontova. Tu se nalazi kartica Font, koja omogućava da podešavate font, i kartica Character Spacing, koja omogućava da podešavate razmak izmeñu karaktera i poravnanje teksta. Do prozora Font možete doći ako izaberete Format Font. Slika Prozor Font 437

22 Visoka poslovna škola strukovnih studija, Novi Sad Hiperlinkovi Hiperlinkovi su linkovi koji vode sa strane na stranu i sa sajta na sajt. Ako ne bi bilo hiperlinkova, za svaku stranu bi smo morali ručno unositi Uniform Resource Locator (URL). Kada kliknete hiperlink, on šalje poruku do web servera i zahteva od njega da pretraživaču pošalje dodatnu stranu i datoteke. Hiperlinkovi se mogu primeniti i na druge elemente osim teksta, kao što su video, slike, tabele i sl. Povezivanje sa drugim stranama pomoću hiperlinka Povezivanje se vrši tako što izaberemo ono što želimo da nam bude hiperlink (tekst, video, slika, tabela...), a zatim pokrenemo prozor Insert Hyperlink. Ovo možete da uradite na jedan od sledeća dva načina: 1.Desnim tasterom miša kliknite izabrane reči i izaberite komandu Hyperlink 2. Sa palete Standard izaberite ikonu Insert Hyperlink. Otvoriće se prozor Insert Hyperlink: Slika Opcija Hyperlink U prozoru Insert Hyperlink, u glavnom meniju, možete izabrati hiperlink, ili u polju Address na dnu prozora, možete otkucati adresu. Stavka na strani obojena plavom bojom ukazuje na to da je tekst aktiviran link koji može da se izabere. 438

23 Pomoću komande Preview možete pogledati kako radi hiperlink, ali tada nećete moći da menjate stranu ili da dodajete nešto na nju. Slika Komanda Preview Povezivanje sa novim prozorom pomoću hiperlinka Povezivanje sa novim prozorom se vrši tako što u prozoru Insert Hyperlink unesemo ime ili potražimo željenu datoteku i pre nego što izaberemo OK, kliknemo dugme Target Frame koje se nalazi sa desne strane prozora. U prozoru Target Frame, u polju Common targets, izaberemo New Window. Povezivanje sa adresom pomoću hiperlinka Povezivanje sa adresom se vrši tako što u prozoru Insert Hyperlink izaberemo opciju Adress iz liste Link to list sa leve strane prozora. U polje address možemo otkucati adresu, a u polju Subject zaglavlje poruke. Hiperlink na oznaku Kreiranje hiperlinka na drugi deo istog dokumenta, tzv. oznaku (bookmark) sastoji se iz dva dela. Prvo se kreira oznaka tog drugog mesta, a onda se kreira link koji vodi do te oznake. Oznaku možemo kreirati tako što ćemo izabrati Insert Bookmark U polje Bookmark name unećemo ime. U tekstu će se pojaviti znak koji predstavlja tu oznku. Kada se prikaže strana, oznaka se neće pojaviti. Slika Oznaka Bookmark Link kreiramo tako što izaberemo tekst i pokrenemo prozor Insert Hyperlink. U prozoru Insert Hyperlink izaberemo opciju Place in This Document., a zatim u polju Select a place in this document izaberemo željenu oznaku. 439

24 Visoka poslovna škola strukovnih studija, Novi Sad Saveti na ekranu Slika Opcija Insert Hyperlink Kada iznad hiperlinka postavite pokazivač miša, može se prikazati mali pravougaonik sa dodatnim informacijama koje se odnose na hiperlink iznad kojeg se pokazivač nalazi. Ovaj mali prozor i njegov sadržaj se nazivaju savetima na ekranu (screen tips). Saveti na ekranu se mogu pisti i menjati u prozoru Set Hyperlink ScreenTip u polju ScreenTip text. Do tog prozora možemo doći, ako u prozoru Insert Hyperlink izaberemo dugme ScreenTip. Kreiranje novih dokumenata Slika Saveti na ekranu Za kreiranje hiperlinka na stranu koja još nije kreirana upotrebljava se komanda Create New Document koja se nalazi u prozoru Insert Hyperlink. 440

25 Slika Komunikacioni prozor Insert Hyperlink Ime dokumenta se kuca u polju Name of new document. Ako želimo da kasnije otvorimo novi dokument, možemo izabrati opciju Edit the new document later, a ako želimo da otvorimo novi dokument odmah posle kreiranja, možemo izabrati opciju Edit the new document now. Povezivanje preko hiperlinka sa drugim web stranama Da bi ste postavili hiperlink na drugu web stranu na World Wide Webu, u gornjem desnom uglu prozora Insert Hyperlink kliknite ikonu Browse the Web. Slika Opcija Browse the Web Time ćete pokrenuti svoj pretraživač i u njemu pronaći stranu na koju želite da postavite link. Adresa koju ste izabrali biće automatski dodata u polje Address prozora Insert Hyperlink

26 Visoka poslovna škola strukovnih studija, Novi Sad Upotreba slika na web stranama Sa pojavom prvih pretraživača (browsera) koji su mogli da prikazuju i grafiku, World Wide Web više nije bio isti. Prelaz sa web sajtova zasnovanih samo na tekstu na web sajtove sa slikama osnovni je faktor u rastu popularnosti Interneta. FrontPage ne samo da podržava umetanje slika u dokumente, već omogućava i jednostavno ureñivanje tih slika. Umetanje i modifikacija slika Slike se u dokument mogu ubaciti pomoću ikone Insert Picture From File koja se nalazi na paleti Standard. Iako FrontPage nije tako moćan kao glavni softverski paket za ureñivanje slika, on ima neke alate koji se lako koriste. Ureñivanje slika vrši se preko palete Pictures koju možemo prikazati ako izaberemo View Toolbars Pictures. Umetanje i modifikacija slika kao pozadine Slike se mogu ubaciti kao pozadina ako desnim tasterom miša kliknemo negde na strani i izaberemo komandu Page Properties. Otvoriće se prozor Page Properties. Na kartici Background trebamo potvrditi polje Background picture i kliknuti dugme Browse sa desne strane praznog polja. Slika Opcija Page Properties 442

27 Slike u pozadini kao vodeni žigovi Vodeni žig se od neke slike pravi tako da ne može da se mejna pozicija te slike, čak i kada se krećete kroz stranu. Kada se strana pokreće, i slika se kreće zajedno sa njom. Osim ako je u pitanju neki obrazac koji se ponavlja u pozadini ili ako je slika zaista velika, slika u pozadini se ponavlja. Na mestima na kojima se slika ponavlja često dolazi do pojave linije koja jasno označava mesto gde se jedna slika završava, a druga počinje. Ta linija često narušava izgled strane i može se izbeći ako sliku u pozadini zadate kao vodeni žig. To nam omogućava polje Watermark koje se nalazi na kartici Background prozora Page Properties. Umetanje boje pozadine Boja se umesto slike kao pozadine ubacuje pomoću padajuće liste Background u kojoj možemo izabrati boju koju želimo. Ova lista se nalazi u delu Colors kartice Background koja se nalazi u prozoru Page Properties. Upotreba clip art sličica FrontPage nudi neke besplatne slike koje nazivamo clip art. Ove slike mogu da variraju od jednostavnih linija i strelica, do crteža hrane, životinja, simbola itd. Njih možemo ubaciti ako sa linije menija izaberemo opciju Insert Picture Clip Art. Na dnu panoa Clip Art, u odeljku See also, postoji komanda Clip Organizer. Ako želite da pretražite clip art slike, u polju Search otkucajte neku reč. Posle toga kliknite dugme Search, a Clip Organizer će prikazati slike koje odgovaraju uslovu pretraživanja Crtanje i upotreba multimedije Pojavom web tehnologije Vector Markup Language (VML), programeri su bili u stanju da direktno crtaju linije i oblike korišćenjem matematičkih konverzija u HTML kodu. Uvedena je i podrška za slike i datoteke koje se automatski kreiraju i pamte. FrontPage omogućava da crtate linije i oblike, a da pri tome ne morate da poznajete VML. Pošto je VML deo HTML koda, FrontPage piše sav potreban VML kod u pozadini linija i oblika koje crtate. Najbolje od svega je što FrontPage omogućava da crtate trodimenzionalne oblike sa brojnim prilagoñavanjima. 443

28 Visoka poslovna škola strukovnih studija, Novi Sad Za crtanje se koristi paleta Drawing koju ćete prikazati ako izaberete View Toolbars Drawing. Upotreba zvuka Postavljanje zvuka na sajt može imati i svoje prednosti, ali i svoje mane. Kratki zvučni zapisi mogu zabaviti posetioce, mada u većini slučajeva ovo treba pažljivo koristiti. Nedostaci upotrebe zvuka su: povećava se vreme učitavanja stane; posetioci mogu da reše da ne čitaju informacije koje se nalaze na sajtu; neki zvuci se možda neće dobro reprodukovati na računaru posetilaca Ako želite da na svoj sajt postavite zvuk desnim tasterom miša izaberite prazan deo strane i izaberite komandu General. Na kartici General u oblasti označenoj kao Background sound, nalazi se dugme Browse pomoću koga možete naći datoteku koju želite da ubacite. Slika Background sound Za muziku u pozadini mogu se koristiti bilo koji zvučni formati. Najviše se koriste Audio Interchange File Format (AIFF), Wave (WAV), Musical Instrument Digital Interface (MIDI), MPEG Audio Layer-3 (MP3) itd. Za zvuk u pozadini preporučuju se MIDI datoteke zbog manje veličine. Razlika izmeñu zvuka u pozadini i regularnog zvuka je u tome što zvuk u pozadini nemožete da kontrolišete. Po podrazumevanom podešavanju, FrontPage ostavlja muziku da svira sve dok posetioci ne napuste stranu. Ako želite da podesite broj koliko puta muzika treba da se izvede, deselektujte polje Forever u delu Background sound i u polju Loop koje se nalazi sa leve strane polja Forever unesite broj koji odreñuje koliko puta muzika treba da se ponavlja. Upotreba videa Kako raste broj korisnika Interneta, sve veći broj sajtova koristi video za privlačenje i informisanje posetilaca. Front page omogućava da na 444

29 stranama koristite video, a da ne morate da koristite neki drugi program. Ako želite da ubacite video stranu, sa palete Standard izaberite Insert Picture Video. Možete da podesite koliko dugo video treba da se prikazuje. Po standardnom podešavanju, video se prikazuje automatski kada se strana prikaže u pretraživaču i prikazuje se samo jednom. Ako želite da promenite broj prikazivanja tako da se video prikazuje kada se iznadnjega postavi miš desnim tasterom miša kliknite video i iz pomoćnog menija izaberite Picture Properties. Iz prozora Picture Properties izaberite opciju On mouse over koja se nalazi u oblasti Start. Kao što se može podešavati broj reprodukovanja zvuka, tako se može podesiti i broj prikazivanja videa. To se radi u prozoru Picture Properties u delu pod nazivom Repeat. U tom delu postoji polje Loop. Ovo polje odreñuje broj koliko puta će se prikazati video. Polje Loop delay odreñuje broj milisekundi izmeñu ponavljanja videa. Upotreba tabela Slika Prozor Picture Properties Problem sa kojim se većina web programera suočavala u ranijim verzijama HTML-a jesu teškoće u organizovanju sadržaja njihovih strana. Kombinovanje teksta, slika i drugih objekata u istom redu bilo je vrlo teško izvesti. Pojava tabela u HTML-u dala je programerima više kontrole nad postavljanjem sadržaja na stranama. FrontPage omogućava da intenzivno koristite tabele, a daje i punu kontrolu nad atributima tabela, kao što su boja i stil. Takoñe postoji mogućnost da ureñujete i pojedine delove (ćelije) tabele. Paleta Tables omogućava da brzo i lako pristupite svim glavnim funkcijama vezanim za tabele. Paleti Tables možete da pristupite ako izaberete View Toolbars Tables. 445

30 Visoka poslovna škola strukovnih studija, Novi Sad Upotreba frejmova Frejmovi omogućavaju kreiranje linkova koji ažuriraju delove strane, dok preostali delovi ostaju nepromenjeni. Oni omogućavaju da u istom prozoru u istom trenutku vidite dve HTML strane ili više njih. Sa frejmovima, kada kliknete link, učitava se samo deo strane. Skup frejmova (frameset) jeste skup nekoliko HTML strana koje su u pretraživaču prikazane u istom trenutku. Kada pogledate sajt sa frejmovima, ne vidite stranu skupa frejmova. Ona sadrži samo HTML kod. ono što vidite su strane koje se nalaze u tom skupu frejmova. Kreiranje frejmova U FrontPageu otvorite novi dokument. Frejmove možete kreirati ako izaberete File New Page or Web. Tada će se sa desne strane prozora pojaviti pano Task. U njemu izaberite komandu za Page Templates. Otvoriće se istoimeni prozor. Na vrhu ovog prozora izaberite karticu Frame Pages. Slika Page Templates Možete izabrati bilo kojih od šablona u kartici Frame Pages.i u prikazu Preview videti kako vaša strana može da izgleda. Nakon toga kliknite OK. Svaki od frejmova sadrži dva dugmeta: Set Initial Page (otvara se prozor Insert Hyperlink u kome možete pronaći datoteku koju želite 446

31 da postavite u frejm) i New Page (prikazuju se frejmovi sa belom pozadinom). Ako želite, možete da obrišete ili spojite frejmove izborom opcije Frame / Split Frame ili Delete Frame iz menija. Formatiranje frejmova FrontPage omogućava modifikaciju karakteristika frejmova, od podešavanja granica do podešavanja margina. To se radi u prozoru Frame Properties do koga možemo doći ako desnim tasterom miša kliknemo u željeni frejm. Slika Formatiranje frejmova Sledi lista opcija koje postoje u prozoru Frame Properties, zajedno sa kratkim opisom njihovih funkcija: Name Ime koje FrontPage daje frejmu. Možete da promenite ime, ali treba da znate to novo ime kaa pravite hiperlink. Initial page Ime datoteke koju trenutno gledate. Column width Frejmovi mogu da sadrže kolone. U frejmovima, kolona je vertikalni frejm koji ide do dna strane. Na ovom mestu možete da podešavate širinu kolone frejmova. Height U ovom polju možete da otkucate broj koji odreñuje koliko frejm treba da bude visok. Vrednost možete da unesete u pikselima, u procentima ili možete da unesete relativnu vrednost. Relativna vrednost je broj koji menja 447

32 Visoka poslovna škola strukovnih studija, Novi Sad veličinu frejma u relaciji sa drugim frejmovima koji se trenutno nalaze u skupu frejmova. Width To je horizontalno rastojanje koje odvaja sadržaj frejma od granice HTML strane. Height To je vertiklno rastojanje koje odvaja informacije u frejmu od granica HTML strane. Resizable in browser Kada je ovo polje potvrñeno, posetioci mogu da menjaju veličinu svakog frejma. Preporučuje se da ovo polje ne bude potvrñeno, jer u slučaju da posetilac menja veličinu frejma, može da se desi da se poremeti opšti izgled sajta. Show scrollbars U ovom meniju možete da odlučite da li želite ili neželite da se prikazuju klizači. Generalno, za gornje frejmove, koji mogu da sadrže malo informacija, ova vrednost bi trebalo da bude podešena na Never. Za frejmove koji imaju dosta sadržaja trebalo bi da se koristi ili Needed ili Always. Ne podržavaju svi pretraživači upotrebu frejmova. Ako na sajtu koristite frejmove, a posetilac koristi pretraživač koji ih ne podržava, njemu će e prikazati poruka da ta strana ne može da se prikaže u pretraživaču. Ako želite da sami definišete poruku koja se prikazuje, kliknite komandu No Frames na dnu prozora. Ureñivanje strana sa frejmovima Iako se strane koje se nalaze u frejmu prikazuju u FrontPageu u istom tranutku, ipak svaka od njih može posebno da se ureñuje. Na te strane možete da dodajete tekst, ubacujete slike, tabele i možete da radite na njima sve drugo što možete i na običnoj HTML strani. Deoba i brisanje frejmova Ponekad će te poželeti da, posle kreiranja frejmova, podelite ili izbrišete neki frejm. Ako želite da podelite frejm na dva nivoa, izaberite željeni frejm, a zatim izaberite Frames Split frame. U prozoru Split Frame koji se otvara, možete da izaberete da li frejm treba da se deli u kolone ili redove, a takoñe možete da definišete da li želite da kreirate novu stranu ili da podesite inicijalnu stranu. Procedura za brisanje frejma slična je proceduri za deobu frejmova. Izaberite frejm koji cželite da bude obrisan, tako što će te ga kliknuti levim tasterom miša. Posle toga izaberite Frames Delete Frame. Tada će izabrani frejm biti obrisan. 448

33 Povezivanje frejmova hiperlinkom Najbolji deo u korišćenju frejmova je to što delovi strane mogu da ostanu statički dok se ostali delovi menjaju. Ako želite da dodate hiperlink za neki frejm izaberite željene reči i kliknite ikonu Insert Hyperlink na paleti Standard. U prozoru Edit Hyperlink koji se otvara otkucajte ime datoteke sa kojom želite da se povežete, a zatim kliknite dugme Target Frame. Otvoriće se prozor Target Frame. Slika Target Frame U prozoru Target Frame videćete grafičku prezentaciju trenutnog skupa frejmova. Ovo je dato u oblasti Current frames. Kada izaberete željeni frejm, ta oblast će biti obojena plavom bojom, a u polju Target setting pojaviće se ime tog frejma. Inline frejmovi Inline frejmovi su kao i obični frejmovi, osim što se mogu postaviti bilo gde na web sajtu. Za razliku od običnih frejmova koji zauzimaju ceo red ili celu kolonu na ekranu, inline frejmovi zauzimaju vrlo malo prostora čak mogu da se postave u tabele. Njih možemo da kreiramo ako izaberemo Insert Inline Frame sa linije menija Kreiranje lista Za prikazivanje informacija na organizovan način, sa odreñenom strukturom, najviše se koriste liste. Liste su važan element za privlačenje pažnje posetilaca. Iako tabele omogućavaju da lakše 449

34 Visoka poslovna škola strukovnih studija, Novi Sad organizujete informacije, liste su korisne za isticanje manjih delova informacija. FrontPage omogućava da lako kreirate i formatirate liste. U njemu možete da kreirate tri tipa liste: ureñene liste, liste sa oznakama, liste koje mogu da se zatvaraju. Ikone koje se koriste za rad sa listama nalaze se na paleti Formatting. To su ikone: Numbering (kreira se lista u kojoj su stavke označene brojevima), Bullets (Kreira se lista sa oznakama), Decrease Indent (Smanjuje se uvlačenje liste), Increase Indent (Povećeva se uvlačenje liste). Ureñene liste su organizovane na hijerarhijski način, odnosno one prate neki obrazac, pri čemu se koriste brojevi ili slova Modifikacija i postavljanje preko mreže Kada se u FrontPageu kreira nova HTML strana, postoje izvesne karakteristike koje se dodaju automatski, ali postoje i osobine koje se mogu i promeniti. Dodavanje naslova Naslov neke strane jeste tekst koji se prikazuje na vrhu prozora pretraživača. Većina web sajtova koji se posećuju na Internetu ima naslove koji omogućavaju da se brzo shvati na šta se sajt odnosi. Naslov obično sadrži ime sajta, slogan itd. Naslov možemo dodati ako desnim tasterom miša kliknemo u dokument i iz pomoćnog menija izaberemo komandu Page Properties. U prozoru Page Properties, u polju Title možemo otkucati naslov. Podešavanje boje hiperlinka Kada se dodaje hiperlink na neki tekst, koristi se podrazumevana boja (plava). Podrazumevana boja linka koji je već upotrebljen je purpurna, a podrazumevana boja aktivnog linka je crvena. Postoji mogućnost podešavanja boje hiperlinka. Ovo može da se uradi preko menija za podešavanje fontova na paleti Formatting, ali se tu ne može promeniti boja za aktivan hiperlink i onaj okji je već posećen. Boja linka se menja uz pomoć prozora Page Properties. Ovaj prozor 450

35 sadrži karticu Background u kojoj se nalaze tri padajuća menija sa bojama: Hyperlink (podešava se boja hiperlinka na strani), Visited Hyperlink (podešava se boja hiperlinka koji je već iskorišćen) i Active Hyperlink (Podešava se boja hiperlinka koji je već izabran ili aktivan). Publikovanje sajta Da bi ljudi širom sveta mogli da posete sajt, taj sajt mora da ima postavljene datoteke na web server. Web server je računar koji je povezan sa Internetom. Web domaćin (host) jeste preduzeće ili pojedinac kome se plaća da održava web server. Web host ne mora da bude lociran negde blizu. Većina ažuriranja se može uraditi preko Interneta, tako da server može da bude lociran bilo gde. Postavljanje sajta na web server Sajt možemo postaviti na web server ako otvorimo FrontPage Web, a potom izaberemo File Publish Web. Tada će se otvoriti prozor Publish Destination. U polje Enter publish destination unosi se adresa web servera. Adresa web servera je ime domena ili jedinstvena adresa domaćina. Slika Postavljanje sajta na Server - Publish Zatim će se zatražiti da se unese korisničko ime i lozinka u polje Enter Network Password, zbog provere dozvole rada na web serveru. Kada se korisničko ime i lozinka prihvate, otvoriće se prozor Publish Web. U ovom prozoru se nalaze sve datoteke koje sadrži FrontPage Web, a koje treba da se publikuju. Klikom na dugme Publish završava se prebacivanje datoteka. Prikazaće se linija progresa na kojoj se može pratit napredak prebacivanja. Pošto su sve datoteke prebačene na novu lokaciju pojaviće se prozor sa potvrdom. 451

36 Visoka poslovna škola strukovnih studija, Novi Sad Promena opcija publikovanja U prozoru Publish Web nalazi se dugme Options koje aktivira prozor Options. U tom prozoru se nalazi kartica Publish u kojoj se nalaze opcije vezane za promenu opcija publikovanja. U narednoj listi su opisane opcije koje se nalaze u kartici Publish prozora Options: Changed pages only Ako je ova opcija potvrñena, onda će se publikovati samo one strane sa diska koje su promenjene do poslednjeg publikovanja. All Pages, Overwriting pages already on destination Kada je ova opcija potvrñena, prebacuju se sve datoteke, bez obzira na to da li su menjane od poslednjeg publikovanja ili ne. Determine changes by comparing source and destination webs Ako je ova opcija potvrñena, uporeñuju se datoteke na disku i na serveru. Use source file timestamps to determine changes since last publish Ako je ova opcija izabrana, proveravaju se promene na osnovu vremena kada je računar zapisivao datoteku. Ovo vreme se menja svaki put kada se datoteka menja. Ako je to vreme na disku isto kao vreme na serveru, onda ta datoteka ne treba da se ažurira. Ako je vreme različito, onda se datoteka prebacuje. Lag changes during publish Kada se menjaju datoteke i direktorijumi ili se postavljaju na server, korisničko ime, vreme pristupa i ostale informacije čuvaju se u datoteci. Ovo polje se odnosi na uključivanje i isključivanje zapisivanja informacija kada se datoteka publikuje. Upotreba prikaza Reports FrontPage ima nekoliko načina da pomogne u upravljanju i održavanju sajta. Prikaz Reports nudi važne informacije u vezi sa upotrebom prostora, hiperlink datotekama itd. Ako želimo pristupiti izveštaju za svoj sajt, trebamo izabrati View Reports Site Summary ili izabrati paletu Reporting izborom komande View Toolbars Reporting. U zavisnosti od toga koliko datoteka ima na serveru, proces može potrajati nekoliko sekundi ili nekoliko minuta. Ako izaberemo stavku All files, otvara se prikaz All Files u kome su prikazane datoteke koje se trenutno nalaze u FrontPage Webu. 452

37 Prikaz Unlinked Files vrlo je sličan prikazu All Files, osim što se u njemu prikazuju samo one datoteke koje nisu povezane linkom sa drugim stranama. FrontPage ne koristi datoteke koje se prikazuju u ovom prikazu, i one verovatno samo nepotrebno zauzimaju prostor na disku Prikaz Slow Pages prikazuje detaljnu listu strana i datoteka koje se duže prebacuju. Ovi podaci se odose na standardnu vezu od 28,8K. Vreme prebacivanja ne samo da se odnosi na aktuelnu HTML stranu, već se odnosi i na datoteke za podršku, kao što su slike, zvuk, animacije i sve drugo što treba da se prebaci radi prikazivanja na strani Datoteke se u FrontPageu smatzraju starim ako su kreirane i nisu menjane više od 72 dana. Prikaz Older Files je koristan da bi se videlo da li treba da se ažuriraju ili modifikuju neke informacije. Prikaz Recently Added Files obezbeñuje Centralnu lokaciju sa koje se mogu videti sve datoteke koje su u skorije vreme ubačene na FrontPage Web.Ovde su prikazane datoteke koje su kreirane u poslednjih 30 dana. U prikazu Hyperlinks su dati svi hiperlinkovi koji trenutno postoje na webu, kao i lokacije na kojima se nalaze datoteke sa hiperlinkovima. FrontPage prepoznaje hiperlinkove preko hiperlinkova koji se nalaze na strani. Ponekad se dešava da se doda hiperlink na datoteke ili objekte koje FrontPage ne može da prepozna. Ovo se dešava kada hiperlink vodi na strane koje se dinamiči kreiraju, strane koje se ne neleze na sajtu, ili strane na kojima su potrebne dodatne informacije da bi hiperlink mogao da radi. Kada FrontPage ne može da prepozna hiperlink, te adrese se prikazuju u prikazu Unverified Hyperlinks. Prekinuti hiperlinkovi (Broken Hyperlinks) su hiperlinkovi za koje je FrontPage utvrdio da vode na strane koje više ne postoje. To mogu biti linkovi na slike koje više ne postoje, skriptove koji više ne rade, na druge HTML strane itd. FrontPage često automatski menja hiperlinkove tako da se ažurira lokacija na koju on vodi. Prikaz External Hyperlinks daje informacije o hiperlinkovima koji vode na datoteke koje su izvan FronPage Weba. Prikaz Internal Hyperlinks daje informacije o hiperlinkovima koji vode na datoteke koje se nalaze u FrontPage Webu. 453

38 Visoka poslovna škola strukovnih studija, Novi Sad U prikazu Component Errors daju se informacije o stranama sa greškama u odnosu na komponente FrontPagea. Komponente FrontPagea su mali programi koji automatizuju dosadne poslove koji postoje na sajtu. U FrontPageu postoji mogućnost dodeljivanja poslova nekim osobama. Ovaj timski rad je vrlo koristan kada postoji mnogo promena i ažuriranja. U prikazu Uncompleted Tasks može se proveriti da li je zadatak koji je nekome dodeljen završen ili nije. Teme predstavljaju skup unapred definisanih boja i stilova koji se mogu koristiti za poboljšanje izgleda web strana. U prikazu Unused Themes postoji mogućnost brisanja tema koje se ne koriste. Upotreba prikaza Navigation Ovaj alat se može koristiti prilikom planiranja i organizovanja strane. On je koristan prilikom kreiranja elemenata za navigaciju, kao što su linije linkova i slično Upotreba formi Forme omogućavaju posetiocu web sajta da sa Vama komunicira direktno preko pretraživača. Forma je oblast strane na kojoj su sakupljeni elementi forme, kao što su polja za pšotvrdu, dugmad itd., koji prikupljaju i šalju informacije. FrontPage koristi HTML za prosleñivanje informacija sa forme. Ove informacije se šalju na zadatu lokaciju. Informacije koje se šalju preko forme mogu biti poslate preko elektronske pošte, zapisane u datoteci, stavljene u bazu podataka itd. Forme mogu da se podešavaju. Može se podesiti raspored polja na formi, boje, stilovi fonta, tipovi podataka itd. Sve opcije za upotrebu formi koje ima FrontPage nalaze se u podmeniju Form. Ovom podmeniju možete da pristupite ako izaberete Insert Form. U narednoj tabeli data je lista ikona koje postoje u ovom podmeniju, zajedno sa njihovim imenima i funkcijom. Ikona Ime Funkcija Form Ubacuje se forma. List Form Ubacuje se forma sa listom. 454

39 List Field Textbox Text Area File Upload Checkbox Option Button Group Box Drop-Down Box Push Button Advanced Button Picture Label Form Properties Ubacuje se lista. Ubacuje se polje za unos teksta. Ubacuje se polje za unos teksta sa klizačima. Obezbeñuje se metod da posetioci mogu da Vam pošalju datoteke. Kreira se polje za potvrdu. Kreira se radio-dugme. Metod za grupisanje elemenata na formi. Padajuća lista. Kreira se dugme. Formatira se dugme. Dugme se zamenjuje slikom. Definiše se oznaka koja može da se koristi za pristup formi preko HTML-a ili nekih drugih web tehnologija, kao što su JavaScript, CGI itd. Menjaju se osobine forme. Tabela Ikone podmenija Form Animacija sajta Kada se pojavio HTML (Hipertext Markup Language), bilo je vrlo malo jezičkih struktura koje su podržavale specijalne efekte kao što su animacuja, tranzicija itd. Sa razvojem HTML-a pojavio se i podskup HTML-a, tzv. dinamički HTML (DHTML). Jedan od važnih elemenata DHTML-a bila je podrška za animaciju različitih elemenata na strani, kao što su tekst, tabele i dugmad. U FrontPageu se mogu animirati elementi strane, dodavati prelazi strana, kreirati lebdeća (hover) dugmad, kreirati efekat marquee itd. Najbolje od svega je što se pomoću miša može prikazati cela animacija, a da pri tome ne mora da se piše nikakav kod. Za animaciju u FrontPageu koristi se paleta DHTML Effetcts. Njoj možemo pristupiti ako izaberemo View Toolbars DHTML Effects. 455

40 Visoka poslovna škola strukovnih studija, Novi Sad Upotrebom palete DHTML Effects i izborom komande Insert Web Component omogućava se animiranje objekata prilikom učitavanja strane, animacija objekata kao odgovor na pokazivač miša, formatiranje teksta prilikom animacije, kreiranje prelaza strana (to su kratke animacije koje prate prelaz sa jedne strane na drugu), kreiranje lebdeće dugmadi (ovo su mali Java apleti koje kreira FrontPage. kada korisnik pomera pokazivač miša iznad ovakvog dugmeta, ono menja boju, pušta neki zvuk ili čak pokazuje neku sliku), definisanje efekta marquee (tekst se kreće u jednom ili oba smera po horizontali) Upotreba Web komponenata FrontPage-a Upotreba FrontPageovog skupa softverskih alata koji se nazivaju web komponentama se vrši da bi sajt bio interaktivan. Ove komponente mogu pomoći za kreiranje forma za pretraživanje, za brojanje poseta, linija za navigaciju itd. Web komponentama FrontPagea pristupa se preko menija izborom Insert Web Component. Tada će se otvoriti prozor Web Component. U narednoj tabeli data je lista svih ikona koje postoje u ovom prozoru, zajedno sa njihovim imenima i funkcijama. Ikona Ime Funkcija komponente Dynamic Effects Dodaje se lebdeće dugme, efekat marquee ili baner. Web Search Posetiocima se pruža mogućnost da pretražuju sajt. Spreadsheets Ugrañuju se dijagrami ili radni listovi. and Charts Hit Counter Prati se broj poseta na sajtu. Photo Gallery Kreira se foto-galerija sa nekoliko šablona. Included Content Ubacuje se i prilagoñava sadržaj sa drugih strana. Link Bars Kreiraju se linkovi za navigaciju koji su prilagoñeni sajtu. Table of Kreira se tabela sa sadržajem. Contents Top 10 List Kreira se lista sa korisnim informacijama, kao što su posećene strane, domeni, pretraživači itd. 456

41 bcentral Web Components Expedia Components MSN Components MSNBC Components Advanced Controls Promoviše se sajt na Microsoftovom sajtu bcentral. Posetiocima se pruža mapa za Expediu. Omogućava se posetiocima da pretražuju Web i primaju povratne informacije direktno sa Microsoft Network mreže (MSN). Daje se lista koja se automatski ažurira preko informacija sa MSNBC-a. Dodaju se ili menjaju HTML, Java apleti, Active X kontrole itd. Tabela FrontPage Web komponente Upotreba tema i šablona TemeTeme FrontPagea su skup stilova koji se mogu koristiti radi oživljavanja web sajta. One omogućavaju da i oni koji nisu umetnički nastrojeni za kratko vreme kreiraju sjajan sajt. Teme se mogu primeniti na web strani ako se izabere Format Theme. Tada se otvara prozor Themes. Slika Themes U prozoru Themes postoje brojne opcije koje se mogu iskoristiti za podešavanje teme. Sledi lista sa kratkim opisom svake opcije koja postoji u ovom prozoru: 457

42 Visoka poslovna škola strukovnih studija, Novi Sad All pages Tekuća tema se primenjuje na sve strane iz FrontPage Weba. Selected Page(s) Tekuća tema se primenjuje na sve strane koje su otvorene ili izabrane u FrontPageu. Vivid colors Umesto boja teme, koriste se življe, jasnije boje. Active graphics Omogućavaju se mali efekti animacije kao što je okretanje slike. Background picture Na tekuću temu se primenjuje slika u pozadini. Apply using CSS Omogućava se upotreba kaskadnih stilova (CSS), koji se primenjuju na boje i grafičku šemu teme. Ako ovo polje nije potvrñeno, primećuju se izvesne promene na temi, pošto su teme urañene pomoću ovih stilova. Modifikacija elemenata teme FrontPage ima različite unapred podešene teme. Tema jednostavno predstavlja skup boja, grafike i teksta, koji se mogu menjati vrlo lako u nekoliko koraka. Modifikacija boja U prozoru Themes postoji dugme Modify. Klikom na ovo dugme pojaviće se dugme Colors pomoću koga dolazimo do prozora Modify Theme. Slika Modifikacija tema 458

43 Kartica Color Schemes služi za podešavanje boja u tekućoj temi. Kartica Color Wheel omogućava korišćenje točka boja. Kartica Custom omogućava da se umesto boje cele teme menja samo boja pojedinih elemenata. To su, na primer, tekst, naslovi, tekst banera itd. Modifikacija grafike U okviru tema, na stranu se postavljaju različite slike i mali grafički elementi. Stavke kojima su označene liste takoñe su mali grafički elementi. Kada se na baner primeni tema, takoñe se koristi grafika. Klikom na dugme Modify takoñe se pojavljuje i dugme Graphic. Klikom na ovo dugme dolazi se do prozora Modify Theme. Na vrhu prozora Modify Theme nalazi se padajuća lista. Svaki element koji u temi koristi grafiku nalazi se u toj listi i pomoću nje može da se ureñuje. Modifikacija teksta Kao što se mogu menjati boje i grafika teme, može se menjati i tekst. Klikom na dugme modifaj pojaviće se i treće dugme, Text, koji omogućava promenu karakteristika teksta. Kniga utisaka Knjiga utisaka omogućava posetiocima da na web sajtu ostave svoje komentare. Kada se ostave informacije u knjizi utisaka, one se prikazuju na odgovarajućoj strani. Pitanja i komentari posetilaca će se prikazati svakome ko poseti sajt i želi da ih vidi. Da bi se kreirala knjiga utisaka treba iz menija izabrati File New New Page or Web. Otvoriće se pano New Page or Web u kome se nalazi komanda Page Templates. Klikom na ovu komandu otvoriće se prozor Page Temlates u kome se nalazi šablon Guest Book. Klikom na ovaj šablon i dugme OK kreira se knjiga utisaka. Komponenta Discussion Web Komponenta Discussion Web (web za diskusiju) vrlo je slična ploči za poruke jer omogućava da šaljete poruke i primate odgovore na njih. Za razliku od knjige utisaka, poslati komentari i odgovori prikazuju se na jedn organizovan način. Najbolje od svega je što FrontPage olakšava kreiranje i održavanje weba za diskusiju. Mogu se obavljati i komplikovani zadaci, kao što je podešavanje forme za pretraživanje, 459

44 Visoka poslovna škola strukovnih studija, Novi Sad omogućavanje registracije korisnika, kreiranje automatskog sadržaja itd. Za razliku od prethodnih alata, FrontPage ima čarobnjaka za kreiranje weba za dikusiju. Do njega možemo doći ako u panou New Page or Web izaberemo komandu Web Site Templates, a u prozoru Web Site Templates šablon Discussion Web Wizard. Tada će se otvoriti prvi prozor čarobnjaka. Discussion Web Wizard nudi niz pitanja i opcija za kreiranje weba za diskusiju. Nakon njihovog podešavanja, klikom na dugme Finish, FrontPage kreira web za diskusiju na osnovu izabranih opcija Plug-inovi, ActiveX kontrole i Java apleti Web sajtovi su danas mnogo interaktivniji nego ranije. Iako HTML i web programski jezici mogu da pruže neke osnovne funkcije za multimediju i interaktivnost, postoje tri tehnologije koje mogu dalje proširiti mogućnosti sajta. To su plug-inovi, ActiveX kontrole i Java apleti. Plug-inovi Plug-in je softver koji prikazuje informacije na web strani. Iako se može koristiti za prikazivanje informacija kao što je tekst, često se upotrebljava za obavljanje poslova kao što su interakcija sa korisnikom, šetnja kroz galeriju virtuelne realnosti, modifikacija boja celularnih telefona itd. Postoje brojni plug-inovi koji se mogu preuzeti besplatno ili uz izvesnu sumu novca. Popularni plug-inovi se odnose na Adobeov Acrobat Reader, RealPlayer, Macromedia Flash i Shockwave player itd. Pošto su plug-inovi posebni delovi softvera, FrontPage ne može direktno da ih ureñuje. On može samo da menja HTML koji poziva plug-in i može da menja one osobine plug-ina koje je autor predvideo da mogu da se menjaju. Ako u prozoru Insert Web Component izaberemo Advanced Controls, a potom komandu Plug-in, klikom na dugme Finish prikazaće se prozor Plug-in Properties. 460

45 Slika Plug in Properties Sledi lista sa različitim poljima i komandama koje postoje u prozoru Plug-in Properties. Tu je i kratak opis svake od opcija. ActiveX Data Source Definiše se datoteka sa plug-inom koji se koristi. Može se zadati i URL adresa te datoteke. Message for browsers without plug-in support Tekst koji se prikazuje ako pretraživač ne podržava plug-inove. Height Definiše se visina plug-ina u pikselima. Width Definiše se širina plug-ina u pikselima. Hide plug-in Omogućava se sakrivanje plug-ina. Kada je sakriven, on se ne vidi u pretraživaču. Ovo polje možete da potvrdite ako prikazujete zvučne datoteke koje ne moraju da se vide. Alinment Definiše se poravnanje plug-ina. Ovo je slično poravnanju teksta. Border thickness Omogućava se definisanje debljine ivice oko plug-ina. Horizontal spacing Omogućava se podešavanje horizontalnog rastojanja izmeñu plug-ina i najbližeg objekta. Ovo je slično vrednosti spacing kod ćelija u tabelama. Vertical spacing Omogućava se unošenje vertikalnog rastojanja od nabližeg objekta koji se nalazi iznad i ispod plug-ina. Ovo je slično vrednosti spacing kod ćelija u tabelama. ActiveX je tehnologija koju je pokrenuo Microsoft i koja se može dodati na web strane da bi se poboljšale mogućnosti HTML-a. Za 461

46 Visoka poslovna škola strukovnih studija, Novi Sad razliku od plug-ina, ActiveX objekti (zovemo ih kontrolama) omogućavaju programerima da ujedine programiranje u Windowsu sa programiranjem na World Wide Web. Mnoge ActiveX kontrole instalira Windows, dok neke instaliraju programi nezavisnih proizvoñača. Datoteke koje imaju ekstenziju.ocx su ActiveX kontrole. Ako u prozoru Insert Web Component izaberemo tip komponente Advanced Controls i iz liste Choose a control izaberemo opciju ActiveX Control, a zatim kliknemo dugme Next, prikazaće se lista ActiveX kontrola koje postoje na sistemu. Pošto ActiveX kontrole nisu kreirane u FrontPageu, one ne mogu direktno da se ureñuju. Iako ActiveX kontrola ne može direktno da se menja, može se menjati HTML koji se odnosi na nju. Ako desnim tasterom miša kliknemo kontrolu i iz pomoćnog menija izaberemo opciju ActiveX Control Properties, otvoriće se istoimeni prozor. Pošto su ActiveX kontrole meñusobno različite, svaka ima svoje jedinstvene osobine, pa će prema tome u ovom prozoru biti manje ili više kartica. Dve kartice koje se javljaju za sve ActiveX kontrole su Object Tag i Parameters. Slika Options Sledi lista polja i komandi koje postoje u kartici Object Tag, zajedno sa kratkim opisom svake od opcija: Name Definiše se ime ActiveX kontrole. 462

47 Alignment Definiše se poravnanje ActiveX kontrole. Ovo je slično poravnanju teksta ili sadržaja ćelije. Border thickness Omogućava se unos vrednosti za debljinu ivice. Ivica će uokviriti kontrolu. Horizontal spacing Omogućava se definisanje horizontalnog rastojanja izmeñu kontrole i najbližeg objekta. Ovo je slično vrednosti spacing za ćelije u tabeli. Vertical spacing Omogućava se podešavanje vertikalnog rastojanja izmeñu kontrole i objekta koji je iznad i ispod nje. Ovo je slično vrednosti spacing za ćelije u tabeli. Width Omogućava se unošenje vrednosti za širinu ActiveX kontrole. Height Omogućava se unošenje vrednosti za visinu kontrole. HTML Omogućava se pisanje poruke za posetioce čiji pretraživači ne podržavaju ActiveX. Ova poruka može biti običan tekst ili HTML oznaka. Code Source Omogućava se dodavanje lokacije za ActiveX kontrolu. Kada posetioci nemaju tu kontrolu, pretraživači kao što je Internet Explorer vode korisnika do lokacije koja je ovde zadata, tako da može da se preuzme i instalira ta kontrola. Java apleti Vrlo popularan programski jezik za kreiranje programskog sadržaja preko Interneta jeste Java. Kreirala ge je firma Sun Microsystems i on je popularan iz dva razloga: može da radi na bilo kom računaru na kome postoji Java virtuelna mašina, i njegov sigurnosni mehanizam sprečava da Java program ošteti računar korisnika. Java programi za svoj rad ne koriste procesor korisnika ili sistemske vrednosti. Kada se izvršava Java program, on na računaru kreira virtuelni prostor u kome se program izvršava. Virtuelni prostor je poznat po imenu virtuelna mašina i svaki računar na kome postoji virtuelna mašina može da izvršava male Java programe, tzv. aplete. Za razliku od plug-inova i ActiveXb kontrola, Java programi su vrlo restriktivni u tome šta može i šta ne može da se radi na računaru. Java programi su manja opasnost po sigurnost računara u odnosu na plug-inove i ActiveX kontrole, jer oni ne mogu da promene bilo koju vrednost koja se odnosi na softver ili hardver računara. Programeri uvek za komplikovane stvari smišljaju interesantne fraze, pa se tako ograničenja koja postoje za Java aplete nazivaju,,java sandbox (Java ograde).ovo se tako naziva jer aplet ne može da ide dalje od 463

48 Visoka poslovna škola strukovnih studija, Novi Sad ograničenja koja mu postavlja virtuelna ograda. Taj ograñeni prostor je, u stvari, virtuelna mašina. Pošto Java aplet ne može da izñe izvan tog prostora, to znači da Java aplet ne može da ošteti sistem. Ubacivanje Java apleta je isto tako jednostavno kao i ubacivanje ActiveX kontrola ili plug-inova. U prozoru Insert Web Component, iz liste sa tipovima komponenata, trebamo izabrati Advanced Controls, a zatim sa desne strane prozora opciju Java Applet Properties. Otvoriće se prozor Java Applet Properties. Slika Java Applet Properties Sledi lista polja koja postoje u prozoru Java Applet Properties, zajedno sa kratkim opisom svakog od njih. Applet source Omogućava se unos imena Java apleta. Većina Java apleta završava se ekstenzijom.class. Applet base URL Omogućava se dodavanje URL na datoteku apleta. Nije potrebno korišćenje radi prikazivanja putanje Java apleta. Ako se npr. Java aplet nalazi u direktorijumu,,classes, onda je potreban unos samo putanje /classes, a ne cele putanje. Message for browsers without Java support Omogućava se unos poruka koje će se prikazati korisnicima čiji pretraživači ne podržavaju Java tehnologiju. Applet Parameters Omogućava se dodavnje, menjanje i brisanje podešavanja Java apleta.parametri Java Apleta definišu šta aplet treba da radi, koje datoteke treba da 464

49 prikazuje itd. Parametri Java apleta mogu biti različiti, u zavisnosti od njegove namene. Horizontal spacing Omogućava se podešavanje horizontalnog rastojanja izmeñu Java apleta i najbližeg objekta. Vertical spacing Omogućava se podešavanje vertikalnog rastojanja izmeñu apleta i najbližeg objekta iznad i ispod plug-ina. Alignment Podešava se poravnanje Java apleta na web strani. Width Definiše se horizontalna veličina apleta. Height Definiše se vertikalna veličina apleta. HTML u FrontPageu Programski jezici za Web Prilikom kreiranja web strana, FrontPage intenzivno koristi HTML. Iako se HTML ne upotrebljava direktno, ipak svaka akcija koja se preduzima u FrontPageu (kao umetanje teksta, ubacivanje slika, podela frejmova, ubacivanje boje u pozadinu itd.) dobija svoju HTML pozadinu. Pre pojave alata kao što je FrontPage, HTML se pisao u editorima teksta kao što je Notepad. Ovaj kod nije mogao da se testira, a da se ne pogleda u web pretraživaču. Pojava FrontPagea promenila je način pisanja i testiranja HTML koda. Iako mnogi ljudi koji koriste FrontPage izbegavaju da nauče HTML, ipak postoje ljudi koji FrontPage koriste isključivo zbog njegovih osobina vezanih za HTML. U prikazu HTML postoje delovi koda koji su obojeni različitim bojama da bi se lakše pratili. Primena različitih boja za različite elemente koda olakšava čitanje HTML koda i omogućava lakše pronalaženje grešaka. Kaskadni stilovi CSS je jezik koji se koristi za formatiranje stilova na web strani. Dok HTML omogućava formatiranje stilova na web Vašem web sajtu, CSS omogućava da se unapred definiše odreñeni broj stilova i da se konzistentno primenjuju na ceo sajt. Raznolikost stilova i formatiranje koje podržava CSS kao što su podešavanje veličine teksta, boja 465

50 Visoka poslovna škola strukovnih studija, Novi Sad ivica, formata pasusa itd. nadmašuju jednostavno formatiranje stilova koje postoji u HTML-u. Postoje dve varijante Css jezika: Css Level 1 (CSS) Koristi se za formatiranje teksta. Poboljšavaju se elementi teksta kao što su stilovi fonta, boje i formatiranje pasusa. CSS Level 2 (CSS2) Koristi se za precizno merenje i postavljanje objekata na ekranu. Osnovna prednost CSS-a jeste mogućnost da se kreira stil i konzistentno se primeni na ceo sajt. CSS stilovi ipak ne moraju da budu prmenjeni na ceo sajt. Oni se mogu primeniti samo na jedan red teksta, na delove tabele, celu web stranu itd. Umesto da se svaki element formatira pojedinačno, CSS omogućava da se odjednom formatira nekoliko elemenata. Jedna od prednosti korišćenja CSS-a jeste u tome što CSS stilovi koji se primenjuju na objekte mogu globalno da se menjaju u celom dokumentu. Umesto da se ponovo primenjuju CSS stilovi na svaki deo teksta, jednostavno se promeni sam stil i on će zameniti stil fonta u celom tekstu koji je napisan tim stilom Integracija Microsoft Office-a u sajt Premda FrontPage u osnovi koristi HTML i jezike koji se na njemu zasnivaju, on podržava i mnoge tehnologije koje imaju malo sličnosti sa HTML-om. Datoteke koje su pisane u Microsoft Wordu, Microsoft Exelu, Lotusu 1-2-3, Corel WordPerfectu itd. mogu se konvertovati u HTML i postaviti na sajt korišćenjem FrontPagea. Pošato FrontPage pripada Microsoft Officeu, on mnogo lakše sarañuje sa aplikacijama iz ovog paketa nego sa nekim drugim. Jedna od lepih osobina FrontPagea odnosi se na mogućnost da ubacuje sadržaj iz drugih programa, kao što su Word i Exel, a da u isto vreme sačuva originalni format. Sadržaj se može ubaciti na dva načina: postavljanjem sadržaja sa Windows Clipoboarda, umetanjem sadržaja. 466

51 Postavljanje sadržaja iz Worda Najlakši način da se sadržaj iz Wordovog dokumenta ubaci u FrontPage, jeste da se iskopira i postavi. To se može uraditi ako u Wordu pritisnemo CTRL+A da bismo označili ceo tekst zajedno sa slikama i tabelama, a potom pritisnemo CTRL+C da bismo iskopirali. Ako u FrontPageu pritisnemo CTRL+V postavićemo sadržaj iz Worda u FrontPage. Alternativa kopiranju sadržaja jeste umetanje celog dokumenta u FrontPage. Kada se u FrontPage ubacuje sadržaj, koristi se specijalan program za konverziju datoteke. Ovaj program prebacuje format koji se koristio u tom programu u HTML koji može da se pročita u FrontPageu. Za razliku od kopiranja i postavljanja sadržaja iz drugih aplikacija, sadržaj koji se ubacuje na ovaj način gubi svoj originalni format. Dokument se u FrontPage unosi ako izaberemo Insert File. Tada se otvara prozor Select File u kome možemo naći željenu datoteku i kliknuti Open. Na taj način će se ufrontpageu prikazati sadržaj Wordovog dokumenta, s tim što će se boje i stilovi teksta razlikovati od originalne datoteke. Iako FrontPage pripada porodici programa iz Officea, on može da ubacuje sadržaj i iz drugih programa, kao što su WordPerfect, Lotus itd. Formate iz kojih FrontPage može da preuzima sadržaj možemo videti, ako izaberemo Insert File, a zatim kliknemo padajuću listu Files of type. Slika Formati datoteka za unos U ovoj padajućoj listi prikazani su različiti formati. U narednoj tabeli dati su svi formati koje podržava FrontPage. 467

52 Visoka poslovna škola strukovnih studija, Novi Sad Format datoteke HTML Files Preprocessed HTML Rich Text Format Text Files Hypertext Templates Any Text (Recover text from Any File) Word (Asian Versions) Word Lotus Mirosoft Excel Worksheet Word 6.0/95 for Windows & Macintosh Word for Macintosh Word 2.x for Windows Works 4.0 for Windows WordPerfect 6.x WordPerfect 5.x Works 2000 HTML Document Word 6.0/95 for Windows & Macintosh Windows Write Word 5.x for Macintosh Ekstenzija.HTM,.HTML.HTX,.ASP.RTF.TXT.HTT Bilo koja datoteka koja sadrži tekst..doc.doc.wk1,.wk3,.wk4.xls,.xlw.doc.mcw.wps.wps.wpd,.doc.doc.wps,.wpt.htm,.html,.htx.doc.wri.mcw Tabela Formati datoteka koji su podržani u FrontPage-u Umetanje radnog lista iz Excela Umetanje podataka iz Excelovog radnog lista odvija se na isti način kao i umetanje dokumenta iz Worda. Kada se umeće radni list iz Excela, može se desiti da informacije postanu nečitljive. Radni list iz Excela možemo ubaciti ako izaberemo Insert File. Otvoriće se prozor Select File. Tada treba izabrati Excelovu datoteku chart i kliknuti dugme Open Umetanje Excelovih datoteka u FrontPage ne dovodi uvek do željenih rezultata. Da bi se sačuvao originalni format radnog lista iz Excela, trebaju se kopirati i postaviti informacije iz odgovarajuće Excelove datoteke. Ovo se radi na isti način kao i kopiranje i postavljanje informacija iz Worda. 468

53 Umetanje podataka u komponentu Office Spreadsheet Komponenta Office Spreadsheet omogućava da se u okviru web pretraživača koriste Excelovi dokumenti. Radi se na sličan način kao što se radi i u samom Excelu. Sadržaj se u komponentu Office Spreadsheet ubacuje, ako izaberemo radni list i kliknemo komandu Commands and Options. Tada će se otvoriti prozor Commands and Options u kome treba kliknuti karticu Import. U polju Data tipe bira tip datoteke, a u polje URL se unosi ime datoteke. Klikom Na dugme Import Now ubaciće se željeni sadržaj u komponentu Office Spreadsheet. Slika Commands and Options FrontPage je prilagodljiv program koji omogućava da se koriste podaci iz drugih aplikacija. Mogućnost FrontPagea Da ubacuje sadržaj iz drugih aplikacija olakšava deobu datoteka. Najbolje od svega je što datotekama može da pristupi svako ko ima web pretraživač Strukturalni prikaz Web strane Prva strana koja se kreira u Front Pageu dobija naziv index.htm. U mom radu je prva strana samo uvod u pravu prvu stranu (Home Page) koja nosi naziv Internet. Ona se sastoji iz tri frejma. Gornji frejm obično služi za ispisivanje naslova, u desni frejm se po običaju stavljaju hiper linkovi, a tekst i ostali multimedijalan sadržaj se 469

54 Visoka poslovna škola strukovnih studija, Novi Sad ispisuju u trećem frejmu.sve ostale strane su povezane direktno sa home page-om sem strane Potraga koja se kreira u novom prozoru odakle gubi vezu sa glavnom stranicom. U prikazu View Navigation lako se uočava struktura strane. Slika Navigation Stranu možemo kreirati u novom prozoru, ako u prozoru Insert Hyperlink kliknemo opciju Target Frame i u njoj podopciju New Window. U Uvodnoj strani se nalazi video koji se ubacuje ako izaberemo Insert Picture Video. Video se ponavlja samo jednom, pošto nije izabrana opcija Forever, a Loop (broj ponavljanja) je podešen na 1. U glavnoj strani, u gornjem frejmu nalazi se naslov (na koji je primenjen efekat iz palete DHTML Effects) i animacija koja nije napravljena u FrontPageu već je uvezena. U glavnoj strani, u desnom frejmu nalaze se linkovi: Uvodna strana (uvek prikazuje glavnu stranu), O Internetu, Arhitektura Interneta, Sigurnost i privatnost na Internetu, Intrnet trgovina sigurnost pre svega i Pretraga. Prozor Uvodna strana je vrlo sličan i ostalim prozorima do kojih se dolazi klikom na jedan od linkova u desnom frejmu. Na početku se nalaze linkovi podnaslova koji vode do njih. Kada vas link dovede do tog podnaslova postoji još jedan link: Vrati se na početak, koji nas vraća na vrh strane. To je urañeno pomoću opcije Bookmarks. Na slike u ovim prozorima su takoñe primenjene opcije sa palete DHTML Effects. Kada jednom otvorite sve prozore uvek se možete vratiti na predhodni pomoću opcija Back i Forward koje se nalaze u pretraživaču. To je omogućeno u prikazu Navigation u kome sami 470