Monday, July 30, 2018

Jenis Aplikasi Web - Pengetahuan Untuk Web Programmer


Jenis Aplikasi Web :
Melihat perkembangan aplikasi web yang sedang berkembang saat ini, dapat diklasifikasikan menjadi beberapa bentuk atau kelompok. Berikut di bawah penjelasan beberapa kelompok aplikasi web dan contohnya :
  • Web Bisnis yaitu aplikasi web yang di dalamnya terdapat proses bisnis seperti jual beli, sewa menyewa, penggunaan jasa, lelang dan sebagainya. Contoh situs yang menggunakan aplikasi web bisnis seperti bhineka.com, ebay.com, dll.
  • Web Berita dan Informasi yaitu aplikasi web yang menyediakan konten informasi berbayar maupun gratis. Contoh situs yang menggunakan aplikasi web berita dan informasi : kompas.com, detik.com, kaskus.us, yellowpages.co.id, tokobagus.com.
  • Web Profil yaitu aplikasi web yang mendeskripsikan tentang profil suatu perusahaan, lembaga, ataupun orang personal. Aplikasi web ini biasanya digunakan untuk memperkenalkan profil perusahaan, lembaga atau orang personal kepada umum. Contoh aplikasi web profil seperti : jogjakota.go.id, blogspot.com, dll.
  • Web Services yaitu aplikasi web yang menyediakan layanan pengolahan data dan sebagainya. Perbedaan aplikasi web service dan aplikasi web lain pada umumnya adalah aplikasi web service tidak memiliki antarmuka, namun dapat diakses melalui alamat internet. Contoh aplikasi web services seperti aws.amazon.com, konakart.com, dll.
  • Web Social Networking yaitu aplikasi web yang memberikan fasilitas pertemanan, tempat berkumpul, dan dapat juga menjadi wadah suatu kelompok. Aplikasi web social networking saat ini menjadi tren dunia internet. Contoh aplikasi web social networking seperti facebook.com, twitter.com, myspace.com, dll.
  • Web Banking yaitu aplikasi web yang di dalamnya terdapat proses transaksi keuangan pada perbankan secara umum, seperti transfer dana, pembayaran, pembelian dan lainnya. Contoh aplikasi web banking seperti klikbca.com, bankmandiri.co.id, bni.co.id, dll.
  • Web Search Engine Optimize (SEO) yaitu aplikasi web yang di dalamnya terdapat proses pencarian pada internet. Contoh aplikasi web SEO seperti: google.com, yahoo.com, bing.com, dll.

Saturday, July 28, 2018

Perbedaan Antara Client Side Scripting dan Server Side Scripting - Web Programmer

Client Side Scripting:
Proses kerja pada saat pemanggilan halaman web terbagi menjadi dua bagian, yaitu proses pada sisi client atau dikenal dengan istilah Client Side dan proses pada sisi server atau dikenal dengan istilah Server Side. Proses pada sisi klien menjalankan suatu script seperti Javascript, VBScript,dll. Script yang dijalankan umumnya adalah pengolahan tampilan halaman web serta validasi kontrol input. Melihat dari sisi kecepatan, proses sisi klien sangat membantu mengurangi lalu lintas data pada server, hal ini dikarenakan pada sisi klien proses menampilkan halaman web diolah menggunakan sumber daya dari komputer yang menjalankan halaman web tersebut.

Server Side Scripting:
Seperti yang telah dijelaskan di atas mengenai proses sisi klien, maka kebalikannya adalah proses pada sisi server (server side). Proses yang dijalankan pada sisi server memiliki tingkat pengolahan yang lebih kompleks seperti pengolahan data, hak akses, dan pengolahan lainnya yang memerlukan ketelitian dan sumber daya yang besar. Beberapa bahasa pemrograman yang berjalan pada sisi server antara lain PHP, ASP, Java Servlet,JSP, ColdFusion, dll.

Tuesday, July 24, 2018

Desain Web Praktis Dengan CSS - Mengenal dan Memahami Cara Kerja CSS



Desain Web Praktis Dengan CSS - Mengenal dan Memahami Cara Kerja CSS:
CSS atau Cascading Style Sheets adalah sebuah dokumen yang berisi aturan yang digunakan untuk memisahkan isi dengan layout dalam halaman-halaman web yang dibuat. CSS memperkenalkan "template" yang berupa style untuk dibuat dan mengizinkan penulisan kode yang lebih mudah dari halaman-halaman web yang dirancang. CSS mampu menciptakan halaman yang tampak sama pada resolusi layar yang berbeda dari pengunjung berbeda tanpa memerlukan penggunaan tabel seperti pada html klasik.

Dengan CSS, Anda akan lebih mudah dalam melakukan setting tampilan keseluruhan web hanya dengan menggantikan atribut-atribut atau perintah dalam style CSS dengan atribut yang diinginkan. Anda tidak perlu repot mengubah satu per satu atribut tiap elemen yang ada dalam halaman web jika anda menggunakan style CSS ini.

Bayangkan jika terdapat seratus atau lebih halaman dalam situs tersebut? Bayangkan berapa banyak waktu yang kita habiskan hanya untuk memformat tiap halaman jika terdapat kesalahan dalam halaman-halaman tersebut? Namun masalah tersebut dapat lebih diminimalisir dengan menggunakan CSS, karena kita hanya akan membuat sebuah style yang akan memformat keseluruhan halaman dalam situs yang dibuat, dan kita cukup menentukan selector dalam style yang akan digunakan dalam halaman-halaman tersebut dan mengeditnya.

Saat ini CSS merupakan style yang banyak digunakan dikarenakan berbagai kemudahan dan lengkapnya atribut yang dimiliknya, disamping berbagai kemudahan lain yang ditawarkannya. Penggunaan CSS dalam web akan lebih efisien dikarenakan CSS dapat digunakan secara berulang pada tag-tag tertentu, sehingga kita tidak usah mengetikkan ulang seluruh perintah pemformatan seperti halnya dalam HTML klasik.

Monday, July 23, 2018

Mendefinisikan Desain yang Baik Untuk Sebuah Desain Website - Penting untuk Web Designer

Mendefinisikan Desain yang Baik:
Ada dua sudut pandang utama yang digunakan kebanyakan orang untuk menentukan desain dari sebuah website itu "baik" atau "buruk". Ada sudut pandang usability, yang berfokus pada fungsionalitas, keefektifan penyajian informasi, dan efisiensi. Kemudian ada perspektif estetika murni, di mana semuanya berkaitan dengan nilai seni dan daya tarik visual dari desain. Beberapa orang terperangkap dalam sisi estetika dan grafis sampai melupakan penggunanya, sementara beberapa penganut usability tersesat dalam user testing dan melupakan daya tarik visual dari situs mereka. Dalam rangka menjangkau pengguna dan mempertahankan ketertarikan mereka terhadap situs yang dibuat, sangatlah penting untuk memaksimalkan kedua sudut pandang ini.

Hal terpenting untuk diingat adalah bahwa desain itu adalah tentang komunikasi. Jika anda membuat website yang bekerja dan menyajikan informasi dengan baik, namun tampilannya tampak jelek atau gagal menyatu dengan merek yang dimiliki klien, tidak akan ada yang mau menggunakannya. Demikian pula, jika Anda membuat website yang tampak indah namun sulit untuk digunakan atau tidak dapat diakses, orang juga akan meninggalkannya. Memang, unsur-unsur dan fungsionalitas dari sebuah desain website yang jadi haruslah bekerja sebagai satu unit kohesif tunggal, sehingga:

  1. Pengguna menyukai desainnya namun tertarik juga dengan kontennya
  2. Salah satu kekhawatiran terbesar di antara para profesional usabilitas adalah waktu yang dibutuhkan oleh pengguna untuk memindai halaman hingga menemukan informasi yang mereka inginkan, baik itu sebuah konten, link ke halaman lain, maupun bentuk form isian.Desain tidak boleh menjadi penghalang; desain harus bertindak sebagai penghubung antara pengguna dan informasi. Contoh website yang baik dari segi desain juga kontennya adalah: harmonyrepublic.bigcartel.com
  3. Pengguna dapat berpindah-pindah dengan mudah melalui navigasi intuitif
  4. Kita nanti akan membahas lebih banyak tentang penempatan navigasi. Yang perlu diingat, blok navigasi utama itu sendiri harus terlihat jelas pada halaman, dan masing-masing link harus memiliki judul (title) deskriptif. Struktur navigasi yang tidak hanya mengubah penampilan ketika ditunjuk dengan kursor tetapi juga menunjukkan halaman atau bagian yag aktif, akan dapat membantu pengguna untuk mengenali posisi di mana mereka sedang berada, dan cara menuju ke mana mereka ingin pergi. Contoh website yang baik dari segi navigasi serta intuitif adalah seperti yang pernah dibuat oleh pembuat blog ini (alvienadnan.blogspot.com)--(sedikit promosii..yaa..hehehe..) yaitu sebagai berikut:

    Navigasi sekunder, kolom pencarian, dan link untuk keluar tidak boleh menjadi fitur yang dominan. Jika kita membuat item-item ini mudah ditemukan, dan memisahkan mereka secara visual dari konten, kita memungkinkan pengguna untuk berfokus pada informasi -- nantinya mereka akan tahu di mana harus mencarinya ketika mereka sudah siap untuk beralih ke konten yang lain.

  5. Pengguna mengenali masing-masing halaman sebagai bagian dari situs
  6. Bahkan jika ada perbedaan dramatis antara layout halaman muka dan bagian lain dari situs , sebuah tema atau gaya yang kohesif harus ada kepada keseluruhan halaman situs untuk mempertahankan desain secara bersama-sama. Contoh website yang memberikan pengenalan masing-masing halaman sebagai bagian dari situs adalah: moore.sc.edu .



Sunday, July 22, 2018

Pengertian Web Server dan List Beberapa Perangkat Lunak Web Server



Pengertian Web Server dan List Beberapa Perangkat Lunak Web Server:
Web Server adalah sebuah komputer yang terdiri dari perangkat keras dan perangkat lunak. Secara bentuk fisik dan cara kerjanya, perangkat keras web server tidak berbeda dengan komputer rumah atau PC, yang membedakan adalah kapasitas dan kapabilitasnya. Perbedaan tersebut dikarenakan web server bekerja sebagai penyedia layanan yang dapat diakses oleh banyak pengguna, sehingga dibutuhkan kapasitas dan kapabilitas yang besar dibandingkan PC. Dukungan perangkat lunak sangat dibutuhkan agar web server dapat berjalan secara optimal. Setiap perangkat lunak web server memiliki karakteristik dan teknologi yang digunakan untuk mengatur keja sistemnya. Berikut beberapa perangkat lunak web server antara lain:

Vendor
Produk
Sistem Operasi
Apache Software Foundation
Apache Web Server Cross Platform
Microsoft Corp. Internet Information Services (IIS) Windows Only
Igor Sysoev Nginx Web Server Cross Platform
Lighttpd Lighttpd Web Server Cross Platform
JigsawJigsaw Web ServerCross Platform
KoanlogicKloneCross Platform
Oracle CorpiPlanet Web ServerCross Platform
iMatic CorpXitami (X5)Cross Platform
Aprelium TechAbyss Web ServerCross Platform
Zeus Technology LtdZeus Web ServerCross Platform

Wednesday, July 18, 2018

Dasar Pemrograman Web Dinamis - Bab 2 - Mulai Memprogram Dengan PHP - Kumpulan Source Code PHP yang Dapat Dipraktikkan

2.1 Membuat Program PHP yang Pertama
Setelah web server diintegrasikan dengan PHP, Anda bisa memulai memprogram dengan PHP dan kemudian mengujinya.Untuk membuat program PHP,anda bisa menggunakan editor teks apa saja.Misalnya, di lingkungan Windows, anda bisa menggunakan Notepad.
Dengan menggunakan editor apa saja,tulislah kode seperti berikut dan simpan pada direktori yang diakses oleh klien dengan nama selamat.php.

→Skrip : selamat.php
<html>
<head>
<title>Latihan Pertama</title>
</head>
<body>
Selamat Belajar PHP.<br>
<?php
printf("Tgl.Sekarang:%s",Date("D F Y"));
?>
</body>
</html>

2.2 Variabel Dalam PHP
Semua bahasa pemrograman menyediakan variabel, yang berfungsi untuk menyimpan suatu nilai dan nilai yang ada di dalamnya dapat diubah sewaktu-waktu.Skrip berikut memerikan contoh penggunaan variabel.

→Skrip : latvar.php

<html>
<head>
<title>Latihan Variabel</title>
</head>
<body>
Selamat Belajar PHP.<br>
<?php
$nama="Abdul Kadir";
printf("Halo, %s", $nama );
?>
</body>
</html>

Pada kode di atas $nama adalah nama variabel.Pada program PHP,variabel selalu ditulis dengan diawali tanda $. Baris:
$nama="Abdul Kadir";
merupakan pernyataan yang digunakan untuk memberikan string "Abdul Kadir" ke variabel $nama. Selanjutnya:
printf("Halo, %s",$nama);
merupakan pernyataan untuk menampilakn tulisan "Halo," yang diikuti dengan nilai yang terletak di sebelah kanan koma, yaitu isi variabel $nama. Tanda %s merupakan tanda format untuk string.Artinya,data yang akan menggantikan tanda tersebut adalah data string.

Dengan menggunakan PHP anda juga bisa mengirimkan suatu nilai yang ditangani melalui formulir dan kemudian nilai ini dikirim ke skrip yang lain.Sebagai contoh,anda bisa membuat skrip PHP seperti berikut:

→Skrip : latinput.php

<html>
<head>
<title>Latihan Pemasukan Data</title>
</head>
<body>
<form action="salam.php" method="GET">
Silakan masukkan nama anda:<br>
<input type="text" name="nama_pemakai"><br>
<input type="submit" value="kirim">
</form>
</body>

Bila pemakai memasukkan nama maka nama tersebut akan disimpan pada variabel HTML bernama nama_pemakai (yang dinyatakan dengan nama_pemakai pada NAME).
Bila selanjutnya pemakai mengklik tombol berjudul Kirim maka berkas salam.php akan dijalankan.
Sebelum mencoba mengklik tombol berjudul Kirim, cobalah untuk membuat skrip PHP sebagai berikut:

→Skrip : salam.php


<html>
<head>
<title>Latihan menampilan variabel</title>
</head>
<body>
<?php
$nama_pemakai=$_GET("nama_pemakai");
print("Selamat Belajar PHP, <b>$nama_pemakai</b>");
?>
</body>
</html>



Dasar Pemrograman Web Dinamis Menggunakan PHP - Bab 1 Pengantar PHP

1.1 Apa Itu PHP?
Menurut dokumen resmi PHP, PHP merupakan singkatan dari PHP Hypertext Preprocessor.Ia merupakan bahasa berbentuk skrip yang ditempatkan dalam server dan diproses di server. Hasilnyalah yang dikirimkan ke klien,tempat pemakai menggunakan browser.

Secara khusus, PHP dirancang untuk membentuk aplikasi web dinamis.Artinya, ia dapat membentuk suatu tampilan berdasarkan permintaan terkini.Misalnya,Anda bisa menampilkan isi database ke halaman web.Pada prinsipnya PHP mempunyai fungsi yang sama dengan skrip-skrip seperti ASP,ColdFusion,ataupun Perl.Namun, perlu diketahui bahwa PHP sebenarnya bisa dipakai secara command line.Artinya, skrip PHP dapat dijalankan tanpa melibatkan web server maupun browser.

Pada saat ini PHP cukup populer sebagai peranti pemrograman web,terutama di lingkungan Linux.Walaupun demikian, PHP sebenarnya juga dapat berfungsi pada server-server yang berbasis UNIX,Windows, dan Macintosh.

Pada awalnya , PHP dirancang untuk diintegrasikan dengan web server Apache. Namun, belakangan PHP juga dapat bekerja dengan web server seperti PWS (Personal Web Server),IIS(Internet Information Server), dan Xitami.

1.2 Skrip PHP
Skrip PHP berkedudukan sebagai tag dalam bahasa HTML.Sebagaimana diketahui,HTML (Hypertext Markup Language) adalah bahasa standard untuk membuat halaman-halaman web.Sebagai contoh,berikut adalah kode HTML (disimpan dengan ekstensi .html atau .html)

<html>
<head>
<title>Latihan Pertama</title>
</head>
<body>
Selamat Belajar PHP.<br>
</body>
</html>

Adapun kode berikut adalah contoh kode PHP yang berada di dalam kode HTML: (Kode disimpan dengan ekstensi .php)

<html>
<head>
<title>Latihan Pertama</title>
</head>
<body>
Selamat Belajar PHP.<br>
<?php
printf("Tgl. Sekarang: %s ", Date("d F Y"));
?>
</body>
</html>

Perhatikan kode berikut:

<?php
printf("Tgl. Sekarang: %s ", Date("d F Y"));
?>

Kode inilah yang merupakan kode PHP.Kode PHP diawali dengan <?php dan diakhiri dengan ?>.
Pasangan kedua kode inilah yang berfungsi sebagai tag kode PHP.Berdasarkan tag inilah,pihak server dapat memahami kode PHP dan kemudian memprosesnya.Hasilnya dikirim ke browser.

1.3 PHP dan Database
Salah satu kelebihan dari PHP adalah mampu berkomunikasi dengan berbagai database yang terkenal.Dengan demikian, menampilkan data yang bersifat dinamis, yang diambil dari database, merupakan hal yang mudah untuk diimplementasikan.Itulah sebabnya sering dikatakan bahwa PHP sangat cocok untuk membangun halaman-halaman web dinamis.

Pada saat ini PHP sudah dapat berkomunikasi dengan berbagai database meskipun dengan kelengkapan yang berbeda-beda. Beberapa di antaranya BASE,

  • DBM,
  • FilePro(Personix,Inc),
  • Informix,
  • Ingres,
  • InterBase,
  • Microsoft Access,
  • MSQL,
  • MySQL,
  • Oracle,
  • PostgreSQL,
  • Sybase.


Monday, July 16, 2018

Bab 1 Buku Terjemahan The Principles Of Beautiful Web Design-Tata Letak dan Komposisi

Proses Desain
Mendesain sebuah website dapat menjadi pedang bermata dua.Prosesnya berada di antara seni,ilmu pengetahuan, dan pemecahan masalah. Kita pastinya ingin membuat sebuah situs individual yang estetis,tetapi yang perlu diingat, prioritas utama kita haruslah sesuai dengan kebutuhan klien kita.Proses ini memerlukan pencapaian yang tinggi dan rumit,jika tidak demikian nantinya hanya akan menjadi sebuah penyajian informasi belaka.Jika kita gagal menyimak,maka keseluruhan proyek akan hancur dalam waktu yang bersamaan dengan hancurnya reputasi kita.Detail teknis dan pengembangan,hosting,serta pemeliharaan dari sebuah website atau aplikasi akan menjadi hal yang bersifat teknis.Proses pembuatan "comp" dari suatu desain dapat dirumuskan dalam tiga pokok tugas saja, yaitu: penemuan (discovery), eksplorasi (exploration), dan implementasi (implementation).

Apa itu Comp?

Kata comp merupakan kependekan dari frase "comprenhensive dummy(dummy komprehensif)"-sebuah istilah yang berasal dari dunia desain cetak.Comp adalah simulasi lengkap dari layout cetak yang dibuat sebelum layout dicetak massal.Dalam bahasa desain web,comp merupakan gambar layout yang dibuat sebelum kita mulai membangun prototipe desain dalam HTML.

Berikut adalah pembahasan mengenai tiga pokok proses pembuatan "comp" dari suatu desain:

  • Penemuan
  • Komponen penemuan dalam proses desain adalah mengenai pertemuan dengan para klien dan mempelajari apa yang sebenarnya mereka kerjakan.Akan sedikit kontra-intuitif,namun mengumpulkan informasi mengenai siapakah klien anda dan bagaimana mereka mengerjakan bisnis mereka adalah penting dalam upaya menghadirkan sebuah desain yang tepat dan efektif.

    Berikut ini adalah beberapa pertanyaan yang sering saya tanyakan dalam pertemuan awal dengan klien,sekalipun saya telah memperoleh sendiri jawabannya dari hasil pencarian via search engine:
    • Apa yang perusahaan anda kerjakan?
    • Apa peran anda dalam perusahaan?
    • Apakah perusahaan anda ini memiliki merek atau logo?Apa tujuan pengembangan website ini?
    • Informasi apa saja yang ingin anda sajikan secara online?
    • Terdiri dari siapa sajakah audiens target anda?Apakah setiap member memerikan informasi mengenai demografi umum,seperti umur,jenis kelamin, atau lokasi fisik?
    • Siapa sajakah kompetitor anda, dan apakah mereka memiliki website?
    • Adakah contoh-contoh website yang anda sukai atau yang tidak anda sukai?
    • Berapa lamakah waktu yang anda sediakan untuk pengerjaan proyek ini dan berapa anggarannya?

    Jika Proyek ini merupakan proyek desain ulang dari sebuah website yang sudah ada sebelumnya,saya juga akan menanyakan hal-hal berikut:
    • Apa saja yang biasanya dicari oleh pengunjung website anda ketika mereka mengunjungi situs anda?
    • Apa saja permasalah yang ada pada desain yang sudah ada sekarang?
    • Pencapaian apa yang anda harapkan dari adanya redesain ini?
    • Adakah elemen-elemen tertentu dari situs lama yang tetap ingin anda gunakan?
    • Bagaimana kira-kira reaksi dari pengunjung anda terhadap desain baru ini nantinya?

  • Eksplorasi
  • Tahap selanjutnya dari proses desain adalah membawa kembali informasi yang telah anda pelajari dari klien ke dalam laboratorium anda untuk dianalisis,dipilah,dan diujicobakan.Anda hendak mengembangkan pemahaman yang kuat pada semua informasi,produk,dan layanan yang ingin mereka tawarkan,dan bermain-main dengan bagaimana semuanya ini dapat diatur.Posisikan diri anda sebagai pengunjung website dan tanyakan kepada diri anda sendiri apa yang sekiranya anda cari sebagai pengunjung.Jika anda berpikir untuk membeli sebuah produk,apa saja yang perlu anda ketahui sebelum anda membeli produk tersebut?Jika anda mendaftar untuk sebuah layanan,di manakah anda akan mempelajari tentang perbedaan penawaran dan tingkat layanan yang anda butuhkan?Judul terbaik seperti apakah yang cocok untuk halaman x, dan berapa langkah yang dibutuhkan untuk mencapai halaman y.

  • Implementasi
  • Percobaannya dengan memulai membuat sketsa beberapa kemungkinan layout.Setelah menghasilkan beberapa layout,saya memutuskan untuk memilih salah satu yang saya suka,beralih ke Photshop, dan menggunakan rectangle tool untuk memblok area yang sudah saya tandai di atas kertas tadi.Setelah menetapkan layout,saya bereksperimen dengan warna-warna background dan foreground sampai saya menemukan skema warna yang solid.Saya mengutak-atik tombol yang ada di Photoshop,hingga akhirnya,seara ajaib,saya mendapatkan comp untuk ditunjukkan kepada klien.


Prakata Dan Daftar Isi Buku Terjemahan The Principles Of Beautiful Web Design

Prakata:
Ketika saya beserta istri pindah ke rumah baru, salah satu proyek besar pertama kami adalah memperbarui kamar mandi.Wallpaper bermotif bunga-bunga yang mengerikan,dengan wastafel yang disepuh keemasan,kaca cermin yang jelek,dan lampu yang modelnya norak,membuat kami serasa kembali ke dekade sebelumnya setiap kali melangkahkan kaki ke kamar mandi utama.Mengganti wallpaper adalah tugas yang sulit, dan menjadi makin sulit saat wallpaper tersebut ternyata sudah dipasang berlapis-lapis.Hal inilah yang terjadi pada kamar mandi kami.Sepertinya selera pemilik rumah sebelumnya terhadap wallpaper selalu berubah setiap beberapa tahun,dan bukannya melepas lembaran yang lama sebelum menempel yang baru,mereka justru menutup wallpaper jelek dengan wallpaper yang lebih jelek lagi.Yah,beginilah suka duka menjadi pemilik rumah baru.


Pelajaran yang dapat diambil dari petualangan renovasi saya adalah adanya kesamaan yang kuat antara mendesain ruangan dengan mendesai sebuah situs web yang baik.
Point utama yang terdapat pada prakata buku ini adalah:

  1. Desain yang baik berbicara tentang hubungan antar elemen-elemen yang terlibat dan menciptakan keseimbangan di antara mereka.
  2. Mode selalu datang dan pergi,tetapi desain yang baik tidak mengenal waktu.
  3. Sentuhan akhir memberikan kesan yang besar.
Isi Buku Ini:
Buku ini terdiri atas lima bab.Anda dapat membacanya mulai dari awal hingga akhir untuk mendapatkan pemahaman menyeluruh terhadap subjek, atau langsung melompat ke topik tertentu untuk mendapatkan penyegaran.Kelima bab tersebut sebagai berikut:

  1. Bab 1: Layout (Tata Letak) dan Komposisi
  2. Bab 2: Warna
  3. Bab 3: Tekstur
  4. Bab 4: Tipografi
  5. Bab 5: Gambar




Thursday, July 12, 2018

Bab 1 Serial Zero to a Pro CSS-Mengenal HTML dan CSS


1.Pengertian HTML:
  • Tersurat dari kepanjangannya , HTML adalah bahasa markup.
Bahasa Markup berarti bahasa yang menggunakan teks sebagai penanda atau pemformat bagi teks yang lain. Sebagai contoh:
<h1>Judul</h1>
Pada HTML membuat teks "Judul" ditulis dengan ukuran besar karena ditulis dengan apitan <h1> dan </h1>
  • Berkas yang berisi kode HTML biasa disebut dokumen HTML.
  • Hypertext berarti teks yang mengandung suatu link ke teks yang lain.
Link biasanya berupa text yang digarisbawahi dan apabila diklik maka teks lain akan ditampilkan

2.Perlukah Tool Khusus untuk Membuat HTML:
  • Ilustrasi:
  • Pintu rumah bisa dibuat tanpa harus menggunakan peralatan canggih.Demikian juga saat kita bermaksud membuat kode HTML untuk menyusun suatu halaman web.
    Kita sudah bisa menyusun halaman web dengan menggunakan editor teks yang sederhana.Sebagai contoh ,kita bisa memakai fasilitas Notepad di Windows.
3.Mengenal Kode HTML:
Sebuah dokumen HTML yang sederhana telah diperkenalkan di depan.Sebuah Dokumen diawali dengan:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
atau mirip dengan itu.Bagian tersebut dikenal dengan deklarasi doctype.Letaknya sebelum tag <html>,tetapi DOCTYPE tersebut tidak berkedudukan sebagai tag.Deklarasi doctype berfungsi memberi tahu browser tentang aturan-aturan yang digunakan untuk menyusun halaman web sehingga diharapkan browser dapat menerjemahkannya dengan tepat.Jika anda membuat dokumen HTML,salin saja baris tersebut.
Keterangan Khusus:
  • Pasangan tag <html> dan </html> mengawali kode HTML
  • Di dalamnya terdapat pasangan <head> dan &lt/head> serta <body> dan </body>
  • Pasangan <head> dan </head> mengawali halaman web,antara lain berisi pasangan tag <title> dan </title> yang berguna untuk menentukan judul halaman web,yaitu yang terletak di bagian teratas jendela browser.
  • Pasangan <body> dan </body> merupakan bagian yang menyatakan isi halaman web.Pada Bagian inilah informasi yang ingin disampaikan ke pengunjung web diletakkan.Di dalamnya banyak tag yang bisa digunakan.Pada contoh di depan,antara lain terdapat pasangan tag <h1> dan </h1> serta <h2> dan </h2>.
  • Pasangan tag <h1> dan </h1> ditujukan untuk membuat judul dengan ukuran terbesar.
  • Pasangan tag <h2> dan </h2> ditujukan untuk membuat judul dengan ukuran lebih kecil daripada <h1>
  • Pasangan tag <div> dan </div> digunakan untuk membuat suatu divisi(bayangkan sekumpulan paragraf dalam buku).
  • Tag <img src="nasgitel.png"/> menyatakan bahwa gambar berkas nasgitel.png ditampilkan.
Catatan:
Biasakan untuk menuliskan pasangan tag terlebih dulu dan kemudian baru mengisikan yang berada di antara pasangan tersebut.Cara ini mengurangi kesalahan untuk lupa menuliskan tag penutup.

Monday, July 2, 2018

Materi Buku From Zero To A Pro CSS

'Materi Buku From Zero To A Pro CSS'

1.Mengenal HTML dan CSS
2.Memahami CSS Lebih Lanjut
3.Mendalami Beberapa Fondasi
4.Semua Tentang Font
5.Mengatur Teks
6.Menggunakan List
7.Mengatur Bingkai
8.Semua Tentang Gambar
9.Menggunakan Tabel