Израда веб страница | Увод
Јесте ли се икада запитали колико је потребно знања за једну класичну веб (web) страницу? Или можда, да ли је могуће све то научити путем интернета? Неке од вас ће мој одговор вјероватно изненадити, али да би научили направити једну класичну страницу само са HTML-ом и CSS-ом (касније ћемо објаснити шта је шта) потребно је мјесец дана учења.
Иако можете на разним огласима по интернету примјетити да постоје ‘академије’ (чак и у нашем региону) које траже огромну своту новца да би се научило нешто од тога, вјерујте – не вриједи. У наредном тексту ћемо обрадити могућност и исплатљивост учења веб дизајна и најавити нови серијал туторијала на овоме блогу
Зашто да учим како направити веб страницу?
Шта год да радите на интернету, у већини случајева, морат ћете посјетити одређену веб страницу, било да се ради о претрази за оним што вас занима (Google), комуницирању са пријатељима (Facebook), куповини (eBay) и сл. Када говоримо о самом почетку веб страница, прво су служиле за подјелу научних радова. А данас?! Готово за све.
На примјер: отворили сте трговину са рачунарском периферијом. Веб страница ће омогућити свима да погледају шта имате у понуди, а ако сте омогућили и онлајн куповину онда ћете повећати свој обим пословања. С једне стране, ако сте у овој позицији онда нећете морати дати одређену своту новца некоме да вам направи веб страницу, а с друге стране, можда ви будете особа од које ће друге особе тражити да јој направите веб страницу. Сматрам да ће знање о веб дизајну бити свима од велике користи.
Најбоље мјесто за учење
Као што сам рекао у уводу, без новца не можете научити пуно тога на квалитетан начин. На енглеском језику има богата понуда туторијала, али ако узмемо у обзир да већина данашњих корисника на нашим просторима не зна енглески језик у мјери да би се преко њега едуцирао, онда ћемо се фокусирати на ‘српскохрватски’ језик.
Прије него што кренемо даље, ако неко зна енглески језик добро и жели да уложи у своју едукацију, онда препоручујем да се регистрира на Treehouse (teamtreehouse.com). За 25$ мјесечно имате богату понуду туторијала који су јако добро одрађени. По мом мишљењу – најбоља веб страница за учити девелопмент.
Истраживао сам по Google-у (глумећи особу која жели научити веб дизајн) куцајући „html туторијали“, „како направити веб страницу“ и сл. да је понуда веома стара и неквалитетна. На првој страници претраге нисам нашао оно што сам тражио.
Уствари, нашао сам пар туторијала на којем неки клинац мрмља (без увреде момак, али чим сам те чуо одмах сам зауставио туторијал) или пак како неко објашњава како да путем веб са направите у ПАР КОРАКА веб страницу (уз хрпу реклама и сл. глупости).
Управо због тога одлучио см да покушам кроз пар туторијала објаснити FeD (front end development) на овоме блогу. Прије свега, прећи ћемо саме основе, а потом прећи на мало теже теме. Након тога имат ћете јаку основу, али и могућност да на једноставан начин ширите своје знање.
Све је то замишљено на принцип да објашњавам код, а да с тим кодом правимо веб страницу. Након што је направимо, објаснићу вам гдје да тражите још ‘команди’ (касније ћемо прећи на стручне изразе) које ћете моћи имплементирати у наредним пројектима.
WordPress?!
Вјероватно не желите да се замарате пуно са кодом и да трошите своје вријеме на програмирање због одређених разлога. Претпоставио сам и да има таквих па сам одлучио и да паралелно са FeD-ом водим и основе WordPress администрације тако да укратко научите како управљати неком готовом WordPress страницом. Обрадићемо и најчешће проблеме, must-have додатке и сл. Претпостављам да ће ово стати у 2 туторијала.
Припрема за серијал
У наредном туторијалу кренут ћемо одмах са кодом па било би добро да одмах сад набавите све потребно јер тамо нећу то објаснити, него само реферирати на овај чланак.
Код можете писати и у Notepad-у, али ја ћу користити текст едитор који се зове Brackets. Инсталација је веома једноставна. Отворите сету и идете само next и то је то.
Ако има и напреднијих корисника, свакако препоручујем да скинете MAMP тако да имате и неки сервер.
И то је то!
Завршна ријеч
Како вам се свиђа идеја? Да ли сте ви од оних који желе да науче нешто од горе споменутог? Свака киритика и приједлог ће свакако бити од велике користи. Хвала вам ако сте прочитали чланак до краја и ‘видимо се’…
Живјели!
rada
04/05/2015 @ 09:29
Divno je da dobijemo još jedan tutorijal za HTML i CSS, pa i WP.
Nisam razumela da li će Alem objasniti HTML i CSS preko WP, ili odvojeno, jer u suštii WP je PHP. Tu je malo nejasan.
To može učenike zbuniti.
Pogledala sam teamtreehouse, ali ne vidim pregled koje programe nude za učenje. ipak našla spisak…
Zbog toga bih samo da dodam na ovaj Alemov predlog još jedan odličan online tutorijal, idealan za učenje, ne samo HTML i CSS, nego mnoštvo drugih softvera, a isto za malo novca:
digitaltutors.com
Ne želeći nikako da umanjim vrednost Alemovog truda, unapred, nego samo kao za dodatno učenje, imamo mi i na srpskom dobrih predloga za HTML i CSS, ne bih ja njih preskočila:)
Pogledati na YT:
Prvi je :
Kako napraviti sajt? | Dreamweaver lekcije | PART 1
Drugi:
HTML Tutorijal – 1. Kako skinuti text editor
Treći:
HTML tutorijal – Osnove html kodiranja #1
Srećno, pratim vas 🙂
Alem
04/05/2015 @ 10:01
Drago mi je da Vam se sviđa ideja. Što se tiče Vaše nejasnoće; ja ću objasniti HTML i CSS odvojeno, a za one koji ne žele da uče to sve od početka itd. onda ću objasniti osnove WordPress ADMINISTRACIJE, što znači da učenje PHPa u ovome slučaju neće biti potrebno.
Najbolje bi bilo da na Treehouse aktivirate trial account koji će trajati 7 dana pa da se upoznate sa njihovom ponudom bolje i onako iz prve ruke, jer HTML i CSS je samo jedan od većeg broja mogućnosti za učenje.
Znam da je u jednu ruku lakše učiti i preko klipova, toga sam se već gore dotakao, ali smatram da to nije dovoljno dobro jer sam prvi ja učio tako i vidio da ne ide. Ali to sam samo ja.
Ukoliko bude prijedloga, može se u tekstovima, pored objašenjenja i svega, dodati YouTube video na kojem ću „demonstrirati“ naučeno, čisto da ne pišemo po sajtu previše koda. Ali o tome kasnije, tek je početak. Vidjećemo šta će drugi reći.
rada
04/05/2015 @ 10:25
Potpuno se slažem s tobom (da budemo manje formalni 🙂 )
da je učenje samo preko video sadržaja/tutorijala nedovoljno.
Ja učim decu u Komp Kampu HTML i CSS i jedva čekam i tvoj tutorijal,
da deca imaju veći izbor za učenje.
( i ja učim svakodnevno, toga nikada nije višak 🙂 ).
Btw. odličan ti je izbor editora (Y)
Čekamo nastavak.
Gospodin Popara
04/05/2015 @ 10:40
Hvala kur*u da se neko sa ovih prostora setio da piše o web tehnologijama. Svi znaju a čuvaju znanje ko zmija noge.
Hvala Alemu!
X
04/05/2015 @ 16:49
Ovo si nas samo naložio da čekamo sledeći tekst? :o)
elementhttp
05/05/2015 @ 00:52
Evo par dobrih kanala:
– phpacademy back-end
https://www.youtube.com/user/phpacademy
– DevTips -front-end design
https://www.youtube.com/user/DevTipsForDesigners
-TheNewBoston -tutorijali za pocetnike
https://www.youtube.com/user/thenewboston
Alem
12/06/2015 @ 00:52
Prije davno sam gledao TheNewBostona i mogu reći da super objašnjava. I dan danas se sjećam nekih njegovih savjeta, kao npr. da ne koristimo tag nego jer koriste samo totalni početnici i tako dajemo loš dojam o sebi kao developeru pred stručnjacima itd itd 🙂 Preporuka svakako, hvala na listi.1
Alem
12/06/2015 @ 00:54
Lapsus 🙂
Da ne koristimo BOLD nego STRONG jer BOLD koriste samo …*
Ajvan Trejs
05/05/2015 @ 16:34
Moze, bravo!
Ajvan Trejs
14/05/2015 @ 17:48
Šta bi? 😀
Alem
12/06/2015 @ 00:48
Kratka pauza zbog školskih i poslovnih obaveza! Nastavak bi već danas trebao biti na stranici ako sve bude kako treba. 🙂
Milos M
08/06/2015 @ 15:49
Cekamo sa nestrpljenjem!
Alem
12/06/2015 @ 00:47
Drago mi je to čuti! Nastavak tutorijala je napisan i čeka se da ga Darko provjeri i objavi danas/sutra ako sve bude u redu.
Goran
05/10/2015 @ 16:23
Kad krece ovo. Jedva cekam.
Компјутераш блог
05/10/2015 @ 16:29
Gorane,
Alemovi tutorijali se nastavljaju na njegovom sajtu koji počinje sa radom: http://tutorijalend.com
Goran
08/10/2015 @ 14:28
Hvala Darko