afterschools

Lambang Negara Kanada

2011-02-12T19:10:00.000-08:00

Tahun 1980 negara pertama yang memiliki sistem identitas adalah Kanada. Sejak tahun 1969 pemerintahnya telah memikirkan perlunya sebuah identitas lebih dari sekedar lambang dan bendera negara. Dengan segera negara-negara lain mengikuti langkah Kanada.

Agar Blog diterima oleh Google ( Bagian 2 )

2011-02-11T11:58:00.000-08:00

Melanjutkan postingan saya sebelumnya tentang "Agar Blog diterima oleh Googe ". Pada kali ini saya akan membahas dari segi teknis tentang apa saja yang harus di lakukan agar blog kita dapat diterima oleh Google.

Tulis content yang berkualitas. ini adalah syarat mutlak yang harus dipenuhi.
Jangan menduplikat artikel secara sama persis dari situs lain.karena Google akan menganggap situs kita tidak benar-benar bermutu. Perlu di ingat bahwa Google memiliki robot untuk melakukan tugas tracking articles sekaligus untuk melakukan check atas kontent yang sama.
Jangan terlalu banyak mengimport feed dari situs lain. Saya kerap kali menemukan situs yang isinya hanya tumpukan feed dari situs lain, yang ujung-ujungnya jika dibuka akan mengarah ke source dari artikel itu sendiri.
Jangan memasukkan iklan yang berlebih dan tidak teratur. karena nantinya situs / blog kita hanya di anggap sebagai junk.
Perhatikan Layouting. ini akan sangat berpengaruh besar sekali. karena personalisasi berasal dari Layouting ini.

mengenai ini akan saya bahas di kategori desain grafis di postingan selanjutnya. Cukup sekian dulu mengenai topik kita kali ini, semoga bermanfaat dan banyak membantu.

Agar Blog diterima oleh Google ( Bagian 1 )

2011-01-26T23:44:00.000-08:00

Sebenarnya saya tidak berniat untuk membahas tentang SEO di Blog ini, karena memang saya khususkan untuk materi ringan seputar Programming Web dan desain grafis saja. Namun, karena adanya permintaan dari beberapa teman blogger, akhirnya saya memunculkan materi ini lagi.

Kasus permasalahan pada topik kita kali ini ialah sulitnya Blog di terima di Google. sebenarnya hal ini tidak akan menjadi masalah berat bagi para pengamat SEO. Sebenarnya sudah menjadi issue yang sangat lama jika Google lebih memilih situs yang memiliki domain berbayar daripada hanya sebuah domain gratis sekalipun itu merupakan produk Google sendiri. Setelah sekian lama saya mengamati, ternyata begitu banyak sekali Blog dari luar yang menghasilkan earning dari Google Adsense yang didapatkannya dari Blog mereka. lalu melihat kenyataan tersebut, bagaimanakah tentang issue yang selama ini telah dipercaya berpengaruh besar dalam approve di Google Adsense tersebut?

Ternyata jawaban utamanya ialah terletak pada kualitas konten, usia, dan keteraturan dalam postingan Blog. syarat yang sangat mudah bukan? tapi terkadang syarat ini akan menjadi sangat menyulitkan bagi orang-orang yang mengawali karir Blogging mereka dengan SEO ataupun online earning. karena kebanyakan dari mereka telah banyak teracuni dan berpandangan bahwa Blog itu hanyalah mesin penghasil uang, cukup itu saja!

Perbedaan para Blogger luar dan para "Blogger" Indonesia kebanyakan ialah ( tanpa bermangsut men-judge ) niat awal dari kegiatan Blogging itu sendiri. para Real Blogger dari luar beranggapan bahwa Blog itu ibarat rumah yang mungkin bernyawa. Blog itu menjadi tempat bernaung di kala si pemilik Blog merasa suntuk dengan kegiatan sehari-harinya, menjadi tempat curhat, research atas kegiatan sehari-harinya, dan masih banyak alasan-alasan lain yang lebih baik dari sekedar mencari uang dari mengharapkan klik dari Google Adsense dan semacamnya. dan Google Adsense bagi mereka hanyalah bonus dari apa yang telah ia pelihara selama ini.

Namun berbeda lagi dengan apa yang Blogger Indonesia lakukan selama ini ( tanpa bermangsut men-judge ). Memang tidak semua, tapi rata-rata bagi mereka yang mengharapkan earning dari internet dengan media Blogger, Blogger hanyalah di anggap sebagai mesin. Sehingga, ujung-ujungnya segala carapun di lakukan, mulai dari auto post, copas, SEO yang berlebihan, dan kegiatan lain tanpa memperhatikan esensi dari Blogging itu sendiri. bahkan ada satu hal yang tampak begitu membosankan sekali, yaitu mengkategorikan label dengan begitu banyaknya namun tidak sesuai, sehingga Blog itu sendiripun tidak sedap dipandang.

Lalu, apa yang harus dilakukan agar Blog kita dapat diterima Google dan mendapatkan banyak pembaca setia? kunci utamanya ialah "konten yang berkualitas!"

dan mengenai teknik yang lain, akan saya bahas di posting saya selanjutnya. selamat membaca..

Membuat wave line effect

2011-01-10T21:52:00.000-08:00

Hai.. teman-teman, selamat pagi! di hari minggu yang cerah ini saya hendak membuat tutorial tentang membuat effect wave line. Apakah anda-anda ini sudah tahu apa itu wave line? baiklah saya kasih contohnya :

Dan sekarang saya akan menunjukkan bagaimana cara membuatnya. agar lebih mudah, seperti biasa saya akan menunjukkan dengan gambar. tapi sebelum itu, buka terlebih dahulu adobe illustrator anda.

Pertama, buatlah 2 buah garis, terserah anda hendak membuat garis dengan motif seperti apapun. agar lebih mudah dalam membuat garis, gunakan pen tool ( perhatikan lingkaran dengan tanda huruf a). selanjutnya jangan lupa fill harus dalam posisi kosong / transparan dan stroke / garis dalam posisi berwarna ( perhatikan pada lingkaran dengan tanda huruf b). dan untuk ukuran ketebalan garis terserah anda ( perhatikan lingkaran dengan tanda huruf c).

Langkah selanjutnya ialah blok kedua garis, anda bisa memblok dengan menggunakan shortcut Ctrl+A atau dengan menyeleksi dengan menggunakan mouse. Setelah objek terseleksi, lanjutkan dengan memilih menu Object-Blend-Make. hal itu berfungsi untuk membuat effect blend.

Untuk sementara waktu hasil dari effect blend tersebut masih dalam posisi merapat. itu adalah wajar, karena itulah yang disebut sebagai effect blend. untuk merubahnya menjadi polah wave, kita perlu merenggangkan kerapatan warnanya hingga membentuk garis-garis. Caranya perhatikan gambar di atas, yaitu hampir sama dengan langkah di atas: Object-Blend-Blend Option.

Pada menu Blend Option, anda akan menjumpai 3 pilihan. yaitu smooth color, specified steps, dan specified distance. Perbedaan dari ketiga menu di atas ialah smooth color untuk membuat effect gradasi / blend yang halus seperti saat semula kita memberikan effect ( seperti gambar di atas ), specified steps ialah untuk merenggangkan warna sesuai jumlah objek yang ditentukan. misal, pada contoh di atas saya menentukan value untuk specified steps sebanyak 20, itu berarti garis yang akan diciptakan sebanyak 20 garis mulai dari garis awal ( merah ) ke garis akhir ( biru ). sedangkan specified distance itu sendiri ialah menentukan lebarnya jarak antar baris.

bagaimana? cukup mudah bukan? contoh di atas adalah contoh pola wave sederhana yang telah saya buat. mengapa terkesan jelek dan kurang halus? tentu saja karena saya membuatnya dengan asal-asalan. dan contoh di bawah ini adalah contoh jadi yang telah saya buat.

selamat mencoba!

export design dari Adobe illustrator ke Photoshop secara langsung

2011-01-09T12:48:00.000-08:00

Pada adobe illustrator CS5 terdapat fitur terbaru yang memungkinkan kita untuk melakukan export file secara langsung dari adobe illustrator ke adobe photoshop. Sehingga nantinya kita bisa langsung mengedit file yang telah di desain dari adobe illustrator tersebut ke dalam adobe photoshop.bagaimana caranya? perhatikan contoh illustrasi gambar di bawah ini :

Seperti pada kedua gambar yang telah di tampilkan di atas, telah jelas ditunjukkan bahwa anda hanya perlu melakukan dua langkah mudah. di antaranya. pertama, lakukan export files yang bisa anda temui di menu files (pada toolbar adobe illustrator). selanjutnya pilih type files PSD ( format adobe photoshop). dan kemudian anda bisa langsung membuka file tersebut di adobe photoshop. cukup mudah bukan? silahkan mencoba!

Cari sesuatu yang lebih mudah diingat!

2011-01-08T00:27:00.000-08:00

Dalam hal desain grafis, khususnya dalam pembuatan logo, ada beberapa point penting yang harus diperhatikan. yaitu, "cari sesuatu yang lebih mudah diingat". kenapa harus demikian? biasanya logo yang terlalu ribet, dan terkesan sangat sulit untuk diingat itu tidak akan mudah untuk masuk di hati orang lain. tapi tentu saja tidak semua logo bersifat simple. logo yang ribet dengan berbagai atribut, biasanya terdapat pada logo-logo tertentu yang berkesan mewah dan memiliki nama yang sudah melambung. biasanya logo seperti ini dapat kita jumpai pada produk kemasan makanan. terutama produk botol. untuk pengalaman saya pribadi, biasanya saya sering menjumpai logo tersebut pada kemasan kecap, jus, susu ataupun hal lain yang menyangkut dari apa yang produk itu tawarkan. sebut saja sebuah produk susu, pasti hal yang paling melekat di hari orang ialah gambar sapi dengan background pegunungan dengan rerumputan hijau dan matahari yang bersinar. tentu dengan adanya clue seperti ini kita setidaknya dituntut untuk menggambarkannya ke dalam sebuah logo. tapi logo yang mudah iingat biasanya tidak jauh dari huruf awal dari nama perusahan tersebut ataupun sesuatu yang bisa menjadi wakil untuk menggambarkan / mendeskripsikan perusahaan tersebut. bagaimana? sudah ada gambaran?

mendesain dengan memadukan gambar manual

2011-01-04T17:32:00.000-08:00

Sebenarnya ini bisa dibilang teknik yang sangat jadul sekali. tapi saya rasa sangat ampuh dan masih bisa membantu kita dalam mempermudah mendesain suatu logo atau artwork yang lain. tidak sepenuhnya 100% manual sih, tapi intinya disini ialah.. kita mendesain sketchnya terlebih dahulu kemudian lakukan scanning dan setelahnya kita akan membuat sketch ulang dari hasil scan tadi dengan menggunakan aplikasi yang favorit bagi anda. seperti misalkan adobe illustrator ataupun adobe photoshop. setelah itu melakukan pewarnaan dasar,effect dan setelah itu finishing.

mengapa saya sebutkan di atas bahwa membuat gambar secara manual itu bisa mempermudah? hal ini karena saya rasa, setiap orang akan lebih familiar dengan tangannya sendiri daripada masih memegang mouse. jadi, mungkin saja apa yang menjadi ide segar, bisa langsung di tuangkan dengan cepat jika langsung melalui tangan. bila anda masih bingung dengan apa yang saya maksud, mungkin lebih baik jika di lain waktu saya akan menunjukkan contoh gambarnya secara langsung. selamat berkreasi!

Fokus itu penting!

2010-12-22T12:43:00.000-08:00

Dalam dunia desain grafis, ada satu hal yang kadang sering kali terabaikan secara tidak sadar oleh para desainer itu sendiri. Hal itu ialah "fokus". terkadang desainer yang fokusnya kian menghilang seiring tenggat waktu penyelesaian atau order yang semakin dekat ialah di pengaruhi oleh beberapa faktor. di antaranya dikarenakan desainer tersebut mulai panik, karena ia merasa kekurangan waktu untuk menyelesaikan pekerjaannya tersebut. yang kedua ialah dikarenakan terlalu banyak order, sehingga ia bingung hendak menyelesaikan yang mana terlebih dahulu, sampai akhirnya desainer tersebut berusaha menyelesaikan semua order namun sayangnya dengan hasil yang terlalu terburu-buru dan tidak maksimal.

Namun ada hal lain yang saya anggap agak sedikit aneh. biasanya penyakit ini muncul khusus untuk desainer yang sering kali mengikuti kontes desain yang diselenggarakan secara terbuka dengan jumlah kontes yang sangat banyak disertai dengan hadiah yang begitu besar. biasanya desainer menjadi bingung hendak mengambil kontes yang mana. hal ini sangat wajar, karena sebagai manusia yang butuh uang tentu secara naluri manusia ini akan mencoba mencari sebanyak-banyaknya uang tersebut, karena semakin banyak akan semakin makmur. mungkin seperti itulah logika sederhananya. begitu pula dengan desainer yang mengikuti kontes. terkadang, karena begitu besarnya keinginan untuk mengikuti seluruh kontes, apalagi disertai dengan pesaing desainer lain yang memiliki kemampuan hebat, dan tenggat waktu yang singkat, ini akan menjadi masalah yang sangat membingungkan bagi desainer, karena dirinya butuh fokus agar perhatiannya tidak terbias dengan hadiah dan banyaknya kontes yang ada. desainer harus mampu memfokuskan diri untuk beberapa kontes yang dirasa dapat ia kerjakan dengan semaksimal mungkin sesuai waktu yang telah disediakan. jika perlu jangan mengambil terlalu banyak kontes pada saat itu. bukankah lebih baik menyelesaikan satu pekerjaan dengan benar-benar maksimal dibanding menyelesaikan banyak pekerjaan namun dengan hasil yang kurang memuaskan.

Intinya, fokuslah pada satu pekerjaan terlebih dahulu sebelum mengerjakan pekerjaan yang lain. dan ingat! jangan terbias dengan faktor ekternal disekitarnya.

Mengenal Padding Bag.1

2010-12-19T19:25:00.000-08:00

Apa itu padding? mungkin disini anda sempat bingung antara perbedaan margin dengan padding. Secara singkat saya akan mencoba menjelaskan sedikit tentang perbedaan margin dan padding. margin ialah jarak pengukuran dari tepi luar halaman website. sedangkan padding ialah jarak pengukuran dari tepi dalam halaman website. Masih bingung? saya juga bingung mau menjelaskan bagaimana.. maklum bahasa yang saya gunakan tidak memenuhi EYD. yah, kira-kira seperti dibawah ini gambarannya.

Sudah mengerti bukan? baiklah, mari kita lanjutkan ke materi selanjutnya. Sekarang kita akan belajar ke bagian codingnya secara langsung agar kita lebih mengerti tentang apa itu padding dan bagaimana cara kerjanya.

..........
<head>
<style type="text/css">
body{font-family:verdana;}
p {width:200px; background-color:grey; padding: 0 20px;}
</style>
</head>
<body>
Ini adalah latihan CSS saya yang ketiga
<h1>Judul</h1>
<p>disini adalah lokasi paragraf yang akan anda tulis</p>
</body>

Perhatikan coding di atas, saya menuliskan syntax pada bagian p seperti ini

p {width:200px; background-color:grey; padding: 0 20px;}

itu artinya : saya mencoba menentukan width atau panjang sebesar 400 pixel dengan warna background grey dan dengan padding atas dan bawah sebesar 0 pixel dan padding kanan dan kiri sebesar 20 pixel .

Pasti saat ini anda bertanya-tanya. bagaimana saya bisa berkata bahwa padding atas dan bawah bernilai 0 pixel dan sedangkan padding kiri dan kanan bernilai 20 pixel, padahal pada coding di atas hanya terlihat mendeklarasikan 2 sisi saja. Tenang saja, nanti pasti saya terangkan di lain posting. sekarang mari kita kembali ke pembicaraan awal.

Dari coding di atas, kira-kira seperti inilah gambarannya.

p {width:200px; background-color:grey; padding: 0 20px;}

Perlu anda ingat! antara padding dan width tidak ada istilah pengurangan. Maksudnya ialah, jika pada kasus gambar di atas telah ditentukan width sebesar 200 pixel, dan padding sebesar 20px itu bukan berarti width menjadi 180px ( mengurangi dari 200 pixel - 20 pixel = 180 pixel ), melainkan di jumlah. sehingga panjang width tidak akan berpengaruh terhadap padding.

Seberapa pentingkah melakukan validasi W3C?

2010-12-18T09:02:00.000-08:00

Ini merupakan pertanyaan yang paling sering muncul di pikiran para pakar Web, SEO dan developer lainnya, dan termasuk juga saya tentunya. Kadang saya berpikir tentang seberapa besar pengaruh W3C terhadap kinerja Website yang kita ciptakan dan apa pula yang akan terjadi jika kita tidak mempatuhi standarisasi ini. Kenyataannya perusahaan no.1 di dunia maya seperti Google saja masih banyak memiliki kesalahan saat melakukan test uji standarisasi di W3C, padahal banyak opini yang menyatakan mesin dengan tingkat kompleksitas tertinggi dalam suatu coding itu dimiliki oleh Google. Bahkan ada beberapa pakar SEO yang menyatakan bahwa standarisasi W3C hanyalah bentuk legalitas dan paten yang lebih merujuk ke eksistensi dan loyalitas dari Website dan pemilik Website itu sendiri, mungkin bahasa umumnya "hanya untuk keren-kerenan saja". Apa benar seperti demikian? bagaimana menurut anda pribadi? dan jika ditinjau dari segi SEO, standarisasi ini bahkan tidak memiliki efek besar yang begitu berpengaruh. lantas mengapa hal ini masih di anggap penting?

Corel Draw vs Adobe illustrator?

2010-12-18T07:57:00.000-08:00

Hai teman-teman pembaca setia afterschools, pada kali ini saya ingin membahas tentang perbandingan Corel Draw dan Adobe illustrator dalam hal kemudahan, tools, harga dan fitur. Sebenarnya hal seperti ini sangat susah dan mungkin tidak bisa dibandingkan, karena bagaimanapun ini menyangkut selera dari masing-masing designer atau pemakai umum itu sendiri. Tapi diluar itu semua, saya mencoba menilai dari segi netral. jadi saya akan mengkesampingkan segi selera atau pribadi. Jika kita melihat dari segi harga, semua aplikasi keluaran dari keluarga Adobe memang sudah tidak di pungkiri lagi bahwa harga yang di tawarkan di atas rata-rata, dan hal itu memang layak karena apa yang mereka tawarkan sungguh fantastis dan memiliki point lebih di banding aplikasi yang lain. Jika saya mereview dari segi kemudahan ( sekilas pandang dari segi orang awam / pengguna baru ) mungkin Corel Draw lebih menjanjikan kemudahan dibanding Adobe illustrator. namun kekurangan dari Corel itu sendiri bagi saya, warna yang ada tidak begitu real atau hidup, jadi lebih terkesan kartun. Jadi, jika kita hendak membuat objek lebih nyata atau lebih hidup alangkah lebih baik jika kita menggunakan Adobe illustrator. dari segi fitur, saya rasa adobe illustrator lebih memungkinkan kita untuk melakukan import dan export file dari berbagai jenis type file. Jadi kita bisa sangat mudah memadukan dengan aplikasi lainnya.

dan kesimpulannya ialah Adobe illustrator 100% more worth!

Kelebihan dan kekurangan jQuery

2010-12-16T09:45:00.000-08:00

Kelebihan :

Menyederhanakan penggunaan javascript, karena kita cukup menggunakan fungsi dari library javascript yang telah ada. Termasuk mempercepat coding javascript dalam sebuah website. Dibandingkan kita harus mulai sebuah script javascript dari nol.
Fungsi-fungsi yang disediakan didokumentasikan dengan baik beserta contoh penggunaannya, baca di situs http://jquery.com hal ini mempermudah dalam pembelajaran jQuery.
Support terhadap CSS1-3 selector, untuk fleksibilitas desain antar muka halaman website dan interaksinya.
Website yang dibangun dengan jQuery akan lebih interaktif dan menarik.

Kekurangan :

Meskipun diklaim jQuery memiliki beban kerja yang ringan (load CPU dan RAM) untuk browser, tetap saja lebih ringan (cepat di-load) website yang tidak menggunakan jQuery, alias HTML murni.
Dari sisi server hosting pun, CPU dan RAM harus mengalokasikan resource yang mereka miliki untuk menangani request terhadap jQuery. Pada level tertentu request yang sangat banyak (sangat-sangat banyak) akan membebani server. Solusi: host jquery pada situs lain, seperti Google yang menyediakan request jQuery dari servernya.

Kesimpulan :
jQuery mampu merubah interaksi sebuah website menjadi lebih menarik, namun harus di bayar dengan beban load yang lebih lama dibandingkan dengan tidak menggunakan script. (hal ini tidak akan terasa jika anda memiliki komputer yang powerful dan koneksi yang kencang).

Bagaimana menjadi desainer professional

2010-12-14T09:45:00.000-08:00

Ada beberapa hal yang mungkin sepele untuk di ketahui, tapi ternyata setelah saya melakukan eksperimen selama kurun waktu hampir 1 tahun bergelut di dunia desain, ada beberapa point yang memang sangat penting dan wajib untuk di perhatikan agar kita benar-benar menjadi desainer yang professional dan laku pasaran.

Pertama, anda harus bisa mengilustrasikan apa yang dipikirkan oleh pemesan ( istilah kerennya "Contest Holder" ) sekalipun dia tidak bisa mengungkapkan apa yang sedang dipikirkannya. hal ini memang terdengar aneh dan sulit, tapi jika anda membiasakan untuk dapat melakukannya, ini akan menjadi senjata terbaik anda sebagai seorang desainer, karena tidak semua desainer dapat melakukan hal ini.

Kedua, anda harus bisa mengklasifikasi jenis logo, mulai dari aspek bentuk, kombinasi warna, typografi / penggunaan font, originalitas, lambang atau icon yang akan menjadi maskot dari logo itu sendiri agar mudah diingat orang, dimensi. Maksud dari dimensi disini ialah, anda harus bisa mengetahui dimensi terbaik dari logo tersebut, apakah lebih baik jika dibuat secara plain/ 2D atau harus dibuat secara 3D.

Ketiga, perhatikan detil. Anda harus mendesain dengan detil dan halus. buat ke dalam beberapa ukuran. Jika anda mampu mendesain secara vector, itu lebih bagus. karena pemesan dapat mengedit ukuran sesuka hati tanpa takut mengalami gambar pecah setelah di perbesar maupun di perkecil.

Keempat, perhatikan timing. Semakin cepat anda mendesain atau menyelesaikan pekerjaan yang pemesan ajukan, itu akan semakin bagus. karena setiap feedback positif yang anda dapatkan akan berpengaruh kepada kepuasan pemesan tersebut. Biasanya pemesan yang puas akan kembali lagi dan akan terus berlangganan kepada anda.

Menjadi desainer professional bukan hanya sekedar pandai mendesain

2010-12-14T08:55:00.001-08:00

Menjadi seorang desainer professional itu tidak semudah seperti yang kita bayangkan, tidak sekedar "desain semenarik mungkin dan selesai". Mungkin hal ini tidak begitu terasa jika kita hanya mendesain untuk diri kita pribadi, hal ini karena apa yang kita desain sudah sesuai dengan selera yang kita inginkan. wajar saja, karena apa yang kita desain sudah secara otomatis menyesuaikan dengan gaya mendesain kita secara naluri. lantas bagaimana jika yang memesan desain itu orang lain? bukankah kita harus menyesuaikan dengan apa yang si pemesan itu inginkan bukan? mungkin hal ini terkesan sangat mudah, karena kita bisa saja menanyakan ke pada si pemesan tersebut tentang desain seperti apa yang dia inginkan. dengan demikian, kita bisa begitu mudahnya meminta penjelasan dan mengetahui apa yang ia inginkan. Tapi bagaimana jika si pemesan sendiri tidak bisa menjelaskan apa yang ia inginkan? sedangkan ia hanya bisa memilih saat anda selesai mendesain. mungkin jika dengan sekali mendesain, dia langsung cocok dengan desain anda. tapi bagaimana jika tidak? ini baru masalah rumit. ada banyak faktor yang mempengaruhi bukan? dan sesuai dengan judul yang telah saya paparkan di atas lantas bagaimanakah cara untuk menjadi desainer professional? mungkin akan saya jelaskan di posting selanjutnya. ^,^ v

HTML Markup

2010-12-10T20:21:00.000-08:00

Pada HTML 5 diperkenalkan beberapa elemen baru dan atribut yang merefleksikan tipikal penggunaan website modern. Beberapa diantaranya adalah pergantian yang bersifat semantik pada blok yang umum digunakan: yaitu elemen (<div>) dan inline (<span>), sebagai contoh (<span>) (sebagai blok navigasi website) dan <footer> (biasanya dikaitkan pada bagian bawah suatu website atau baris terakhir dari kode html). Banyak elemen lain yang memberikan kegunaan baru melalui antar muka yang telah distandarkan, seperti elemen multimedia <audio> dan <video>.Beberapa elemen yang telah ditinggalkan juga ditiadakan, termasuk elemen presentasi semata seperti <font> dan <center>, yang sebenarnya dapat dikerjakan menggunakan Cascading Style Sheet (CSS).

Apa itu HTML 5?

2010-12-10T20:17:00.000-08:00

HTML5 adalah revisi yang sedang dibangun oleh konsorsium W3C untuk dimasukkan sebagai perubahan besar berikutnya pada standar HTML. Sebagaimana pendahulu sebelumnya yaitu: HTML 4.01 dan XTHML 1.1, HTML5 adalah sebuah standar untuk menstrukturkan dan menampilkan isi pada World Wide Web. Standar ini memperkenalkan fitur baru seperti memutar video serta drag and drop, Sebelumnya fitur ini bergantung pada plugins pihak ketiga di penjelajah web seperti Adobe Flash dan Microsoft Silverlight.

Mengenal Heading

2010-11-09T20:22:00.000-08:00

Rasa-rasanya istilah heading ini sudah pasti tidak terdengar aneh dan baru bagi anda yang sudah mengenal dunia website developing. heading merupakan dasar dari programming dalam pemrograman HTML untuk melakukan aturan penulisan secara otomatis dengan seksama dan mengikuti aturan penulisan HTML yang berlaku. Mungkin bagi sebagian orang yang belum mengenal dunia SEO, hal ini menjadi hal yang tidak penting dan terkesan biasa saja. tapi bagi mereka yang tahu, heading merupakan salah satu syarat yang sangat vital dalam mengoptimasi kinerja SEO dalam sebuah website maupun blog. yah setidaknya itu gambaran singkat tentang heading yang bisa saya berikan untuk anda hari ini. Selebihnya kita bahas di lain posting.

Di bawah ini merupakan tata cara penulisan heading dalam pemrograman Web :

<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<h6>Ini adalah heading 6</h6>
<h7>Ini adalah heading 7</h7>
<h8>Ini adalah heading 8</h8>

dan berikut hasilnya :

Ini adalah heading 1

Ini adalah heading 3

Ini adalah heading 4

Ini adalah heading 5

Ini adalah heading 6

tidak terlalu susah bukan? sebenarnya kita dapat menggunakan setiap ukuran heading sesuka hati, namun akan lebih bagus jika kita tahu setiap fungsi dari setiap heading ini. mungkin cukup ini dulu pelajaran hari ini. selamat mencoba yah!

Membuat symbol dengan teknik Vertical-Align

2010-11-09T10:50:00.000-08:00

Pernahkan anda berpikir tentang bagaimana menuliskan symbol atau rumus-rumus kimia ke dalam halaman web anda? mungkin sepintas, hal ini tampak sangat aneh,dan biasa saja. namun bagi anda yang belum tahu tentang penulisan kode CSS, hal ini bisa menjadi masalah. Sebenarnya tidak sesulit seperti apa yang kita bayangkan jika kita ingin mempelajari kodenya. Apakah anda sudah penasaran ingin tahu seperti apa kode penulisannya? terus simak dan baca artikel ini hingga selesai. Berikut penulisan code CSS nya :

Ingat, jangan lupa untuk mendeklarasikan styling code nya ke dalam CSS, seperti di bawah ini
<style type="text/css">
sup{vertical-align:60% ; font-size:60%;}
</style>

Kemudian, tulislah symbol seperti yang anda inginkan.
H<sup>2</sup>O

Dan seperti berikut hasilnya :

H²O

Catatan : Sebenarnya, kode di atas tidak harus menggunakan sup. Anda bisa menggantinya dengan huruf atau kata lain sesuai yang anda inginkan. Namun standar default dari aturan pengkodean vertical-align pada CSS memiliki beberapa value, di antaranya :

value, sub, sup, top, middle, bottom

sedangkan untuk length-nya kita dapat merubah-rubah sesuai yang anda kehendaki, jadi.. tidak harus menggunakan 60%. Logikanya, semakin tinggi angka persentasenya maka akan semakin naik symbolnya. jadi, sudah tentu jika anda menggunakan angka negatif atau minus, itu artinya simbol tersebut akan bergerak turun / ke bawah.

Bagaimana? apakah anda masih bingung?

Membuat Unorder List

2010-11-08T21:59:00.001-08:00

Kemarin kita telah belajar membuat order list, jadi sekarang kita akan belajar membuat penandaan dengan unorder list. Pada dasarnya perbedaan antara order list dan unorder list tidaklah terlalu berbeda, perbedaannya hanyalah terletak di bentuk penomorannya saja. jika order list menggunakan angka, sedangkan unorder list menggunakan bullets. biar nggak pusing, kita langsung praktek saja ya.

<ul>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ul>

dan seperti inilah hasilnya :

List 1
List 2
List 3

Tidak terlalu sulit bukan? selamat mencoba yah. jika ada yang kurang dipahami, silahkan bertanya di blog ini.

Membuat Order List

2010-11-08T09:24:00.001-08:00

Order List atau sering kita kenal dengan istilah <ol> dalam sebuah coding CSS merupakan sebuah bentuk penandaan untuk sebuah kategori, teks maupun kalimat. Fungsinya tentu tidak lain agar kita dapat membuat daftar list agar telihat tampak lebih indah dan rapi. sebenarnya tidak terlalu susah untuk membuat sebuat order list, hanya dibutuhkan sedikit coding saja. Berikut cara membuatnya.

<ol>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ol>

Berikut hasilnya :

List 1
List 2
List 3

Bagaimana? tidak terlalu susah bukan? di posting saya mendatang, akan mengajarkan tentang bagaimana membuat daftar list dengan menggunakan bullets.