Izrada sajta.Šta je HTML a šta CMS?

Posle dobro isplaniranog sajta na red je došla najbitnija faza, a to je njegova izrada. Osnova za kreiranje web stranice je poznavanje HTML-a (HyperText Markup Language). Osnove HTML-a možete savladati za svega par dana a kasnije. Sve što je potrebno za početak imate na Vašem računaru a to je tekst editor (Notepad) i Web browser koga već imate. HTML služi za izradu stranice a izgled se definiše pomoću CSS-a. Najpoznatiji sajt za učenje HTML-a je W3school , preko koga izmedju ostalog možete da učite i ostale programske jezike.

U današnje vreme izrada sajta je napredovala pa su se samim tim razvili i alati koji prate razvoj i izradu web stranica. Neki od najpoznatijh alata za izradu stranica su dreamweaver koji je namenjen naprednijim korisnicima ,  Front Page, OpenWebware, Cofee Cup za one sa malo manje iskustva i jedan od poznatijih za izradu flash sajtova je  WIX.  Ovi alati se jos nazivaju web site builders. Neki od njih su integrisani u Cpanel Vašeg hosting provajdera a drugi su softver koji se kao i svaki program nalazi na Vašem kompjuteru odakle ćete kreirati offline web strane. Nakon kreiranih stranica sledeći korak je objavljivanje istih na internet. Spisak ovih alatki i njihovo poredjenje pogledajte ovde

Izrada HTML strana

HTML se generiše uz pomoć tzv tagova. Svaki tag počinje zagradom „<“ i završava sa „>“ (bez navodnika). Svaka HTML strana se sastoji od početnog <html> i završnog </html> taga. Najveći broj tagova ima „/“ i  time se završava.Dakle, otvorite Vaš tekst editor i iskopirajte sledeći kod :

<html>
<head>
<title>Naziv web strane</title>
</head>
<body>
Tekst koji će se videti na stranici
</body>
</html>


zatim sacuvajte iz vašeg editora : File -Save page As i nazovite je index.html. Početna strana ima naziv  index.html a onda se ostale stranice povezuju linkovima na nju.Ovo je samo mali delić onoga što može HTML.

Izrada web strane u Front Page-u


Vrlo je bitno kako nazivate stranice i foldere u kojima se one nalaze jer će posetioci dolaziti na web stranu najviše sa pretraživača. Dalje, trudite se da ne pravite veliki broj foldera a sve stranice bi najbolje da budu što bliže domenu.

Neispravno :

www.primer.com/folder/nesto/bla/kontakt.html

Ispravno:

www.primer.com/kontakt.html

www.primer.com/nekiproizvod/

O nazivima fajlova čitaćete u nekom od narednih postova kada budem pisao o promociji sajta i optimizaciji za pretraživače.

WEB aplikacije

Ukoliko ste savladali osnove HTML-a mogli bi da probate i neke od najpopularnijih web aplikacija  kao što su Joomla, WordPress , SMF ili Elxis. U principu za rad sa ovim aplikacijama nije potrebno da znate nijedan programski jezik i još se nazivaju Content Managment Systems (Sistemi za upravljanje sadržajem). Uprošćeno rečeno za instalaciju i rad sa ovim programima potrebno je da imate fajlove i bazu koju dobijate od vašeg hosting provajdera.

Ono što ove CMS-ove čini privlačnim je lako korišćenje  i upravljanje sadržajem (tekst, slika, video) , veliki izbor dodataka za iste i veliki izbor već spremljenih templejta. Svaki od njih ima svoj administracioni deo gde ulazite pomoću svoje šifre i nadimka. U admin panelu dodajete pluginove, kreirate članke i menjate izgled vaše stranice.

Joomla i Elxis

Joomla
joomla logo

Joomla i Elxis namenjeni su pre svega onima koji žele da imaju svoj portal i  na njemu plasiraju vesti iz neke kategorije. Slični a ipak različiti. Joomla ima mnogo više dodataka dok je glavna odlika Elxisa višejezičnost i mogućnost da se kreiraju zasebne stranice. Uglavnom, dok ne isprobate svaki od ovih CMS-ova nećete znati koji vam najviše odgovara. Primer Joomla stranice je i BalkanRock portal koji postoji skoro 3 godine i koji se redovno ažurira i pruža informacije svojim posetiocima. Odličan  tutorijal o Joomla-i skinite ovde

SMF

Verovatno ste videli veliki broj foruma gde su odredjene teme poredjane po kategorijama ili podforumima. Jedan od takvih je i niški forum . U principu, proces instalacije je sličan kao i kod svake pomenute aplikacije  – u instalacioni fajl ubacite podatke i povežete fajlove i bazom i već nakon toga u svom administracionom panelu počinjente sa kreiranjem kategorija (podforuma). Dobra strana foruma je to što vaš sadržaj stvaraju drugi korisnici a loša ta što na taj sadržaj ne možete da utičete previše. Forumi spadaju u kategoriju tzv. UGC sajtova .

WordPress

Moj omiljeni CMS. Blog koji čitate je na wordpress platformi. Zamišljen je kao softver za blogove medjutim wordpress je vremenom evoluirao u nešto mnogo više pa je sada praktično moguće da od njega napravite i online Wordpressmagazin, web shop ili jednostavno unapredite vaš blog. WordPress je možda i najbolje optimizovan za pretraživače i vrlo je lagan za korišćenje. O instalaciji WP-a smo već pisali . Struktura WP-a je podeljen po kategorijama i tagovima tako da jedan post može biti označen na više načina.

Ovo je najkraći prikaz web aplikacija koje sam odabrao po svom nahodjenu jer su najpopularnije i najlakše za korišćenje. . Spisak ostalih CMS-ova pogledajte na Wikipediji i odaberite onaj koji vama odgovara. Svaka od njih ima svoje prednosti i svoje mane u odnosuna ostale, a ako vremenom postanete malo bolji u korišćenju istih onda na jednom domenu pored vaše prezentacije dodajte i blog ili forum. Naravno pre toga, dobro isplanirajte vaš sajt i znajte šta želite. Najčešća greška koju prave početnici je da ne znaju šta žele ili odaberu kategoriju koja je previše „široka“ a nisu dovoljno upoznati sa materijom. Zato , krenite polako, korak po korak.

Postavljanje sajta i FTP programi

Nakon što ste napravili Vaš sajt, registrovali odgovarajući domen, našli pouzdan hosting vreme je da Vaš domen osvane na Internetu kako bi konačno posetioci mogli da vide  produkt Vašeg rada. Dakle, ono što sada trebate da uradite jeste  da transferujete sadržaj  sajta na  server hosting provajdera odnosno na prostor na disku koji je određen odabranim web hosting paketom. Ova procedura transferovanja podataka obavlja se uz pomoć FTP (File Transfer Protocol). FTP protokol omogućava razmenu podataka između računara, kao i prebacivanje (upload)  fajlova na server i skidanje (download) fajlova sa servera.

FTP softveri

Jedni od najpopularnijih besplatnih  ftp softvera su svakako FileZilla, SmartFTP , Cute-FTP . Nakon što ste ubacili prilikom konfigurisanja Vaše FTP korisničko ime i šifru dobićete prozor koji u mnogome podseća na dva računarska hardiska, pri čemu jedan od njih predstavlja lokalni disk na vasem računaru, a drugi, udaljeni  disk na serveru. Sve što treba da uradite je da prebacujete fajlove sa  jednog diska na drugi. Naravno prenos je dvosmeran, tako da sem sto možete vršiti upload Vaših fajlova na server isto tako možete skinuti ceo sajt sa servera i izvršiti odgovarajuće promene.

Uputstvo za korišćenje FileZille

Nakon što ste skinuli sa sajta i  instalirali FileZillu  potrebno je da napravite FTP nalog uz pomoć Vašeg hosting naloga. Brza konekcija na FTP server omogućena je QuickConnect barom gde je potrebno upisati podatke iz Vašeg ftp naloga što obično podrazumeva:

  1. host (u našem primeru ftp.bezicni-internet.rs)
  2. korisničko ime
  3. šifra
ftp konekcija

Nakon popunjavanja odgovarajućih podataka klikom na dugme QuickConnect povezujemo se sa serverom tako da veoma brzo testiramo konekciju sa serverom. Onda iz glavnog menija idemo na File -> „Copy current connection to Site Manager pri čemu pravimo ulaz za novi sajt.

Korišćenje Site Manager-a

Site Manager omogućava uopšte korisnicima FileZille klijenta da čuvaju informacije o FTP sajtovima kao i  definisanje  još dodatnih parametara.

site manager
site manager

Sa leve strane biramo sajt na koji cemo da se povežemo pri čemu kad ga odaberemo možemo da ga editujemo, da promenimo ime, brišemo ili kopiramo. A sa desne strane imamo 4 opcije pri čemu u prvoj General obično definišemo:

  • host (pr. ftp.vašsajt.rs)
  • port (samo ukoliko se razlikuje od podrazumevanog  21)
  • tip ftp servera na koji se povezujemo (FTP ili SFTP)
  • korisničko ime (kojim se konektujemo na server)
  • šifra

U drugoj opciji Advanced definišemo direktorijum u lokalu koji se vidi kad se konektujemo na server npr D:/sajtmaster, kao i direktorijum na serveru odnosno root direktorijum npr /public_html.

Sledeća opcija Transfer Settings omogućava nam  da definišemo tip prenosa, dok  se u opciji Charset definiše tip kodiranja karaktera koji će se koristiti u komunikaciji sa serverom.

Transfer fajlova

Transfer fajlova se može vršiti na više načina. Jedan od njih je i prikazan na slici na fajl koji želite da prebacite na server kliknete desnim klikom i idete na opciju upload.

ftp-upload
ftp-upload

Još jednostavniji način za transfer fajlova je jednostavnim prevlačenjem fajla iz jednog panela u drugi. U donjem  delu možete pratiti progres vaših transfera, odnosno  u opciji Successful transfer močemo videti koliko njih je uspešno obavljeno.

Planiranje sajta

Planiranje-sajta
Planiranje sajta

Nakon što ste odlučili kako će se zvati Vaš sajt, prateći naša uputstva o izboru domena , izboru hosting paketa možete krenuti sa planiranjem Vašeg sajta.  Planiranje web sajta je svakako najvažniji deo  u procesu njegove izrade. Bitno je da znate šta želite da prikažete posetiocima , kako internet funkcioniše i da imate realna očekivanja o tome kako Vaš sajt može da izgleda. U ovom tekstu ćemo naglasiti šta bi trebalo i šta ne bi trebalo da radite prilikom izrade web sajta.

Prva stvar kod koje većina pravi grešku jeste da ne planiraju uopšte web sajt. Pre nego što počnete stavite na papir odgovore na pitanja : Kako želim da izgleda moj sajt ? Kome je namenjen ? Koje su ključne reči i pojmovi koje najbolje opisuju sajt?Da li je sajt edukativan ? Kako treba biti dizajniran ? Da li ce biti interaktivan ili ne ?

Ako nemate jasan plan biće Vam potrebno mnogo više vremena da ostvarite Vaše ciljeve kao i da obezbedite posetiocima ono što žele da nadju. Kada krenete da radite sajt , radite stranu za stranu posebno i dok ne završite svaku kompletno nemojte prelazite na sledeću. Ovo važi kako za obične  (HTML) prezentacije tako i za blogove  i ostala CMS rešenja. Vaš sajt može biti prezentacija , lična ili poslovna , blog ili forum , kao i neka internet prodavnica.

Sadrzaj i struktura sajta

Kada pocinjete sajt morate imati u vidu na koji nacin ce biti rasporedjen sadrzaj (teks, slike , video). Primera radi vi zelite da napravite statican sajt u HTML-u koji ce biti vasa internet prezentacija.  Verovatno najvazniji deo planiranja sajta je struktura sajta odnosno kako cete rasporediti sadrzaj u logicke jedinice (Pocetna strana, ostale stranie,  Meni, linkovi, slike , video materijal i dr. ) .

Uvek je pozeljno kreirati graficku semu odnosno mapu sajta, sto ce vam pomoci u sagledavanju logicke hijerarhije, a takodje ostalima pojasniti strukturu vaseg sajta.

Planiranje sajta
Prikaz planiranja sajta firme koja se bavi hostingom, web dizajnom i ostalim uslugama

Navigacija

Moderni websajt sada podrazumeva prisustvo mnogo veb aplikacija kao sto su Facebook, Youtube, Google maps itd. Ali kako Vas sajt postaje slozeniji postaje jako bitna organizacija i navigacija sajta kako bi se Vasi posetioci lakse snalazili na njemu. Svrha navigacije je da Vasi posetioci mogu da nadju ono sto zele i to veoma brzo.

Dobro i precizno organizujte Vas sajt u vidu glavnog menija i primarnih linkova do strana, pod-navigacije kao i mogucnost pretrazivanja ukoliko Vas sajt ima forum ili blog.

Dizajn

Prvi pogled na Vas sajt kao celinu je veoma bitan. Posetioci ce u prvih 15 sekundi vizuelno procenjivati Vas sajt na osnovu same strukture, boja, oblika i ukoliko im on izgleda konfuzno i neatraktivno nece procitati nijednu jedinu rec. Vecina  ljudi gresi misleci da je dizajn prvi korak u pravljenju sajta, jer ne mozete razmisljati o dizajnu, dok neznate sta  dizajnirate. Razmisljanje o sadrzaju i strukturi sajta je uvek na prvom mestu.

Definitivno, najbolja solucija je da počnete sajt sa nekoliko strana a kasnije da krenete sa dodavanjem i ostalih kako  bi što pre bili online. Ukoliko krenete sa mnogo strana odjednom izgubićete dragoceno vreme. Nijedan sajt nije u potpunosti završen i uvek je poželjno dodavanje novog sadržaja i ažuriranje postojećeg kako bi ste se najbolje moguće pozicionirali na pretraživačima. Ukoliko imate sajt sa puno strana vrednih i korisnih informacija to je upravo ono što vole i  posetioci i pretraživači.Imajte na umu da pored dobro optimizovanog sajta za pretraživače pre svega sadržaj stvarate za ljude tj. vaše posetioce.