Prvi čas – Dreamweaver

Dragan Filipović Korak po korak, Kurs Comments (0)

Uvod

Dreamweaver (DW) je program koji pomaže u izradi web sajtova. 

Osnovni delovi DW-a su:

Menu Bar - File, Edit, Insert … – glavna navigacija.

Insert Panel – ikone za brzo ubacivanje različitih elemenata (slike, tabele, div, skripte, linkovi isl.)

Document tab bar – prikazuje otvorene fajlove (imena fajla) u tabovima. Ako je fajl promenjen a nije snimljen, pored imena fajla se pojavljuje zvezdica.

Document toolbar - prikazuje način pregleda fajla (code, split, design), i ostale korisne ikone – pregled fajla u brovseru, title …

Lenjiri (Rulers) - za pregled dimenzija elemenata

Status bar - za selektovanje elemenata, zum isl.

CSS panel – za brze izmene css-a

Files panel – za upravljanje fajlovima

Properties panel - Sadržaj ovog panela se menja u zavisnosti od objekta koji je selektovan (obrada teksta, slika isl.)

dw-delovi

 

 Lokalizacija

Pre početka rada sa Dreamweaverom potrebno je prilagoditi program. Edit -- Preferences

Prvo definišemo New document – vrstu dokumenta (XHTML ili HTML5) kao i default encoding – UTF-8.

preferences-newdoc

 

preferences-prewiev

Definisanje novog sajta

Pre početka rada na sajtu potrebno je definisati sajt. Kreiranje novog Web sajta u Dreamweaver-u podrazumeva definisanje lokalnog sajta na vašem računaru kako bi Dreamweaver znao gde da sačuva i nađe fajlove vezane za vaš sajt.

new_site

 

definisanje_sajta1

 

Site name - Ovde definišete ime novog sajta unutar Dreamweaver-a. Ovo ime obično predstavlja ime klijenta ili označava namenu Web sajta i služi samo vama, posetioci Web sajta ga neće videti.

HTTP Address - Ukucajte http://localhost/vas_root_folder

Ovo je vaša lokalna internet adresa.

Za potrebe kursa koristićemo lokalni server XAMPP, pa će nam se folderi preklapati, odnosno jedan isti folder će biti i Root folder i folder za skladištenje podataka na lokalu i folder za skladištenje podataka na serveru.

Yes, I want to use server teh…. JSP

Koristićemo različite vrste skripti.

Edit and test Localy

Where on your computer you want to store ur files? Izaberite vaš root folder.

What url would u use to browse… ukucajte http://localhost/vas_root_folder/

No, dont use remote server

Finish

Kreiranje novog dokumenta

Sada možemo da kreiramo prvu stranu sajta.

File — New — Blank page / HTML / Create

new-doc

 

Uvek kada kreiramo novi fajl, pre izmena potrebno je snimiti fajl. 

File -- Save as

Ime prve strane mora biti index, ostale strane sajta će imati proizvoljna imena, ali početna strana se mora zvati index.

 

Osnovni tagovi web strane

Osnovni tagovi web strane su:

<html>

<head>

</head>

<body>

</body>

</html>

 Odnosno strana počinje <html> tagom i završava se zatvarajućim </html> tagom. Strana ima dva osnovna dela HEAD i BODY.

U HEAD delu se nalazi funkcija strane, ključne reči, informacije isl, a u BODY delu se nalazi sve što je vidljivo na sajtu, tekst, slike, elementi isl.

Kada u Dreamweveru napravite novi HTML fajl automatski se pojave novi tagovi:

<!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>Untitled document </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>

<body>
</body>
</html>

 Prva linija koda predstavlja tip dokumenta – XHTML

Druga linija koda pored osnovnog html taga ima i deo www.w3.org -što znači da strana prati standarde svetske organizacije za razvoj interneta w3

U HEAD delu se nalaze još dve linije koda:

TITLE – Naslov strane

title

 

kao i META tag koji pruža informaciju o setu karaktera – UTF-8, što znači da na našem sajtu možemo koristiti nestandardne karaktere, za nas veoma bitna slova č.š isl. To je definisano u delu charset=utf-8, odnosno set karaktera je UTF8, što je međunarodni standard za karaktere, ne samo u web dizajnu, već za tekst uopšte.

Zadatak:

Napraviti Root folder na hostingu (u folderu C://xampp/htdocs). Prilagoditi DW (edit–preferences). Napraviti prvu stranu sajta (index.html). Strani dati naslov (Title). Pregledati sajt u browseru.

Sajt možemo pogledati u browseru ako stisnemo f12 (otvoriće se podrazumevani browser koji smo ranije definisali) ili preko ikone globusa koja se nalazi u Document toolbar-u.

Comments (0) Trackback from your site.

Dragan Filipović

Predavač na Kursu Web Dizajna - Web edukator.

Ostavi komentar

Morate biti prijavljeni da biste dodali komentar.