E-grafika.lt svetainės atsinaujinimo proga paruošėme dviejų valandų trukmės video pamoką (ah, meluojame — tiksli pamokos trukmė 2 val 34 min!) apie tai, kaip sukurti tinklalapio (web) dizainą. Jeigu kas nors iš jūsų žiūrėjote pirmąją video pamoką, atsimenate, kad ji buvo suskaidyta į tris dalis. Kadangi ši video pamoka yra labai panaši (vos ne „remake“) į ankstesnę, nutarėme palikti tas pačias dalis.


Pagrindinės video pamokos dalys:
1) dizaino maketavimas Adobe Photoshop programoje;
2) dizaino karpymas ir reikiamų paveiksliukų eksportavimas
2) kodavimas su HTML ir CSS.
 
Pamokoje taip pat plačiai paaiškinta, kaip tinkamai sukarpyti dizainą su Slice Tool, kuo skiriasi CSS savybės: margin ir padding, kaip taikyti pakopinių stilių savybę float, ir daugelis kitų dalykų.

Pamokoje kurtas dizainas nėra ypatingai sudėtingas, tačiau užtikriname, kad rezultatu liksite nenusivylę. Žinoma, pabaigę kurti dizainą pagal video pamoką galėsite jį toliau tobulinti, gražinti, žodžiu — eksperimentuoti ir ieškoti savų idėjų.

Lauksime jūsų darbo rezultatų, patarimų bei įvairių pašnekesių, susijusių su šia video pamoka, mūsų svetainės diskusijų forumuose. Jeigu jums patiks video pamoka, tikimės, kad siūlysite temas naujoms pamokoms. Ir kas ten žino... gal vieną dieną išvysite norimą pamoką E-grafika.lt svetainėje?

Visi video pamokoje sukurti/naudoti failai patalpinti serveryje, todėl, jei norite, galite juos parsisiųsti: http://www.e-grafika.lt/failai/dizainas.rar.

Atsakymas parašytas: 2010-02-12 00:33:14 [#819] Ilgalaikė nuoroda į atsakymą #1

E-grafika.lt svetainės atsinaujinimo proga paruošėme dviejų valandų trukmės video pamoką (ah, meluojame — tiksli pamokos trukmė 2 val 34 min!) apie tai, kaip sukurti tinklalapio (web) dizainą. Jeigu kas nors iš jūsų žiūrėjote pirmąją video pamoką, atsimenate, kad ji buvo suskaidyta į tris dalis. Kadangi ši video pamoka yra labai panaši (vos ne „remake“) į ankstesnę, nutarėme palikti tas pačias dalis.


Pagrindinės video pamokos dalys:
1) dizaino maketavimas Adobe Photoshop programoje;
2) dizaino karpymas ir reikiamų paveiksliukų eksportavimas
2) kodavimas su HTML ir CSS.
 
Pamokoje taip pat plačiai paaiškinta, kaip tinkamai sukarpyti dizainą su Slice Tool, kuo skiriasi CSS savybės: margin ir padding, kaip taikyti pakopinių stilių savybę float, ir daugelis kitų dalykų.

Pamokoje kurtas dizainas nėra ypatingai sudėtingas, tačiau užtikriname, kad rezultatu liksite nenusivylę. Žinoma, pabaigę kurti dizainą pagal video pamoką galėsite jį toliau tobulinti, gražinti, žodžiu — eksperimentuoti ir ieškoti savų idėjų.

Lauksime jūsų darbo rezultatų, patarimų bei įvairių pašnekesių, susijusių su šia video pamoka, mūsų svetainės diskusijų forumuose. Jeigu jums patiks video pamoka, tikimės, kad siūlysite temas naujoms pamokoms. Ir kas ten žino... gal vieną dieną išvysite norimą pamoką E-grafika.lt svetainėje?

Visi video pamokoje sukurti/naudoti failai patalpinti serveryje, todėl, jei norite, galite juos parsisiųsti: http://www.e-grafika.lt/failai/dizainas.rar.

Laukiame jūsų atsiliepimų, komentarų, diskusijų apie šią video pamoką.

---
Dabar galite video pamoką parsisiųsti, nuorodos pateiktos žemiau.

• 00 - Pamokos introdukcija (įžanga) (50,8 MB)


• 01.1 - Dizaino maketavimas - dizaino viršus (94,1 MB)


• 01.2 - [1 dalis] - Dizaino maketavimas - turinio sritis ir apačia (footer) (57.2 MB)


• 01.2 - [2 dalis] - Dizaino maketavimas - turinio sritis ir apačia (footer) (52.2 MB)


• 02.1 - Dizaino karpymas - kaip tinkamai karpyti dizainą (12,9 MB)


• 02.2 - Dizaino karpymas - dizaino karpymas ir paveiksliukų eksportavimas (63,9 MB)


• 03.1 - Dizaino kodavimas (HTML/CSS) - pasiruošimas kodavimui (24,5 MB)


• 03.2 - Dizaino kodavimas (HTML/CSS) - viršutinė dizaino dalis (58,1 MB)


• 03.3 - Dizaino kodavimas (HTML/CSS) - CSS savybės: margin ir padding (12,4 MB)


• 03.4 - [1 dalis] - Dizaino kodavimas (HTML/CSS) - turinio ir apačios sritis (57,2 MB)


• 03.4 - [2 dalis] - Dizaino kodavimas (HTML/CSS) - turinio ir apačios sritis (52,0 MB)


• 04 - Apibendrinimas (18,7 MB)

Atsakymas parašytas: 2010-02-12 15:42:12 [#820] Ilgalaikė nuoroda į atsakymą #2

adijux rašė:

E-grafika.lt svetainės atsinaujinimo proga paruošėme dviejų valandų trukmės video pamoką (ah, meluojame — tiksli pamokos trukmė 2 val 34 min!) apie tai, kaip sukurti tinklalapio (web) dizainą. Jeigu kas nors iš jūsų žiūrėjote pirmąją video pamoką, atsimenate, kad ji buvo suskaidyta į tris dalis. Kadangi ši video pamoka yra labai panaši (vos ne „remake“) į ankstesnę, nutarėme palikti tas pačias dalis.


Pagrindinės video pamokos dalys:
1) dizaino maketavimas Adobe Photoshop programoje;
2) dizaino karpymas ir reikiamų paveiksliukų eksportavimas
2) kodavimas su HTML ir CSS.
 
Pamokoje taip pat plačiai paaiškinta, kaip tinkamai sukarpyti dizainą su Slice Tool, kuo skiriasi CSS savybės: margin ir padding, kaip taikyti pakopinių stilių savybę float, ir daugelis kitų dalykų.

Pamokoje kurtas dizainas nėra ypatingai sudėtingas, tačiau užtikriname, kad rezultatu liksite nenusivylę. Žinoma, pabaigę kurti dizainą pagal video pamoką galėsite jį toliau tobulinti, gražinti, žodžiu — eksperimentuoti ir ieškoti savų idėjų.

Lauksime jūsų darbo rezultatų, patarimų bei įvairių pašnekesių, susijusių su šia video pamoka, mūsų svetainės diskusijų forumuose. Jeigu jums patiks video pamoka, tikimės, kad siūlysite temas naujoms pamokoms. Ir kas ten žino... gal vieną dieną išvysite norimą pamoką E-grafika.lt svetainėje?

Visi video pamokoje sukurti/naudoti failai patalpinti serveryje, todėl, jei norite, galite juos parsisiųsti: http://www.e-grafika.lt/failai/dizainas.rar.

Laukiame jūsų atsiliepimų, komentarų, diskusijų apie šią video pamoką.

---
Dabar galite video pamoką parsisiųsti, nuorodos pateiktos žemiau.

• 00 - Pamokos introdukcija (įžanga) (50,8 MB)


• 01.1 - Dizaino maketavimas - dizaino viršus (94,1 MB)


• 01.2 - [1 dalis] - Dizaino maketavimas - turinio sritis ir apačia (footer) (57.2 MB)


• 01.2 - [2 dalis] - Dizaino maketavimas - turinio sritis ir apačia (footer) (52.2 MB)


• 02.1 - Dizaino karpymas - kaip tinkamai karpyti dizainą (12,9 MB)


• 02.2 - Dizaino karpymas - dizaino karpymas ir paveiksliukų eksportavimas (63,9 MB)


• 03.1 - Dizaino kodavimas (HTML/CSS) - pasiruošimas kodavimui (24,5 MB)


• 03.2 - Dizaino kodavimas (HTML/CSS) - viršutinė dizaino dalis (58,1 MB)


• 03.3 - Dizaino kodavimas (HTML/CSS) - CSS savybės: margin ir padding (12,4 MB)


• 03.4 - [1 dalis] - Dizaino kodavimas (HTML/CSS) - turinio ir apačios sritis (57,2 MB)


• 03.4 - [2 dalis] - Dizaino kodavimas (HTML/CSS) - turinio ir apačios sritis (52,0 MB)


• 04 - Apibendrinimas (18,7 MB)

ATNAUJINKITE LINKUS. Aciu ;]

Atsakymas parašytas: 2010-02-12 23:11:13 [#821] Ilgalaikė nuoroda į atsakymą #3

ATNAUJINKITE LINKUS. Aciu ;]

Atsakymas parašytas: 2010-03-28 13:28:50 [#910] Ilgalaikė nuoroda į atsakymą #4

body { background: black; }

a { text-decoration: none; }

#dizainas_01 { widht: 100%; height: 15px; background: #c60909; }

#meniu { margin 0 0 0 1500px; }

#meniu li { display: inline; }
#meniu li a { display: block; float: left; height: 63px; padding: 25px 20px 0 20px; color: #00FF00; }
#meniu li a:hover { color: #00FF00; }

#meniu li.aktyvus a { background: url(../images/Meniu_punkto_fonas.png) repeat-x; color: #00FF00; }

#virsus { width: 100% height: 282px; background: url(../images/virsus.png) no-repeat; }

Atsakymas parašytas: 2010-03-28 13:33:15 [#911] Ilgalaikė nuoroda į atsakymą #5

body { background: black; }

a { text-decoration: none; }

#dizainas_01 { widht: 100%; height: 15px; background: #c60909; }

#meniu { margin 0 0 0 1500px; }

#meniu li { display: inline; }
#meniu li a { display: block; float: left; height: 63px; padding: 25px 20px 0 20px; color: #00FF00; }
#meniu li a:hover { color: #00FF00; }

#meniu li.aktyvus a { background: url(../images/Meniu_punkto_fonas.png) repeat-x; color: #00FF00; }

#virsus { width: 100% height: 282px; background: url(../images/virsus.png) no-repeat; }

Atsakymas parašytas: 2010-04-02 11:47:05 [#922] Ilgalaikė nuoroda į atsakymą #6

#dizainas_01 { widht: 100%; height: 15px; background: #c60909; }

#meniu { margin 0 0 0 1500px; }

#virsus { width: 100% height: 282px; background: url(../images/virsus.png) no-repeat; }

body { background: black; } 

a { text-decoration: none; } 

#dizainas_01 { width: 100%; height: 15px; background: #c60909; } 

#meniu { margin 0 0 0 150px; } 

#meniu li { display: inline; } 
#meniu li a { display: block; float: left; height: 63px; padding: 25px 20px 0 20px; color: #00FF00; } 
#meniu li a:hover { color: #00FF00; } 

#meniu li.aktyvus a { background: url(../images/Meniu_punkto_fonas.png) repeat-x; color: #00FF00; } 

#virsus { width: 100%; height: 282px; background: url(../images/virsus.png) no-repeat; }

Atsakymas parašytas: 2010-05-05 23:42:17 [#933] Ilgalaikė nuoroda į atsakymą #8

Neveikia nuorodos, gal galėtumėt atnaujinti?