Tutorial

Showing posts with label Tutorial. Show all posts

Membuat Gambar Chibi

Seperti yang anda lihat pada gambar diatas, kita bisa memodifikasi gambar chibi kita sesuai keinginan. Mulai dari Body, Rambut, Pakian, Mata, Aksesoris dll. pokoknya lengkap deh... dan cara penggunaannya mudah kok, anda tinggal memulai aplikasinya dan memodifikasi gambar chibi sesuai yang kita inginkan, selesai dan simpan.

Klik disini atau disini untuk download aplikasi, setelah aplikasi selesai di download buka aplikasinya menggunakan Firefox atau aplikasi flash lainnya.

Memberi Style pada Tag HTML

Unknown 1:12 AM

Unknown

Blog Css Tutorial Web 0

e-amik - Pada tutorial sebelumnya saya telah menjelaskan tentang Dasar-Dasar HTML, dalam tutorial kali ini saya akan melanjutkannya dengan memberi style pada beberapa tag tersebut misalnya: Memberi warna pada text, table, header.

Contoh Tag yang telah di beri style:

Table Mahasiswa

Cara Memberi Style pada tabel
Contoh Tabel:

No	Nama	Alamat
1	Busra Ahmad	Lembang
2	Umi Setiyani	Lembang
3	Saddam Husain	Pakkola
4	Kaco'	Austria

Kode Html dari contoh di atas:

<html>
<head>
<title>Tag Style Html</title>
<style type="text/css">
.judul {
 font-family: Verdana, Geneva, sans-serif;
 color: #096;
}
#mahasiswa
{
 font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
 width:300px;
 border-collapse:collapse;
 text-align: center;
}
#mahasiswa td, #mahasiswa th 
{
 font-size:1em;
 border:1px solid #98bf21;
 padding:3px 7px 2px 7px;
 text-align: left;
}
#mahasiswa th 
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color:#A7C942;
color:#ffffff;
}
#mahasiswa tr.alt td 
{
color:#000000;
background-color:#EAF2D3;
}
.teks-biru {
 color: #00F;
}
.teks-merah {
 color: #F00;
}
</style>
</head>

<body>

<h1 class="judul">Table Mahasiswa </h1>
 <span class="teks-biru">Cara Memberi Style pada tabel</span>
 <br>
<span class="teks-merah">Contoh Tabel:</span>
<br>
<table id="mahasiswa">
<tr>
  <th>No</th>
  <th>Nama</th>
  <th>Alamat</th>
</tr>
<tr>
<td>1</td>
<td>Busra Ahmad</td>
<td>Lembang</td>
</tr>
<tr class="alt">
<td>2</td>
<td>Umi Setiyani</td>
<td>Lembang</td>
</tr>
<tr>
<td>3</td>
<td>Saddam Husain</td>
<td>Pakkola</td>
</tr>
<tr class="alt">
<td>4</td>
<td>Kaco</td>
<td>Austria</td>
</tr>
</table>
</body>
</html>

Dasar-Dasar HTML

Unknown 11:22 AM

Unknown

Blog Tutorial Web 1

e-amik - Pembahasan kali ini saya akan membahas tentang dasar-dasar HTML, mulai dari text hingga pembuatan table. Lanjut pada materi.

Heading

INI ADALAH HEADING1

INI ADALAH HEADING2

INI ADALAH HEADING3

INI ADALAH HEADING4

INI ADALAH HEADING5

INI ADALAH HEADING6

<h1>
INI ADALAH HEADING1</h1>
<h1>
</h1>
<h2>
INI ADALAH HEADING2</h2>
<h2>
</h2>
<h3>
INI ADALAH HEADING3</h3>
<h3>
</h3>
<h4>
INI ADALAH HEADING4</h4>
<h4>
</h4>
<h5>
INI ADALAH HEADING5</h5>
<h5>
</h5>
<h6>
INI ADALAH HEADING6</h6>

Paragraf

<p>Isi dari penjelasan ini merupakan suatu paragraf, jadi defenisi dari 
paragraf adalah isi dari dokumen atau artikel yang kita buat.</p>

Format Text

Ini adalah huruf tebal
Ini adalah huruf miring

Ini adalah Huruf rata tengah

Ini adalah huruf rata kiri

Ini adalah huruf rata kanan

Ini adalah huruf rata kiri kanan, dapat tampil saat kita membuat suatu artikel yang panjang.

Ini adalah huruf berjalan

<b>Ini adalah huruf tebal</b>
<br />
<i>Ini adalah huruf miring</i>
<br />
<div style="text-align: center;">
Ini adalah Huruf rata tengah</div>
<br />
<div style="text-align: left;">
Ini adalah huruf rata kiri
</div>
<br />
<div style="text-align: right;">
Ini adalah huruf rata kanan
</div>
<br />
<div style="text-align: justify;">
Ini adalah huruf rata kiri kanan, dapat tampil saat kita membuat suatu artikel yang panjang.
</div>
<br />
<marquee>Ini adalah huruf berjalan</marquee>

Nomor dan Daftar

List1
List3
List3

Pertama
Kedua
Ketiga

<ul>
<li>List1</li>
<li>List3</li>
<li>List3</li>
</ul>
<ol>
<li>Pertama</li>
<li>Kedua</li>
<li>Ketiga</li>
</ol>

Table

No	Nama	Alamat
1	Busra Ahmad	Lembang
2	Umi Setiyani	Lembang

<table border="1">
<tbody>
<tr>
<td>No</td>
<td>Nama</td>
<td>Alamat</td>
</tr>
<tr>
<td>1</td>
<td>Busra Ahmad</td>
<td>Lembang</td>
</tr>
<tr>
<td>2</td>
<td>Umi Setiyani</td>
<td>Lembang</td>
</tr>
</tbody></table>

Sekian untuk tutorial kali ini, pada tutorial selanjutnya kita akan membuat style pada tag html

Tool's Dasar Adobe Photoshop

Unknown 11:44 PM

Unknown

Photoshop Tutorial 0

e-amik - Dalam tutorial kali ini saya akan membahas tentang Tool's Dasar Adobe Photoshop beserta fungsi-fungsinya, dengan tujuan agar pengguna Adobe Photoshop yang masih dalam tahap permulaan atau pemula dapat memahami fungsi-fungsi dari tool tersebut. Karena kadang seseorang dalam menggunakan Adobe Photoshop hanya menggunakan tool-tool tertentu dan mengabaikan tool lainnya. Baiklah kita lanjut dengan pembahasan.

Move Tool (V)

(V)

Rectangular Marquee Tool (M)

Polygonal Lasso Tool (L)

Magic Wand Tool (W)

Crop Tool (C)

Eye Dropper Tool (I)

Spot Brush Tool (J)

Brush Tool (B)

Clone Stamp Tool (S)

History Brush Tool (Y)

Erase Tool (E)

Paint Bucket Tool (G)

Blur Tool

Dogde Tool (O)

Pen Tool (P)

Text (T)

Patch Selection Tool (A)

Rectangle Tool (U)

Hand Tool (H)

Zoom Tool (Z)

Sampai disini tutorial tentang Tool's Dasar Adobe Photoshop, Pada tutorial selanjutnya saya akan membahas tentang Keyboard Shorcut atau Cara Pintas Keyboard Adobe Photoshop.

Struktur Dasar HTML5

Unknown 12:40 AM

Unknown

Artikel Tutorial Web 0

e-amik - HTML5 merupakan hasil proyek dari W3C (World Wide Web Consortium dan WHATWG ( Web Hypertext Application Technology Working Group ). Dimana WHATWG bekerja dengan bentuk web dan aplikasi dan W3C merupakan pengembang dari XHTML 2.0 pada tahun 2006, kemudian mereka memutuskan untuk bekerja sama dan membentuk versi baru dari HTML.

Berikut tujuan dibuatnya HTML5 :

Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
Mengurangi kebutuhan untuk plugin eksternal ( Seperti Flash )
Penanagan kesalahan yang lebih baik
Lebih markup untuk menggantikan scripting
HTML5 merupakan perangkat mandiri
Proses pembangunan dapat terlihat untuk umum

Fitur baru dalam HTML5 :

Unsur kanvas untuk menggambar
Video dan elemen audio untuk media pemutaran
Dukungan yang lebih baik untuk penyimpanan secara offline
Elemen konten yang lebih spesifik, seperti artikel, footer, header, nav, section
Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.

Beberapa browser sudah mendukung HTML5 seperti safari, chrome, firefox, dan opera. Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5.

Struktur Dasar HTML5:

Header

Aside

Nav
Section
Article
Footer

Contoh Penulisan

    

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>
      Contoh Dokumen HTML5
    </title>
  </head>
  <body>
    <header>
      <h1>
      Judul
      </h1>  
        </header>

<nav>
        <ul>
          
          <li>
            <a href="#">
              Home
            </a>
          </li>
          <li>
            <a href="#">
              About
            </a>
          </li>
          <li>
            <a href="#">
              Artikel
            </a>
          </li>
          <li>
            <a href="#">
              Contact Us
            </a>
          </li>
          </ul>
          </nav>

          <aside>
          <div>
            <p>
              Pengikut
            </p>
          </div>
          <div>
            <p>
              Kategori
            </p>
          </div>
          <div>
            <p>
              Arsip
            </p>
          </div>
        </aside>
        <section>
          <article>
            <header>
              <h2>
                Judul
              </h2>
              <p>
                Konten
              </p>
            </header>
            <p>
              Isi
            </p>
          </article>
        </section>
        <footer>
          <p>
            konten
          </p>
        </footer>
  </body>
</html>

Pada tutorial selanjutnya kita akan membahas tentang cara menyesuaikan struktur dengan CSS

Cara Menambah Alinea Paragraf Pada Postingan Blog

Unknown 11:16 AM

Unknown

Blog Tips/Trik Tutorial Web 0

Saat kita membuat suatu artikel/catatan dalam blog kita, biasanya kita pengen menampilkan model paragraf yang memiliki alinea atau tulisan line awal yang menjolok kedalam seperti saat kita membuat ketikan pada Microsoft Office Word, Dalam tutorial ini saya akan menjelaskan bagaimana cara membuat alinea pada paragraf dalam postingan blog atau web.

Contoh1

<p style="text-align: justify; text-indent: 0.5in;">Contoh pembuatan alinea pada paragraph rata kiri-kanan, terimah kasih telah membaca artikel ini. lihat artikel lain di sini</p>