22
SADRŽAJ 1. UVOD.....................................................................3 2. SPECIFIKACIJA POTREBA....................................................4 3. KORISNIČKI ZAHTJEVI......................................................5 4. SVRHA IZRADE STRANICE....................................................5 5. WEB STRANICA.............................................................5 1.1 Naslovna stranica....................................................5 1.2 Stranica O NAMA......................................................9 1.3 Stranica VIDEO......................................................12 1.4 Stranica AUDIO......................................................15 1.5 Stranica KONTAKT....................................................17 6. ZAKLJUČAK...............................................................19 7. LITERATURA..............................................................20 1

Web Programiranje Seminarski Rad

Embed Size (px)

Citation preview

Page 1: Web Programiranje Seminarski Rad

SADRŽAJ

1. UVOD...............................................................................................................................3

2. SPECIFIKACIJA POTREBA...................................................................................................4

3. KORISNIČKI ZAHTJEVI.......................................................................................................5

4. SVRHA IZRADE STRANICE.................................................................................................5

5. WEB STRANICA.................................................................................................................5

1.1 Naslovna stranica......................................................................................................5

1.2 Stranica O NAMA.......................................................................................................9

1.3 Stranica VIDEO........................................................................................................12

1.4 Stranica AUDIO........................................................................................................15

1.5 Stranica KONTAKT...................................................................................................17

6. ZAKLJUČAK.....................................................................................................................19

7. LITERATURA...................................................................................................................20

1

Page 2: Web Programiranje Seminarski Rad

1. UVOD

Helvetica je jedna od onih stvari koje ili volite ili mrzite. Dok je jedni smatraju klasikom dizajna i ultimativnom tipografijom, drugi misle da je suhoparna, neambiciozna i beskarakterna tipografija kapitalizma.

Autor Helvetice je slabo poznati švicarski dizajner Max Miedinger koji je slijedio uputstva Eduarda Hoffmanna i 1957. godine izradio prvu tipografiju po uzoru na šezdeset godina stariji njemački predložak i nazvao je Neue Haas Grotesk. 1960. godine preimenovana je u Helveticu (termin koji dolazi od latinskog imena za Švicarsku, Confederation Helvetica) za potrebe inter-nacionalnog tržišta.

Jedno je sigurno — od Helvetice ne možemo pobjeći. Švicarski dizajner Lars Müller naziva je “parfemom grada” je je prisutna u svakom urbanom kutu planete, od javne signal-izacije, korporacijskih logotipa, plakata za koncerte, mapa metroa, restoranskih menu-a, liječničkih uputstava, dnevnih časopisa, portala, ambalaža, pa do reklama i svega onoga što nam donosi bilo kakvu informaciju. Upravo zbog toga, mnogi smatraju da je Helvetica nabolji pri-jenosnik poruke jer je čitljiva, glatkih linija i neupadljive geometrije, očišćena od svih nepotreb-nih grafičkih dodataka, te ju je nemoguće poboljšati.

Jedan od naših prvih susreta s Helveticom je vjerovatno bio logo Gorenja na frižideru ili Iskre na telefonima iz vremena Jugoslavije. Zanimljivo bi bilo napraviti istraživanje o tome koliko je Helvetica prisutna danas u bosanskohercegovačkom i regionalnom dizajnu.

Oni koji izbjegavaju upotrebu Helvetice najčešće navode kao razlog da je Helvetica najbolji izraz duha vremena u kojem je nastala navodeći njen mehanički aspekt — mašinsko pismo lišeno elemenata kojima je izrađeno, te da je modernističko naslijeđe i elegantno rješenje u slučajevima kada dizajneri ne znaju koju bi tipografiju koristili. S druge strane, zagovarači Hel-vetice su mišljenja da je upravo mehanički aspekt Helvetice njena prednost jer je time napravljen veliki korak naprijed u odnosu na pisma 19.stoljeća, te da je s Helveticom tipografija prvi put postala neutralna, a neutralnost je bila ono čemu su dizajneri te generacije najviše težili — tipografija ne smije sadržati značenje, njega bi trebalo prepustiti tekstu.

2

Page 3: Web Programiranje Seminarski Rad

2. SPECIFIKACIJA POTREBA

Sam izgled,privlačnost i domišljatost web sranice zahtjeva nekoliko osnovih potreba za njenu implementaciju i zainteresiranost jer se radi o proizvodu od kojeg su mnogi drugi fontovi potekli ali nisu uspjeli da imaju taj izgled prepoznatljivosti.

Same potrebe traže mnogo informacija i poznavanje povijesti nastanka samog imena Helvetica,njenog stvaraoca i tok razvijanja i prepoznatiljivosti u širem krugu društva.

Osim tih informacija koje samo ranije saznali i prikupili materijale za obradu bez znanja za obradu podataka u ovome slučaju obrada i dorada pomoću programa za stvaranje web stranice potrebna su nam sljedeća znanja:

1. Osnovna znanja HTML programiranja2. Program u kojemu će mo editovati Notepad,Notepad++ 3. Browser preko kojeg će mo pratiti razvoj web stranice4. Photoshop,CorelDraw i drugi programi koji se mogu iskoristit za doradu fotografija

i razna dizajnerska rješenje. 5. Razni konverteri preko kojih će mo audio i video datoteke prilagođavati našoj web

stranici da bi bila brza i funkcionalna što nam je jedan od glavih ciljeva.

3. KORISNIČKI ZAHTJEVI

Da li je Helvetica zaista čitljiva ili samo prepoznatljiva tipografija? Zašto DA Helvetici i zašto NE Helvetici? Da li je Helvetica mainstream? Da li je savršena ili je dosadna? Da li je zaista neutralna i da li tipografija uopće može biti neutralna? Da li je kroz godine primjene poprimila potpuno paradoksalnu prirodu? Da li je Helvetica nehuman font? Da li je nevidljiva tipografija dobra tipografija?

Osim ovih ranije postavljenih pitanja još mnogobrojna su ostala ne odgovorena što će mo da se potrudimo da unesemo u našu web stranicu u kojoj će fotografije,video zapisi i sam web dizajn stranice mnogo toga razjasniti i otvoriti novi spektar znanja i zainteresiranost za ovaj avangardni font.

4. SVRHA IZRADE STRANICE

Kažu da s Helveticom nikada ne možete pogriješiti, ali nikad niste ni u potpunosti upravu. U dizajnerskom slengu često se čuje da dobar dizajner nikada ne može pomiješati Arial i Helveticu i da se, naravno, zgrožava na Comic Sans. Kada već spominjemo Comic Sans, Google je ove godine za 1. april napravio prank tako što vam je sve rezultate za pretragu riječi “Helvetica” izbacivao u Comic Sansu.

3

Page 4: Web Programiranje Seminarski Rad

Osim samog pisanja i raznoraznih obilkovanja teksta trebali bi voditi brigu i o tome kako će se to nekome svidjeti i da li će to zaista izledati onako koako smo mi zamislili kada to pustimo na internet ili to budemo čitali sa papira i drugih mjesta.

Bitno je razdvojiti bitno od nebitnog!U prethodnom tekstu mogli smo vidjeti da se stvara problem oko poznavanja fontova sa kojim svakodnevno radimo ili ih gledamo i čitamo.Za onoga tko je stvorio nešto čemu bi se drugi trebali diviti itekako je bitno.

Zato izrađujem web stranicu u kojoj ću pokazati da da je veoma bitno da znamo odakle potjeću ti simboli i znakovi koje mi svakodnevno gledamo i predstavljaju nam samo obične karaktere da bih pokazao da to i nije baš tako bezazleno i da je to netko pravio dugo vremena i da je ostalo zapisano u povijesti.

U narednom tekstu prikazat će mo izvorni kod stranice i njene dijelove.

5. WEB STRANICA

1.1Naslovna stranica

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HELVETICA - Mladen Topalovic</title> <link rel="stylesheet" type="text/css" media="screen" href="css/style.css" /><script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>

<script type="text/javascript">

/*** Simple jQuery Slideshow Script Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc. Please link out to me if you like it :)***/

function slideSwitch() { var $active = $('#slideshow IMG.active');

if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

// use this to pull the images in the order they appear in the markup var $next = $active.next().length ? $active.next() : $('#slideshow IMG:first');

// uncomment the 3 lines below to pull the images in random order // var $sibs = $active.siblings();

4

Page 5: Web Programiranje Seminarski Rad

// var rndNum = Math.floor(Math.random() * $sibs.length ); // var $next = $( $sibs[ rndNum ] );

$active.addClass('last-active');

$next.css({opacity: 0.0}) .addClass('active') .animate({opacity: 1.0}, 1000, function() { $active.removeClass('active last-active'); });}

$(function() { setInterval( "slideSwitch()", 5000 );});

</script>

<style type="text/css">

/*** set the width and height to match your images **/

#slideshow { position:relative; height:350px;}

#slideshow IMG { position:absolute; top:0; left:0; z-index:8; opacity:0.0;}

#slideshow IMG.active { z-index:10; opacity:1.0;}

#slideshow IMG.last-active { z-index:9;}

</style>

</head> <body> <div class="container"> <div class="wrap"> <div id="header"> <div class="naslov"> </div>

5

Page 6: Web Programiranje Seminarski Rad

<div class="banner"> <img src="img/banner.jpg" width="728" height="90"></img> </div> <ul id="menu">

<li><a href="index.html" title=""class="current">Naslovna</a></li><li><a href="o_nama.html" title="">O nama</a></li><li><a href="video.html" title="">Video</a></li><li><a href="audio.html" title="">Audio</a></li><li><a href="kontakt.html" title="">Kontakt</a></li></ul>

</div> <div id="content"> <div class="left"> <div id="slideshow"> <img src="img/slika.png" alt="Slideshow Image 1" class="active" /> <img src="img/slika2.png" alt="Slideshow Image 2" />

<img src="img/slika3.png" alt="Slideshow Image 3" /> </div> <div class="l"> <img src="img/s1.png" /> <h2>Helvetica WIKIPEDIA</h2> <p> Ovdje postoji najvjerojatnije najvise informacija o ovoj temi, tako da mozete pogledati na linku koji slijedi. <a href="http://en.wikipedia.org/wiki/Helvetica">...više></a> </p> </div> <div class="l"> <img src="img/s2.png" /> <h2>Helvetica slavi 50 godina</h2> <p> Najpopularniji font 20. stoljeæa helvetica ove godine slavi pedeseti roðendan. Tokom tog vremena, ova sveprisutna vrsta slova obilježila je vizualni identitet zapadnog svijeta - od provincijskih novina do logotipa Microsofta i reklama Lufthanse. <a href="http://www.sarajevo-x.com/scitech/tehnologija/clanak/070528043">...više></a> </p> </div> <div class="lz"> <img src="img/s3.png" /> <h2>Helvetica: A Documentary Film by Gary Hustwit</h2> <p> Sve o dokumentarcu koji je snimljen i priredjen u cast ovog slavnog fonta mozete pogledati na sljedecem linku. Jako je zanimljivo i vrijedi pogledati<a href="http://www.helveticafilm.com/">...više></a>

</p> </div> </div> <div class="right"> <img src="img/vrijeme.png" /> <div class="tekst"> <a href="#"> Helvetica WIKIPEDIA ... </a> </div>

6

Page 7: Web Programiranje Seminarski Rad

<div class="tekst"> <a href="#"> Helvetica: A Documentary Film by Gary Hustwit </a> </div> <div class="tekst"> <a href="#"> Helvetica slavi 50 godina </a> </div> <div class="tekst"> <a href="#"> Helvetica Regular Medium... </a> </div> <div class="tekst"> <a href="#"> Helvetica Bold... </a> </div> <div class="tekst"> <a href="#">Helvetica: 50 years in production </a> </div> <div class="tekst"> <a href="#"> Helvetica Black ... </a> </div> <div class="tekst"> <a href="#">Helvetica Light </a> </div> <div class="tekst"> <a href="#">Helvetica: Documentary on IMDB (2007) </a> </div> <div class="tekst"> <a href="#"><p>Helvetica from Switzerland</p>Ovo je paragraf </a> </div> </div> </div>

</div> </div> <div class="container">

7

Page 8: Web Programiranje Seminarski Rad

<div id="footer"> <div class="copy"> <p>&copy; Sva prava pridržana. Izradio Mladen Topalovic</p> </div> </div> </div></body></html>

1.2Stranica O NAMA

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HELVETICA - Mladen Topalovic</title><link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />

</head> <body> <div class="container"> <div class="wrap"> <div id="header"> <div class="naslov"> </div> <div class="banner"> <img src="img/banner.jpg" width="728" height="90"></img> </div> <ul id="menu">

<li><a href="index.html" title="">Naslovna</a></li><li><a href="o_nama.html" title="">O nama</a></li><li><a href="video.html" title="">Video</a></li>

<li><a href="audio.html" title="">Audio</a></li><li><a href="kontakt.html" title="">Kontakt</a></li></ul>

</div> <div id="content"> <div class="left"> <div class="left"><img src="img/vijest01.png" /><h2>Helvetica Love/Hate</h2><p>(text koji će biti prikazan na web stranici)

<br /><br /><br /><br /></p><img src="img/vijest02.png" /><p><br /><br />

<img src="img/vijest03.png" />

</p> </div> </div>

8

Page 9: Web Programiranje Seminarski Rad

<div class="right"> <img src="img/vrijeme.png" /> <div class="tekst"> <a href="#"> Helvetica WIKIPEDIA ... </a> </div> <div class="tekst"> <a href="#"> Helvetica: A Documentary Film by Gary Hustwit </a> </div> <div class="tekst"> <a href="#"> Helvetica slavi 50 godina </a> </div> <div class="tekst"> <a href="#"> Helvetica Regular Medium... </a> </div> <div class="tekst"> <a href="#"> Helvetica Bold... </a> </div> <div class="tekst"> <a href="#">Helvetica: 50 years in production </a> </div> <div class="tekst"> <a href="#"> Helvetica Black ... </a> </div> <div class="tekst"> <a href="#">Helvetica Light </a> </div> <div class="tekst"> <a href="#">Helvetica: Documentary on IMDB (2007) </a> </div> <div class="tekst"> <a href="#">Helvetica from Switzerland </a> </div> </div> </div>

9

Page 10: Web Programiranje Seminarski Rad

</div> </div> <div class="container"> <div id="footer"> <div class="copy"> <p>&copy; Sva prava pridržana. Izradio Mladen Topalovic</p> </div> </div> </div></body></html>

1.3Stranica VIDEO

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HELVETICA - Mladen Topalovic</title>

<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />

</head> <body> <div class="container"> <div class="wrap"> <div id="header"> <div class="naslov"> </div> <div class="banner"> <img src="img/banner.jpg" width="728" height="90"></img> </div> <ul id="menu">

<li><a href="index.html" title="">Naslovna</a></li><li><a href="o_nama.html" title="">O nama</a></li><li><a href="video.html" title="">Video</a></li>

<li><a href="audio.html" title="">Audio</a></li><li><a href="kontakt.html" title="">Kontakt</a></li></ul>

</div> <div id="content"> <div class="left"> <div class="lt"><h2>Helvetica - Official Trailer</h2>

<div> <object width="560" height="340"><param name="movie" value="http://www.youtube.com/v/wkoX0pEwSCw&hl=en_US&fs=1&color1=0x5d1719&color2=0xcd311b"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/wkoX0pEwSCw&hl=en_US&fs=1&color1=0x5d1719&color2

10

Page 11: Web Programiranje Seminarski Rad

=0xcd311b" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br>

<h2>Dokumentarni film helvetica (2007)</h2><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/aThDPDQCpa8&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/aThDPDQCpa8&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/sbuUThBasKw&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/sbuUThBasKw&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/Qq_2-iVpWvc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Qq_2-iVpWvc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/L7qv9IgSlW0&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/L7qv9IgSlW0&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/yzMgJnBCAfc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/yzMgJnBCAfc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0

11

Page 12: Web Programiranje Seminarski Rad

x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/8kQGtoFcbp0&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/8kQGtoFcbp0&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/558Fu233s6U&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/558Fu233s6U&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div><br><div><object width="560" height="340"><param name="movie"

value="http://www.youtube.com/v/9J0m_T5t8dc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/9J0m_T5t8dc&hl=en_US&fs=1&color1=0x3a3a3a&color2=0x999999" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="560" height="340"></embed></object>

</div>

</div> </div> <div class="right"> <img src="img/vrijeme.png" /> <div class="tekst"> <a href="#"> Helvetica WIKIPEDIA ... </a> </div> <div class="tekst"> <a href="#"> Helvetica: A Documentary Film by Gary Hustwit </a> </div> <div class="tekst"> <a href="#"> Helvetica slavi 50 godina </a>

12

Page 13: Web Programiranje Seminarski Rad

</div> <div class="tekst"> <a href="#"> Helvetica Regular Medium... </a> </div> <div class="tekst"> <a href="#"> Helvetica Bold... </a> </div> <div class="tekst"> <a href="#">Helvetica: 50 years in production </a> </div> <div class="tekst"> <a href="#"> Helvetica Black ... </a> </div> <div class="tekst"> <a href="#">Helvetica Light </a> </div> <div class="tekst"> <a href="#">Helvetica: Documentary on IMDB (2007) </a> </div> <div class="tekst"> <a href="#">Helvetica from Switzerland </a> </div> </div> </div>

</div> </div> <div class="container"> <div id="footer"> <div class="copy"> <p>&copy; Sva prava pridržana. Izradio Mladen Topalovic</p> </div> </div> </div></body></html>

13

Page 14: Web Programiranje Seminarski Rad

1.4Stranica AUDIO

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HELVETICA - Mladen Topalovic</title>

<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />

</head> <body> <div class="container"> <div class="wrap"> <div id="header"> <div class="naslov"> </div> <div class="banner"> <img src="img/banner.jpg" width="728" height="90"></img> </div> <ul id="menu">

<li><a href="index.html" title="">Naslovna</a></li><li><a href="o_nama.html" title="">O nama</a></li><li><a href="video.html" title="">Video</a></li>

<li><a href="audio.html" title="">Audio</a></li><li><a href="kontakt.html" title=""class="current">Kontakt</a></li></ul>

</div> <div id="content"> <div class="left"><div class="l"><img src="img/Cont.png" /></div><div class="l"><h2>Informacije</h2><br /><p>AUDIO FILE<br /></p></div><div class="lz"><<p>Ovdje ce svirati Axwell heart is king(radio edit) extenzija dokumenta je mp3 </p><EMBED SRC="117 - axwell - heart is king (radio edit).mp3" VOLUME="50" HEIGHT="60" WIDTH="144"></div> </div> <div class="right-k"> <img src="img/vrijeme.png" /> <div class="tekst"> <a href="#"> Helvetica light... </a> </div> <div class="tekst">

14

Page 15: Web Programiranje Seminarski Rad

<a href="#"> Helvetica Regular Medium </a> </div> <div class="tekst"> <a href="#"> PHelvetica Bold </a> </div> <div class="tekst"> <a href="#"> Helvetica Black... </a> </div> </div> </div>

</div> </div> <div class="container"> <div id="footer"> <div class="copy"> <p>&copy; Sva prava pridržana. Izradio Mladen Topalovic</p> </div> </div> </div></body></html>

1.5Stranica KONTAKT

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title>HELVETICA - Mladen Topalovic</title>

<link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />

</head> <body> <div class="container"> <div class="wrap"> <div id="header"> <div class="naslov"> </div> <div class="banner"> <img src="img/banner.jpg" width="728" height="90"></img>

15

Page 16: Web Programiranje Seminarski Rad

</div> <ul id="menu">

<li><a href="index.html" title="">Naslovna</a></li><li><a href="o_nama.html" title="">O nama</a></li><li><a href="video.html" title="">Video</a></li>

<li><a href="audio.html" title="">Audio</a></li><li><a href="kontakt.html" title=""class="current">Kontakt</a></li></ul>

</div> <div id="content"> <div class="left"><div class="l"><img src="img/Cont.png" /></div><div class="l"><h2>Informacije</h2><br /><p>Ako zelite jos saznati o ovoj temi<br />onda mi se mozete slobodno<br />na e-mail obratit.<br /><br />

e-mail: [email protected]<br /></p></div><div class="lz"><form id="contacts-form" method="post" action="mailer.php">

<fieldset> <div class="field"><label>Vaše ime:</label><input type="text" name="ime" size="19"/></div> <div class="field"><label>Vaš E-mail:</label><input type="text" name="email" size="19"/></div> <div class="field"><label>Naslov poruke:</label><input type="text" name="naslov" size="19"/></div> <div class="field"><label>Vaša poruka:</label><textarea rows="6" name="message" cols="15"></textarea></div> <div class="alignright"> <input type="submit" value="Pošaljite poruku" name="submit"/> </div> </fieldset> </form></div> </div> <div class="right-k"> <img src="img/vrijeme.png" /> <div class="tekst"> <a href="#"> Helvetica light... </a> </div> <div class="tekst"> <a href="#"> Helvetica Regular Medium </a>

16

Page 17: Web Programiranje Seminarski Rad

</div> <div class="tekst"> <a href="#"> PHelvetica Bold </a> </div> <div class="tekst"> <a href="#"> Helvetica Black... </a> </div> </div>

</div>

</div> </div> <div class="container"> <div id="footer"> <div class="copy"> <p>&copy; Sva prava pridržana. Izradio Mladen Topalovic</p> </div> , </div>, </div>, </body>, </html>

6. ZAKLJUČAK

Sa prostituiranjem Helvetice usko se veže mišljenje nekih dizajnera da Helveticu koriste oni kojima se ne da razmišljati koju bi tipografiju koristili. Što je toliko posebno u Helvetici da je i danas, nakon 54 godine postojanja, podjednako aktualna? Grafički dizajner Danny van den Dungen (Exper i mental Jetset) kaže “Kada je nešto dizajnirano tako dobro kao Helvetica, trebalo bi potrajati barem par stotina godina, baš kao velika arhitektura”.

Oni koji izbjegavaju upotrebu Helvetice najčešće navode kao razlog da je Helvetica najbolji izraz duha vremena u kojem je nastala navodeći njen mehanički aspekt mašinsko pismo lišeno elemenata kojima je izrađeno, te da je modernističko naslijeđe i elegantno rješenje u slučajevima kada dizajneri ne znaju koju bi tipografiju koristili. S druge strane, zagovarači Helvetice su mišljenja da je upravo mehanički aspekt Helvetice njena prednost jer je time napravljen veliki korak naprijed u odnosu na pisma 19.stoljeća, te da je s Helveticom tipografija prvi put postala neutralna, a neutralnost je bila ono čemu su dizajneri te generacije najviše težili tipografija ne smije sadržati značenje, njega bi trebalo prepustiti tekstu.

17

Page 18: Web Programiranje Seminarski Rad

7. LITERATURA

1. www.wikipedia.org

2. www.google.com

3. http://ftp.grf.hr/fontovi/helvetica/Helvetica.pdf ,

4. www.webstrategija.com

18