Prak 11 – Menggunakan Google Fonts

Prak 11 – Menggunakan Google Fonts

1. Tujuan

Belajar menggunakan external font dari Google Fonts

2. Alat

Text Editor
Browser
Js Fiddle

3. Bahan

spritesheet.png
spritesheet.css

4. Dasar Teori

Google Font adalah salah satu layanan yang disediakan Google untuk memudahkan web developer dalam menghasilkan desain yang menarik dengan meyediakan font-font gratis. Fitur ini dapat anda akses pada alamat: https://www.google.com/fonts.

Google menyediakan 3 cara untuk ‘menghubungkan’ Google font dengan halaman HTML kita, yakni dengan menggunakan tag <link>, perintah CSS @import, dan dengan JavaScript. Ketiga cara ini relatif tidak terlalu berbeda dari cara penggunaanya. Tnggal copy paste kode tersebut ke halaman HTML.

5. Hasil Praktikum

 Menggunakan Google Fonts "Open Sans"

5. Referensi
https://www.google.com/fonts#QuickUsePlace:quickUse

Read More [...]

Praktikum 10 - Membuat Ads Banner (Part 2)

Prak 10 – Membuat Ads Banner (part 2)

1. Tujuan

Belajar membuat Ads Banner berbasis HTML5.

2. Alat

Text Editor
Browser

3. Bahan

spritesheet.png
spritesheet.css

4. Dasar Teori

Efek Linear Gradient atau gradasi warna linear adalah sebuah visual effect yang dihasilkan olehperubahan dan bergeseran warna (gradasi) diatara 2 warna atau lebih. Arah gradasi atau perubahan warna ini dapat terjadi secara vertical (dari atas ke bawah atau dari bawah ke atas), secara horizontal (dari kiri ke kanan atau kanan ke kiri).

Salah satu teknik horizontal centering untuk image adalah dengan menggunakan property text-align: center;. property ini bisa digunakan pada elemen HTML yang memiliki property display: block. untuk membuatnya horizontal center, maka container perlu di set text-align: center

5. Hasil Praktikum

1. Mengaplikasikan CSS Linear Gradient

2. Menambahkan Sprite berikutnya



3. Me-resize sprite menggunakan CSS

6. Referensi

   Creating an HTML5 Banner Ad with GreenSock (GSAP)

   www.mohhasbias.com

Read More [...]