A. JUDUL
Menulis Kode Pemrograman untuk Mendesain Website dan Merancang serta Mengimplementasikan User Interface Menggunakan HTML sebagai Desainer Website
Rp. 500.000
Deskripsi pelatihan :
Dengan mengikuti pelatihan ini, peserta akan menjadi seorang desainer website perusahaan Sebagai desainer website, peserta mampu membuat rancangan tampilan website menjadi lebih menarik.
Selain itu dapat membuat plugin menggunakan kode HTML dan CSS. Di mana seorang desainer website perllu memahami setidaknya 2 bahasa pemrograman yaitu HTML dan CSS. Kemudian desian nantinya akan dapat dibuka dan dinikmati di layar monitor baik di komputer maupun handphone. Menurut data dari Indonesia’s Critical Occupations List 2018 (http://gg.gg/v05jo).
Di era digital seperti sekarang ini, kebutuhan akan media website semakin tinggi. Di Indonesia, tenaga profesional seperti seorang web designer yang menduduki level manajerial masih sangat langka.
Tenaga IT yang terampil dibutuhkan untuk mendukung investasi besar-besaran di bidang e-commerce. Indonesia sekarang ini ada di pusaran digitalisasi. Hal ini menjadi peluang untuk peserta menekuni profesi ini. Pelatihan ini merujuk pada KBJI 2014 dengan kode 2166.10 dengan profesi desainer website.
Selain itu, pada pelatihan ini disesuaikan dengan menggunakan SKKNI NO.282 TAHUN 2016 Kompetensi yang akan dilatih pada program pelatihan ini yaitu :
1. Kompeten memahami CSS pada HTML
2. Kompeten dalam membuat layout sampai pembuatan layout 2 kolom
3. Kompeten membangun website perusahaan
4. Kompeten memasukan elemen menggunakan CSS
5. Kompeten menggunakan plugin pada HTML
B. KOMPETENSI
Aspek Kompetensi: Pengetahuan (Knowledge) :
Dengan pelatihan Menulis kode pemrograman untuk mendesain website dan merancang serta mengimplementasikan user interface menggunakan HTML sebagai desainer website, siswa :
1. Memahami cara membaca dan memahami notasi untuk pengumpulan kebutuhan perangkat lunak (Aspek ini dapat di lihat pada modul 2 tentang Hardware & Software menit 00.00 – 02.35)
2. Memahami cara penggunaaan tools yang dapat dimanfaatkan untuk pengumpulan dan perekaman kebutuhan perangkat lunak (Aspek ini dapat di lihat pada modul 2 tentang Simple Layout Part 1 Web Structure menit 00.00 – 01.57)
3. Platform lingkungan pemrograman aplikasi (Aspek ini dapat di lihat pada modul 2 tentang Upload Website Ke Server Hosting Bagian A dan Bagian B menit 00.00 – 14.00)
4. Pre-request tools pemrograman (Aspek ini dapat di lihat pada modul 2 tentang CSS For Input Element menit 00.00 – 6.58)
5. Standar menghidupkan dan mematikan perangkat keras komputer (Aspek ini dapat di lihat pada modul 2 tentang Plugin Introductions menit 00.00 – 1.35)
Aspek Kompetensi: Keterampilan (Skill) :
Dengan pelatihan Menulis kode pemrograman untuk mendesain website dan merancang serta mengimplementasikan user interface menggunakan HTML sebagai desainer website, siswa :
1. Mengembangkan Road Map website (Aspek ini dapat di lihat pada modul 2 tentang Road Map Web Developer Bagian A dan Bagian B menit 00.00 – 14.00)
2. Meng-upload website ke server hosting (Aspek ini dapat di lihat pada modul 2 tentang Upload Website Ke Server Hosting Bagian A dan Bagian B menit 00.00 – 14.00)
3. Membuat layout simple (Aspek ini dapat di lihat pada modul 2 tentang Simple Layout Part 1 Web Structure menit 00.00 – 1.57)
4. Menginput elemen CSS (Aspek ini dapat di lihat pada modul 2 tentang CSS For Input Element menit 00.00 – 6.58)
5. Memasang sebuah plugin (Aspek ini dapat di lihat pada modul 2 tentang Plugin Introductions sampai Plug In Youtube menit 00.00 – 1.35)
6. Membuat form (Aspek ini dapat di lihat pada modul 2 tentang Form Part 1 Bagian A dan Bagian B menit 00.00 – 18.00)
Aspek Kompetensi: Sikap (Attitude) :
Dengan pelatihan Menulis kode pemrograman untuk mendesain website dan merancang serta mengimplementasikan user interface menggunakan HTML sebagai desainer website, peserta :
1. Mampu Menambahkan elemen pada HTML dengan teliti (Aspek ini dapat di lihat pada modul 2 tentang Elemen Pada HTML Part 1 Bagian A dan Bagian B menit 00.00 – 18.00)
2. Teliti Membuat layout dengan cermat (Aspek ini dapat di lihat pada modul 2 tentang Simple Layout Part 1 Web Structure sampai Simple Layout Part 5 Content & Footer menit 00.00 – 68.00)
3. Cekatan Membuat conten sesuai dengan kaidah (Aspek ini dapat di lihat pada modul 2 tentang Content Bagian A sampai Bagian C menit 00.00 – 22.00)
4. Teliti Memasang plugin sesuai dengan dasar-dasar pemrograman (Aspek ini dapat di lihat pada modul 2 tentang Plugin Introductions sampai Plug In Youtube menit 00.00 – 32.00)
C. SASARAN PESERTA
Peserta pelatihan yang dapat mengikuti pelatihan ini yaitu :
1).Minimal lulusan SMA/SMK sederajat
2).Memiliki minimal laptop/komputer
3).Peserta minimal memiiki pengetahuan dasar pemrograman
D. TUJUAN PELATIHAN
Tujuan Umum :
Di akhir pelatihan, peserta merancang layout website menggunakan bahasa HTML dan CSS sesuai dengan prinsip-prinsip desain
Tujuan Khusus :
Program pelatihan Menulis kode pemrograman untuk mendesain website dan merancang serta mengimplementasikan user interface menggunakan HTML sebagai desainer website :
1. Kompeten memahami CSS pada HTML
2. Kompeten dalam membuat layout sampai pembuatan layout 2 kolom
3. Kompeten membangun website perusahaan
4. Kompeten memasukan elemen menggunakan CSS
5. Kompeten menggunakan plugin pada HTML
E. SILABUS DAN DURASI
1. Pembukaan 03:33
2. Pengenalan Instruktur 00:33
3. Introduction 2:30
4. Road Map Web Developer Bagian A 08:10
5. Road Map Web Developer Bagian B 06:48
6. Hardware & Software 2:35
7. Basic HTML Part 1 Bagian A 09:24
8. Basic HTML Part 1 Bagian B 09:00
9. Basic HTML Part 2 Bagian A 06:10
10. Basic HTML Part 2 Bagian B 06:12
11. Basic HTML Part 3 Bagian A 09:00
12. Basic HTML Part 3 Bagian B 09:30
13. Basic HTML Part 3 Bagian C 08:48
14. Elemen Pada HTML Part 1 Bagian A 09:40
15. Elemen Pada HTML Part 1 Bagian B 09:47
16. Elemen Pada HTML Part 2 Symbol Entities 03:35
17. Elemen Pada HTML Part 3 Bagian A 06:10
18. Elemen Pada HTML Part 3 Bagian B 07:00
19. Elemen Pada HTML Part 3 Bagian C 06:15
20. Elemen Pada HTML Part 4 06:03
21. Elemen Pada HTML Part 5 09:17
22. Elemen Pada HTML Part 6 Audio 6:33
23. Upload Website Ke Server Hosting Bagian A 08:00
24. Upload Website Ke Server Hosting Bagian B 06:51
25. Adobe Dreamweaver 04:28
26. Comment On HTML 03:36
27. CSS Introductions 02:57
28. CSS Implementation Bagian A 06:30
29. CSS Implementation Bagian B 05:38
30. CSS Selector Bagian A 09:50
31. CSS Selector Bagian B 09:51
32. Div Element Part 1 Bagian A 08:19
33. Div Element Part 1 Bagian B 07:50
34. Div Element Part 2 Overflow 07:39
35. Simple Layout Part 1 Web Structure 01:57
36. Simple Layout Part 2 Bagian A 09:10
37. Simple Layout Part 2 Bagian B 08:56
38. Simple Layout Part 3 06:38
39. Simple Layout Part 4 Bagian A 09:19
40. Simple Layout Part 4 Bagian B 09:00
41. Simple Layout Part 5 Content & Footer Bagian A 09:10
42. Simple Layout Part 5 Content & Footer Bagian B 08:37
43. Layout Two Columns Part 1 01:42
44. Layout Two Columns Part 2 Bagian A 08:30
45. Layout Two Columns Part 2 Bagian B 08:24
46. Layout Two Columns Part 3 Bagian A 09:00
47. Layout Two Columns Part 3 Bagian B 07:51
48. Layout Two Columns Part 4 Bagian A 07:30
49. Layout Two Columns Part 4 Bagian B 07:42
50. Layout Two Columns Part 5 Bagian A 09:10
51. Layout Two Columns Part 5 Bagian B 08:00
52. Layout Two Columns Part 5 Bagian C 07:17
53. Layout Two Columns Part 6 08:29
54. Basic Structure Bagian A 08:00
55. Basic Structure Bagian B 07:20
56. Basic Structure Bagian C 06:04
57. Header Bagian A 09:44
58. Header Bagian B 09:50
59. Header Bagian C 09:50
60. Content Bagian A 08:00
61. Content Bagian B 07:22
62. Content Bagian C 07:00
63. Content Bottom Footer Bagian A 07:00
64. Content Bottom Footer Bagian B 07:02
65. Form Part 1 Bagian A 09:50
66. Form Part 1 Bagian B 09:58
67. Form Part 2 Bagian A 08:30
68. Form Part 2 Bagian B 09:20
69. Form Part 2 Bagian C 09:00
70. CSS For Input Element 06:58
71. Another Input Element 07:18
72. Plugin Introductions 01:35
74. Plugin Image Slider Bagian A 07:30
75. Plugin Image Slider Bagian B 06:55
76. Plugin Lightbox Bagian A 05:32
77. Plugin Lightbox Bagian B 05:50
74. Plugin Google Map 05:32
75. Plugin Youtube 03:38
TOTAL DURASI : 9 Jam 25 Menit 02 Detik
F. KAPASITAS JENIS/KELAS PELATIHAN
Tidak terbatas
G. METODE AJAR/LATIH DAN EVALUASI PESERTA
Metode Ajar yang digunakan dalam pelatihan ini yaitu Self Paced Learning.
H. DATA INSTRUKTUR DAN RIWAYAT PROFESI
Nama : Bambang Riono
• Adobe Dreamweaver
• Adobe Flash
• Adobe Photoshop
• Adobe Illustrator
• Adobe InDesign
• Corel Draw
• Crystal Report
• Multimedia
• Web Design (HTML, CSS, Javascript)
• Pengembang Web Aplikasi (PHPMySQL)
• Java Programming Fundamental (SL110)
• PC Hardware A+
• Microsoft Office 2014-2016
I. Jadwal Sesi Konseling :
Bambang Riono, Rabu 09:00 – 10:00
J. JENIS/KLASIFIKASI SERTIFIKAT
Certificate of Completion & Certificate of Graduation
K. MEKANISME EVALUASI :
Mekanisme Evaluasi pada program pelatihan ini yaitu :
1. Soal Pre Test
2. Soal Kuis
3. Soal Pop-up Kuis
4. Soal Post Test
5. Penugasan atau Tugas Akhir
Curriculum
- 1 Section
- 77 Lessons
- 10 Weeks
- HTML & CSS77
- 2.1Introduction
- 2.2Road Map Web Developer Bagian A
- 2.3Road Map Web Developer Bagian B
- 2.4Hardware & Software
- 2.5Basic HTML Part 1 Bagian A
- 2.6Basic HTML Part 1 Bagian B
- 2.7Basic HTML Part 2 Bagian A
- 2.8Basic HTML Part 2 Bagian B
- 2.9Basic HTML Part 2 Bagian C
- 2.10Basic HTML Part 3 Bagian A
- 2.11Basic HTML Part 3 Bagian B
- 2.12Basic HTML Part 3 Bagian C
- 2.13Elemen Pada HTML Part 1 Bagian A
- 2.14Elemen Pada HTML Part 1 Bagian B
- 2.15Elemen Pada HTML Part 2 Symbol Entities
- 2.16Elemen Pada HTML Part 3 Bagian A
- 2.17Elemen Pada HTML Part 3 Bagian B
- 2.18Elemen Pada HTML Part 3 Bagian C
- 2.19Elemen Pada HTML Part 4
- 2.20Elemen Pada HTML Part 5
- 2.21Elemen Pada HTML Part 6 Audio
- 2.22Upload Website Ke Server Hosting Bagian A
- 2.23Upload Website Ke Server Hosting Bagian B
- 2.24Adobe Dreamweaver
- 2.25Comment On HTML
- 2.26CSS Introductions
- 2.27CSS Implementation Bagian A
- 2.28CSS Implementation Bagian B
- 2.29CSS Selector Bagian A
- 2.30CSS Selector Bagian B
- 2.31Div Element Part 1 Bagian A
- 2.32Div Element Part 1 Bagian B
- 2.33Div Element Part 2 Overflow
- 2.34Simple Layout Part 1 Web Structure
- 2.35Simple Layout Part 2 Bagian A
- 2.36Simple Layout Part 2 Bagian B
- 2.37Simple Layout Part 3
- 2.38Simple Layout Part 4 Bagian A
- 2.39Simple Layout Part 4 Bagian B
- 2.40Simple Layout Part 5 Content & Footer Bagian A
- 2.41Simple Layout Part 5 Content & Footer Bagian B
- 2.42Layout Two Columns Part 1
- 2.43Layout Two Columns Part 2 Bagian A
- 2.44Layout Two Columns Part 2 Bagian B
- 2.45Layout Two Columns Part 3 Bagian A
- 2.46Layout Two Columns Part 3 Bagian B
- 2.47Layout Two Columns Part 4 Bagian A
- 2.48Layout Two Columns Part 4 Bagian B
- 2.49Layout Two Columns Part 5 Bagian A
- 2.50Layout Two Columns Part 5 Bagian B
- 2.51Layout Two Columns Part 5 Bagian C
- 2.52Layout Two Columns Part 6
- 2.53Basic Structure Bagian A
- 2.54Basic Structure Bagian B
- 2.55Basic Structure Bagian C
- 2.56Header Bagian A
- 2.57Header Bagian B
- 2.58Header Bagian C
- 2.59Content Bagian A
- 2.60Content Bagian B
- 2.61Content Bagian C
- 2.62Content Bottom Footer Bagian A
- 2.63Content Bottom Footer Bagian B
- 2.64Form Part 1 Bagian A
- 2.65Form Part 1 Bagian B
- 2.66Form Part 2 Bagian A
- 2.67Form Part 2 Bagian B
- 2.68Form Part 2 Bagian C
- 2.69CSS For Input Element
- 2.70Another Input Element
- 2.71Plugin Introductions
- 2.72Plugin Image Slider Bagian A
- 2.73Plugin Image Slider Bagian B
- 2.74Plugin Lightbox Bagian A
- 2.75Plugin Lightbox Bagian B
- 2.76Plugin Google Map
- 2.77Plugin Youtube
