Hai, sobat bloger!!!
Kita tahu bahwa blog merupakan salah satu situs yang kini diakui menjadi sosial media terbaik untuk membagikan informasi secara meluas. Untuk memperlihatkan informasi tersebut, kita perlu menciptakan artikel yang berkualitas. Selain artikel yang berkualitas, kita perlu memasang template yang baik pada blog kita.
Pada artikel kali ini, saya akan membahas ihwal “Pemahaman gampang dan terbaik untuk mengerti bahasa coding template”. Sebelum masuk ke pembahasan, saya ingin berkata bahwa artikel ini merupakan ajakan dari teman-teman bloger saya nih sob. Teman-teman saya ingin berguru coding template yang gampang dimengerti oleh orang banyak.
Sebenarnya gampang sekali untuk berguru coding ini sob. Yang terpenting ialah kita mengetahui bahasa-bahasa inggris dasar saja dan itu sudah cukup. Maka dari itu, biasanya yang suka bermain coding andal berbahasa inggris dan andal memprogram dengan matematis suatu program.
Jadi, bagaimanakah cara kita biar gampang paham bahasa coding apabila kita tidak mengerti bahasa inggris? Bagaimana jikalau kita tidak mengerti matematika? Bagaimana jikalau kita pusing setiap kali membaca coding? Berikut ini ialah penjelasannya.
Belajar bahasa inggris
Ada trik biar kita lancar berbahasa inggris, sobat. Tidak perlu mengeluarkan biaya lebih untuk berguru bahasa inggris. Cara biar kita cepat mengerti bahasa inggris ialah dengan mengetahui tenses terlebih dahulu. Silakan buka di kamus anda dan lihat halaman di cuilan tengah kamus dan lihat setiap pola kalimatnya. Buatlah kalimat mengikuti pola pada setiap yang tertera. Ikuti step by step, buatlah 10 kalimat pada setiap tenses. Ulang hingga anda lancar. Karena anda akan kesulitan mengikuti langkah selanjutnya apabila belum lancar. Ingat juga untuk menggunakan kata-kata yang anda tahu terlebih dahulu, biar sanggup mempermudah anda. Lalu ubah dari bentuk present tense ke bentuk tenses yang lainnya.
Selanjutnya apabila anda sudah lancar, silakan buka blog atau situs gosip berbahasa inggris. Jangan membacanya begitu saja ya sob, itu akan menciptakan anda malas. Artikan setiap kata dengan baik dengan mengikuti tenses, sekalipun tidak berurutan. Setiap kata gres silakan cari di kamus. Apabila anda menemukan keanehan penggunaan kata atau arti, maka buka google translate sobat. Sebab biasanya biasanya itu ialah frasa bukan kata. Dan frasa tidak tercantum di kamus bahasa inggris.
Semakin banyak anda menerjemahkan, semakin banyak perbendaharaan kata yang anda sanggup sobat. Jadi, berusahalah sekeras mungkin, tanpa berpikir negatif. Karena usaha anda tidak akan sia-sia.
Belajar matematika
Sebenarnya, saya tidak mengenal matematika pada coding template blog. Mengapa? Karena sekalipun ada, itu hanyalah matematika yang dipelajari anak TK, sob. Contohnya angka 1,2,3, ..., 100,dst. Tanpa pelengkap lambang tertentu. Kaprikornus tidak perlu anggap keras mengenai hal ini, bro. Berpikirlah saja dengan logis apabila ada matematika pada coding.
Mengenal HTML
Dalam coding blog, kita akan menemui arahan HTML.HTML akan dirumuskan dengan lambang pembuka “<” dan lambang epilog “>”. Apabila arahan tersebut dibelah, maka akan arahan epilog “</>”. Dengan fungsi untuk memperlihatkan struktur terlihat pada blog kita.
Jadi, anda sanggup mengenal bahwa setiap arahan html akan ada arahan “<” dan “>”. Praktis sekali bukan?
Mengenal CSS
CSS adalah arahan yang akan memperlihatkan style dengan lambang pembuka [nama]{[code]}. Contohnya #body{background:#fff}. Kode tersebut jikalau dibaca berarti ID(#) body akan berlatar belakang yang warnanya putih(#fff).
Mungkin sedikit memusingkan, sehingga kita perlu mengetahui lebih lanjut lebih dahulu hal ini. Lebih lagi, arahan ini sering dicantumkan dalam arahan HTML.
Mengenal javascript
Sama ibarat halnya CSS, javascript juga sering dicantumkan dalam arahan HTML. Jujur saja, arahan ini tidak mengecewakan memusingkan berdasarkan saya, tapi akan gampang jikalau mengerti. Tapi sebaiknya anda tidak perlu mengetahui lebih lanjut sebelum tahu betul HTML dan CSS.
Mendalami penggunaan HTML
Kode HTML
Secara kompleks, HTML akan lebih gampang terlihat apabila diberi CSS atau text tertentu. Tapi saya tidak akan membahas itu, saya akan membahas mengenai arahan HTML beserta fungsinya dan hal-hal terkait.
Kode HTML Paling awal pada template ialah <HTML>. Kode ini merupakan arahan pembuka. Kode penutupnya </HTML>. Hanya berbeda sedikit bukan? Lalu, selanjutnya ada arahan <head></head> dan <body></body>.
Fungsi arahan <HTML></HTML> ialah memberitahukan pada perangkat bahwa arahan berbentuk HTML. Lalu arahan <head/> artinya arahan yang tidak akan ditunjukan secara signifikan pada blog. Karena akan lebih tertuju pada browser. Contohnya arahan <title/> untuk menampilkan judul halaman yang tertera di cuilan atas browser. Kode <body/> pula, berfungsi untuk menampilkan cuilan paling signifikan pada blog anda. Mulai dari kepala hingga kaki.
Perlu diingat, bahwa ketiga arahan ini dihentikan ada yang kurang sedikit pun. Boleh diubah kecil, asal sudah mahir dan sudah tahu risikonya.
Struktur arahan HTML dasar
Struktur arahan HTML dasar sangat gampang dihafal sobat. Kode tersebut ialah sebagai berikut.
<HTML> <head> </head> <body> </body> </HTML> Itu merupakan arahan dengan deret yang gampang sekali untuk dihafalkan. Struktur arahan HTML dasar harus sistematis, artinya dihentikan diubah urutannya sedikitpun. Mengapa? Karena sedikit saja salah kata atau salah posisi, maka akan mengacaukan arahan HTML.
Struktur arahan HTML tingkat dua
Struktur ini akan ada sangkut pautnya dengan kode-kode pelengkap yang bersatu sob. Disinilah tantangan pertama dimulai. Berikut ini ialah arahan tersebut.
<html lang=’ID’> <head> <title></title> <meta></meta> <style></style> <script></script> // Jangan diperdalam dahulu, alasannya ialah javascript <body> <header></header> <asside id=’post-body’></asside> <asside id=’sidebar-right’></asside> <footer></footer> </body> </html> Jangan mengalah sobat. Mungkin memusingkan sekali sobat, tapi kalau anda sudah mahir berbahasa inggris, anda akan mengerti dengan gampang mengenai fungsi-fungsi dari kode-kode tersebut.
- Kode pelengkap dalam pembuka ibarat id dan lang, merupakan arahan yang perlu diketahui sobat. Kode id berfungsi untuk memperlihatkan nama identitas, sedangkan lang untuk memberitahukan bahasa resmi apa yang akan digunakan pada artikel blog anda.
- Kode pelengkap lain ibarat <title> berfungsi untuk memperlihatkan judul halaman yang akan tampil di browser anda. Kode ini boleh tidak sesuai dengan judul artikel atau laman anda.
- Kode <meta></meta> merupakan arahan yang tidak perlu dipelajari mendalam sebagai dasar. Sehingga kita sanggup melewatinya.
- Kode <style> merupakan arahan untuk menaruh arahan CSS.
- Kode <script> untuk ditaruh arahan javascript.
- Kode <header> untuk menampilkan cuilan kepala atau cuilan atas blog anda. Wajib ada.
- Kode <asside> untuk menciptakan sisi-sisi yang tergantung apa yang dipilih dan wajib ada.
- Kode <footer> untuk menampilkan kaki atau cuilan paling bawah blog anda dan tidak wajib banyak bagian.
Nah, berdasarkan kode-kode tersebut, adakah yang anda tidak mengerti? Silakan tanyakan ya sob. Karena berdasarkan saya itu sudah jelas.
Mendalami penggunaan CSS
Dasar
Dasar dari CSS gampang sekali sob. Ada beberapa awalan yang perlu anda ketahui, yaitu:
- . : arahan untuk memperlihatkan style pada class
- # : arahan untuk memperlihatkan style pada id
- (tidak ada apapun) : arahan untuk memperlihatkan style pada arahan awalan ibarat <body>
Selanjutnya, anda perlu menyesuaikan arahan tersebut dengan arahan HTML. Contoh ada arahan <div class=’contoh’>Contoh</div>, maka untuk memperlihatkan style kita perlu memasang arahan CSS dengan script .contoh{}.
Lalu, kita perlu mengetahui arahan “{“ dan “}”. Kita memasang arahan tersebut untuk membuka arahan isi css. Setelah itu, kita harus tahu arahan perintahnya. Misalnya sumbangan warna teks dengan arahan “color” dan latar belakang “background”. Taruh arahan tersebut ditengah “{“ dan “}”. Ketahui juga arahan selanjutnya, yaitu arahan pemenggal dengan lambang “;”. Berfungsi untuk memisahkan arahan perintah satu dengan yang lain.
Maka, teladan yang kita peroleh ialah .contoh{color:#fff;background:#000}. Paham?
Tingkat dua
Untuk memperdalam lagi, maka kita perlu mengetahui arahan perintah-perintah yang ada pada CSS. Contohnya kita ingin memasang garis pinggir. Garis pinggir dalam bahasa inggris ialah border. Maka cantumkan arahan perintah border pada CSS.
Selanjutnya ada arahan perintah lanjutan, yaitu apa yang akan tampil. Misalnya arahan #fff merupakan arahan /hex/ yang memperlihatkan warna putih. Sedangkan #000 merupakan arahan yang memperlihatkan warna hitam.
Nanti akan ada arahan dengan satuan px, misalnya 15px. Itu artinya memperlihatkan perintah untuk menciptakan ukuran normal ialah 15px atau 15 pixel. Itulah dasar tingkat kedua.
Kode-kode perintah yang akan sering kita temui lainnya ialah background, color, border, font, font-weight, widht, height, margin, padding, text-align, float, dan display.
Sedangkan arahan perintah lanjutan yang akan sering kita temui ialah #fff atau #ffffff, #000 atau #000000, [angka]px atau [angka]em, Arial(font), Times New Roman(font), solid(border), dan masih banyak lagi.
Sejauh ini paham dasarnya, bukan? Apabila anda penasaran, silakan komentar saja sob. Malu bertanya sesat di jalan.
Mengabungkan HTML dan CSS secara sistematis
Jika sudah berkata sistematis, maka kita akan membahas struktur. Menurut apa yang kita ketahui, maka anda sanggup mempelajari kode-kode berikut ini.
<html id=’lang’> <head> <title>Tekno Franklin | Artikel</artikel> <style> body{background:#fff;width:900px} #kepala{border:1px solid;width:100%;height:30px;font:3px arial} #post-body{background:#000;color:#fff;float:left:width:70%;margin:1px;padding:5px;text-align:justify} #sidebar{background:#fff;border:1px;float:right;width:30%;margin:1px} #kaki{margin:1px;text-align:center} </style> </head> <body> <header id=’kepala’>Tekno Franklin</header> <asside id=’post-body’>Mau buka apa ayo? Wkwkwk....</asside> <asside id=’sidebar’>Jangan lihat kalau tidak suka!!! Wkwkwk....</asside> <footer id=’kaki’>Hak Cipta Tekno Franklin</footer> </body> </html> Panjang ya sob? Tenang... Jangan anggap pusing.... Anggap saja lagi nonton TV yang isinya text viewer dari medsos. Jadi, anda tidak akan menganggap itu pusing.
Itulah kode-kode pondasi paling dasar yang wajib dipahami oleh bloger yang ingin berguru coding.
Mendalami kode-kode bertingkat
Kita tahu bahwa arahan header tadi menggunakan id kepala. Kalau kita perdalam, ternyata kita tidak perlu memasang arahan id. Sehingga arahan CSS berubah dari #kepala menjadi header.
Kode tersebut mempermudah kita untuk melancarkan pemahaman dalam arahan bertingkat ini.
HTML
Apabila anda membaca coding HTML, akan ada arahan ibarat div, h1, h2, h3, h4, h5, h6, img, table, p, dan masih banyak lagi. Kode ini merupakan singkatan-singkatan sob. Anda sanggup mengetahuinya dengan gampang dengan kamus atau tebak menebak. Contohnya img tidak ada di kamus, yang ada image. Artinya arahan ini memunculkan gambar. Kode h1, h2, dst berfungsi untuk arahan heading. Kode p untuk paragraf, table untuk tabel. Banyak lagi, kode-kode lainnya yang perlu kita ketahui. Tapi hanya itu arahan paling dasar, berdasarkan saya.
Contoh penggunaan pada header di body ialah sebagai berikut:
<header> <h1>Tekno Franklin</h1> <p>Tempat bermain bawah umur IT pemula, amatir, hingga profesional</p> </header>CSS
Mengikuti kode-kode tadi, maka kita akan mendapat kode-kode lain yang menarik. Mau tahu kodenya ibarat apa? Berikut ini ialah kodenya.
header{background:#fff; border-radius:8px;width:50px} header h1, header p{color:#000} header h1{font:30px} header p{font:12px} Lebih gila sekali ya sob? Arti dari arahan tersebut itu gampang bergotong-royong sobat. Penggunaan tanda koma ialah menciptakan perintah CSS untuk kode-kode tercantum. Kode “header h1” artinya memberi perintah pada arahan h1 yang terdapat pada header. Apabila anda ingin menciptakan semua h1 sama, maka tidak perlu menggunakan arahan header. Begitu pun dengan “header p”.
Kode perintah border-radius, berfungsi untuk memberi border unik dengan lengkung di sudut-sudut.
Punya pertanyaan? Silakan tanyakan di kolom komentar ya, sobat.
Nah, sejauh ini saya tahu bahwa kesulitan terbesar ialah pada html dan arahan perintah serta perintah lanjutan CSS. Maka silakan simak hal berikut ini.
Memahami abreviasi pada HTML
Saya tidak tahu apakah singkatan-singkatan pada HTML itu baku dalam penggunaan berbahasa inggris atau tidak. Yang pasti, arahan tersebut sanggup digunakan dalam pergaulan sehari-hari sebenarnya. Tapi hanya sebagian, pada arahan yang terang ibarat img.
Untuk gampang memahami kode-kode selain yang saya jelaskan tadi, maka anda sanggup memahami dengan banyak metode sobat. Misalkan kita ingin memasang gambar, maka arahan yang kita sanggup <img src=’https://contoh.com/contoh.jpg/’/>. Maka kita sanggup analisis bahwa img ialah abreviasi dari image yang artinya gambar dan src abreviasi dari source yang artinya sumber.
Bagaimana sobat? Praktis bukan? Sebenarnya saya sendiri sulit sekali untuk menjelaskan mengenai bahan blog yang satu ini. Mengapa? Karena saya berguru blog secara autodidak. Belajar template hanya sekedar dengan menganalisis dan bermain inspect element. Sedangkan menciptakan artikel hanya dengan membaca sedikit mengenai artikel-artikel bermanfaat untuk saya.
Walaupun begitu, ada beberapa orang yang beropini bahwa dengan berguru secara autodidak akan lebih gampang mengerti ketimbang les atau berguru secara formal. Kerugiannya, kita akan kesulitan untuk memperdalam ilmu tersebut saja.
Tapi, sob, jangan berkecil hati dahulu. Ayo kita pelajar dengan seksama saja, sob. Jangan ragu untuk bertanya, sob. Tunggu apa lagi? Selagi ini tutorial ini disebarkan gratis!!!