UNIVERZA V MARIBORU FAKULTETA ZA ORGANIZACIJSKE VEDE Diplomsko delo univerzitetnega študija Smer Organizacijska informatika SPLETNA REŠITEV ZA POTREBE DRUŠTVA UPOKOJENCEV Mentor: red.prof.dr. Miro Gradišar Kandidat: Petra Bogataj Kranj, marec 2007
ZAHVALA Zahvaljujem se mentorju red.prof.dr. Miru Gradišarju za strokovno vodstvo in pomoč pri izdelavi diplomskega dela. Zahvaljujem se Dušanu Šubicu, ki mi je s svojimi nasveti pomagal pri izdelavi spletnih strani, in lektorici Katji Benevol Gabrijelčič, ki je lektorirala mojo diplomsko nalogo.
POVZETEK V internetu je malo spletnih strani, ki bi predstavljale društva upokojencev. Mama je bila dolgo aktivna članica društva, pozneje tudi tajnica društva, zato sem se odločila, da njihovo delovanje predstavim na spletnih straneh. Naloga obravnava spletno rešitev za predstavitev društva upokojencev. V prvem, teoretičnem delu, so predstavljena orodja, ki sem jih uporabila za izdelavo spletnih strani. V drugem, praktičnem delu pa je prikaz izdelave in opis spletnih strani. Spletna rešitev je razdeljena na javne strani, ki so dostopne obiskovalcem interneta, in na zasebne strani, do katerih je dostop zaščiten in so namenjene skrbniku za dostop do podatkovne baze.. KLJUČNE BESEDE Spletne strani, internet, Dreamweaver, PHP, društvo upokojencev ABSTRACT On the internet, there are only a few web pages representing senior citizen associations. My mother was an active member of such an association for a long period of time, and she was its secretary as well. This is why I decided to present the association s work on a web page. In this dissertation a web page solution for a senior citizen association is introduced. The first part of the dissertation is theoretical and deals with web authoring tools I used to create these web pages. The second part is empirical and deals with the construction and description of the web pages. The web pages include public pages, which are accessible to all internet users, and private pages, which are secured and are intended for an administrator to access the database. KEY WORDS Web pages, internet, Dreamweaver, PHP, senior citizen associatio
KAZALO 1. UVOD...1 1.1 Opis osnovnega problema... 1 1.2 Cilji diplomske naloge... 1 1.3 Metodologija dela... 2 2. INTERNET...3 2.1 Zgodovina interneta... 3 2.2 Kaj je internet?... 3 2.3 Kaj nam omogoča omrežje internet?... 3 2.3.1 Elektronska pošta... 3 2.3.2 Svetovni splet ali World Wide Web... 4 2.3.3 Prenos podatkov FTP... 4 2.4 Internet pravila lepega obnašanja in varnosti... 4 2.5 Internet danes... 5 2.6 Raba Interneta v Sloveniji... 7 3. PREDSTAVITEV PROGRAMSKE OPREME IN ORODIJ...8 3.1 Macromedia Dreamweaver MX... 8 3.1.1 Predstavitev Dreamweaver MX... 8 3.2 HTML... 10 3.3 Skriptni jezik PHP... 10 3.3.1 Kako deluje PHP in osnovni pojmi... 11 3.4 Jezik SQL in podatkovna baza MySQL... 12 3.4.1 Kaj je podatkovna baza... 12 3.4.2 Osnove jezika SQL... 12 3.4.3 Baza podatkov MySQL... 13 3.5 PhPMyAdmin... 13 3.5.1 Kaj je PhPMyAdmin in kaj nam omogoča?... 14
4. RAZVOJ APLIKACIJE...15 4.1 Izdelava koncepta... 15 4.2 Opredelitev ciljev... 15 4.2.1 Predstaviti delo društva in obveščati člane o aktualnih zadevah... 15 4.2.2 Omogočiti stik z obiskovalci strani... 15 4.2.3 Vzpostaviti stik z mediji (radio, časopis)... 15 4.3 Oblikovna in strukturna podoba... 16 5. IZDELAVE APLIKACIJE...17 5.1. Podatkovna baza... 17 5.2. Spletne strani... 18 5.3 Povezava spletnih strani in podatkovne baze... 20 5.4. Skrbniške strani... 22 5.4.1 Obrazec za vnos izleta... 23 5.4.2 Iskanje po tabeli izleti ali po tabeli clani... 23 5.4.3 Seznam prijavljenih na izlet... 24 6. TEŽAVE IN POSODOBITEV SPLETNIH STRANI...26 6.1 Kaj je CSS?... 26 6.1.1 Prednosti, ki jih prinaša CSS... 26 6.2 Potek nadgradnje spletnih strani... 27 7. ZAKLJUČEK IN PREDLOGI ZA PRIHODNOST...29 7.1 Predstavitev dela društva in stik z obiskovalci strani... 29 7.2 Obveščanje članov o aktualnih zadevah... 29 7.3 Vzpostavitev stika z mediji (radio, časopis)... 29 7.4 Prihodnji razvoj spletne strani društva... 29 VIRI IN LITERATURA...30 PRILOGE...32
KAZALO SLIK...42 KRATICE IN AKRONIMI...43
1. Uvod Živimo v dobi informatike, v kateri je čas pomemben in je treba odgovor ali rešitev nekega problema poiskati čim hitreje in s čim manjšimi stroški. Danes v internetu najdemo odgovor za praktično vsako svojo težavo. Informacij je ogromno in pri iskanju je potrebna natančnost, kajti lahko se zgodi, da se v poplavi informacij izgubimo. Tudi spletnih strani je iz dneva v dan več. Tako nam ni več treba hoditi v trgovine, da bi si izdelke ogledali in jih primerjali med seboj. Na raznih forumih lahko izvemo mnenja, pohvale ali graje drugih uporabnikov, ki nam pomagajo pri naših odločitvah. Tako imamo na koncu približno oceno, mnenje o želeni zadevi in ko se odpravimo v trgovino, da bi si še fizično ogledali izdelek, za nakup ne porabimo veliko časa. Navadno so v prednosti tisti ponudniki, pri katerih smo dobili informacije že prek interneta, kar pomeni, da imajo svojo spletno stran. Zatorej je spletna stran, in z njo stik z obiskovalci, postala zelo pomembna pri doseganju večjega tržnega deleža. 1.1 Opis osnovnega problema Društvo upokojencev Žabnica Bitnje deluje že vrsto let. Dejavni so na več področjih in število članov se iz leta v leto povečuje. Pred letom dni se je vodstvo v društvu zamenjalo in na mesto tajnice so izbrali mojo mamo. Tako se je pri 60-ih letih z mojo pomočjo spet soočila z računalnikom in spoznala osnovne programe, kot so Word, Excel, Access in ščepec interneta. Vse to z namenom, da bo njeno delo v društvu lažje in bolj učinkovito. Njena naloga je pisanje obvestil o tekočih izletih, obvestil za medije, vpis novih članov, priprava vsakoletnih seznamov za članarino itd. Brez pomoči računalnika bi njeno delo zahtevalo veliko več časa in truda. Kot študentka Fakultete za organizacijske vede sem želela uporabiti svoje znanje, ki sem ga pridobila med študijem, in predstaviti delo društva tudi na spletu. Tako sem se odločila za izdelavo spletnih strani Društva upokojencev Žabnica Bitnje. 1.2 Cilji diplomske naloge Ob načrtovanju diplomske naloge sem si zadala več ciljev, ki bi jih dosegla z opravljenim delom: predstaviti delo društva na spletu, omogočiti stik z obiskovalci strani, obveščati člane o aktualnih zadevah, vzpostaviti stik z raznimi mediji (radio, časopis). Večina ljudi ima ob upokojitvi na voljo precej časa, ki ga ne znajo zapolniti ali ne vedo, kako bi to naredili. Da bi bilo njihovo življenje še naprej aktivno in polno, do neke mere poskrbijo tudi razna društva. Ker se zavedam, da marsikdo uporablja pri svojem delu tudi internet, sem želela, da bi jim s spletno stranjo na kratko predstavila delovanje društva in jih na ta način pritegnila k včlanitvi. Zavedati se moramo, da nismo samo mladi in malo manj mladi tisti, ki smo osvojili internet, ampak da tudi naši starši spoznavajo čare in pasti sodobnega življenja. Naj bo to že med službo ali pa pozneje, v pokoju, ko imajo na voljo malce več časa. Dobro se nam zdi, da lahko v tem hitrem tempu najdejo tudi košček zase in na ta način Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 1
spoznajo nekaj novega, zanimivega, malce poklepetajo, si mogoče pridobijo internetnega prijatelja itd. V ta namen sem si izbrala tudi misel foruma, ki se imenuje»starejši so modrejši«in ga najdemo na naslovu http://med.over.net/forum:»mogoče smo internet osvojili pozneje, zato pa nam ni nič manj zanimiv. Pozabimo na samoto in poglejmo, kdo od sovrstnikov se skriva tukaj...«1.3 Metodologija dela Pri pripravi diplomske naloge sem uporabila različne metode dela. Najprej sem začela z raziskovanjem literature, predvsem interneta, na temo spletnih strani. Med študijem sem spoznala program Front Page, vendar sem želela strani narediti interaktivne, zato sem iskala še druge programe. Sledilo je zbiranje podatkov in literature v zvezi z društvom. Pri tem mi je bila v veliko pomoč mama, ki je bila v tistem času tajnica društva ter aktivna članica in organizatorka. Za izdelavo spletnih strani sem uporabila metodo prototipa. Bistvo te metode je, da se že na samem začetku naredi vzorec rešitve, nato pa se ta vzorec dopolnjuje in dograjuje, dokler ne dobimo končne rešitve. V prvem delu diplomske naloge bom na kratko predstavila internet ter programsko opremo in orodja, ki sem jih uporabila pri izdelavi naloge. Sledi opis razvoja aplikacije, kjer bodo podrobneje opisani cilji naloge, postopek izdelave spletnih strani, težave, s katerimi sem se srečala pri tem itd. V zadnjem delu je zaključek, v katerem bom povzela, ali sem z nalogo dosegla cilje, ki sem si jih zadala v začetku projekta. Poskusila bom tudi določiti smernice za prihodnost: kaj bi se dalo izboljšati, spremeniti in dopolniti, da bi bila spletna stran še bolj zanimiva in obiskana. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 2
2. Internet 2.1 Zgodovina interneta V poznih šestdesetih je agencija ARPA (Advanced Research Project Agency) po ukazu ameriškega obrambnega ministrstva izdelala omrežje, ki so ga poimenovali ARPANet. Vojska je namreč zahtevala omrežje, ki bi delovalo, četudi bi kjerkoli prišlo do prekinitve povezav ali okvare računalnikov. Končna odločitev je bila, da se podatke med prenašanjem razdeli v pakete, za pravilno usmeritev paketov do naslovnika pa naj poskrbi omrežje. Omrežje ARPANet je sprva povezovalo le vojaška računalniška omrežja, pozneje pa se je razširilo še na nekatere raziskovalne ustanove. Po letu 1980, ko se je vojska ločila od omrežja, se je začelo močno širiti še na univerze in druge organizacije ter tako privabilo na tisoče uporabnikov z vsega sveta. Približno tedaj se je pojavil tudi pojem internet. (Vir: http://www.ewrs.net/clanki-novice/prvi-koraki-v-internetu.php#2) 2.2 Kaj je internet? Internet predstavlja največje svetovno računalniško omrežje, v katero so povezana manjša in večja lokalna omrežja. Je globalno omrežje med seboj povezanih vladnih, univerzitetnih, šolskih, komercialnih in drugih omrežij. Samostojni računalniki ali računalniki v posameznih lokalnih omrežjih, ki so priključeni v omrežje internet, so lahko različni, vendar se med njimi pretakajo podatki na enak način po posebej dogovorjenem protokolu, ki se imenuje TCP/IP (Transmission Control Protocol/Internet Protocol). Ko se računalnik poveže v omrežje internet, na primer prek domače telefonske povezave, in je opremljen z ustrezno programsko opremo, postane sposoben sprejemati in pošiljati v omrežje internet različne informacije, kot so besedila, slike, zvok in video. Začetek omrežja internet sega v 60-eta leta, v čas, ko je obrambni oddelek vojske ZDA razvil sistem računalniških omrežij, ki bi bil sposoben delovati, tudi če bi v vojni izpadel kakšen njegov del. Sčasoma se je razvoj omrežja internet preselil iz vojaškega kroga najprej na univerze, raziskovalne inštitute in vladne organe ter v zadnjem času tudi v komercialni krog, s čimer se je začel tudi njegov nezadržni vzpon. Število ljudi, ki se priključuje v omrežje internet, se po svetu in še posebej v ZDA še vedno eksponentno povečuje. V Sloveniji se število uporabnikov omrežja internet vsako leto poveča za dvakrat. 2.3 Kaj nam omogoča omrežje internet? 2.3.1 Elektronska pošta Osnovna storitev omrežja internet, ki nam omogoča komunikacijo uporabnik uporabnik, je elektronska pošta. Namenjena je izmenjavi sporočil, tem pa lahko pripnemo tudi datoteke. Sporočila se prenašajo s preprostim protokolom za prenos pošte SMTP (Simple Mail Transport Protocol) in se shranijo na strežniku ponudnika dostopa do interneta oziroma elektronske pošte. Tako vas pošta čaka na strežniku, dokler je sami ne prenesete v svoj računalnik. Ta se v vaš računalnik prenaša s protokolom POP (Post Office Protocol protokol za poštni urad). Elektronska pošta je precej hitrejša od navadne papirne pošte, saj do naslovnika pride že v nekaj sekundah, na daljše razdalje pa v nekaj minutah. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 3
Ko dobimo svoj elektronski naslov pri svojem dobavitelju internetnih storitev, lahko tudi postanemo»člani«poštnih seznamov (ang. mailing lists), kar nam omogoča samodejno sprejemanje novih informacij z želenega področja, ki so naslovljene na ta seznam. Za pošiljanje pošte lahko uporabljamo različne uporabniške programe. 2.3.2 Svetovni splet ali World Wide Web Svetovni splet ali krajše splet je brez dvoma najbolj priljubljena storitev v internetu. Rodil se je leta 1989 v Evropskem laboratoriju za fiziko (CERN) v Ženevi, kjer je dobil tudi ime svetovni splet. Na spletu je moč najti informacije, ki pokrivajo praktično vsa področja, ki si jih lahko zamislimo, kar je tudi vzrok velike priljubljenosti. Sprva je bil splet skupek storitev FTP, Gopher in e-pošta, torej zasnovan samo na besedilu. Danes pa lahko spletna stran, ki je narejena v jeziku HTML (HyperText Markup Language), vsebuje besedilo, slike, zvok, video, animacije in druge interaktivne elemente. Sprehajanje po straneh omogočajo povezave, ki so ponavadi podčrtano besedilo ali pa sličice. Te strani so shranjene v računalnikih (strežnikih) po vsem svetu. Za dostop do spleta moramo najprej namestiti spletni brskalnik. Vsako spletno mesto ima svoj naslov, ki mu pravimo tudi URL (Uniform Resource Locator), začne pa se s kratico http:// (http = HyperText Transport Protocol). Kratica določa protokol, ki pove brskalniku, da se želite povezati s spletnim dokumentom, sledita dve poševnici, nato pa ime gostitelja, ki vsebuje domensko ime in se konča s končnico, ki določa tip domene, na primer.com,.net,.eu. Kar sledi poševnici, je oznaka poti do imenika na strežniku. 2.3.3 Prenos podatkov FTP Do informacij, shranjenih v datotekah, ali različnih programov in dokumentov lahko pridemo tudi s storitvijo, imenovano FTP (File Transfer Protocol), s katero prenašamo datoteke z enega računalnika na drugega kjerkoli v omrežju. Tudi za to storitev potrebujemo ustrezno programsko opremo. 2.4 Internet pravila lepega obnašanja in varnosti Omrežje internet samo po sebi ne zagotavlja potrebnih pogojev za varno komunikacijo in elektronsko poslovanje. Za varnost je treba poskrbeti z izbiro ustreznih tehnologij, metod in rešitev ter jih povezati v celoto, tako da bo varnost komunikacije prek interneta kar največja. V internetu je na voljo veliko programov za zaščito računalnika pri povezavi v to omrežje. Razvijalci operacijskih sistemov pri pojavi večjih možnih načinov vdora sproti popravljajo in posodabljajo, zato so potrebne vsakokratne posodobitve in popravki vašega operacijskega sistema. S tem se zaščitijo možne»luknje«v samem sistemu za preprečitev vdora. Manjšim uporabnikom mogoče to ne predstavlja takšnega problema, dokler se prek uporabnikovega računalnika ne začnejo tržiti ali oglaševati nelegalne teme (pornografija, nelegalni programi, filmi, glasba...) Uporaba in oglaševanje nelegalnih programov, filmov, glasbe in pornografije je kaznivo. Pri pregledovanju brskanju po internetu, se pogosto odpirajo manjša okna s ponudbo po namestitvi raznih programov. Ti programi so večkrat samo v»nadlego«pri uporabi našega računalnika. Lahko tudi zasedajo linijo, kar je pri klicnem dostopu zelo moteče. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 4
Pogosto se tudi dogaja, da»neželeni«programi sami naredijo še dodatne nastavitve na računalniku in s tem»dovolijo«dodatno komunikacijo med našim računalnikom in strežnikom programa. Pri brskanju po internetu bodimo pri potrjevanju namestitve še posebej pozorni, kajti namestitev lahko vsebuje tudi virus. Vsakdo je bil enkrat začetnik v internetu. Zato bodimo prizanesljivi, kadar kdo naredi napako (neumno vprašanje, nepotrebno dolg odgovor, večkrat postavljeno vprašanje itd.). Če gre za manjšo stvar, reakcija niti ni potrebna. V vsakem primeru pa odgovorimo prijazno in po možnosti v zasebnem sporočilu. Če se sami držimo pravil lepega vedenja, nam to še ne daje pravice, da vsakogar popravljamo. Vsako virtualno okolje (pa naj gre za novičarske, diskusijske skupine ali za forume) ima svoja interna pravila in zakonitosti, po katerem deluje. Zato se velja najprej razgledati, da dobimo občutek, kaj je dovoljeno/zaželeno in kaj ne, preden se aktivno vključimo in začnemo sodelovati. (Vir: http://www.telprom.si/faq.htm) 2.5 Internet danes Od vseh danes poznanih medijev je internet tisti, ki prevzema vodilno vlogo, edini pa omogoča interaktivno večpredstavnostno komunikacijo v obe smeri. Podjetja, ki danes ne izkoriščajo vseh tehničnih možnosti sodobnih internetnih tehnologij, zamujajo tehnološki vlak in si zapirajo perspektivo za prihodnost. Spletne predstavitve in okolja dandanes niso več le moderni prospekti (kot je na žalost še zmeraj v večini primerov), pač pa moderno, sofisticirano orodje (medij) za doseganje povečanja prometa, tržnega deleža, pozicioniranja na tržišču, globalizacije poslovanja in nenazadnje povečanja donosov. Naj se podjetje šele odloča za internetni nastop, ali pa je na spletu že dalj časa prisotno, je princip»prospektnega«nastopa zanesljivo zgrešena poteza in investicija, ki ne prinaša dobička. Vodilo za nastop na spletu nikakor ne more biti:»tudi mi smo tu, ker je pač tudi konkurenca!«, pač pa izključno in edino poslovna želja po povečanju prometa in dobička! Zgornji cilj lahko dosežemo edino tako, da svoje spletno okolje gradimo premišljeno in s podporo vseh dodatnih spletnih tehnologij, ki so dandanes na voljo (interaktivnost, multimedialnost, B2B in B2C podporo, e-trgovino, trirazsežni prikazi, dvoplastne tehnologije, PHP in MySQL...). (Vir: http://www.portocontinental.si/internet.htm) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 5
WORLD INTERNET USAGE AND POPULATION STATISTICS World Regions Population (2007 Est.) Population % of World Internet Usage, Latest Data % Population (Penetration) Usage % of World Usage Growth 2000-2007 Africa 933,448,292 14.2 % 32,765,700 3.5 % 3.0 % 625.8 % Asia 3,712,527,624 56.5 % 389,392,288 10.5 % 35.6 % 240.7 % Europe 809,624,686 12.3 % 312,722,892 38.6 % 28.6 % 197.6 % Middle East 193,452,727 2.9 % 19,382,400 10.0 % 1.8 % 490.1 % North America 334,538,018 5.1 % 232,057,067 69.4 % 21.2 % 114.7 % Latin America/Caribbean 556,606,627 8.5 % 88,778,986 16.0 % 8.1 % 391.3 % Oceania / Australia 34,468,443 0.5 % 18,430,359 53.5 % 1.7 % 141.9 % WORLD TOTAL 6,574,666,417 100.0 % 1,093,529,692 16.6 % 100.0 % 202.9 % NOTES: (1) Internet Usage and World Population Statistics were updated on Jan. 11, 2007. (2) CLICK on each world region for detailed regional information. (3) Demographic (Population) numbers are based on data contained in the world-gazetteer website. (4) Internet usage information comes from data published by Nielsen//NetRatings, by the International Telecommunications Union, by local NICs, and other other reliable sources. (5) For definitions, disclaimer, and navigation help, see the Site Surfing Guide. (6) Information from this site may be cited, giving due credit and establishing an active link back to www.internetworldstats.com. Copyright 2007, Miniwatts Marketing Group. All rights reserved worldwide. Slika 1: Prikaz podatkov o uporabi interneta po svetu na dan 11.01.2007 (Vir: http://www.internetworldstats.com/stats.htm) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 6
2.6 Raba Interneta v Sloveniji Statistični urad je objavil podatke raziskave o uporabi interneta v gospodinjstvih. V prvem četrtletju 2006 je internet uporabljalo 54 % gospodinjstev in več kot 900.000 uporabnikov v starosti od 10 do 74 let. Nekaj ugotovitev raziskave Dostop do interneta je imelo nekaj več kot 350.000 (54 %) gospodinjstev. Glede na leto 2005 se je delež povečal za 6 odstotnih točk. Večji delež dostopa je med gospodinjstvi, ki imajo otroke (75 %) kot pa med tistimi, ki otrok nimajo (47 %). Širokopasovni dostop do interneta je imelo 34 % gospodinjstev. Porast glede na leto 2005 je za 15 odstotnih točk. Internet je v zadnjih treh mesecih uporabljalo 54 oseb v starosti od 10 do 74 let. Povečanje glede na leto 2005 je za 4 odstotne točke. Dnevnih uporabnikov interneta v populaciji od 10 do 74 let je 37 %. V starostni skupini od 16 do 34 let je 81 % uporabnikov interneta, med starimi od 35 do 54 let pa 50 %. Med ljudmi z višjo izobrazbo je bilo 90 % uporabnikov interneta, med tistimi z nižjo pa 39 %. Slika 2: Nameni uporabe interneta, Slovenija, 1. četrtletje 2006 (Vir:SURS) (Vir:http://www.ris.org/index.PHP?fl=1&nt=9&sid=431&m2w=Nove%20raziskave% 20-%20arhiv%20%3E%3E) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 7
3. Predstavitev programske opreme in orodij 3.1 Macromedia Dreamweaver MX Podjetje Macromedia je zaslovelo po računalniških programih za delo z grafiko in pripravo večpredstavnostnih predstavitev, danes pa je to programska hiša, katere strategija so predvsem dinamična spletišča. Svojo ponudbo grafičnih programov so dopolnili z lastnimi in kupljenimi programskimi tehnologijami. Ključni moment podjetja je bil uspeh, ki so ga poželi s predvajalnikom animacij Flash. Animacije sicer niso bile tako zmogljive, vendar pa je bil predvajalnik zanje kompakten in je kmalu postal sestavni del spletnih brskalnikov. Dreamweaver je začel svojo pot kot vizualni urejevalnik spletnih strani. Po tretji večji prenovi je bil dovolj zmogljiv, da je postal najbolj priljubljeno orodje spletnih oblikovalcev. Dreamweaver MX je že četrti rod in je celostno spletno razvojno okolje, saj v eni lupini združuje urejevalnik HTML, avtorsko orodje, razvojno orodje za dinamične spletne strani in orodje za upravljanje spletnih strani. Spletne strani izdelujemo z uporabo kode HTML, Dreamweaver pa nam omogoča, da naredimo veliko stvari, ne da bi kodo sploh znali zapisati. Je spletni urejevalnik, ki med delom prikaže enako oblikovanje dokumenta, kot ga bo imel dokument po objavi na spletu (What You See Is What You Get). Program je zelo zmogljiv, uporaba pa preprosta. Omogoča izdelavo novih spletnih strani ali popravilo že obstoječih in pri tem ne spreminja ali preureja kode. 3.1.1 Predstavitev Dreamweaver MX Ko izberemo vmesnik, se odpre delovna površina, imenovana dokumentno okno. Stran, ki jo vidimo in pripravljamo v tem dokumentarnem oknu, bo prikazana v skoraj enaki obliki tudi pozneje v oknu spletnega brskalnika. Dokumentno okno vsebuje: naslovno vrstico ime programa, ime datoteke in naslov trenutne spletne strani. Ta naslov se pojavi tudi v naslovni vrstici spletnega brskalnika; menijsko vrstico vrstica z meniji; vrstico za vstavljanje v njej so gumbi za vstavljanje elementov spletne strani, kot so: slike, tabele, obrazci in nadpovezave. V vrstici imamo več jezičkov, ki odpirajo kartice z različnimi skupinami predmetov (Splošni predmeti, Besedilo, Tabele, Okvirji...); orodno vrstico ta omogoča hiter dostop do pomembnih ukazov. Z gumbi na levi strani lahko preklapljamo med pogledom na kodo, pogledom na postavitev strani, ali pa kombinacijo obeh v ločenih oknih. V orodni vrstici imamo tudi vnosno polje, v katerem je naslov spletne strani, menije, gumbe, priročnike ipd.; vrstico stanja ta je na spodnjem robu okna in v njej so orodja, ki pomagajo dobiti podatke o spletni strani (izbirnik značk, meni za izbiro velikosti delovnega okna...). Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 8
Slika 3: Dokumentno okno programa (Vir: Lasten vir) Orodjarne in okna z lastnostmi Z njimi nastavljamo lastnosti, prikazujemo vrstice z orodji, izdelujemo animacije in dodajamo funkcije spletni strani. Večina ukazov je na voljo na več mestih, običajno v menijih in orodjarnah. Te so združene v skupine. Okno z lastnostmi prikazuje vse lastnosti trenutno izbranega predmeta in se spreminja glede na predmet na strani, ki je izbran (na primer: ko je na zaslonu besedilo, prikazuje lastnosti besedila, ko je na zaslonu slika, so prikazane lastnosti slike). Slika 4: Meni lastnosti, ki prikazuje lastnosti izbranega besedila (Vir: Lasten vir) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 9
3.2 HTML HTML (HyperText Markup Language) je jezik, s katerim opišemo gradiva, ki jih želimo objaviti na spletu. Razvil ga je Tim Berners-Lee na inštitutu CERN leta 1990. Prvi brskalnik za splošno uporabo, ki je ta jezik podpiral, se je pojavil leta 1993 z imenom Mosaic, razvili pa so ga pri NCSA. HTML je takoj postal zelo priljubljen. Čeprav je do danes doživel nekaj sprememb, se osnovni elementi jezika niso spremenili. Datoteka HTML, krajše HTM, je običajna znakovna datoteka, kar pomeni, da jo lahko odpremo in urejamo s poljubnimi urejevalniki besedil (Notepad, TextPad...), uporabimo pa lahko tudi katerega od posebnih programov (Front Page, Dreamweaver...), ki omogočajo sproten pogled na izdelek. Običajno so taki programi bolj prijazni za uporabnika, saj za delo z njimi ne potrebuje znanja jezika HTML, je pa njihova slabost v tem, da sestavijo preveč zapleten opis besedila. (Vir: http://zaversnik.fmf.uni-lj.si/gradiva/html) 3.3 Skriptni jezik PHP PHP je razvil Kanadčan Rasmus Lerdorf, ker je z njim hotel zagotoviti preprost dostop do podatkovnih zbirk. Na začetku se je jezik imenoval PHP/FI (ang. Personal Home Pages/Form Interpreter). Danes pa ta kratica pomeni Hypertext Preprocessor. Skladnja jezika izhaja iz drugih programskih jezikov, kot sta Java in Perl (Bilke 2002). PHP je sodoben programski jezik, namenjen spletnemu programiranju s podporo podatkovnih baz MySQL in je vključen v opisni jezik HTML. Programski jezik PHP omogoča razvijalcem spletnih aplikacij, da sprogramirajo spletno aplikacijo tako, da deluje, kakor da bi bila nameščena na lokalnem računalniku, v lokalnem omrežju. Celotna aplikacija teče na spletnem strežniku in omogoča delovanje vseh spletnih vsebin, ki si jih je naročnik zamislil za svoje spletno okolje. Aplikacije, ki so programirane v PHP-ju, dejansko omogočajo pregledovanje in delo z vsebinami (podatki), ki so shranjeni v podatkovnih bazah MySQL. Princip delovanja je naslednji: s programskimi rešitvami PHP sprogramiramo elemente posameznih prikazov. PHP posamezne prikaze navidezno prikaže v navadnem načinu HTML. Ta tehnika omogoča hiter prikaz posameznega artikla/storitve, če jih je v podatkovnih bazah le nekaj tisoč, ali pa celo nekaj milijonov! Dostopni časi so tako odvisni le od hitrosti spletne povezave posameznega obiskovalca in ne več od števila artiklov/storitev/prikazov... PHP je programski jezik, ki se izjemno hitro razvija in ki ga pri gradnji svojih spletnih rešitev uporabljajo največja svetovna podjetja in ustanove. Spletno okolje, sprogramirano v programskem jeziku PHP, ob uporabi Jave, Perla, javanskih programčkov in podatkovnih baz MySQL tako predstavlja resnično tehnološko najnaprednejši pristop k gradnji naše predstavitve, delovanja in povečanja prodaje s pomočjo globalnega medija, kot je internet. (Vir: http://www.portocontinental.si/php.htm) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 10
3.3.1 Kako deluje PHP in osnovni pojmi Sam po sebi je jezik kot večina drugih neuporaben. Programsko kodo v PHP-ju vgradimo neposredno v kodo HTML, ki opisuje spletno stran. To lahko naredimo na štiri načine (Bilke 2002): <?...?> <?PHP...?> <script language= PHP>... </script> <%... %> Programska koda je sestavljena iz množice ukazov oziroma stavkov, kot so deklaracije spremenljivk, klici funkcij ali zanke. Posamezne ukaze med seboj ločujemo s podpičji. Primer programa v PHP-ju, ki nam na zaslonu prikaže besedo»pozdravljen«<html> <head> <title>pozdrav svetu</title> </head> <body> <?echo»pozdravljen«; /*Izpis besedila na zaslon*/?> </body> </html> Če malce razčlenimo zgornji primer, ugotovimo: komentar se začne z /* in konča z */, uporabljen je ukaz ECHO za izpis besedila na zaslon, besedilo je treba vstaviti med narekovaje. Spremenljivke Spremenljivke omogočajo shranjevanje podatkov, ki jih potrebujemo med izvajanjem programa. Spremenljivko označimo z znakom $, za prirejanje vrednosti pa uporabimo enačaj =. PHP uporablja netipizirane spremenljivke, kar pomeni, da nam ni treba posebej navesti, za kateri tip spremenljivke gre (na primer string, text, date itd). PHP namreč samodejno prilagodi tip ob njeni uporabi. Poleg enostavnih spremenljivk poznamo tudi polja (ang. array), ki so sestavljena iz več spremenljivk. Pri tem ima polje svoje ime, vsak njegov element pa svoj indeks. S spremenljivkami lahko izvajamo različne računske operacije (seštevanje, odštevanje, množenje, deljenje...) ali pa primerjamo njihove vrednosti (je enako, je več/manj kot...). Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 11
3.4 Jezik SQL in podatkovna baza MySQL 3.4.1 Kaj je podatkovna baza Podatkovna baza je skupek oziroma baza podatkov, ki opisuje isto temo oziroma cilj. Uporabniku omogoča dostop do shranjenih podatkov, ne da bi moral vedeti, kako so podatki organizirani v sistemu podatkovne baze. Baza nam zagotavlja, da imajo pravico pregledovanja in spreminjanja podatkov le uporabniki, ki so do tega upravičeni (Bilke 2002). 3.4.2 Osnove jezika SQL SQL (Structured Query Language) je jezik, ki je bil razvit sredi 80-ih let in se uporablja pri upravljanju podatkovne baze (klicanje podatkov, spreminjanje le-teh, shranjevanje itd.). Je nekakšen vmesnik med uporabnikom in sistemom za upravljanje podatkovnih baz. Je jezik, ki nam ob povpraševanju v podatkovno bazo omogoča tudi oblikovanje relacijske podatkovne baze in delo s podatki, shranjenimi v njej. Zaradi preproste uporabe in strojne neodvisnosti ter podpore pri vodilnih industrijskih podjetjih s področja tehnologije relacijskih baz je postal jezik SQL standarden jezik. Standard je definiran pri inštitutu ANSI (American National Standart Institute) in sprejet pri organizaciji ISO (Inernational Standard Organization). Ukaze SQL razvrstimo v tri osnovne skupine: DDL Data Definition Language (jezik za definiranje) omogoča strukturiranje podatkovne baze. Ukaz CREATE, ALTER, DROP uporabljamo pri oblikovanju novih objektov, spreminjanju in brisanju obstoječih objektov. DML Data Manipulation Language (jezik za delo s podatki) nastopa pri uporabi podatkovne baze. Te ukaze uporabljamo najpogosteje in sicer pri iskanju in spreminjanju podatkov v podatkovni bazi (ukaz SELECT, UPDATE, DELETE, INSERT, LOCK TABLE). DCL Data Control Language (jezik za nadzor podatkov) omogoča nadzor delovanja podatkovne baze. Ukazi, kot so GRANT, REVOKE, COMMIT in ROOLBACK, nadzorujejo dostop do podatkovne baze Najprej je treba ustvariti tabelo, ji določiti število polj, dolžino posameznega polja in omejitev NULL ali NOT NULL. Katero omejitev bomo izbrali, je odvisno od tega, ali so v danem trenutku znane vrednosti atributa ali ne. Tabele ponavadi vsebujejo veliko število zapisov, ki pa niso urejeni. V ta namen uporabimo indekse, s katerimi omogočimo tudi enoumno definicijo polj (primarni in tuji ključ). Tabelo ali indekse lahko po potrebi brišemo, obstoječi tabeli dodajamo nova polja, spreminjamo velikosti polja... Ukazi, ki jih uporabimo pri tem, so iz skupine DDL. Vrednosti v polja tabele vpisujemo, brišemo in spreminjamo z ukazi skupine DML. Ko imamo tako narejene tabele z vpisanimi podatki, lahko podatke zajemamo iz svoje podatkovne baze s povpraševanji (ang. query). Tako iskani podatki oziroma informacije so poslane na zaslon, tiskalniku, v zbirko, ali pa se uporabijo za kak drug proces. V ta namen imamo kar nekaj ukazov, členov, primerjalnih in logičnih operatorjev, pogojev, funkcij... (Vir:http://lpt.uni-b.si/lpt/student/im3/files/INFORMATIKA%20V%20MEDIJIH%20III.pdf) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 12
3.4.3 Baza podatkov MySQL MySQL je klasična baza podatkov, ki lahko deluje sama zase, kot samostojen podatkovni strežnik ali pa v kombinaciji z drugimi tehnologijami (Štrancar 2002). Razvili so ga v švedskem podjetju T.c.X. DataKonsult. Sistem se odlikuje po hitrosti, robustnosti in preprosti uporabi. MySQL ustreza standardu ANSI SQL 92, vendar ponuja tudi razširitve. Ima tudi nekatere pomanjkljivosti (Bilke 2002). Pomembnejše razširitve: ukaz SELECT je razširjen, nov ukaz REPLACE nadomešča kombinacijo ukazov DELETE in INSERT, vsaka podatkovna zbirka je predstavljena kot mapa, vsaka tabela v njej pa kot datoteka, nov ukaz SHOW, dodatni tipi podatkov. Omejitve: poizvedbe na več nivojih niso dovoljene, shranjene procedure niso podprte, sprožilci niso podprti, tuji ključi niso podprti. Podatkovne baze MySQL omogočajo vnos tekstovnih in večpredstavnostnih podatkov (digitalne fotografije...). Omogoča ustvarjanje datotek na strežniku po enakih merilih kakor na lokalnem računalniku ali v lokalnem omrežju. Edina razlika med obema je ta, da so podatki shranjeni na internetnem strežniku. MySQL omogoča ustvarjanje podatkovnih datotek po željah in navodilih naročnika. Sodobna spletna okolja je dandanes nemogoče graditi na zastarelih tehnologijah, se pravi v jeziku HTML. Sodobne informacijske tehnologije omogočajo sodobne in celostne pristope, od katerih je eden najboljših zagotovo način s podporo podatkovnih datotek MySQL. Te predstavljajo celosten temelj, na katerem je zgrajeno naše spletno okolje, ta pa nam v nadaljevanju omogoča izdelavo resnično interaktivnega, večpredstavnostnega in realno-časovnega delovanja. (Vir: http://www.portocontinental.si/mysql.htm) 3.5 PhPMyAdmin Želela sem, da so spletne strani dinamične in da prikazujejo podatke iz podatkovne baze. Urejanje, spreminjanje in dostop do te podatkovne baze v lokalni bazi na domačem računalniku se mi niso zdeli smiselni, zato sem se odločila, da omogočim dostop do teh podatkov prek interneta. V ta namen sem uporabila orodje PhPMyAdmin. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 13
3.5.1 Kaj je PhPMyAdmin in kaj nam omogoča? To je orodje, napisano v jeziku PHP, ki omogoča upravljanje MySQL-a prek interneta. To pomeni, da kjerkoli lahko dostopamo do svoje baze, če le imamo na voljo internetno povezavo in računalnik. Seveda je treba dostop do teh strani zaščititi, za kar se uporabi geslo. Omogoča nam urejanje, spreminjanje, brisanje, ustvarjanje, dodajanje v tabele, ki jih imamo. Skratka vse tisto, kar nam omogoča tudi program MySQL-Front. Tudi videz in samo delo je do uporabnika prijazno. Za samo delo ni treba pisati kode SQL, saj lahko vse opravimo s klikanjem na pravo mesto. Seveda pa imamo na voljo tudi pisanje kode, če smo bolj vešči tega. Slika 5: PhPMyAdmin (Vir: Lasten vir) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 14
4. Razvoj aplikacije Vsebina spletne strani je ključni dejavnik uspeha spletne predstavitve. Treba se je namreč zavedati, da pridejo uporabniki na spletno stran predvsem zaradi njene vsebine, ne pa zaradi njene tehnične dovršenosti ali njene privlačne grafične podobe. Slednja elementa sta sicer pomembna gradnika spletnega uspeha, toda ključna je vsebina. Od nje je namreč odvisno, ali bo spletna stran uspela ali pogorela. (Skrt 2005) 4.1 Izdelava koncepta Izdelave koncepta spletne strani sem se lotila celostno od osnovne ideje prek oblikovne in vsebinske podobe do končne rešitve. Osnovni koraki pri nastajanju spletnih strani: kaj naj bi spletna stran predstavljala, zbiranje, priprava in obdelava materiala, strukturna, vsebinska in oblikovna podoba strani, vključitev spletne strani na splet in njena predstavitev. 4.2 Opredelitev ciljev V uvodu diplomske naloge sem omenila cilje naloge, ki jih bom s spletnimi stranmi poskušala doseči. 4.2.1 Predstaviti delo društva in obveščati člane o aktualnih zadevah Društvo upokojencev je dejavno na veliko področjih in vsako leto se število članov poveča. Z izdelavo spletne strani bo delo društva predstavljeno širši množici ljudi in mogoče se bo na tak način vanj vključil še kakšen nov član. Na spletni strani bo lahko vsakdo, član ali nečlan, spremljal aktualne zadeve društva, kot so poročila o sestankih upravnih odborov, razna obvestila o izletih, akcijah ipd. Med drugim si lahko ogledamo plan izletov, ki jih društvo organizira skozi celo leto, ali pa si preberemo podroben opis trenutno aktualnega izleta. 4.2.2 Omogočiti stik z obiskovalci strani Vsak obiskovalec ima možnost podati svoje mnenje, napisati vprašanje, pohvalo ali kritiko, in vse to prek obrazca poslati na naslov društva. Vsake elektronske pošte bodo v društvu veseli in vam bodo poskušali pomagati s hitrim odgovorom. Poleg tega se bodo lahko s posebnim obrazcem tudi včlanili v naše društvo, ali pa se prijavili na želeni izlet. 4.2.3 Vzpostaviti stik z mediji (radio, časopis) Glede na to, da bo društvo imelo svoj elektronski naslov, bo komunikacija s časopisnimi in radijskimi hišami potekala tudi po tej poti. S tem bi se komuniciranje močno pospešilo, morebitne težave bi bile veliko hitreje rešene in odpravljene kakor po klasični pošti. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 15
4.3 Oblikovna in strukturna podoba V internetu praktično ni samostojnih spletnih strani na temo društev upokojencev, po katerih bi se lahko zgledovali pri pripravi svoje. Ker so naša ciljna publika starejši ljudje, je smotrno, da so strani narejene na razumljiv in preprost način. Pomemben faktor je tudi primerna velikost črk oziroma pisava besedila, saj ne želimo dodatno utrujati oči. Prav tako je pomembna tudi izbira umirjenih, pastelnih barv, ki se dobro poda k vsebini strani. Vsebina mora biti ustrezno predstavljena in organizirana, kar pomeni, da mora voditi obiskovalca po spletni predstavitvi in ga spodbujati k izvrševanju zaželenih akcij. Zaželeno je, da vsebina spodbuja tudi dvosmerno komunikacijo z uporabniki. Bistvo spletne strani je, da posreduje pravo vsebino, pravim ljudem, ob pravem času in minimalnih stroških. Navigacija mora biti uporabniku v pomoč pri njegovem udobnem in učinkovitem sprehajanju po spletni predstavitvi. Ker morajo uporabniki na preprost in hiter način najti informacije, ki jih potrebujejo, mora biti navigacija razumljiva, logična, konsistentna in funkcionalna. Dobra navigacija v vsakem trenutku pove uporabniku, kje je in kam lahko gre. (Skrt 2005) Nasveti pri ustvarjanju oblikovne podobe (Skrt 2004): ne pretiravajte pri številu različnih barv, ki jih boste uporabili na strani, uporabljate primerno velikost in tipografijo pisave, zaradi boljše čitljivosti uporabljajte temno pisavo na svetli podlagi, okoli tekstov uporabljajte prazen prostor, ozadje naj ne bo izstopajoče, uporaba grafičnih elementov mora popestriti vsebino, nikakor pa je ne sme zadušiti, grafični elementi in slike morajo biti zaradi dolžine nalaganja spletne strani optimizirani. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 16
5. Izdelave aplikacije 5.1. Podatkovna baza Najprej sem začela z izdelavo podatkovne baze, in sicer z uporabniškim vmesnikom MySQL-Front. Vmesnik olajša delo tako, da ni treba pisati ukaznih vrstic. Primeren je za vse, ki jim ukazi SQL niso znani, pa tudi urejanje in spreminjanje baze je z njim veliko lažje in preglednejše. Najprej sem ustvarila bazo dubitnje, nato pa tabelo izleti, ki vsebuje 6 polj. Vsako polje je definirano. Primarni ključ tabele je IDizlet, ki je definiran kot auto_increment, kar pomeni, da se vrednost tega polja samodejno poveča za 1 ob vsakem novem zapisu. Primer zapisa, ki ga naredi program za tabelo izleti: CREATE TABLE `izleti` ( `IDizlet` int(3) unsigned NOT NULL auto_increment, `IDvrstaizleta` int(3) unsigned NOT NULL, `datum` date NOT NULL default '0000-00-00', `naziv` varchar(100) NOT NULL, `opis` varchar(200) NOT NULL, `podrobneje` text NOT NULL, `objava` int(3) default '1', PRIMARY KEY (`IDizlet`)); Poleg omenjene tabele sem ustvarila še tri tabele in vpisala nekaj podatkov. Baza dubitnje je tako sestavljena iz štirih tabel z naslednjo vsebino: vrstaizleta (IDvrstazleta, naziv, opis, objava) izleti (IDizlet, IDvrstaizleta, datum, naziv, opis, podrobneje, objava) clani (IDclan, ime, priimek, ulica, stevilka, email, geslo, clan) prijava (IDprijava, IDizlet, IDclan, datumprijave, IP, opomba, status) Če pogledamo polja teh tabel, vidimo, da se nekatera ponavljajo. To pomeni, da so prek teh polj tabele povezane med seboj. Vzemimo za zgled tabeli izleti in vrstaizleta: V tabeli vrstaizleta sem zaenkrat določila tri oblike izletov in sicer: turisticni izlet (turistični izleti, nakupovalni izleti, kopanje...) planinski izlet (izleti v gore in hribe) dogodek (v to so vključena razna srečanja, prireditve, sestanki...) Vsako od teh polj ima svojo zaporedno številko (IDvrstaizleta), ki je hkrati tudi ključ tabele. Polje IDvrstaizleta je tudi v tabeli izleti. To pomeni, da se ob vnosu novega izleta temu določi tip. To nam omogoča poznejši izpis izletov glede na posamezno vrsto izleta (na primer: izpis samo planinskih izletov). Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 17
Slika 6: Prikaz sestave tabele vrstaizleta (Vir: Lasten vir) Slika 7: Prikaz podatkov tabele izleti (Vir: Lasten vir) Če primerjamo zapise na zgornjih slikah, vidimo, da polje IDvrstaizleta v tabeli izleti (slika 7), ki je enako 2, predstavlja planinski izlet, ki je definiran v tabeli vrstaizleta (slika 6). Nekaj podatkov je bilo vnesenih v tabele neposredno prek vmesnika, pozneje pa sem jih dodajala z obrazci na spletnih straneh, ki sem jih naredila v ta namen. Tudi bazo dubitnje sem kasneje dopolnila z dodatnimi tabelami (posta, novice, BAZA). 5.2. Spletne strani Spletne strani sem naredila s programom Dreamweaver MX, ki je razumljiv in pregleden ter ponuja dovolj možnosti in podpore za izdelavo spletnih strani. Izdelava spletne strani Spletna stran je razdeljena na tri dele, na tako imenovane okvirje (levi, zgornji in glavni). Levi in zgornji okvir sta fiksna in se njuna vsebina ne spreminja, medtem ko se vsebina glavnega okvirja spreminja ob kliku na povezavo. Povezave v levem okvirju so vedno vidne in tako dostopne v vsakem trenutku, v glavnem okvirju pa se nam v primeru daljšega besedila pojavi drsnik. V zgornjem okvirju je ime društva v prilagojeni velikosti in barvi pisave. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 18
Slika 8: Prikaz razdelitve spletne strani na okvirje (Vir: Lasten vir) Program omogoča praktično rokovanje, saj besedilo preprosto napišemo in določamo njegove lastnosti (velikost in barva pisave, vrsta pisave, poravnava ) izmed možnosti, ki nam jih program ponuja. Ni treba posegati v samo kodo HTML, saj jo program zapiše samodejno glede na našo izbiro. Seveda pa lahko spreminjamo videz in lastnosti besedila tako, da sami napišemo ustrezne ukaze v samo kodo. S tem imamo tudi več izbire, saj lahko uporabimo ukaze, ki jih Dreamweaver ne ponuja v svoji osnovni različici. Pri nalogi sem večinoma uporabljala slednjo možnost in sicer tako, da sem osnovno kodo, ki jo je program zapisal, dopolnila z dodatno kodo HTML ali z jezikom PHP. S pisanjem kode sem kasneje uredila tudi povezave oziroma gumbe. Lahko pa bi uporabila prvotno narejene gumbe, ki nam jih ponuja knjižnica programa, saj je njihova izdelava zelo preprosta. Izdelava gumba s programom: Izberemo možnost Insert Interactive images Flush button. Odpre se novo okno, kjer izberemo ustrezen gumb in vpišemo potrebne podatke: naslov gumba, določimo velikost pisave, barvo, stran povezave itd. Pri povezavah je treba paziti, da določimo pravo mesto (ang. target), kjer se bo stran naložila. Program ponudi možne opcije, med katerimi lahko izbiramo. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 19
Slika 9: Vnosna maska za izdelavo gumba (Vir: Lasten vir) Spletne strani so tematsko razdeljene in opisujejo delovanje društva. Na teh straneh večinoma prevladuje besedilo, del besedila pa predstavlja povezave na druge strani ali podstrani. Povezave vidimo kot podčrtano in drugače obarvano besedo, lahko pa videz povezav sami spreminjamo glede na svoje želje in potrebe. 5.3 Povezava spletnih strani in podatkovne baze Namen naloge je omogočiti povezavo med spletno stranjo in med podatkovno bazo. To pomeni, da lahko obiskovalec prek spletne strani vpiše podatke v bazo in da se na spletni strani prikažejo podatki, ki so v bazi MySQL. PHP skriptni jezik je tista vez med obema, ki pozna HTML na eni strani in poizvedbe SQL na drugi strani. S tem sem že narejene strani nadgradila ter vključila razne obrazce in tabele. Ukaz INCLUDE Vedno, kadar hočemo dostopati do podatkov v podatkovni bazi, se je treba najprej povezati z bazo in definirati spremenljivke, kot so geslo, uporabnik, baza itd. Ker je to treba izvesti v večini dokumentov, sem ustvarila poseben dokument mysql_open.php, katerega z ukazom INCLUDE vključim v nov dokument. S tem sem odpravila nepotrebno pisanje in najpomembnejše, v primeru spremembe ali napake, to popravimo samo v enem dokumentu, veljalo pa bo v vseh uporabljenih dokumentih. Zapis dokumenta mysql_open.php: <?PHP define("docroot", $_SERVER['DOCUMENT_ROOT']."/"); $host = "localhost"; $uporabnik = "dupetra"; $geslo = "***"; $baza = "dubitnje"; //echo "Povezava je uspela"; mysql_connect($host,$uporabnik,$geslo) or die ("Ne morem se povezati z bazo!"); //echo "Baza je izbrana"; Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 20
mysql_select_db($baza) or die ("Izbira baze ni mogoca"); $datum_temp = date("y-m-d", strtotime(date())); //trenutni datum $datum_cez_mesec = date("y-m-d", strtotime("+1 month")); //naslednji mesec?> Opomba: Geslo je v dokumentu zapisano, v nalogi je zaradi zaščite znak *. Stran Izleti Stran izleti in z njo povezane strani, so najpomembnejši del spletnih strani. Na stran sem vključila tabelo, v kateri so opisane vrste izletov, ki jih organizira društvo. Ko izberemo posamezno vrsto izleta (npr. planinski izleti), se odpre nova stran, na kateri se v tabeli izpišejo vsi planinski izleti. V izpisani tabeli se v polju podrobnejši opis nahaja povezava, ki prikaže podroben opis izbranega izleta. Obrazec za registracijo Obrazec za registracijo ima dve funkciji: uporablja se kot registracija člana in kot prijavnica za vpis v društvo. Obiskovalec posreduje svoje podatke, ki se zapišejo v bazo, v tabelo clani. Vsako registracijo mora skrbnik preveriti in poslati potrdilo na vpisani e-poštni naslov. Obrazec je sestavljen iz tekstovnih polj, v katera se vnesejo potrebni podatki. Za polje posta sem namesto tekstovnega polja uporabila padajoči meni (ang. drop down menu), v katerem se izpišejo podatki iz tabele posta, v kateri je seznam vseh poštnih številk v Sloveniji. Za uspešno prijavo je treba pravilno izpolniti obrazec, kar pomeni, da je treba izpolniti vsa polja in vnesti podatke v pravi obliki (npr. v polje ime se ne sme vnesti numeričnega podatka). V nasprotnem primeru se pojavi obvestilo, ki nas opozori na napako. Vneseni podatki se zapišejo v tabelo clani. Slika 10: Obrazec za registracijo (Vir: Lasten vir) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 21
Obrazec za prijavo na izlet Če se želimo prijaviti na izlet, se moramo torej najprej registrirati. Ko skrbnik pošlje potrditev registracije, se lahko prijavimo v sistem. Ob prijavi sistem v bazi preveri, ali je oseba s tem uporabniškim imenom res registrirana, preveri geslo in če so vsi podatki pravilni, se pokaže obvestilo o uspešni prijavi in lahko nadaljujemo s prijavo na izlet. Če podatki niso pravilni, sistem prijavo zavrne. Vse to je zapisano v dokumentu login.php in login_preveri.php, ki se nahaja v Prilogi 2. Ob uspešni prijavi se na levi strani, kjer se nahajajo gumbi, pojavita dva nova gumba Prijava na izlet in Odjava. Slika 11: Uspešna prijava pojavita se dva nova gumba (Vir: Lasten vir) Če izberemo gumb Prijava na izlet se prikaže obrazec, ki ponudi izlete, razvrščene glede na vrsto izleta in datum, ki je večji od trenutnega. Poleg padajočega menija je v obrazcu še tekstovno polje za razne opombe ali komentarje. Slika 12: Prikaz obrazca za prijavo na izlet (Vir: Lasten vir) Koda programskega dokumenta izlet_prijava.php se nahaja v Prilogi 3. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 22
5.4. Skrbniške strani Skrbniški del je ločen del od ostalih strani. V njem ima skrbnik vpogled v dogajanja s člani in izleti. Dostop do teh strani je zaščiten in varovan z geslom. Na teh straneh je skrbniku omogočeno: vnos novih izletov, pregled in urejanje izletov, vnos novih članov, pregled in urejanje članov, vnos novih novic, pregled in urejanje novic, iskanje po bazi podatkov za člane in izlete, pregled prijavljenih članov na izlete. 5.4.1 Obrazec za vnos izleta Za vnos novega izleta sem naredila obrazec s polji za vnos podatkov. Polje IDizlet sem izpustila, kajti številka zapisa se ustvari samodejno ob vsakem novem zapisu v bazo (to omogoča opcija auto_increment). Za polje Vrsta izleta sem zopet uporabila padajoči meni, v katerem se izpišejo podatki, ki jih dobim iz tabele vrstaizleta. Na dnu obrazca sta dva gumba, ki izvedeta neko dejanje ali shrani zapis v bazo ali pobriše vneseni tekst. Ko se podatki zapišejo v bazo, je skrbnik o tem obveščen, prav tako v primeru, če zapis ni bil uspešno izveden. Tudi v tem obrazcu se pred zapisom v bazo preveri pravilnost vseh vnesenih polj. 5.4.2 Iskanje po tabeli izleti ali po tabeli clani Iskanje v tabeli je možno prek obrazca, ki je temu namenjen. V vnosno polje vpišemo naziv izleta oziroma priimek člana, kot rezultat pa dobimo izpis vseh izletov oziroma članov, ki imajo v zapisu kombinacijo iskane besede. V prikazani tabeli poleg izpisanih podatkov obstaja možnost urejanja ali brisanja posameznega zapisa. S klikom na gumb Uredi se odpre nov obrazec, v katerega se prepišejo podatki izbranega zapisa. Ko spremenimo želene podatke, se s klikom na gumb Popravi v bazo vpišejo popravljeni podatki. Pred dokončnim brisanjem zapisa iz baze nas sistem vpraša za potrditev zahteve in šele nato se izvede izbris. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 23
Slika 13: Možnost urejanja vsebine izbranega izleta (Vir: Lasten vir) 5.4.3 Seznam prijavljenih na izlet Ko se člani prijavijo na izlet, se v tabelo prijava med drugim vpiše podatek IDclan in IDizlet. Ti podatki, v obliki številk, pri izpisu prijavljenih članov nimajo pravega pomena, saj ne vem, za koga gre in za kateri izlet. Zato je bilo potrebno izpis prijavljenih članov urediti. Koda PHP je sestavljena tako, da iz tabele clani izpiše ime in priimek člana na podlagi podatka IDclan iz tabele prijava, iz tabele izleti pa izpiše naziv izleta na podlagi podatka IDizlet v tabeli prijava. Poleg tega se iz tabele vrstaizleta izpiše podatek za kateri tip prijavljenega izleta gre. Ta podatek se dobi tako, da se med seboj poveže tabeli izleti in vrstaizleta preko polja IDvrstaizleta. Tako številke, ki ne povedo ničesar, zamenjajo smiselne besede. Poleg omenjenih podatkov se v tabelo prijava zapiše tudi datum prijave in IP za primer reševanja morebitnih nesporazumov. Koda programskega dokumenta prijava_pregled.php se nahaja v Prilogi 4. Slika 14: Prikaz prijavljenih na izlet v bazi (Vir: Lasten vir) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 24
Slika 15: Prikaz prijavljenih na izlet na skrbniških straneh (Vir: Lasten vir) Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 25
6. Težave in posodobitev spletnih strani Največja težava, na katero sem naletela, je bila ta, da se spletne strani niso osveževale pravilno. To pomeni, da se je ob vsaki osvežitvi pojavila osnovna stran in ne stran, na kateri smo bili nazadnje. To je problem okvirjev, kjer je združenih več strani. Čeprav je Dreamweaver do uporabnika prijazen program, ki omogoča enostavno oblikovanje, je treba za enoten videz vseh strani urejati vsak dokument posebej. Vsakokrat, ko sem se odločila spremeniti obliko nekega besedila, je to pomenilo spreminjanje večjega števila dokumentov. Delo je s širitvijo strani postalo preveč zamudno in možnost napak je bila vse večja. Zaradi vseh teh težav sem se odločila za oblikovanje strani na osnovi standardov CSS (Cascading Style Sheets). 6.1 Kaj je CSS? CSS (Cascading Style Sheets) je spletni standard, ki je logična višja stopnja v tehnologiji izdelave spletnih strani. CSS je s svojim prihodom pomenil velik preobrat pri izdelovalcih in pri uporabnikih, saj je na eni strani omogočal lažjo in prijaznejšo izdelavo, na drugi pa lepše, kakovostnejše ter do uporabnikov in iskalnikov prijaznejše spletne strani. Standard CSS je bil ustvarjen z namenom, da bi naredil stvari lažje, boljše, z veliko večjo razširitveno sposobnostjo, predvsem pa, da bi svetovni splet in izdelavo spletnih strani poenotil. Omogoča nam veliko večji nadzor nad izdelovanjem in optimiranjem spletnih strani, uporabnike pa pri deskanju po svetovnem spletu naredi zadovoljnejše. 6.1.1 Prednosti, ki jih prinaša CSS Odlična prilagodljivost pri oblikovanju Ker je CSS ločen od drugih dokumentov, nam to omogoča odličen nadzor nad videzom spletnega mesta. Če hočemo spremeniti določen del pojavnosti naše spletne strani (npr. barvo besedilnih povezav), moramo to storiti le enkrat v našem dokumentu CSS. Vse povezave na celotnem spletnem mestu, bodo spremenile svojo barvo. To nam seveda omogoča odlično prilagodljivost, saj imamo z enim dokumentom CSS nadzor nad ureditvijo spletne strani in oblikovanjem na celotni spletni strani. Hitrejši prenos spletnih strani na uporabniški računalnik Zaradi velike»lahkosti«dokumenta CSS se bo spletna stran v uporabnikov računalnik prenesla veliko hitreje. Glavni razlog je ta, da v dokumentu HTML (na spletni strani) ne bo podatkov o postavitvi in ureditvi elementov. Ker se besedilo prenaša zelo hitro, pomeni, da bo uporabnik spletno stran videl zelo hitro. To tudi pomeni, da bodo uporabniki na spletni strani zadovoljnejši, saj se dokument CSS prenese v uporabnikov računalnik le enkrat (na začetku), in se ta samodejno uporabi na vseh prenesenih podstraneh. V uporabnikov računalnik se med nadaljnjim brskanjem prenese le vsebina vsake podstrani. V praksi pomeni uporaba CSS-ja od 5- do 10-krat hitrejši prenos spletne strani v uporabnikov računalnik. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 26
Samodejno višje pozicije spletnih strani v rezultatih iskanj v iskalnikih CSS omogoča absolutno pozicioniranje elementov na spletni strani. To pomeni, če je navigacijski meni ali prvi odstavek na sredini dokumenta HTML (kode HTML), se lahko le-to z absolutnim pozicioniranjem postavi na sam vrh. To je koristno predvsem zato, ker iskalniki najpomembnejšo vsebino preberejo najprej (to je tudi eden od kriterijev, po katerem iskalniki vrednotijo vsebino po mestu, na katerem je vsebina). Druga prednost je ta, da je koda HTML veliko čistejša. Tako iskalnikom ni treba ločevati kode od vsebine. Rezultat je veliko natančnejše indeksiranje (branje) iskalnikov spletne strani. Združljivost spletnih strani z vsemi novejšimi brskalniki Uporabniki do svetovnega spleta dostopajo z različnimi brskalniki, zato je treba poskrbeti za to, da je spletna stran vidna v vseh največjih in vseh novejših brskalnikih. S spletnim standardom CSS (opredelil ga je W3C World Wide Web Consortium) spletni strani zagotovimo kakovosten in pravilen prikaz tudi v prihodnosti. Zaradi prevelikega števila brskalnikov je nemogoče, da bi spletno stran preverjali v vsakem od njih v vseh njihovih konfiguracijah, zato je izdelava spletnih strani po uradnih spletnih standardih edina praktična rešitev. Preprosto ustvarjanje tiskanju prijaznih spletnih strani Še ena prednost CSS-ja je, da lahko ustvarimo tiskanju prijazne spletne strani. To pomeni, da lahko, ko bi uporabnik želel spletno stran natisniti, s CSS-jem videz celotne spletne strani spremenimo (npr. celotno spletno stran, predvsem pa besedilo in ozadje spremenimo v belo in črno, umaknemo reklamne pasice in menije itd.). Vse, kar smo naredili, je, da smo na spletno stran dodali nov dokument CSS, ki ga lahko vklopimo ob uporabi tiskalnika. (Vir: http://www.izdelava-spletnih-strani.studiostyle.si/css2.html) 6.2 Potek nadgradnje spletnih strani Najprej sem spremenila postavitev in videz strani. Odstranila sem okvir in stran razdelila na tabele. Prednost tabel je v tem, da se ob osvežitvi strani naloži celotna stran, torej vse tabele in ne samo del strani, kot je to v primeru okvirjev. V skladu s trenutnim trendom so strani postavljene na sredino in niso več razpotegnjene čez celoten zaslon. V glavo sem za bolj privlačen videz vključila slike, ki se naključno menjajo in kar je najpomembnejše, ob osvežitvi strani ostanemo na isti strani. Vse to sem določila v dokumentu index.php, katerega vsebina se nahaja v Prilogi 1 diplomske naloge. Sledila je ureditev in prikaz elementov ter besedila spletnih strani. Določila sem lastnosti gumbov, obliko osnovnega besedila, videz povezav, tabel in naslovov. Vsi elementi so opredeljeni v enem dokumentu, imenovanem style.css, in jih nato preprosto vključim v preostale dokumente. Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 27
Slika 16: Del kode v datoteki style.css, ki prikazuje lastnosti gumba (Vir: Lasten vir) Slika 17: Prikaz datoteke menu.php (Vir: Lasten vir) Na sliki 17, ki prikazuje povezave oziroma gumbe, je razvidno, da je gumb ustvarjen z ukazom class = gumb, kot je poimenovan v datoteki style.css (slika 16). S tem sem povezavi določila vse lastnosti, ki sem jih predhodno določila v datoteki style.css. Na tak način sem poimenovala tudi ostale dele besedila (povezava, naslov, podatki itd.). Petra Bogataj: Spletna rešitev za potrebe društva upokojencev stran 28