pembuatan website menu makanan sehat dengan menggunakan bahasa pemrograman html,css dan...
TRANSCRIPT
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