Postingan

Menampilkan postingan dengan label html

Dasar membuat game HTML sederhana menggunakan Javascript

Gambar
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

Gambar
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

Gambar
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

Gambar
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

Gambar
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?

Gambar
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)

Gambar
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

Gambar
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

Gambar
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

Gambar
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

Gambar
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

Gambar
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

Gambar
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

Labels

adwords aibo ajax alexa algoritma alternative Am I Responsive amazon ambigu Amerika AMP Andorid Android Android 10 Angular animasi apple ARM Art Of War artikel sabtu asesories autodidact avatar avatar penulis awesome awsome back to top backdoor backlink bahasa bank btn batam beautiful beginning belajar belajar koding berita bing web master biografi blackberryOS blackhat blockquote blog blogcomments blogger bloggerhelp blogging Blogging mobile bloging blogspeed blogspot bluetooth bootstrap border dash breadcrumb browser btn mobile bugs Buku business capital letter cara catatan catatan awal tahun Cek IMEI Cerita cerpen cewek chimpense chipset chrome chrome 76 Cina cinta clickjacking codepen coding compose compose view contact form contempo contempo base contempo blackmagic contempo hibrida contempo hybrid converter coolest copy-paste copyright covid 19 covid_19 cowok CPC credit footer css CTR cuitan curhat cybercrime Dahlan Iskan dark mode dasbor data default Demo desain diblokir dirtylink disway DOM domain domain authority Donald Trump download download template terbaru dropdown earn money edisi minggu edit editblogtema editor HTML ekonomi elektronik Elle Darby embed emoji emporio emporio hybrid english error essential expires header expires headers facebook fakta fanpage fast loading template fastloading template favicon featured posts feed burner firefox fitur fixed fixed sidebar font font awsome footer footer link Footer navigasi forbes Free friendship fuchsia full stacks furure g-suite gadget gagdet galeri gambar gambar bergoncang gambar profile penulis gambar responsive game generasi Alpha Generasi Z geng motor genius gerhana girl gmail Gmetrix gong xi fa cai good news google google chrome Google Domain google drive google font Google honemoon google Plus google search console google webmaster Googlewebmaster gradasi warna grafik gramedia gratis grid style GTmetrix h1 Habibie hack hacker halaman web hamburger menu hanya opini hapus hari bumi harimau heading headings heart secret hewan hoax hobi hotpink HTM5 html HTML view huawei hukum human Idulfitri Iklan ikon Imlek in memories indie Indonesia Indonesia darurat corona indosat infinite color infinity war informasi instagram intel inteligensia internal link internasional internet internt interntet interntt intert iOS iPad iPadOS iPhone isu IT italia Jaime Ocabo java JavaScript jimdo jin Ping jingling Jokowi jQuery JSitor kaca pembesar kafe kalimantan kalkulus kamera kanonis kartun keamanan keamanan blogger kebijkan kecepatan blog mobile kehidupan kemanusiaan kesehatan keyakinan keyboard keyword khusus kiata G+ klasik klik kode warna koding komentar komentar blog komputer konsipirasi konten konversi kopi kota kotak navigasi menu blog kotak pencarian kotlin kriminalitas kualitas kucing label laptop lay out lay out version 3 theme layarlipat layout lazyload lifehack lingkungan logitech logo love Macbook Macbook Air machine learning MacOS magnifier maintenance makmur manusia margasatwa masa depan masonry matahari matematika medsos mega menu mengganti tempa menu menu navigasi menu pencarian menulis merombak metafisika Microsoft microsoft edge Minggu minify misteri mitos mobile modal modern modifikasi monetisi morality motivasi motivation moz myths nasehat terbaik navbar navigasi navigasi menu blog ngeblog nibbler notable office Omnibus online online editor operating sistem opini otodidak pagelist pagerank paginator Pandora panduan panduan mobile paradox parameter parasit parse pembatasan pemilu 2019 Pemilu Indonesia 17 April 2019 pemrograman pemula pendidikan pengalaman pengaturan pengusaha Penulis perang dagang Cina vs Amerika perang dunia ketiga perangdagang perceraian perihal perubahan pexel phablet PHP plagiat plagiator PlagScan play store polemik politik ponsel popularitas popularposts portable powered by blogger Powerpoint prediksi premium privasi produk profesi profile programmer programming programming. prosesor pseudo-sains psikologi Python rahasia ramalan ranking faktor rawgit re-desain re-desain tema blogger React Reactions read more recentPosts redesain related posts remaja resolusi responsinator responsive review robot robot.txt sains samsung sanggahan saran temaplate blogger saran template search secrets security sederhana sejarah seken selegram semrush SEO share button sharing buttons I.O sidebar sidenav siginifikan silikon simple simpson singularity sitelink sitemap smartphone snippet soho solusi somadmorroco spesial spoiler star wars sticky sidebar sticky widget Strategi SEO Student study study online style submenu subscriber success sudut cerita SVG SVG icon syimbian tab s2 tabel tablet tabs2 tagging takdir takhyul talenta tataletak Teen teka teki teknik teknologi TELKOMSEL tema tema kesederhanaan template template premium template premium gratis template SOHO template versi ke-2 terkemuka tes popularitas testimoni testmysite text theme Thucydides tip tips toggle tokoh tombol berbagi tombol pengalihan tombol reply komentar tops traffik trafic trafik translator tribun tricks Trik triks troubleshooting Tutorial Tutorial Anissa tutorialKhusus twitter uang UAS unduh unik update urang utan ustazd Abdul Somad vanilla Script video viomagz viral virus corona vlogging vue w3-css w3school W3Shool wabah warna web web story WebAssembly webdesign WEBP website whatsapp widget wifi ID windows Windows Mobile wisata WIX wordpress X-Frame xiomi xml yandex youtube youtuber z-index
Tampilkan selengkapnya