SKIP TO MAIN CONTENT
Rabu, 27 Juni 2018
Cara Bikin Web - Cara Membuat Website AMP-HTML

Cara Bikin Website & Membuat Website AMP-HTML

NethCourse Jateng merupakan pusat privat / kursus desain website. Cara bikin web yang diajarkan berfokus pada materi terupdate khususnya bagaimana cara membuat website dengan halaman berbentuk AMP-HTML. AMP-HTML adalah format halaman website yang direkomendasikan oleh google. Ini adalah cara desain web yang mudah, sederhana dan cepat.



Mendesain & Membuat Website Halaman AMP-HTML

Cara terbaik didalam belajar mendesain website AMP-HTML tiada lain adalah dengan memahami bagaimana syarat membuat web yang berformat AMP-HTML itu. Bikin web standar alias web non AMP-HTML memang lebih bebas; bebas coding dan tanpa harus berpatokan pada penambahan script link amp ini itu. Akan tetapi, kecepatan loading, ringan, mudahnya snippet terindeks oleh google merupakan keunggulan tersendiri antara halaman AMP dan Non AMP.

Secara garis besar, format halaman AMP yaitu dengan menambahkan snippet yang ditentukan oleh google. Snippet tersebut terbagi atas 3 bagian yaitu:

  1. Format dokumen web ditandai oleh tulisan amp atau tanda petir
  2. Link CDN ke ampproject dimana sumber script di kirim ke web untuk dirender oleh browser
  3. Cara coding sedikit berbeda dengan html biasa

Secara global, membuat website dengan format halaman amp-html itu tidak beda jauh dengan coding html biasa. Beda-beda tipis lah. Asal bersungguh-sungguh, pengalaman belajar coding amp-html dalam mendesain website lebih enjoy, clean dan cepat. Itulah kenapa direkomendasikan oleh raksasa mesin pencari, google.

Format Desain Web AMP-HTML

Perhatian coding berikut ini:

<!DOCTYPE html>
<html ⚡>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<title>Kursus Bikin Web Termudah di Jateng </title>
<link rel="canonical" href="https://kursusjateng.blogspot.com"/>
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"/>
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
</head>
<body>
<h1>Halo dunia AMP!</h1>
</body>
</html>

Menyimak coding inti AMP-HTML diatas kita menemukan pokok-pokok yang wajib ada agar halaman website anda berformat AMP, yaitu:

  1. Format Dokumen: <!DOCTYPE html>
  2. Meta Charset: <meta charset="utf-8">
  3. Script CDN Amp: <script async src="https://cdn.ampproject.org/v0.js"></script>
  4. Title Tag: <title>Kursus Bikin Web Termudah di Jateng </title>
  5. Link Canonical: <link rel="canonical" href="https://kursusjateng.blogspot.com"/>
  6. Meta Viewport: <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"/>
  7. CSS Wajib Boilerplate: <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  8. dan, Stylesheet Custom berupa: <style amp-custom>

Melalui kursus web alias kursus bikin web di NethCourse Jateng yang berlokasi di Kabupaten Magelang, anda akan dibimbing hingga menguasai walau pengetahuan mengenai coding nol besar. Kami siap membimbing anda sampai tuntas.

So, daftar sekarang juga! Hotline Contact: 0882-2522-6922.


By NethCourse (0882-2522-6922)
Back to KursusJateng Homepage.

NethCourse uses cookies to help google service, personalise ads, and more. By visiting us you agree with our Cookies & Privacy policy.