Cara Membuat Blog di Blogger Blogspot

Artikel ini merupakan artikel lanjutan dari artikel yang saya tulis sebelumnya yaitu mengatur jarak spasi di blogspot. Artikel ini saya buat untuk melengkapi tutorial blogspot agar cukup untuk memenuhi kebutuhan pembaca. Jadi sebenarnya anda bisa memulai dari tahap ini saja yaitu membuat blog di blogger blogspot.

Tahap ini merupakan tahap paling awal kita lakukan terutama bagi anda para pemula. Adalah sangat lucu apabila kita memulai belajar dari topik mengedit file html blogspot dahulu kemudian kita baru akan membuat account kita di blogspot.

Jadi agar urutanya tepat mulailah dari dasar dulu yaitu membuat blog di blogger blogspot. Atau apabila anda ingin melihat urutan materi tutorial kita, bisa dilihat di Silabus Tutorial Blogger Blogspot.

Di dalam silabus itu akan dijelaskan secara detail tahap demi tahap yang akan kita butuhkan dan lakukan dalam hal kegiatan blogging kita dengan menggunakan blogspot.

Sebelum kita terlalu jauh belajar perlu saya jelaskan sedikit mengenai blogspot.com ini. Blogspot.com merupakan sebuah situs yang menyediakan blog gratisan untuk seluruh manusia di muka bumi ini. Jadi siapa saja bisa mendaftar dan membuat blog di situs ini. Sungguh mulia bukan ? (he..he..jarang-jarang ada orang mau ngasi gratis sekarang ini..).

Blogspot.com ini memiliki CMS yang dinamakan dengan blogger, jadi untuk membuat blog di blogspot kita harus login ke blogger kira-kira begitu. Apabila anda belum tahu tentang CMS bisa anda lihat di Pengertian CMS dan Jenis-Jenis CMS.

Situs blogspot ini dimiliki oleh sebuah perusahaan besar yaitu perushaan mesin pencari terbesar di dunia yaitu Google.com. Jadi jangan heran apabila di dasboard blogger banyak fitur-fitur yang terhubung secara langsung ke Google.

Baiklah untuk memprsingkat waktu langsung saja kita kepada topik pembahasan untuk membuat blog di blogger blogspot.com.

Membuat Email di Google (Gmail)

Yang pertama sekali kita lakukan untuk memiliki sebuah blog gratisan milik blogspot adalah membuat email Gmail. Apabila anda belum memiliki email Gmail, silahkan anda buat terlebih dahulu caranya sangat gampang jadi jangan pusing duluan ok!

Setelah email anda selesai dibuat selanjutnya anda bisa login ke blogger dengan mengetikkan blogger.com di address bar web browser anda.

• Masukkan alamat email dan password anda pada kolom yang sudah ditentukan, lalu klik Sign in. Perhatikan gambar dibawah:

Membuat blog di blogger blogspot (gambar login)

• Setelah anda login maka akan muncul tampilan sebagai berikut :

Membuat blog di blogger blogspot (gambar dasboard)

• Setelah muncul tampilan seperti diatas selanjutnya klik tombol New Blog

• Maka kan muncul jendela popup seperti gambar berikut:

Membuat blog di blogger blogspot (gambar jendela popup)

• Pada jendela ini, masukkan nama blog yang anda inginkan pada kolom Title.

• Kemudian isikan nama alamat website yang anda inginkan pada kolom Address. Perhatikan gambar berikut:

Membuat blog di blogger blogspot (gambar popup)

• Apabila muncul pesan dengan tulisan berwarna merah, itu menunjukkan bahwa alamat situs tersebut sudah dipakai oleh orang lain. Untuk itu anda harus mengganti alamat situs anda dengan nama yang berbeda.

• Kemudian pilihlah Template yang anda inginkan sesuai dengan gambar yang disediakan oleh blogger. Saran saya untuk permulaan anda pilih saja Simple.

• Kalau sudah selesai klik Create blog

Dengan demikian blog anda sudah selesai dibuat, jadi sampai di sini tutorial membuat blog di blogger blogspot, selanjutnya anda bertugas untuk memposting artikel-artikel anda ke dalam blog tersebut. Untuk mengetahui caranya anda bisa baca di cara memposting artikel di blog blogspot.

Semoga tutorial ini bermanfaat untuk anda, salam

Cara Mengatur Jarak Spasi Huruf, Kata dan Baris di Blogspot

Dalam menuliskan artikel di blog biasanya kita membutuhkan pengaturan khusus agar artikel yang kita posting bisa dibaca dengan sangat mudah dan menarik.

Kadang kala beberapa blogger kurang memperhatikan hal ini, sehingga tulisan yang bagus kurang diminati oleh para pembaca.

Banyak pembaca langsung malas meneruskan membaca artikel yang ada, dikarenakan text artikel yang terlalau rapat dan paragraf yang terlalu panjang.

Kalau kondisinya seperti itu biasanya para pembaca langsung pusing dan cepat-cepat meninggalkan halaman artikel anda dan mencari website lainnya.

Bayangkan apabila blog anda adalah blog iklan, maka akan sangat disayangkan apabila pengunjung anda pergi begitu saja dan mampir hanya beberapa detik saja di blog anda.

Apabila artikel atau tulisan anda rapi, maka para pengunjung akan betah berlama-lama di website anda dan hal itu akan menambah ranking anda di mata mesin pencari.

Nah untuk mengatasi masalah ini, kita perlu melakukan beberapa pengaturan pada blog kita, dimana kali ini kita masih fokus untuk pengaturan pada blogspot saja dulu ya…

Baiklah langsung saja kita ke pokok permasalahan yaitu mengatur jarak spasi di blogspot, berikut langkah-langkahnya:

Edit Kode HTML di Blogger

Pertama sekali login ke account blogger anda yaitu dengan memasukkan alamat email dan password gmail anda. 

Bagi anda yang belum punya account blogger anda bisa lihat cara membuat blog di blogger blogspot.

• Setelah login maka akan muncul halaman dasboard blog anda
• Kemudian klik menu Template
• Lalu klik Edit html, maka akan muncul kode html blogger anda
• Selanjutnya cari kode ]]></b:skin> dengan menekan Ctrl+F pada keyboard komputer anda, kemudian copy kode tersebut diatas di kolom pencarian, lalu tekan enter.
• Maka kode tersebut akan diberi warna berbeda oleh browser
• Selanjutnya copy kode CSS berikut dan paste di atas kode ]]></b:skin>

.post-body {
line-height:1.8em;
letter-spacing: 0.1px;
Word-spacing:0.5px;
}

• Kemudian klik tombol Save Template
• Maka dengan demikian mengatur jarak spasi di blogspot  sudah selesai.

Anda juga bisa melakukan beberapa modifikasi dari pengaturan yang telah diatur oleh kode CSS yang anda paste-kan tadi.

Anda bisa mengubah nilai pada kode CSS tersebut untuk menyesuaikan jarak spasi sesuai dengan kebutuhan blog anda.

Terlebih dahulu saya akan menjelaskan fungsi dari kode CSS tersebut sehingga anda bisa mengerti dan tahu yang mana yang harus anda ubah untuk kebutuhan blog anda.

Penjelasan Kode CSS di Blogger

.post-body = Merupakan deklarasi yang dibuat oleh blogspot untuk menjelaskan bahwa bagian tersebut merupakan area dari artikel di blogspot.

{} = Kurawal buka dan tutup merupakan tempat dimana kita mengatur nilai-nilai yang akan diberikan untuk post-body tersebut diatas.

line-height = Disini kita memberikan nilai untuk mengatur jarak dari baris pertama dengan baris kedua dan seterusnya.

letter-spacing = Bagian ini berfungsi untuk mengatur jarak antara huruf dengan huruf, jadi kita bisa mengatur nilainya untuk mengatur jarak huruf-huruf  tulisan blog kita agar lebih rapi.

word-spacing = Bagian ini berfungsi untuk mengatur jarak antara kata dengan kata dalam paragraf tulisan di blog kita. Apabila standar jarak kata dengan kata di blog tidak sesuai dengan harapan, maka dengan cara ini kita bisa mengaturnya.

Satuan yang biasa digunakan untuk nilai dari kode CSS ini ada beberapa yaitu: em, px dan %. Anda bisa memilih salah satu dari satuan ini dan mulailah mengatur jarak spasi di blogspot  kesayangan anda.

Cara Penggunaan Tag HTML, Body, H1 dan P dalam Halaman Web

Artikel saya kali ini merupakan lanjutan dari artikel yang sebelumnya yaitu Struktur Dasar HTML dalam Pembuatan Website. Bagi anda yang belum membacanya silahkan dibaca dulu agar tidak menjadi bingung nantinya.

File HTML dibawah merupakan file yang sama yang kita gunakan pada artikel sebelumnya yang merupakan bentuk kode HTML yang sangat dasar sekali.Tulisan ini sangatlah cocok untuk para pemula yang ingin belajar membuat website.

Coba kita perhatikan kode HTML dibawah ini, dimana saya akan memberikan warna pada setiap tagnya.

Hal ini kita lakukan agar anda akan lebih cepat mengerti dan membedakan lokasi dan cara peletakan tag kode html saja. Pemberian warna ini hanya kita berlakukan di sini saja, hal ini tidak kita lakukan pada waktu menuliskan kode program pada waktu pembuatan website anda.

<html>
<body>

<h1>Di sini judul pertama</h1>
<h2> Di sini judul kedua</h2>
<h3> Di sini judul ketiga</h3>

<p>Di sini meletakkan paragraf atau kalimat yang pertama.</p>
<p> Di sini meletakkan paragraf atau kalimat yang kedua.</p>

<a href=" http://plaza-tutorial.blogspot.com/ ">Di sini membuat link</a>
<img src="plaza-tutorial.blogspot.com.jpg" alt="Baris ini untuk membuat gambar" width="200" height="160">

</body>
</html>

Berikut penjelasan dari kode program yang ada di atas:

Bagian tag HTML

Saya memberikan warna merah pada tag HTML pembuka dan penutup <html></html>. Tag pembuka diletakkan di paling awal kode dan tag penutup diletakkan di paling akhir semua kode.

Kode atau tag tersebut memberikan informasi kepada web browser bahwa mulai dari tag pembuka <html> sampai pada tag penutup </html> merupakan bagian yang harus dibaca web browser sebagai sebuah website atau isi dari html.

Bagian tag Body

Tag pembuka <body> dan tag penutup </body> saya berikan dengan menggunakan warna biru. Dari kode yang tertera diatas bisa kita lihat bagaimana cara meletakkan tag body tersebut.

Tag <body> dan </body> ini memberikan informasi kepada web browser bahwa dari mulai tag pembuka <body> sampai pada tag penutup </body> merupakan badan dari halaman website tersebut. 

Didalam badan website inilah isi atau konten dari web diletakkan, seperti artikel text, gambar dan lain-lain.

Tag h1, h2, h3 dan p

Tag h1, h2, h3 dan p merupakan tag yang dipakai untuk mengisi badan dari sebuah website dimana tag-tag ini nantinya akan diletakkan diantara tag <body> dan tag </body>.

Tah h1, h2 dan h3 yang saya beri warna hijau merupakan tag heading atau judul yang memberikan informasi dan perintah kepada web browser untuk menampilkan isi dari website dalam bentuk h1 (heading1) dan selanjutnya h2 (heading2) dan h3 (heading3).

Heading1 (h1) ukuranya lebih besar dari heading2 (h2) dan heading2 (h2) lebih besar dari heading3 (h3), demikian seterusnya sampai heading6 (h6).

Tag <p> (paragrap) yang saya beri warna orange merupakan tag yang juga digunakan diantara tag pembuka <body> dan tag penutup </body>. 

Tag in memberikan informasi atau perintah kepada web browser bahwa kalimat atau text yang berada diantara tag pembuka<p> dan tag penutup </p> akan ditampilkan dalam bentuk paragrap.

Yang terakhir adalah kode html yang berwarna hita. Tag ini akan kita bahas pada tulisan saya yang berikutnya yaitu membuat link dan memasukkan gambar dalam halaman website.

Struktur Dasar HTML dalam Pembuatan Website

Materi bahasan kita kali ini adalah belajar html. Pelajaran html kita kali ini merupakan pelajaran html dasar, dimana kita akan membahas tentang html dari yang sangat dasar sekali.

Perlu kita ketahui terlebih dahulu bahwa html merupakan suatu script yang dipakai untuk membuah sebuah sebuah website, yang nanti bisa diintegrasikan dengan bahasa program seperti php dan asp.

Anda juga bisa membaca sejarah HTML terlebih dahulu untuk menambah pemahaman tentang HTML.

HTML merupakan bentuk kerangka dari sebuah website sehingga merupakan sesuatu yang perlu dan paling pertama sekali harus diketahui dalam membuat sebuah website.

Untuk belajar secara keseluruhan penggunaan html, php dan asp lebih lanjut silahkan tetap kunjungi blog ini. Kami akan selalu memberikan tutorial-tutorial yang baru setiap minggunya.

Blog ini juga membahas tentang dasar php dan dasar asp, dan tidak hanya itu, blog ini juga akan membahas kedua materi tersebut sampai pada tingkat lanjut yaitu tingkat umum dan tingkat mahir.

Baiklah kita mulai dari bagian yang paling dasar dulu yaitu mengenal HTML. Berikut adalah contoh kode HTML yang sederhana.

Anda bisa melihat penjelasan kode HTML dibawah pada halaman penjelasan kode HTML dasar pada artikel saya yang berikutnya. Penjelasanya sengaja saya buat terpisah agar pada saat membaca bisa lebih konsentrasi pada satu topik terlebih dahulu.

<html>
<body>

<h1>Di sini judul pertama</h1>
<h2> Di sini judul kedua</h2>
<h3> Di sini judul ketiga</h3>

<p>Di sini meletakkan paragraf atau kalimat yang pertama.</p>
<p> Di sini meletakkan paragraf atau kalimat yang kedua.</p>

<a href=" http://plaza-tutorial.blogspot.com/ ">Di sini membuat link</a>
<img src="plaza-tutorial.blogspot.com.jpg" alt="Bari ini untuk membuat gambar" width="200" height="160">

</body>
</html>


Di dalam HTML kita mengenal istilah tag atau bisa kita sebut penanda. Penanda atau tag ini digunakan untuk memberikan informasi pada aplikasi browser batasan-batasan dari setiap bagian kerangka website tersebut.

Penjelasan sederhana tag yang dimaksud sebagai berikut:
Tag akan memberikan tanda bahwa yang ini merupakan header yang ini merupakan body dan yang ini merupakan footer.

Bahasa komunikasi antara script html dan aplikasi browser kira-kira seperti itu, shingga browser tahu cara menampilkan bentuk website yang sudah diatur oleh scrip html tadi.

Anda bisa melihat gambaran struktur HTML terlebih dahulu untuk memdapatkan penjelasan yang lebih mudah. Gambar ini menjelaskan bagaimana kerangka yang dibuat oleh kode HTML dan kita bisa melihat batasan-batansan dari tag yang dibuat oleh kode HTML tersebut.

Perkembangan HTML dari Tahun ke Tahun

Apabila anda seorang yang sering mengutak atik website pasti nama HTML sudah tidak asing lagi ditelinga anda. Nah pernahkah kita memikirkan dari sejak kapan sih HTML mulai muncul ?

Nah kalau belum tahu berikut akan saya tuliskan berdasarkan kesimpulan yang saya dapat dari beberapa sumber tentunya.

HTML singkatan dari Hypertext Markup Language ternyata bukanlah sebuah bahasa pemrograman tetapi hanya script biasa yang dipakai untuk membuat sebuah halaman web.

HTML telah melalui banyak sekali perkembangan setelah dirilis sejak tahun 1991 oleh Tim Berners Lee. HTML itu sendiri merupakan dokumen teks biasa yang dirancang untuk tidak tergantung pada sistem operasi tertentu saja, tetapi bisa jalankan dari hampir semua sistem operasi.

Kalau dilihat dari sejarah perkembangan HTML sudah mengalami banyak perubahan sejak pertama sekali dirilis dan juga begitu banyak pengembangan yang dilakukan seperi penambahan fitur-fitur baru dan script-script baru untuk mendukung agar website kita semakin canggih.

Setiap versi terbaru dari HTML selalu ada pengembangan dari versi-versi sebelumnya. Berikut adalah revisi HTML berdasarkan tahun pengembanganya:

•     HTML tahun 1991
•     HTML+ tahun 1993
•     HTML 2.0 tahun 1995
•     HTML 3.2 tahun 1997
•     HTML 4.01 tahun 1999
•     XHTML tahun 2000
•     HTML5 tahun 2012

Menuliskan HTML untuk membuat sebuah website merupakan sebuah seni, dimana seni untuk membuat sebuah tampilan website menjadi menarik sehingga setiap orang yang mengunjunginya bisa merasakan suatu kenyamanan. 

Untuk itu perlu kita sadari bahwa membuat sebuah halaman dengan HTML bukanlah sekedar menuliskan tag HTML tersebut agar bisa dilihat di web browser saja tetapi juga memiliki nilai seni desainnya. 

Kalau pada sejarah HTML dulu tujuan utamanya adalah untuk menampilkan sebuah halaman website ke browser, tetapi sekarang tujuan itu tidak bisa kita terapkan lagi, mau tidak mau tampilan web menjadi sesuatu yang semakin paling dibutuhkan saat ini.

Untuk memenuhi kebutuhan desain tersebutlah HTML 5 diluncurkan, bahkan kita mungkin akan tetap melihat penembangan-pengembangan HTML ini kedepanya nantinya. 

Kebutuhan akan karakter visual yang tinggi, dan desain yang memukau merupakan tantangan yang harus dipenuhi oleh desain sebuah halaman website terutama saat sekarang ini.

Sebagus apapun isi dari sebuah website apabila tidak didukung oleh tampilan yang menarik maka hanya akan sedikit orang yang akan mau membaca isi website tersebut. Sehingga HTML 5 diharapkan mampu berkolaborasi dengan bahasa javascript dan ajax untuk memenuhi kebutuhan ini.

Apabila anda tidak hanya ingin melihat sejarah perkembangan HTML tetapi anda ingin belajar untuk membuat sebuah website dari nol sampai jadi anda bisa menemukanya tutorialnya di sini. Tutorial ini menggunakan bahasa Indonesia sehingga akan sangat mudah bagi anda untuk mempelajarinya.

Sumber:  http://www.jualtutorialku.com/cd tutorial pemrograman

Struktur HTML