Pertemuan Satu

PHP : suatu script bahasa pemrograman yang diolah pada server PHP
PHP Server : komputer yang memiliki kemampuan mengolah script PHP untuk dikirim ke komputer client

<?php echo date('d-n-y'):    ?>
<?php echo date('d-n-y h:i'):    ?>

Request : keadaan komputer client meminta suatu halaman dengan atau tanpa parameter/data
Request ada 2 metode :
-Post
-Get
dan biasanya diawali dengan tanda ($)

Variabel : data dengan nilai yang dapat berubah-ubah sesuai dengan request

Operator pada PHP ditulis
tambah (+)
kurang (-)
kali (*)
bagi (:)
modulus (%)
set data (=)

<?php echo $_POST ['input1']." ".$_POST["input2'];   ?>
tanda (.) = menghubungkan karakter

Tugas

Hasil tambah dari <?php echo $_GET["input1"];     ?>+<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a+$b;
   
    echo $c;
?><br />
Hasil kurang dari <?php echo $_GET["input1"];     ?>-<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a-$b;
   
    echo $c;
?><br />
Hasil kali dari <?php echo $_GET["input1"];     ?>x<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a*$b;
   
    echo $c;
?><br />
Hasil bagi dari <?php echo $_GET["input1"];     ?>:<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a/$b;
   
    echo $c;
?><br />
Hasil modulus dari <?php echo $_GET["input1"];     ?>%<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a%$b;
   
    echo $c;
?><br />
Hasil set data dari <?php echo $_GET["input1"];     ?>=<?php echo $_GET["input2"];     ?>adalah
<?php
    $a = $_GET["input1"];
    $b = $_GET["input2"];
    $c = $a=$b;
   
    echo $c;

Baca selengkapnya … Pertemuan Satu

Pertemuan 5

• Href merupakan kepanjangan dari hypertext refence.
• Jika di html kita menggunakan atribut "id", maka pada cssnya di awali dengan (#), sedangkan jika pada html kita menggunakan atribut "class", maka pada cssnya akan di awali dengan tanda (.).
• dalam href, ada yang nama <a href="#"></a>
  biasanya ini digunakan untuk memberikan link.
• <span></span>, biasanya digunakan untuk memberikan efek khusus pada suatu objek, misalnya tulisan. Penggunaan span, pada cssnya juga di awali dengan tanda (#), sama halnya seperti "id"

Link download Web Design :

Silahkan disedot

Baca selengkapnya … Pertemuan 5

Pertemuan 4

• Folder Group

Untuk mempermudah dalam menghidden layer saat pemotongan, maka gunakkan Fitur Group untuk mengelompokkan layer-layer dalam Folder Group. Fitur group terletak di panel layer, perhatikan gambar di bawah :

Untuk memberikan nama pada group, double klik group tersebut dan geser layer-layer yang ingin dikelompokkan pada group tersebut.

Untuk memperingan website, maka gunakkan fitur repeat pada CSS. Ada 2 jenis repeat, yaitu :

1. Repeat-x : atribut css untuk mengulang gambar ke samping kanan-kiri saja.
2. Repeat-y : atribut css untuk mengulang gambar ke atas dan ke bawah.

• Merge Visible

Merge Visible (Ctrl+Shift+E) dapat menormalkan efek yang dimiliki suatu layer. Merge Visible akan menyatukan seluruh layer yang terlihat menjadi sebuah layer. Setelah pemotongan selesai, diharapkan meng-undo layer ke history dimana layer terpisah. Kita harus ingat meng-undo karena jika lupa, selamanya layer tidak dapat dipisahkan.

1. Image->crop : untuk memotong daerah seleksi.
2. File->save for web : untuk memunculkan fitur penyimpanan dengan konfigurasi web.
3. Atur terlebih dahulu kualitas gambar, perhatikanlah kualitas dan ukuran gambar.

 Biasanya untukbackground web, extensi yang sering digunakan ada 2, yaitu :

1. JPEG (Joint Photographic Experts Group) : untuk keperluan background dengan ukuran rendah.
2. PNG (Portable Network Graphics) : untuk keperluan background yang memiliki transparansi gambar.

Link Downloadnya :

Silahkan disedot

Baca selengkapnya … Pertemuan 4

Rancangan Web Design

Baca selengkapnya … Rancangan Web Design

Tugas Pertemuan Ketiga

• Fungsi-fungsi atribut pada CSS

1. Float : right : untuk membuat suatu objek berada di sebelah kanan

Cara penggunaan Float : right

Hasilnya

 2. Float : left : untuk membuat suatu objek berada di sebelah kiri

Cara penggunaan Float : left

Hasilnya

3. Clear : both : mematikan fungsi float kiri dan kanan
Penggunaan :
#bg1{
clear : both ;
}

Materi

1. Image (img) merupakan objek yang dapat berdiri sendiri dimana memiliki atribut panjang dan lebar.
2. Background adalah suatu atribut yang dimiliki suatu objek CSS dimana memiliki kemampuan dupiklasi diri dan dapat ditumpuk dengan tulisan diatasnya.
3. Tag <div> merupakan salah satu objek yang sering digunakan untuk menginduki atribut background.
4. Sintak background akan dibuat pada CSS, dan tulisan atau objek yang akan dibuat ditengah div tersebut.

Tambahan :

- Jika mau gambar dengan jumlah warna yang banyak dan ukurannya kecil gunakan format .jpg
- Untuk gambar animasi menggunakan format .gif
- Gambar terdapat bagian yang transparant menggunakan format .png 8/24

Baca selengkapnya … Tugas Pertemuan Ketiga

Photoshop Dasar

• TUGAS :

 1.  Fungsi Crop Tool : berfungsi untuk memotong gambar dengan cara membuat seleksi berbentuk kotak dengan crop tool kemudian dieksekusi dengan menekan tombol enter.
 Shortcut: tombol "C".









2. Fungsi Magic Wand Tool : berfungsi untuk menyeleksi area objek yang memiliki kesamaan warna. Toleransi warna yang akan diseleksi dapat ditentukan dalam pilihan palet dari Magic Wand Tool.
Shortcut: tombol "W".









3. Fungsi Polygon Lasso Tool : digunakan untuk membuat area seleksi berbentuk poligon.

4. Magnetic Lasso Tool : berfungsi untuk membuat area selection dengan cara menempelkan tepi selection pada area tertentu pada image.









5. Pengertian Outer Glow pada Blending Option :
Outer : bagian luar
Glow : cahaya
Outer Glow : merupakan blending option untuk memberikan efek cahaya pada bagian luar.

6. Cara memasukkan foto ke kanvas :

1. Klik File->New->Ok
2. Klik File->Open->Pilih foto->Lalu open
3. Klik "Move Tool"->tarik foto yang tadi lalu geser ke Kanvas.
4. Lalu sesuaikan foto dengan kanvas (menggunakan Ctrl + T)

7. Cara menyimpan dengan save for web & devices :

1. Klik File->klik "save for web & devices->save
   atau dengan cara (Alt+Shift+Ctrl+S)

• Materi Photoshop Dasar

1. Pengertian Photoshop
Photoshop merupakan software yang digunakan untuk memodifikasi gambar atau
foto secara profesional baik meliputi modifikasi obyek yang sederhana maupun yang
sulit sekalipun.

Photoshop juga dapat digunakan untuk  membuat rancangan tampilan antarmuka web, dengan resolusi 1024px-768px.

2. Toolbox

1.  Move Tool : Digunakan untuk memindahkan gambar atau objek. 
2. Rectangular Marquee : Digunakan untuk menyeleksi sebuah objek berbentuk kotak.
3.  Lasso Tools : Digunakan untuk menyeleksi sebuah objek dengan bentuk sembarang.
4. Magic Wand : Digunakan meyeleksi sebuah objek bedasarkan warna tertentu.
5. Crop Tool : Digunakan untuk memotong sebuah objek.
6.  Slice Tool : Digunakan untuk memotong objek sesuai dengan bentuk garis lurus.
7.      Healing Brush Tool : Digunakan untuk menghilangkan bagian gambar terntentu pada image.
8.  Brush Tool : Untuk menghapus atau menggambar objek dengan sapuan kuas.
9. Clone Stamp Tool : Digunakan untuk menyalin sebuah warna untuk diaplikasikan pada objek lain.
10. History Brush Tool : Digunakan untuk menampilkan semua perintah Brush Tool.
11.  Eraser Tool : Digunakan untuk menghapus sebuah objek yang tidak digunakan.
12. Gradient Tool : Digunakan untuk membuat warna gradasi.
13. Dodge Tool : Untuk memberikan koreksi warna pada image agar terlihat terang atau cerah.
14.  Blur Tool : Digunakan untuk menggabungkan sebuah objek.
15. Pen Tool : Digunakan untuk membuat garis berbentuk kurva yang lebih variatif.
16. Horizontal Type Tool : Digunakan untuk membuat objek berupa teks.
17. Path Selection Tool :Untuk membuat seleksi gambar dengan menyambungkan titik-titik gambar agar menjadi sebuah kuva.
18. Rectangle Tools : Digunakan untuk membuat objek segi empat.
19. Eye Dropper Tool : Untuk mengambil sebuah sample background atau foreground.
20. Notes Tool : Untuk menambah sebuah catatan.
21. Hand Tool : Digunakan untuk menggeser stage atau bidang kanvas. Zoom Tool : Digunakan untuk memperbesar atau memperkecil tampilan image.

3. Layer Style
Layer style merupakan kumpulan dari efek-efek khusus untuk ditetapkan pada layer yang disediakan pada palet layer.

Beberapa menu-menu pada layer style :
- Drop shadow : membuat efek bayangan di bagian luar
- Inner shadow : membuat efek bayangan di bagian dalam objek
- Outer glow : Membuat efek bercahaya pada luar
- Inner glow : Membuat efek bercahaya pada dalam objek
- Bevel and emboss : Membuat efek timbul
- Satin : membuat pola-pola tertentu pada objek
- Color, gradient, dan pattern overlay : Sama-sama mengganti permukaan objek, masing-masing dengan warna, gradien, atau pattern
- Stroke : Memberi garis pinggir pada objek

Baca selengkapnya … Photoshop Dasar

TUGAS FUNGSI ATRIBUT-ATRIBUT CSS

• FUNGSI ATRIBUT-ATRIBUT CSS

1. Font-size : untuk mengganti ukuran
-contoh : {font-size : large}
 
2. Font-family : mengganti jenis tulisan
  -contoh : {font-family : Arial, "times roman"}
 
3. Line-height : menentukan line spacing
  -contoh : {line-height : 1.5 em}
 
4. Text-align : untuk membuat perataan pada text

5. Border : untuk memberi batas/garis pada suatu bidang/box/tag HTML

6. Width : untuk mengatur lebar bidang tag yang kita berikan style

7. Height : untuk mengatur tinggi bidang tag yang kita buat

8. Margin : untuk pemberian jarak atau batas (bagian luar) pada suatu tag/box/bidang HTML

9. Padding : untuk pemberian jarak atau batas (bagian dalam) pada suatu tag/box/bidang HTML

Baca selengkapnya … TUGAS FUNGSI ATRIBUT-ATRIBUT CSS