10 Contoh Coding dengan HTML Untuk Membuat Website
Sebagai pemula, salah satu belajar coding adalah dengan melihat contoh _coding_. Contoh kode program akan membantu kamu untuk memahami konsep teknis pemrograman secara lebih detail. Di artikel ini, kita akan mengambil contoh dari bahasa HTML sebagai dasar dalam pengembangan halaman _web_.
## Contoh Coding HTML untuk Membuat Website
Sebuah dokumen HTML terdiri dari banyak bagian dengan fungsi yang berbeda-beda. Setiap bagiannya pun memiliki aturan penulisan yang khas, dimana kesalahan 1 karakter saja bisa menyebabkan _error_. Beberapa bagian utama dokumen HTML beserta contoh kodenya, yaitu:
### 1\. Dokumen HTML
Dokumen HTML adalah dasar dari setiap _website_. Ini adalah struktur dasar untuk menampilkan konten di web. Dokumen HTML biasanya memiliki ekstensi _file_ ".html" atau ".htm". Jika kamu mengunjungi suatu _website_, maka _browser_ kamu membaca dokumen HTML dan mengubahnya menjadi halaman _web_ yang interaktif.
Bagian paling awal dokumen adalah elemen \, yang menandakan awal dan akhir dari dokumen HTML. Di dalam elemen tersebut, terdapat dua elemen utama, yaitu \ dan \.
Elemen \ berisi informasi-informasi meta seperti judul halaman, sedangkan elemen \ berisi konten yang akan tampil di halaman _web_. Struktur dasar dari sebuah dokumen HTML yaitu:
_**\**_
_**\**_
_**\**_
_**\Ini adalah Judul Halaman Web kamu\ **_
_**\**_
_**\**_
_**\. Judul ini akan muncul di _tab browser_ ketika pengguna mengunjungi halaman kamu. Di dalam elemen \<body>, kamu dapat menambahkan berbagai elemen, seperti teks, gambar, tautan, dan banyak lagi.
### 2\. Heading
Selanjutnya, mari kita bahas contoh _coding_ _heading_ dalam HTML. _Heading_ adalah elemen untuk memberi judul atau membuat sebagian teks menjadi lebih menonjol di halaman _web_ kamu. Terdapat enam tingkatan _heading_ yang dapat kamu gunakan, yaitu \<h1> hingga \<h6>.
\<h1> memiliki tingkatan paling tinggi dan berfungsi untuk membuat judul utama halaman, sedangkan \<h6> untuk judul pada tingkat paling rendah.
Contoh penggunaan elemen _heading_ yaitu:
**\<h1>Judul Utama\</h1>**
**\<h2>Ini adalah Judul Tingkat Kedua\</h2>**
**\<h3>Ini adalah Judul Tingkat Ketiga\</h3>**
Penggunaan _heading_ membantu pengguna untuk memahami struktur dan hierarki konten di halaman _web_ kamu. Sebagai _programmer_, kamu harus bisa menentukan tingkatan _heading_ yang tepat untuk konten _web_ kamu.
### 3\. Paragraf
Paragraf adalah elemen HTML untuk menampilkan teks dalam format paragraf. Ini adalah elemen dasar untuk menampilkan teks di halaman _web_ kamu. Elemen paragraf dalam HTML menggunakan _tag_ \<p>. Contoh sederhana penggunaan elemen paragraf dalam HTML yaitu:
\<p>Teks paragraf pertama.\</p>
\<p>Teks paragraf kedua.\</p>
Setiap elemen \<p> akan membuat teks dari baris baru dan otomatis memberikan jarak antar paragraf. Di bagian paragraf, kamu bisa mengatur gaya huruf, misalnya cetak miring _(italic)_, cetak tebal _(bold)_, hingga garis bawah _(underline)_.
### 4\. Link
_Link_ atau tautan adalah elemen penting dalam pembuatan website. Dengan _link_, pengguna dapat berpindah dari satu halaman ke halaman lainnya _(internal link)_, atau bahkan ke _website_ lain _(external link)_. Penggunaan tautan dapat memudahkan navigasi dan pengalaman pengguna pada _website_ kamu.
Contoh penggunaan _link_ dalam contoh _coding_ HTML, yaitu:
**\<a href="https://www.comtohsadja.com">Ini adalah contoh tautan ke web lain.\</a>**
Dalam contoh di atas, \<a> adalah _tag_ HTML untuk membuat _link_ dan _href_ adalah atribut yang menentukan URL tujuan _link_. Dengan menggunakan _link_ ini, pengguna dapat dengan mudah berpindah ke halaman _web_ lainnya.
Selain tautan ke situs lain, kamu juga dapat membuat _internal link_ untuk mengarahkan pengguna ke halaman lain di situs kamu seperti:
**\<a href="halaman-lain.html">Pergi ke halaman lain di website ini.\</a>**
Menggunakan _link_ yang konsisten dan jelas adalah salah satu cara terbaik dalam mengembangkan _web_. Maka dari itu, kamu harus bijak dalam menempatkan _link_, mulai dari menentukan atribut-atribut _link_ hingga _anchor text_ yang tepat.
### 5\. Gambar
Gambar adalah elemen penting dalam membuat _website_ yang menarik dan informatif. Kamu dapat menggunakan gambar untuk memperkuat pesan, memberikan ilustrasi, atau bahkan hanya untuk tujuan dekoratif.
Dalam _coding_ HTML, kamu dapat menggunakan elemen \<img> untuk menambahkan gambar ke halaman _web_ kamu. Contoh penggunaan elemen gambar, yaitu:
**\<img src="gambar.jpg" alt="Deskripsi gambar kamu di sini">**
Dalam contoh di atas, \<img> adalah _tag_ gambar, sedangkan atribut _src_ menunjukkan lokasi gambar. Atribut _alt_ adalah teks alternatif yang akan tampil jika gambar tidak dapat dimuat, dan juga berguna untuk aksesibilitas _web_.
### 6\. Tombol
Tombol adalah elemen interaktif dalam pembuatan _website_, terutama pada halaman yang memerlukan tindakan dari pengguna. Dalam HTML, kamu dapat menggunakan elemen \<button> untuk membuat tombol. Penggunaan elemen tombol dalam contoh _coding_ HTML, yaitu:
**\<button type="button">Klik Saya\</button>**
Dalam contoh di atas, \<button> adalah _tag_ tombol, dan atribut _type_ menentukan tindakan untuk tombol tersebut. Fungsi tombol sendiri, yakni hanya akan memicu aksi JavaScript saat pengguna menekannya.
### 7\. Font
Penggunaan _font_ yang tepat adalah salah satu aspek penting dalam merancang tampilan _website_ yang menarik. Dalam HTML, kamu dapat mengatur _font_ dengan menggunakan elemen \<font>. Contoh penggunaan elemen _font_ dalam HTML, yaitu:
**\<p>\<font face="Arial" size="3" color="blue">Ini adalah contoh teks dengan font Arial, ukuran 3, dan warna biru.\</font>\</p>**
Dalam contoh di atas, kita menggunakan atribut _face_ untuk menentukan jenis _font_, atribut _size_ untuk mengatur ukuran _font_, serta atribut _color_ untuk mengganti warna teks.
### 8\. Ordered List
_Ordered list_ atau daftar terurut adalah cara yang efektif untuk mengatur informasi dalam urutan tertentu. Dalam HTML, kamu dapat menggunakan elemen \<ol> _(ordered list)_ untuk membuat daftar. Contoh penggunaannya, yaitu:
**\<ol>**
**\<li>Jika A, maka B\</li>**
**\<li>Lakukan A, agar B\</li>**
**\</ol>**
Dalam contoh di atas, kita menggunakan elemen \<ol> untuk mengelompokkan sejumlah _item_ dengan nomor berurutan. Ini sangat berguna untuk membuat panduan langkah demi langkah, daftar prioritas, atau tata cara yang runtut.
### 9\. Unordered List
_Unordered list_ atau daftar tak berurutan adalah cara lain untuk mengorganisasi informasi, tetapi dalam bentuk yang tidak memerlukan urutan khusus. Dalam HTML, kamu dapat menggunakan elemen \<ul> _(unordered list)_ untuk membuatnya. Contoh _coding unordered list_ dalam HTML, yaitu:
**\<ul>**
**\<li>Jika A, maka B\</li>**
**\<li>Lakukan A, agar B\</li>**
**\</ul>**
Dalam contoh di atas, kita menggunakan elemen \<ul> untuk mengelompokkan _item_ tanpa urutan yang spesifik. \<ul> cocok untuk membuat daftar _item_ tanpa prioritas tertentu, kategori, atau daftar yang tidak memiliki urutan spesifik.
### 10\. Tabel
Tabel adalah cara yang efektif untuk menyajikan data dalam format yang terstruktur. Dalam HTML, kamu dapat menggunakan elemen \<table> untuk membuat tabel, serta elemen-elemen seperti \<tr> _(table row)_, \<th> _(table header)_, dan \<td> _(table data)_ untuk mengatur isi tabel. Contoh penggunaannya, yaitu:
**\<table>**
**\<tr>**
**\<th>Nama\</th>**
**\<th>Usia\</th>**
**\</tr>**
**\<tr>**
**\<td>John\</td>**
**\<td>30\</td>**
**\</tr>**
**\<tr>**
**\<td>Jane\</td>**
**\<td>28\</td>**
**\</tr>**
**\</table>**
Dalam contoh di atas, kita menggunakan elemen tabel untuk membuat tabel sederhana yang berisi daftar nama dan usia. Elemen \<tr> berfungsi untuk menentukan baris-baris dalam tabel, \<th> untuk membuat _header_, dan \<td> untuk mengisi data.
## Tertarik untuk Belajar Coding HTML?
Setelah menyimak pembahasan contoh _coding_ di atas dan jika kamu tertarik untuk belajar pemrograman, maka solusi terbaik adalah kamu bisa mempelajarinya di bangku kuliah.
Karena, melalui aktivitas perkuliahan, kamu dapat mencari tahu tentang berbagai jurusan IT yang mempelajari _programming_ secara detail dan spesifik sesuai minat kamu. Selain itu, [daftar jurusan IT yang banyak diminati perusahaan](https://primakara.ac.id/blog/tips-kuliah/jurusan-it) juga dapat memberikan kamu prospek kerja yang lebih cemerlang.
## FAQ
**1\. Apa itu dokumen HTML?**
Dokumen HTML adalah struktur dasar untuk menampilkan konten di web.
**2\. Ada berapa tingkatan** _**heading**_ **dalam HTML?**
Ada 6, yaitu dari \<h1> hingga \<h6>.
**3\. Apa perbedaan** _**internal link**_ **dan** _**external link**_**?**
* _Internal link_ untuk berpindah dari satu halaman ke halaman lain pada _website_ yang sama.
* _External link_ untuk berpindah ke _website_ lain.
**4\. Apa perbedaan** _**ordered list**_ **dan** _**unordered list**_**?**
* _Ordered list_ adalah daftar yang berurutan.
* _Unordered list_ adalah daftar yang tidak berurutan.</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js"></script>
<script src="/plugins/custom-markdown.js"></script>
<div class="article_sidebar">
<astro-island uid="1ONe0C" component-url="/ShareBox.5ab03bec.js" component-export="default" renderer-url="/client.4fff43be.js" props="{}" ssr="" client="only" opts="{"name":"ShareBox","value":"solid-js"}"></astro-island>
<div data-hk="0-0" class="box"><p class="box__title paragraph_small"><!--#-->Tags terkait<!--/-->:</p><!--#--><div class="tags">
<a data-hk="0-0" href="/blog/tips-kuliah" style=""><div class="btn_tag content_tags"><!--#--><!--/--><!--#--><div data-hk="0-1" class="content_button">Tips Kuliah</div><!--/--><!--#--><!--/--><!--#--><!--/--><!--#--><!--/--></div></a>
</div><!--/--></div>
</div>
</section>
<section class="other_articles">
<div class="other_articles__container container">
<h2 class="other_articles__title">
<div class="other_articles__title_regular title_large">berita</div>
<div class="other_articles__title_bold title_large--bold">lainnya</div>
</h2>
<div class="other_articles__articles">
<astro-island uid="2p5sGz" data-solid-render-id="s1" component-url="/HeadlineSmall.3252c947.js" component-export="default" renderer-url="/client.4fff43be.js" props="{"imgSrc":[0,"https://dashboard.primakara.ac.id/uploads/Primakara_Juara_PROXOCORIS_2024_e36991b646.jpg"],"category":[0,"Berita"],"desc":[0,"Borong 2 Gelar Nasional PROXOCORIS, Primakara Samai Raihan Binus"],"variant":[0,"secondary"],"href":[0,"/blog/berita/borong-2-gelar-nasional-proxocoris-primakara-samai-raihan-binus"],"noMargin":[0,true]}" ssr="" client="visible" opts="{"name":"HeadlineSmall","value":true}" await-children=""><a data-hk="s10-0" href="/blog/berita/borong-2-gelar-nasional-proxocoris-primakara-samai-raihan-binus" class="headline_small_secondary" style="margin-right:0!important;margin-bottom:0!important"><div class="headline_small_secondary__img_wrapper"></div><div class="headline_small_secondary__details"><p class="headline_small_secondary__details__category content_tags">Berita</p><p class="headline_small_secondary__details__paragraph content_title">Borong 2 Gelar Nasional PROXOCORIS, Primakara Samai Raihan Binus</p></div></a></astro-island><astro-island uid="Z1nB9o" data-solid-render-id="s2" component-url="/HeadlineSmall.3252c947.js" component-export="default" renderer-url="/client.4fff43be.js" props="{"imgSrc":[0,"https://dashboard.primakara.ac.id/uploads/IGDX_Bootcamp_2024_Primakara_2955b43467.jpg"],"category":[0,"Berita"],"desc":[0,"Pertama di Bali, IGDX Bootcamp 2024 Digelar di Primakara"],"variant":[0,"secondary"],"href":[0,"/blog/berita/pertama-di-bali-igdx-bootcamp-2024-digelar-di-primakara"],"noMargin":[0,true]}" ssr="" client="visible" opts="{"name":"HeadlineSmall","value":true}" await-children=""><a data-hk="s20-0" href="/blog/berita/pertama-di-bali-igdx-bootcamp-2024-digelar-di-primakara" class="headline_small_secondary" style="margin-right:0!important;margin-bottom:0!important"><div class="headline_small_secondary__img_wrapper"></div><div class="headline_small_secondary__details"><p class="headline_small_secondary__details__category content_tags">Berita</p><p class="headline_small_secondary__details__paragraph content_title">Pertama di Bali, IGDX Bootcamp 2024 Digelar di Primakara</p></div></a></astro-island><astro-island uid="2pbpXm" data-solid-render-id="s3" component-url="/HeadlineSmall.3252c947.js" component-export="default" renderer-url="/client.4fff43be.js" props="{"imgSrc":[0,"https://dashboard.primakara.ac.id/uploads/Kuliah_Umum_Kominfo_di_Primakara_3995b2da7b.jpg"],"category":[0,"Berita"],"desc":[0,"Menyatukan Manusia dengan AI, Kominfo dan Primakara Gelar Kuliah Umum"],"variant":[0,"secondary"],"href":[0,"/blog/berita/menyatukan-manusia-dengan-ai-kominfo-dan-primakara-gelar-kuliah-umum"],"noMargin":[0,true]}" ssr="" client="visible" opts="{"name":"HeadlineSmall","value":true}" await-children=""><a data-hk="s30-0" href="/blog/berita/menyatukan-manusia-dengan-ai-kominfo-dan-primakara-gelar-kuliah-umum" class="headline_small_secondary" style="margin-right:0!important;margin-bottom:0!important"><div class="headline_small_secondary__img_wrapper"></div><div class="headline_small_secondary__details"><p class="headline_small_secondary__details__category content_tags">Berita</p><p class="headline_small_secondary__details__paragraph content_title">Menyatukan Manusia dengan AI, Kominfo dan Primakara Gelar Kuliah Umum</p></div></a></astro-island>
</div>
</div>
</section>
<section class="tour_campus_wrapper">
<div class="tour_campus_wrapper__container container">
<h2 class="tour_campus_wrapper__heading">
<div class="title_large">explore more</div>
<div class="title_large--bold colored">primakara university</div>
</h2>
<div class="tour_campus_wrapper__actions">
<div class="action_card_wrapper">
<h2 class="content_title">360 Virtual Tour</h2>
<a data-hk="0-0" href="https://rumahvirtual360.com/primakara2/" style=""><div class="btn_primary "><!--#--><!--/--><!--#--><div data-hk="0-1" class="content_button">Ikuti Virtual Tour</div><!--/--><!--#--><svg data-hk="0-2-0" width="36" height="36" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#032038" d="M0 0h36v36H0z"></path><path d="m19 11-1.41 1.41L22.17 17H10v2H22.17l-4.59 4.59L19 25l7-7-7-7Z" fill="#1DCAD3"></path></svg><!--/--><!--#--><!--/--><!--#--><!--/--></div></a>
</div>
<div class="action_card_wrapper">
<h2 class="content_title">Penerimaan mahasiswa</h2>
<a data-hk="0-0" href="/penerimaan" style=""><div class="btn_primary "><!--#--><!--/--><!--#--><div data-hk="0-1" class="content_button">Penerimaan</div><!--/--><!--#--><svg data-hk="0-2-0" width="36" height="36" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#032038" d="M0 0h36v36H0z"></path><path d="m19 11-1.41 1.41L22.17 17H10v2H22.17l-4.59 4.59L19 25l7-7-7-7Z" fill="#1DCAD3"></path></svg><!--/--><!--#--><!--/--><!--#--><!--/--></div></a>
</div>
<div class="action_card_wrapper">
<h2 class="content_title">Berita & Kegiatan</h2>
<a data-hk="0-0" href="/blog" style=""><div class="btn_primary "><!--#--><!--/--><!--#--><div data-hk="0-1" class="content_button">Lihat Berita</div><!--/--><!--#--><svg data-hk="0-2-0" width="36" height="36" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#032038" d="M0 0h36v36H0z"></path><path d="m19 11-1.41 1.41L22.17 17H10v2H22.17l-4.59 4.59L19 25l7-7-7-7Z" fill="#1DCAD3"></path></svg><!--/--><!--#--><!--/--><!--#--><!--/--></div></a>
</div>
</div>
</div>
</section>
</main>
<footer class="footer_wrapper">
<div class="footer_wrapper__container">
<div class="main_footer_wrapper">
<div class="main_footer_wrapper__container container">
<div class="main_footer_wrapper__details">
<p class="main_footer_wrapper__details__title paragraph_large--bold">primakara university</p>
<p class="main_footer_wrapper__details__content paragraph_small" style="margin-bottom:8px">
Jalan Tukad Badung No 135, Denpasar, Bali - 80226
</p>
<a data-hk="0-0" href="https://g.page/primakara?share" style="margin-bottom: 12px"><div class="btn_primary "><!--#--><!--/--><!--#--><div data-hk="0-1" class="content_button">
Lihat Maps
</div><!--/--><!--#--><svg data-hk="0-2-0" width="36" height="36" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="#032038" d="M0 0h36v36H0z"></path><path d="m19 11-1.41 1.41L22.17 17H10v2H22.17l-4.59 4.59L19 25l7-7-7-7Z" fill="#1DCAD3"></path></svg><!--/--><!--#--><!--/--><!--#--><!--/--></div></a>
<p class="main_footer_wrapper__details__content paragraph_small">
<svg data-hk="0-0" width="13" height="14" fill="none" xmlns="http://www.w3.org/2000/svg" class="main_footer_wrapper__details__content__phone_icon " ><path d="M.75 5.896a13.85 13.85 0 0 0 7.175 6.968l.51.227a2.625 2.625 0 0 0 3.247-.935l.666-.993a.75.75 0 0 0-.151-1.001l-2.26-1.823a.75.75 0 0 0-1.073.137l-.699.943a9.105 9.105 0 0 1-4.133-4.133l.943-.699a.75.75 0 0 0 .137-1.073L3.29 1.254a.75.75 0 0 0-1.002-.151l-1 .67A2.625 2.625 0 0 0 .362 5.04l.389.854v.002Z" fill="#fff"></path></svg> +62 361 895 6084
</p>
<p class="main_footer_wrapper__details__content paragraph_small">
<svg data-hk="0-0" width="16" height="13" fill="none" xmlns="http://www.w3.org/2000/svg" class="main_footer_wrapper__details__content__mail_icon " ><path fill-rule="evenodd" clip-rule="evenodd" d="M.688 2.75C.688 1.61 1.61.687 2.75.687h10.5c1.14 0 2.063.924 2.063 2.063v7.5c0 1.14-.924 2.063-2.063 2.063H2.75A2.062 2.062 0 0 1 .687 10.25v-7.5Zm1.624.032a.563.563 0 0 0-.624.936l5.168 3.445a2.062 2.062 0 0 0 2.288 0l5.168-3.445a.562.562 0 1 0-.624-.936L8.52 6.227a.938.938 0 0 1-1.04 0L2.312 2.782Z" fill="#fff"></path></svg> info@primakara.ac.id
</p>
<div class="main_footer_wrapper__details__content_socmed">
<a href="https://www.instagram.com/primakara.univ" class="content_socmed">
<div class="content_socmed__link">
<svg data-hk="0-0" width="22" height="22" fill="none" xmlns="http://www.w3.org/2000/svg" class="content_socmed__link__icon " ><path d="M11 8.021a2.98 2.98 0 1 0 0 5.958 2.98 2.98 0 0 0 0-5.958Z" fill="#fff"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M6.205 2.825a43.514 43.514 0 0 1 9.59 0c1.74.194 3.143 1.565 3.348 3.311a41.868 41.868 0 0 1 0 9.727c-.205 1.747-1.608 3.118-3.348 3.312a43.51 43.51 0 0 1-9.59 0c-1.74-.194-3.143-1.565-3.348-3.312a41.866 41.866 0 0 1 0-9.727C3.062 4.39 4.465 3.02 6.205 2.825ZM15.583 5.5a.917.917 0 1 0 0 1.833.917.917 0 0 0 0-1.833ZM6.646 11a4.354 4.354 0 1 1 8.708 0 4.354 4.354 0 0 1-8.708 0Z" fill="#fff"></path></svg>
</div>
</a>
<a href="https://www.facebook.com/primakara" class="content_socmed">
<div class="content_socmed__link">
<svg data-hk="0-0" width="10" height="18" fill="none" xmlns="http://www.w3.org/2000/svg" class="content_socmed__link__icon " ><path d="M7.017.635a4.24 4.24 0 0 0-4.24 4.24v2.36H.508a.206.206 0 0 0-.206.206v3.117c0 .114.092.206.206.206h2.27v6.394c0 .114.091.206.205.206H6.1a.206.206 0 0 0 .206-.206v-6.394h2.29a.206.206 0 0 0 .2-.156l.778-3.116a.206.206 0 0 0-.2-.257H6.306v-2.36a.71.71 0 0 1 .71-.71H9.4a.206.206 0 0 0 .206-.207V.842A.206.206 0 0 0 9.4.635H7.017Z" fill="#fff"></path></svg>
</div>
</a>
<a href="https://www.tiktok.com/@primakara.univ?is_from_webapp=1&sender_device=pc" class="content_socmed">
<div class="content_socmed__link">
<svg data-hk="0-0" xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 48 48" id="tiktok"><path d="M38.4 21.68V16c-2.66 0-4.69-.71-6-2.09a8.9 8.9 0 0 1-2.13-5.64v-.41l-5.37-.13V30.8a5 5 0 1 1-3.24-5.61v-5.5a10.64 10.64 0 0 0-1.7-.14 10.36 10.36 0 1 0 10.36 10.36 10.56 10.56 0 0 0-.08-1.27v-9.15a14.48 14.48 0 0 0 8.16 2.19Z" fill="#fff"></path></svg>
</div>
</a>
<a href="https://www.youtube.com/c/PrimakaraTV" class="content_socmed">
<div class="content_socmed__link">
<svg data-hk="0-0" width="20" height="14" fill="none" xmlns="http://www.w3.org/2000/svg" class="content_socmed__link__icon " ><path fill-rule="evenodd" clip-rule="evenodd" d="M5.406.483c3.058-.24 6.13-.24 9.188 0l2.054.16c1.144.09 2.08.948 2.269 2.08a25.955 25.955 0 0 1 0 8.555 2.498 2.498 0 0 1-2.27 2.079l-2.053.16c-3.058.24-6.13.24-9.188 0l-2.053-.16a2.498 2.498 0 0 1-2.27-2.08 25.956 25.956 0 0 1 0-8.554 2.498 2.498 0 0 1 2.27-2.08l2.053-.16Zm2.76 8.781V4.736c0-.214.234-.346.417-.236l3.774 2.264a.275.275 0 0 1 0 .472L8.583 9.5a.275.275 0 0 1-.416-.236Z" fill="#fff"></path></svg>
</div>
</a>
</div>
</div>
<div class="main_footer_wrapper__details">
<p class="main_footer_wrapper__details__title paragraph_large--bold">program studi</p>
<p class="main_footer_wrapper__details__second_title paragraph_small">
Fakultas Teknologi Informasi dan Desain
</p><a href="/pendidikan/informatika" class="main_footer_wrapper__details__content paragraph_small ">
Informatika
</a><a href="/pendidikan/sistem-informasi" class="main_footer_wrapper__details__content paragraph_small ">
Sistem Informasi
</a><a href="/pendidikan/sistem-informasi-akuntansi" class="main_footer_wrapper__details__content paragraph_small ">
Sistem Informasi Akuntansi
</a><a href="/pendidikan/desain-komunikasi-visual" class="main_footer_wrapper__details__content paragraph_small last">
Desain Komunikasi Visual
</a><p class="main_footer_wrapper__details__second_title paragraph_small">
Fakultas Ekonomi dan Bisnis
</p><a href="/pendidikan/akuntansi" class="main_footer_wrapper__details__content paragraph_small ">
Akuntansi
</a><a href="/pendidikan/bisnis-digital" class="main_footer_wrapper__details__content paragraph_small ">
Bisnis Digital
</a><a href="/pendidikan/manajemen" class="main_footer_wrapper__details__content paragraph_small ">
Manajemen
</a>
</div>
<div class="main_footer_wrapper__details">
<p class="main_footer_wrapper__details__title paragraph_large--bold">halaman penting</p>
<a href="/pendidikan" class="main_footer_wrapper__details__content paragraph_small">
Pendidikan
</a>
<a href="/tentang-kami" class="main_footer_wrapper__details__content paragraph_small">
Tentang Primakara
</a>
<a href="/kehidupan-kampus" class="main_footer_wrapper__details__content paragraph_small">
Kehidupan Kampus
</a>
<a href="/riset-dan-pengabdian" class="main_footer_wrapper__details__content paragraph_small">
Riset & Pengabdian
</a>
<!-- <a href="#" class="main_footer_wrapper__details__content paragraph_small"> Lembaga LPPM</a> -->
</div>
<div class="main_footer_wrapper__details">
<p class="main_footer_wrapper__details__title paragraph_large--bold">Link Terkait</p>
<a href="/tentang-kami/mahasiswa" class="main_footer_wrapper__details__content paragraph_small">
Mahasiswa
</a>
<a href="/tentang-kami/struktur-organisasi" class="main_footer_wrapper__details__content paragraph_small">
Struktur Organisasi
</a>
<a href="https://international.primakara.ac.id/" class="main_footer_wrapper__details__content paragraph_small">
International Office
</a>
<a href="/tentang-kami/fasilitas" class="main_footer_wrapper__details__content paragraph_small">
Fasilitas
</a>
<!-- <a href="#" class="main_footer_wrapper__details__content paragraph_small">
Inkubator Bisnis
</a> -->
<!-- <a href="#" class="main_footer_wrapper__details__content paragraph_small">
Bekerja di Primakara
</a> -->
</div>
</div>
</div>
<div class="sub_footer_wrapper">
<div class="sub_footer_wrapper__container container">
<svg data-hk="0-0-0" xmlns="http://www.w3.org/2000/svg" width="165" height="48" viewBox="0 0 209 50" fill="none" class="sub_footer_wrapper__logo " ><g fill="#fff" clip-path="url(#a)"><path d="m11.802 19.69 3.435-5.88H0l1.085 3.421A3.497 3.497 0 0 0 4.41 19.69h7.391ZM41.629 13.82h-15.13l-3.434 5.875h17.846a.258.258 0 0 1 .225.381.237.237 0 0 1-.09.089l-4.3 2.582v6.84l7.892-4.745a5.782 5.782 0 0 0 2.882-5.02c0-2.95-2.209-6.002-5.891-6.002ZM12.854 37.19l-5.576 9.555c-.271.57.1.542.444.382l.775-.473 18.491-11.17v-6.843l-14.134 8.548Z"></path><path d="M28.966 21.673V43.54a3.703 3.703 0 0 0 2.43 3.357c.845.284 3.389 1.095 3.389 1.095V21.668l-5.819.005ZM28.483 6.54a.243.243 0 0 1 .217-.125.258.258 0 0 1 .259.258v5.166h5.818V5.943c0-3.72-3.016-5.94-5.94-5.94a5.681 5.681 0 0 0-4.977 2.905L2.942 38.68a3.995 3.995 0 0 0-.212 3.615l2.087 4.76L28.483 6.539ZM78.059 47.695a2.066 2.066 0 0 1-2.066-2.066v-8.62h2.172v8.006a.775.775 0 0 0 .774.774h2.952a.775.775 0 0 0 .775-.774v-8.007h2.175v8.621a2.066 2.066 0 0 1-2.066 2.066h-4.716ZM95.32 47.695l-4.178-7.14v7.14H88.97V37.008h2.513l4.179 7.139v-7.139h2.174v10.687h-2.515ZM104.205 37.008h-2.175v10.687h2.175V37.008ZM112.043 47.695l-4.388-10.687h2.299l3.254 8.007 3.254-8.007h2.298l-4.387 10.687h-2.33ZM122.213 47.695V37.008h7.676v1.816h-5.504v2.562h5.214v1.816h-5.214v2.675h5.504v1.818h-7.676ZM140.609 47.695l-1.963-3.571h-2.544v3.571h-2.174V37.008h6.802a2.065 2.065 0 0 1 2.067 2.067v2.985a2.07 2.07 0 0 1-1.491 1.983l-.281.08 1.97 3.572h-2.386Zm-4.507-5.47h3.735a.777.777 0 0 0 .775-.774v-1.749a.776.776 0 0 0-.775-.775h-3.735v3.298ZM148.974 47.695a2.067 2.067 0 0 1-2.066-2.066v-1.157h2.172v.54a.776.776 0 0 0 .775.775h3.099a.677.677 0 0 0 .731-.68v-.73c0-.584-.969-.816-2.436-1.168-1.838-.439-4.359-1.033-4.359-2.458v-1.676a2.068 2.068 0 0 1 2.066-2.067h4.708a2.065 2.065 0 0 1 2.066 2.067v1.133h-2.174v-.516a.802.802 0 0 0-.775-.775h-2.965a.679.679 0 0 0-.733.682v.69c0 .565.96.8 2.414 1.154 1.849.45 4.391 1.067 4.391 2.464v1.733a2.068 2.068 0 0 1-2.066 2.066l-4.848-.01ZM162.163 37.008h-2.174v10.687h2.174V37.008ZM169.273 47.695v-8.87h-3.347v-1.817h8.866v1.816h-3.347v8.871h-2.172ZM182.023 47.695v-3.848l-3.734-6.839h2.105l2.717 5.096 2.714-5.096h2.107l-3.734 6.84v3.847h-2.175ZM93.704 14.047H89.89v17.616h3.814V14.047ZM86.623 25.797V16.32a2.273 2.273 0 0 0-2.27-2.272H71.977v17.618h3.814V17.417h7.04v5.09h-5.384l5.049 9.158h4.183l-3.238-5.867h3.182ZM66.535 14.047H54.198v17.618h3.815V17.652l.026-.235h7.042v5.256h-4.984l1.86 3.357 6.859-.023v-9.703a2.275 2.275 0 0 0-2.28-2.257ZM106.813 25.743l-5.229-11.696h-3.983v17.618h3.815v-8.85l.007-1.075 4.497 9.925h1.784l4.429-9.819-.007 1.105v8.714h3.814V14.047h-3.897l-5.23 11.696ZM128.096 14.047h-2.768l-7.182 17.618h4.039l1.214-3.238h7.825l1.214 3.238h4.041l-6.732-16.51a1.775 1.775 0 0 0-1.651-1.108Zm-3.476 11.562 2.702-7.53 2.691 7.525-5.393.005ZM163.901 14.047h-2.776l-7.182 17.618h4.042l1.214-3.238h7.825l1.214 3.238h4.039l-6.733-16.51a1.769 1.769 0 0 0-1.643-1.108Zm-3.481 11.562 2.691-7.53 2.691 7.53h-5.382ZM201.925 15.155a1.77 1.77 0 0 0-1.645-1.108h-2.774l-7.169 17.618h4.039l1.216-3.238h7.823l1.214 3.238h4.042l-6.746-16.51Zm-5.132 10.454 2.697-7.53 2.691 7.525-5.388.005ZM188.751 25.797V16.32a2.276 2.276 0 0 0-2.273-2.272h-12.373v17.618h3.815V17.417h7.04v5.09h-5.385l1.862 3.358 3.177 5.787h4.184l-3.229-5.855h3.182ZM146.515 22.469l7.428-8.422h-4.907l-7.35 8.422v-8.422h-3.817v17.618h3.817v-3.719l3.585-4.065 3.571 7.743h4.326l-4.135-9.155h-2.518Z"></path></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h208.658v48H0z"></path></clipPath></defs></svg>
<div class="sub_footer_wrapper__content paragraph_small--light">
Copyright © 2023 Primakara University
</div>
<div class="sub_footer_wrapper__content paragraph_small--light">
Design by <a href="https://wa.me/6281529123648?text=Hi%20Nextap%20%26%20Company!%20Saya%20ingin%20berdiskusi%20tentang%20website%20development" target="_blank">Nextap</a>
</div>
</div>
</div>
</div>
</footer>
<astro-island uid="1SzOAY" component-url="/TractionProofViewer.34558b77.js" component-export="default" renderer-url="/client.4fff43be.js" props="{}" ssr="" client="only" opts="{"name":"TractionProofViewer","value":"solid-js"}"></astro-island>
<astro-island uid="2vluD5" component-url="/CallToAction.af6550e6.js" component-export="default" renderer-url="/client.4fff43be.js" props="{}" ssr="" client="only" opts="{"name":"CallToAction","value":"solid-js"}"></astro-island>
<script src="/plugins/lazysizes.min.js"></script>
<script src="/plugins/lazysizes-video.min.js"></script>
<script src="https://unpkg.com/headroom.js@0.12.0/dist/headroom.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=Intl.NumberFormat,Intl.NumberFormat.~locale.id"></script>
<script src="/plugins/custom-select.min.js"></script>
<script src="/plugins/custom-homepage.js"></script>
<script>
!(function (f, b, e, v, n, t, s) {
if (f.fbq) return;
n = f.fbq = function () {
n.callMethod ? n.callMethod.apply(n, arguments) : n.queue.push(arguments);
};
if (!f._fbq) f._fbq = n;
n.push = n;
n.loaded = !0;
n.version = "2.0";
n.queue = [];
t = b.createElement(e);
t.async = !0;
t.src = v;
s = b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t, s);
})(window, document, "script", "https://connect.facebook.net/en_US/fbevents.js");
fbq("init", "551815523660397");
fbq("track", "PageView");
</script>
<noscript><img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=551815523660397&ev=PageView&noscript=1">
</noscript>
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NKCB5SR" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
</body>
</html>
<script src="https://cdn.jsdelivr.net/npm/toastify-js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.10/clipboard.min.js"></script>
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="/plugins/custom-clipboard.js"></script>
Ini adalah konten halaman web kamu.\
**_ _**\**_ _**\**_ Di dalam elemen \, kamu dapat menentukan judul halaman _web_ dengan menggunakan elemen \