Pembuatan Website Menu Makanan Sehat Dengan Menggunakan

advertisement
Pembuatan Website Menu
Makanan Sehat
Menggunakan Bahasa
Pemrograman HTML,CSS,dan
Plugin Jquery
Nama
NPM
Dosen Pembimbing
: Nugraha Ramadhana
: 56413574
: 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.
Berbagai Istilah Internet
• 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
• 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 masingmasing 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
Download