Refferensi Dasar-Dasar Web Design & Web Development

[David NaistaNewbie]

halo para pencinta web yang budiman

jadi di sini ane ingin berbagi beberapa refferensi yang saya ketahui tentang website ke agan-agan yang baru mau belajar website, ane juga masih belajar gan, jadi kita sama-sama belajar ya, hehe. jadi di sini ane tau nih beberapa refferensi buat belajar web, kalo kata mudahnya sih, link buat belajar.  

kalo kita mau bikin web, pasti kan kita harus bikin design dulu. biasanya saya menggunakan photoshop buat layouting. nah kalo untuk belajar photoshop sendiri, berikut adalah link-link tempat belajar photoshop (cara membuat layouting website) :

dari tutsplus :
1. http://psd.tutsplus.com/
2. http://psd.tutsplus.com/sessions/pho...search_index=1
3. https://tutsplus.com/course/photosho...web-designers/
4. https://tutsplus.com/course/photosho...web-designers/
5. http://psd.tutsplus.com/tutorials/in...design-layout/
6. http://freecourses.tutsplus.com/phot...web-designers/


others :
1. http://line25.com/tutorials/create-a...n-in-photoshop
2. http://www.hongkiat.com/blog/40-grea...shop-tutorial/
3. http://vandelaydesign.com/blog/desig...hop-tutorials/
4. http://sixrevisions.com/photoshop/25...out-tutorials/
5. http://grafpedia.com/category/tutorials
6. http://www.1stwebdesigner.com/tutori...sign-tutorial/


dan masih banyak lagi yang lainnya.

nah setelah kita bisa membuat layout website dari photoshop. pasti kita ingin membuat website yang sudah kita design tadi bisa tampil di browser seperti facebook ini, kita perlu belajar beberapa kodingan bahasa pemrograman. di bagian client side dan bagian server side.

Untuk bagian Client Side, kita bisa mempelajari :
1. HTML (HyperText Markup Language)
2. CSS (Cascading Style Sheet)
3. Javascript

Untuk bagian Server Side nya, kita bisa mempelajari :
1. PHP (Pemberi Harapan Pasti *eh Hypertext Preprocessor)
2. Mysql (Structured Query Love *eh Structured Query Language)

Untuk bagian web service nya kita bisa mempelajari :
1. JSON (JavaScript Object Notation)
2. XML (eXtensible Markup Language)
3. WSDL (Web Services Description Language)

nah untuk pengertiannya googling aja yak  nah setelah mengetahui yang di atas, nanti bakal ada banyak sekali di dalamnya, bakal lebih tau banyak lagi. contohnya nanti ada AJAX, kalo javascript sudah ada library nya seperti jquery, mootols dll. kalo php, banyak framework nya, seperti CI, YII, CakePHP dan masih banyak lagi yang lainnya.

untuk kodingan di atas, saya punya refferensi belajarnya, yaitu :
1. http://www.w3schools.com/(semuanya lengkap di sini)
2. http://www.codecademy.com/ (javascript, jquery, PHP, Phyton, Ruby)
3. http://www.codesaya.com/ (seperty Code Academy, bedanya berbahasa indonesia)
4. http://jquery.com/ (manual jQuery)
5. http://jqueryui.com/ (manual buat plugin2 jQuery)
6. http://php.net/ (manual PHP)
7. http://ajar.st-albertus.sch.id/Tutor...IK/panduanphp/ (manual PHP bahasa indonesia)
8. http://ellislab.com/codeigniter (tempat download dan dokumentasi framework CodeIgniter)
9. http://cakephp.org/ (tempat download dan dokumentasi framework CakePHP)
10. http://www.yiiframework.com/ (tempat download dan dokumentasi YII framework)
11. http://getbootstrap.com/ (untuk bootsrap)
12. http://bradfrost.github.io/this-is-r...ive/index.html (belajar responsive design)


dan masih banyak lagi tempat tutorial2 yang lainnya. semoga bermanfaat. terima kasih.

oh iya kelupaan wkwkwkw. jadi gini pasti kan butuh software buat design n ngoding nya, nah sekiranya

beberapa software yang saya tahu untuk design :
1. Adobe Photoshop
2. Adobe Fireworks
3. Adobe Ilustrator
4. CorelDraw
5. dan masih banyak yang lainnya


kalo untuk ngoding nya :
1. Notepad++
2. JetBrains PHP Storm
3. Sublime Text
4. Adobe Dreamweaver
5. netbeans PHP
6. dan masih banyak yang lainnya


kalo untuk web server lokal nya :
1. xampp
2. lampp (kalo linux)
3. appserv.
4. dan lain-lain


nah begitu lah yang bisa ane bagi tentang website, semoga bisa bermanfaat.

salam olahraga \m/  

Sumur :

https://www.facebook.com/notes/david-naista/web-design-web-development/665291430168572

[LiaNewbie]

makasih kak, lagi nyoba belajar HTML sama CSS soalnya

[aftukunNewbie]

Design bisa pake ilustrator gak?

[mepwnNewbie]

tq pak, referensi ny komplit bgt
skrg lgi belajar2 responsive & parallax nih

[syrusNewbie]

sekedar tambahan info software:

1. Adobe Muse
Kalau belum bisa ngoding, atau lagi males ngoding, Adobe Muse solusinya, kita tinggal bikin designnya di photoshop atau ai, terus masukin ke muse, udah deh, paling tinggal nambah2 efek doang :D

2. Adobe Bracket
Kalau dirasa Dreamweaver sama Muse terlalu berat, Bracket solusinya, Bracket cuman 50mb.an, selain tampilannya yg bener2 clean dan minimalis, bracket juga punya senjata rahasia yaitu Extract from Psd files (sebenernya Dreamweaver juga punya tapi berat imo), dan yg lebih seru lagi, Bracket ini free, gak perlu crack2an hahaha

[Sponsored content]