Pembuatan Website Menu Makanan Sehat

Menggunakan Bahasa Pemrograman HTML,CSS,dan

Plugin Jquery

Nama : Nugraha Ramadhana

NPM : 56413574

Dosen Pembimbing : RIZA ADRIANTI SUPONO, SKOM, MMSI

Pendahuluan

Perkembangan teknologi sekarang ini semakin pesat sejak

munculnya teknologi internet yang mempengaruhi segala bidang,

terutama pada bidang teknologi informasi. Internet adalah media

komunikasi yang digunakan untuk menyampaikan informasi yang

lebih cepat dan efektif, hampir sama dengan buku namun buku

cenderung sedikit lebih rinci dan sedikit sulit untuk mencari suatu

informasi yang mendesak.

Aplikasi web disebut juga dengan perangkat lunak berbasis

web.Salah satu teknologi dalam pembuatan sebuah website dengan

menggunakan sebuah software adobe dreamwever. Adobe

dreamweaver adalah program yang digunakan untuk membuat

halaman web.

Pendahuluan

Kesehatan yaitu merupakan sebuah kondisi yang stabil atau

umum dalam sistem koordinasi badan dan jiwa raga manusia atau

makhluk hidup lainnya pada rata-rata normal. Berkaitan dengan

badan kesehatan tersebut sering dijuluki sebagai kesehatan jasmani

yaitu jika koordinasi organ-organ tubuh manusia atau makhluk hidup

lainnya dalam keadaan yang stabil atau normal. Sementara kesehatan

rohani merupakan kesehatan jiwa manusia atau makhluk hidup yang

memiliki akal dan pikiran, apabila seorang tersebut memiliki

koordinasi pikiran dan hati yang tenang sekaligus nyaman pada saat

itu.

Pendahuluan

Makanan sehat adalah makanan yang memiliki mengandung

gizi yang seimbang, mengandung serat dan zat-zat yang diperlukan

tubuh untuk proses tumbuh kembang. Seiring dengan kemajuan

zaman dan kesibukan sehari-hari kita lupa yang namanya

kesehatan,salah satu dari penyebab tidak sehat adalah jenis makanan

yang kita makan setiap

Mengacu pada uraian diatas ,penulis ingin membuat sebuah

website yang digunakan untuk memberikan informasi, contohnya

adalah informasi tentang menu makanan sehat yang bertujuan

memberikan pengetahuan dan ilmu tambahan bagi masyarakat untuk

memperoleh hidup menjadi lebih sehat dengan menu makanan yang

sehat

Tujuan

• Untuk membangun menu makanan sehat berbasis website.

• Menjadikan masyarakat lebih sehat dengan mengkonsumsi makanan sehat.

• Untuk memberikan pengetahuan dan informasi mengenai menu makanan sehat mulai dari bahan hingga cara membuat.

Berbagai Istilah Internet

• Internet Internet merupakan singkatan dari Interconnected network. Jika diterjemahkan secara langsung berarti jaringan yang saling terhubung. lntemet adalah kumpulan komputer yang terhubung satu dengan yang lain dalam sebuah jaringan.

• WWW WWW (World Wide Web) yang sering juga kita sebut dengan website, merupakan fasilitas di lntemet yang paling banyak digunakan.

• URL (Universal Resource Locator) URL merupakan singkatan dari Universal Resource Locator,yaitu halaman unik sebuah halaman web di internet yang ingin kamu kunjugi.

• Web Browser Web Browser adalah aplikasi perangkat lunak yang memungkinkan penggunanya untuk berinteraksi dengan text, image, video, games dan informasi lainnya yang berlokasikan pada halaman web.

Berbagai Istilah Internet

Berbagai Istilah Internet

• Web Server Web server merupakan perangkat lunak yang mengelola (mengatur) permintaan user dari browser dan hasilnya dikembalikan kembali ke browser untuk melayani permintaan dokumen web dari kliennya.

• Website Website dapat diartikan sebagai kumpulan halaman-halaman yang digunakan untuk menampilkan informasi teks, gambar diam atau gerak, animasi, suara, dan atau gabungan dari semuanya, baik yang bersifat statis maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait

Berbagai Istilah Internet

• HTTP (Hypertext Transfer Protocol) HTTP adalah sebuah protocol yang menentukan aturan main antara software web browser dan web server dalam penyediaan dokumen yang diminta oleh browser.

• Homepage Homepage adalah halaman pembuka dari sekian banyak web page yang terdapat pada suatu web site. Halaman pertama ini berisi tentang apa dan siapa, dari perusahaan atau organisasi mana pemilik web site tersebut, juga sering memiliki link-link yang membawa kita pada hal lain dari sebuah situs web.

HTML

• HTML adalah kepanjangan dari HyperText Markup Language.

• Bahasa untuk membuat struktur website

• Sebagai kerangka website

• Sebagai fondasi website

Ibarat sebuah rumah HTML adalah fondasi dan kerangka dari sebuah bangunan

Bagian Utama HTML

• <HTML> Sebagai tanda awal dokumen HTML.

• <HEAD> Sebagai informasi page header. Dokumen HTML diapit oleh tag < HEAD></HEAD>.

• <BODY> Sebagai isi dari sebuah halaman website.

Yang Penting diketahui Dalam HTML

• <p> dibaca tag p

• Pada umumnya berpasangan ada pembuka dan penutup <p></p>

• Yang tidak berpasangan contohnya </br>

• Ada yg memiliki atribut <img src=“#”>

• Saling membungkus<p><strong>ini text</strong></p>

Kelebihan HTML

• Merupakan bahasa penkodean yang lintas platform (cross

platform), maksudnya HTML dapat digunakan pada berbagai

jenis mesin komputer yang berbeda dan berbagai macam sistem

operasi yang berbeda.

• Dapat disisipi bahasa pemrograman untuk mempercantik halaman

web seperti Javascript, VBScript.

• Cara menjalanakannya cukup dengan menggunakan browser.

Kekurangan HTML

• Memiliki tag-tag yang begitu banyak sehingga susah dipelajari untuk yang masih awam.

• untuk memperoleh halaman yang sangat menarik harus

menggunakan bahasa pemrograman tertentu seperti Javascript

atau VBScript dan animasi seperti Flash atau Shockwave.

CSS

• CSS (Cascading Style Sheet) adalah salah satu bahasa desain web (style sheet language) yang mengontrol format tampilan sebuah halaman web yang ditulis dengan menggunakan penanda (markup language). Biasanya digunakan untuk mendesain sebuah halaman HTML.

• Mengatur layout css

• Mengatur posisi

• Mengatur jarak

• Mengatur ukuran dan warna

JQuery

Jquery adalah sebuah library Javascript yang sangat ringkas dan sederhana untuk memanipulasi komponen di dokumen HTML, animasi, efek dan memproses interaksi ajax.

Struktur Navigasi

Pada aplikasi ini terdiri dari beberapa tampilan halaman yang masing-

masing dari halaman tersebut memiliki kegunaan dan fungsinya yang berbed-beda, struktur navigasi yang digunakan adalah struktur navigasi campuran.

Rancangan Homepage

Tampilan Homepage adalah tampilan

pada saat awal aplikasi dibuka, tampilan

tersebut terdiri dari logo, menu, slider,

article, widget, news dan menu makanan

sehat

Pembuatan Website

Untuk membuat tampilan homepage

pada website kita perlu membuat bahasa

pemrograman html,css dan diberi nama

index.html

Listing Program

Kode tersebut adalah

berisi tag pembuka head

yang di dalamnya terdapat

link menuju ke style.css

juga ke jquety,serta

terdapat script fungsi yang

berguna untuk

menjalankan slider pada

halaman home page