Langsung ke konten utama

Postingan

Menampilkan postingan dengan label html

Dasar membuat game HTML sederhana menggunakan Javascript

Dulu programmer web membuat game menggunakan flash, namun flash kemudian mati sebelum saya sempat mempelajarinya. Itu zaman sudah lewat hari ini zamannya HTML5. Jadi saya mencoba mengutak atik mata pelajaran dasar HTML dan mulai belajar membuat game. DEMO Pernah kan kalian mendengar game sederhana bernama Flappy Bird? Juga sebelum sempat saya memainkannya, game tersebut sudah tidak populer lagi. Namun karena sempat menjadi sangat terkenal, saya juga berfikir gimana kalau membuat game tersebut menggunakan HTML? Ya hanya bisa melalui HTML dan Saya sendiri tidak tahu bagaimana mengkonversikannya ke platform Android he he he... Ternyata juga bisa. Artinya jika kalian bisa menggunakan HTML untuk buat tombol tombol animasi, berarti sekurang kurangnya kalian juga bisa membuat game menggunakan HTML. Walau harus memahami perintah dan logikanya. Perhatikan Javascript berikut: <body onload="startGame()"> <script> var myGamePiece; var myObstacles = []; var myScore; funct

Dasar pengatahuan membuat dan mengedit template web atau blogger

T emplate blogger itu dibuat berbasis HTML, jadi dia dinamakan template web HTML. Sekalipun orang mengatakan teknologi Wordpress di buat berbasis PHP, namun ia juga masih HTML. Namun karena kita sedang blogging di blogger blogspot, kita membahas template blogger saja. Ya template berbasis HTML. Jika fokus kita ingin mengedit template - seperti templatenya editblogtema sekarang - maka kita harus memiliki paling sedikitnya dasar dasar material dan elemen dari pembuatan template. Di dalam template blogger secara garis besar sumber kodenya terdiri dari komposisi: XML HTML CSS Javascript Kita bisa mempelajari bahasa bahasa di atas dengan mudah melalui halaman web misalnya melalui halaman w3school. XML. XML adalah singkatan dari eXtensible Markup Language. XML dirancang untuk menyimpan dan mengangkut data. XML dirancang agar dapat dibaca manusia dan mesin. Contoh XML dalam template blogger: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html> <html b:v

Mari belajar HTML5 buat modal Blogging

PENGERTIAN HTML HTML adalah bahasa markup dan sebagai dasar pembuatan Halaman Web. Jadi dapat kalian bayangkan betapa pentingnya dia. Dengan belajar HTML kita dapat membuat halaman web, membuat tampilan template web dan mengoptimalkan halaman web bagi kita ya paling tidak untuk tujuan blogging. Adapun pengertian HTML dapat di jelaskan sebagai berikut: HTML singkatan dari Hypertext MarkUp Language. Ia adalah bahasa markup standar untuk pembuatan halaman web. Ia mendeskripsikan struktur suatu halaman web. Ia terbentuk (terdiri) dari serangkaian elemen. Elemen elemen HTML menentukan bagaimana konten ditampilkan oleh browser. Elelemen elemen HTML berlabelkan sebagai: 'this is a heading', 'this is a praraph', 'this is a link' dst Contoh: <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1> My First Heading </h1> <p> My first paragraph .</p> </body> </html> <html>

2 ISTILAH DALAM DUNIA INTERNET YANG KADANG DISANGKA SAMA

Beda sekali, bro...Tapi bagi sebagian orang walaupun setiap pergi ke internet hal ini seringnya dianggap sama lho. Penting sih bagi kita untuk mengetahuinya dalam rangka membangun pemahaman yang lebih terarah di dunia web, koding dan pemrograman web. 1. BROWSER VS SEARCH ENGINE (PERAMBAN VERSUS MESIN PENCARI) a). Web Browser atau peramban adalah software, semacam aplikasi yang dibuat oleh suatu perusahaan pengembang dan digunakan untuk meramban di internet guna menampikan informasi atau halaman web melalui suatu peramban. Contohnya Modzilla Firefox, Google Chrome, Safari (milik Apple), Opera dsb. Dengan peramban peramban inilah kita membaca halaman editblogtema.net , membaca berita, nonton Youtube dll. Browser ini terinstall di komputer, di hape atau tablet kita gunanya untuk mengakses halaman web yang sebenarnya tidak ada didalam perangkat komputer, hape dan tablet kita. web itu adalah jaringan informasi dari sekumpulan perangkat server server kuat diseluruh dunia. b).Search Engine at

Cara menngunakan atribut HTML pada judul menu navigasi halaman blog

D engan menambahkan atribut seperti munculnya keterangan pada saat judul blog di sentuh oleh kursor mouse akan membantu  menavigasi pembaca untuk memutuskan apakah judul atau sebuah title layak di klik sehingga atribut ini dapat membantu performa SEO sebuah halaman web atau blog kita. Contohnya Jika kalian letakan kursor pada Judul blog editblogtema atau pada salah satu menu editblogtema, dalam beberapa detik akan muncul navigasi berupa bentuk text di bawah judul tersebut yang apabila mouse di jauhkan akan menghilang: HTML hypertext Markup Language Atau dengan kata lain kita menerapkannya ke bagian menu navigasi dan Judul blog ini untuk menambahkan keterangan dan memperjelas fungsi navigasi pada halaman atas blog kita. Atribut ini di sebut sebagai 'HTML Global title Attribute'. Cara menerapkannya adalah sebagai berikut: Pada Judul blog: Jika kalian ingin menggantikan fungsi description blogger dengan atribut ini maka kalian dapat menerapkannya dengan cara berikut: Pada opsi edi

BENARKAH GOOGLE TIDAK MENYUKAI TULISAN YANG LEBIH BANYAK PENULISAN HTML DIBANDING TEXT?

Isu ini harus di sikapi dengan hati hati, pada saat saya memeriksa laman CSS Tricks, Stack Overflow dan apalagi Codepen, di laman laman tersebut ya hal apa lagi yang di tuliskan oleh para penulis dan pembuat konten selain daripada kode kode, dan kode kode? Ada yang 89% kode, dan sisanya text. Tapi fakta laman laman tersebut menempati posisi yang sangat tinggi di mata mesin pencarian membuat saya bingung, dan iklan (ads) yang terpasang juga iklan iklan bekelas. Laman pavorite saya stack overflow menempati ranking 40 Alexa, DA-nya 93, PA-nya 77.  CSS Tricks menempati ranking Alexa ke-3,906, DA 84, dan PA 67.  Sedangkan CodePen menempati ranking Alexa 1.600, DA 91, PA 72. Mereka memang situs besar, tetapi CSS Tricks adalah laman blog juga dan fakta ini hanya menunjukan, menulis koding pada halaman blog tidak ada hubungannya dengan hal yang Google suka atau tidak suka. Google akan menyukai apa saja yang manusia suka. Jika yang dimaksud adalah konten konten tutorial yang banyak memberikan m

MEMBUAT TEMPLATE BLOGGER DENGAN HTML, CSS DAN JAVASCRIPT (BAG:1)

Quality Templates. Membuat template sendiri adalah sangat mungkin bagi siapa saja terutama blogger. Banyak keuntungan yang kita dapatkan jika telah bisa membuat template sendiri di samping kepuasan hati tentu saja. Contohnya: blogger layout Meningkatkan pengetahuan web Meningkatkan ketrampilan desain web Meningkatkan pengatahuan koding web seperti HTML, CSS dan JavaScript Memiliki template buatan sendiri yang dapat di sesuaikan dengan selera kita sendiri DLL Poin terakhir itu keren. Semahal dan se premium apapun template yang kita beli dari website penjual template, bentuk dan ciri cirinya akan mirip jika di gunakan oleh orang banyak. Contohnya walaupun telah di robah warna warni template viomagz tetaplah viomagz buatan Mas Sugeng. Tidak ada totalitas yakni sebuah halaman web dengan ciri ciri khas dirinya sendiri. Membuat template sendiri membutuhkan pengetahuan, dan pengatahuan itu berguna sekali bukan hanya untuk membuat template tapi juga untuk hal hal lain di lu

JAVASCRIPT ADALAH SUPERMAN DI HALAMAN HTML

Mengapa Javascript masih begitu powerful? Terdapat gambar bola lampu di dalam artikel ini yakni gambar bola lampu nyala namun bola lampu tersebut bisa dimatikan dan dihidupkan kembali melalui tombol action yang di buat melalui JavaScript, setelah saya selesai menuliskan sekilas penjelasan perihal JavaScript dibawah ini, kalian bisa menyalakan dan memadamkan bola lampu di atas melalui tombol yang tersedia di kiri dan kanan gambar dari sumber yang sama (namun dengan skala diperkecil) di bagian bawah postingan ini. Gambar Logo JS Meskipun seluruh bahasa program terus berkembang, dan beberapa sebagiannya telah mati, namun JavaScript hingga kini masih sangat popular. JavaScript juga masih sangat mudah di pelajari karena sintaks sintaksnya yang mirip bahasa manusia yang biasanya selalu kalian pakai itu lho. Tidak seperti bahasa mesin tingkat pertama yang binary, JavaScript adalah bahasa tingkat tinggi yang sangat mudah di fahami. Asalkan,....kalian meminati bahasa bahasa cerdas

Contoh penggunaan kode warna pada menggunakan HTML dan CSS

text berwarna dengan HTML CSS - desain gambar ileh : Anissa Ada beberapa cara yang dapat kita gunakan untuk mewarnai text text tertentu di dalam template blog. Jika kalian berada di halaman ini cobalah klik navigasi menu editblog ini yakni menu "konten" setelah menu dropdown muncul maka diantaranya muncul sebuah menu dengan penulisan kata berbeda warna. Kita dapat menerapkan cara berikut: Menggunakan CSS: <style> #p1 {background-color:#ff0000;} #p2 {background-color:#00ff00;} #p3 {background-color:#0000ff;} #p4 {background-color:#ffff00;} #p5 {background-color:#ff00ff;} </style> </head> <body> <p>HEX colors:</p> <p id="p1"> Red </p> <p id="p2">Green </p> <p id="p3"> Blue </p> <p id="p4"> Yellow </p> <p id="p5"> Cerise </p> </body> Maka akan di deskripsikan secara visual sebagai contoh berikut: :

CARA MEMASANG NAVBAR MOBILE FRIENDLY PADA BLOG

P entingnya membuat navigasi (navbar) pada blog memang telah diakui oleh para blogger. Dan juga dianjurkan oleh para pakar website. mobile navbar Buktinya hampir setiap template blog premium berbeli selalu di pasang navigasi dengan beraneka warna menu. Menu memang bermanfaat menavigasi pengunjung dalam mengeksplorasi halaman blog kita. Di samping itu navbar menu blog masih dapat mengoptimalkan mesin pencari dalam mempetakan konten konten blog kita. Untuk manusia, hal yang menarik adalah navigasi menu yang berbeda, penuh warna, ada hiasan ikon okon keren, fresh, simpel dan efektif. Untuk mesin pencari tentu saja memiliki kriteria tersendiri. Kali ini saya akan mengajak kalian untuk membuat menu navigasi mobile yang cocok sekali untuk di buka melalui ponsel dan tablet. Menu seperti ini selain sederhana juga sangat menghemat ruang. Perhatikan contohnya dibawah ini: Anissa Page News Contact About Navbar vertikal contoh ini u

CARA YANG BENAR MEMBUAT SIDE NAVIGASI BLOG

Berbagai tips dan triks membuat navbar atau navigasi menu blog telah kami kemukakan di dalam blog ini. Diantaranya yang paling banyak adalah Navigasi Menu diatas header. Sekali ini untuk yang ke sekian kali pula saya akan memberikan trik atau tips membuat Navigasi menu yang dapat di buka dan muncul di sebelah kanan halaman blog. Navigasi menu pada sidebar blog Perlu di catat, navigasi menu itu bisa berbentuk unik atau sangat familiar bagi pengunjung. Sebaiknya buat yang mudah, sederhana dan dapat di fahami, sehingga ia dapat memandu pengunjung mengeksplorasi halaman demi halaman blog kita. Navigasi menu juga bisa berguna bagi mesin pencari untuk mempetakan halaman blog. Klik elemen atau hamburger menu (garis lapis tiga) di bawah ini. × About Services Clients Contact ☰ open 1. CSS Cara penerapannya juga mudah: Kalian tinggal masuk ke pengaturan blogger. Pilih theme Lalu akan muncul menu baru blogger cari titik tiga sweetie berikut:  ፧ dan klik maka

BELAJAR HTML UNTUK CEWEK

Learn coding online HTML adalah bahasa dasar untuk membangun atau membuat halaman web. Wah pas banget untuk blogger yang kepingin membuat template mereka sendiri, alasannya adalah karena: HTML adalah bahasa markup standar untuk halaman web With HTML you can create your own Website.Dengan HTML kalian dapat membuat halaman website kalian sendiri. Keren bukan? HTML sangat mudah di pelajari - Kalian pasti bisa! Contoh HTML: <!DOCTYPE html> <html> <head> <title> Judul Halaman </title> </head> <body> < h1> Ini namanya Heading </h1 > <p>Ini Namanya Pragraf .</p> </body> </html> Jika kalian menggunakan platform blogger buat ngeblog, maka kalian akan mengetahui bahwa blogger itu dibuat berbasis HTML atau inti dasar HTML. Coba saja buka pengaturan blog kalian, pasti mirip deh dasarnya sama kode diatas, bedanya kode kode pada template sudah panjang banget karena sudah di tambahkan banyak atribut, da

CARA MEMBUAT TOMBOL DROPDOWN MENU TUNGGAL DI BLOGGER

single dropdown menu  for blogger (gambar oleh Adelina Sofyan) Membuat menu navigasi atau kustom navbar pada blogger memang berguna sebagai tool navigasi bagi pengunjung dan juga berguna bagi mengoptimalkan kinerja mesin pencari. Ada trik yang dapat kita terapkan jika ingin membuat segalanya tampak minimal, yakni tombol menu dropdown. Baca juga: APA BEDANYA jQUERY DENGAN JavaScript? Asal kalian tahu, dropdown bisa saja berbentuk seperti sebuah menu yang apabila disentuh atau di klik akan menampilkan menu menu yang tersembunyi di baliknya berupa list yang turun kebawah. Cobalah sentuh atau klik tombol merah yang saya buat di bawah ini: Dropdown menu Dengan klik Klik tombol merah di bawah untuk menampilkan menu menu. Dropdown Beranda Halaman Trik Navbar blogger Trik Toggle dark mode Menerapkannya sama dengan tips tips saya sebelumnya. Material dan elemen elemennya di buat menggunakan HTML, CSS dan Javascript. Karena template blogger dib

Copyright© EDITBLOGTEMA . All rights reserved.