besplatni online kursevi web dizajna

besplatni online kursevi web dizajna

Besplatni online kurs web dizajna

HTML, CSS, photoshop, JS, Bootstrap - video i pisani materijal - izvorni kodovi



Nastavne jedinice - linkovi ka video i pisanim nastavnim jedinicama

Besplatni online kurs web dizajna Besplatni online kurs web dizajna Besplatni online kurs web dizajna Besplatni online kurs web dizajna

Besplatni online kurs web dizajna firme TEKOMS ima veoma jednostavan način učenja. Kompletna online obuka je sastavljena od nastavnih jedinica koje su u video ili pisanoj formi. Preporuka je da se sve nastavne jedinice pregledaju hronoških redom. Skoro svaku video nastavnu jedinicu prati i odredjeni fajl koji nosi naziv nastavne jedinice sa svojim izvornim kodom.

Pratite nas na Facebook-u - akcije, popusti

Uvod - početak izrade web stranice


Uputstvo kako se uči online obuka i prateći materijal

Besplatni programi za online kurs web dizajna

1. Koji program koristiti za web dizajn

2. Struktura i organizacija web sajta

3. HTML - osnovna struktura web strane

4. DIV TAG - kreiranje osnovne konstrukcije web stranice

5. CSS - stilovi (Klase)

5-1. Primeri konstrukcija web strane

6. Header - ubacivanje slike u HTML kod

7. Navigacija - struktura navigacije

8. Formatiranje sadržaja web strane

9. Ubacivanje slike u tekst

9.1. Fajl .htaccess - linkovi bez ekstenzije

10. Linkovi- vrste linkova (tekst, slika, email)

11. Tabele - rad sa tabelama

12. Galerija slika

13. Google mapa

13.1. Mape bez API key (pisani materijal)

14. Slide Show

15. Testiranje web sajta

16. Testiranje web sajta - 2 deo

17. Dodatno stilizovanje teksta

18. Hover efekti

19. Web boje

20. Google fonts

21. Div tagovi kao LINK

22. Jednostavna navigacija

23. Jednostavna navigacija sa padajućim podmenijem

24. Photoshop - Uvod u radno okruženje

25. Photoshop - Rezolucija, bitmap

26. Photoshop - Selekcija u Photoshopu

27. Photoshop - Layers

28. Photoshop - Erase Background

29. Photoshop - Optimizacija slike

30. Photoshop - Tekst - rad sa tekstom

 

Dodatni elementi na web stranici


31.1. Slide Show - slider u par klikova

31.2. Slide Show - galerija

31.3. Slider properties

31.4. Slider – ubacivanje u HTML kod

32. Response ili mobil dizajn

33. Organizacija mobil verzije

34. Struktura HTML strane za mobil verziju

35. Media queries – stilovi prema rezoluciji

36. Testiranje dizajna u rezolucijama

37. Optimizacija

37.1. Optimizacija web sajtova u 10 koraka

37.2. Greške kod optimizacije web sajtova

38. Sitemap - izrada mape sajta

39. Prebacivanje prezentacije na server

40. Web dizajn - šta dalje ?

41. Kontakt formular

42. Horizontal Scroller - listanje proizvoda

43. Top Scroll Button

44. Tekstualni Slider

45. Accordion Slider

46. Animacija teksta u HTML-u

47. Animacija slika u HTML-u

48. Div Tag u kolonama

49. Response web dizajn

50. Response navigacija

51. Statični DIV TAG

52. Pomerajući (galerijski DIV TAG)

53. Pomerajući DIV TAG - na primeru navigacije

54. Background Slide Show

55. Animirane ikonice

55.1. Error page (404)

55.2. Video u HTML kodu

55.3. HTML TAG - OUTPUT

55.4. HTML TAG - PROGRESS

55.5. HTML TAG - DATALIST

 

 

 

Lajkujte online obuku !

Ako ste do sad zadovoljni besplatnom online obukom odnosno načinom učenja možete kliknuti na LIKE na početku stranice.

 

 

Bootstrap, JS efekti i neki trikovi


88. Uvod - šta je Bootstrap ?

89. Osnovna konstrukcija - pozivanje Bootstrap klasa

90. Navigacija preko Bootstrapa klasa

91. Klasa Carousel - slide show

92. Klasa Jumbotron - header panel

93. Klasa - kolone

94. Klasa - kolone II

95. Zaključak

96. Šta je Javasript i JQuery ?

97. Efekti na klik mišem

98. Selekcija na klik mišem

99. Efekti na prelazak mišem

100. Animacija na klik mišem

101. HTML manipulacija - zamena teksta

102. Hover efekat - prelaskom miša

103. Klik button efekti

104. Klik button efekti II

105. Disable komande

106. Drop Down panel

107. Jednostavan Datepicker

108. TAB panel

109. Autocomplete kod pretrage

110. Brojač - counter

111. Dizajn Newsletter-a

112. Osnovna konstrukcija

113. Dizajn Newsletter-a

114. Dizajn Newsletter-a (nastavak)

115. Ubacivanje Newsletter-a u email

Trick 1 - Drop Caps u HTML-u

Trick 2 - Tooltips u HTML-u

Trick 3 - I FRAME - "ekran" ka web stranici

Trick 4 - Padajući Div tag-ovi

Trick 5 - Stilizovan "prišiveni" Div tag

Trick 6 - Efekat Ribbona

Trick 7 - Tekst u više boja

 

Trikovi - nastavak


Trick 8 - Tekst kao citat

Trick 9 - Efekat pisaće mašine

Trick 10 - Efekat rotirajuće slike - TIP 1

Trick 11 - Efekat rotirajuće slike - TIP 2

Trick 12 - Efekat pomerajućeg div tag-a - TIP 1

Trick 13 - Efekat pomerajućeg div tag-a - TIP 2

Trick 14 - Dizajniran cenovnik - TIP 1

Trick 15 - Dizajniran cenovnik - TIP 2

Trick 16 - Smartfoni (testiranje rezolucije)

Trick 17 - Tableti (testiranje rezolucije)

Trick 18 - Font Sizer - JS za povećavanje fonta

Trick 19 - Photoshop - stilovi

Trick 20 - Page Source - izvorni kod

Trick 21 - Kolone "pod konac" - stilovi "block" i "min-height"

Trick 22 - Call button - samo za mobil verzije

Trick 23 - Stilovi: before, after, content

Trick 24 - Pop Up window - Z index

Kako da stilizujete Bulite

Kako da stilizujete LOADER

Kako da stilizujete ALERT panele

Kako da podesite jednake visine kolona

Vertikalna response navigacija

Font face stil

Ikonice u HTML kodu