Pengenalan Dasar Web
-
Upload
fadlika-dita-nurjanto -
Category
Documents
-
view
991 -
download
1
description
Transcript of Pengenalan Dasar Web
Pengenalan Dasar Web
Fadlika Dita Nurjanto Upgrading KOMINFO FTI BEM FTI ITS 2013
Biodata Nama : Fadlika Dita Nurjanto TTL : Wonosobo, 9 November 1991 Riwayat Pendidikan:
SD Negeri 2 Wonosobo SMP Negeri 2 Wonosobo SMK Negeri 1 Wonosobo Teknik Informatika ITS 2010
Hobi : Membaca, Berenang, Nggowes Email : [email protected]
Pengalaman Organisasi Staf Ristek HMTC ITS 2011-2012 Staf Bisnis Kopma dr.Angka ITS 2011-2012 Kadep Humas KMI (Keluarga Muslim Informatika ITS) 2012-2013 Asisten Direktur Humas Kopma dr.Angka ITS 2012-2013 Microsoft Student Partner ITS Periode 2012-2013 Koordinator Administrator Laboratorium RPL, Teknik Informatika ITS 2013-sekarang
Motto : Keberuntungan merupakan pertemuan dari kesempatan dan persiapan, bismillah
Be Carefull!
Rileks, Santai, Fokus
Apa itu WWW, Website??
Seberapa penting website untuk organisasi
www (world wide web) layanan yang digunakan di internet untuk menyampaikan informasi
dengan dukungan multimedia berupa teks, gambar, video dan suara.
website kumpulan halaman dari halaman situs, terangkum
dalam sebuah domain yang berada di dalam www
pengertian website
1991 situs web pertama diluncurkan
1993 www dapat digunakan oleh setiap orang
1994 W3C (World Wide Web Consortium) didirikan
2003 web 2.0
2010 web 3.0
sejarah website
web 1.0
web 2.0
web 3.0
web 1.0 teknologi awal website. server berperan sebagai pembari informasi, client berperan sebagai pembaca. bahasa yang digunakan HTML
web 2.0 the web as platform. pemanfaatan web sebagai sebuah platform aplikasi . harnessing collective intelligence. konten dapat diisi oleh pengguna secara interaktif, contoh youtube. lightweight programming models. pembuatan web menggunakan bahasa yang lebih beragam (html, css, javascript)
web 3.0 the 3D web. mendukung kemampuan visual 3D dan interaksi secara realtime. the media-centric web. photo, audio, dan video menjadi cara lain untuk mencari informasi selain menggunakan keyword.
Jenis-jenis Website
website statis website dinamis
front-end only front-end dan back-end
front-end merupakan halaman website yang dapat diakses oleh pengunjung
back-end biasa disebut CMS (Content Management System), atau disebut juga Administrator Area, Dashboard, dsb
website bersifat statis, konten website tidak dapat diupdate
website bersifat dinamis, di mana administrator dapat mengubah konten dengan leluasa
Contoh Website
news
social network
forum
e-commerce
search engine
detiknews, kompas, BBC, reuters
facebook, twitter, tumblr, wordpress, blogger
kaskus, indowebster, detik forum
tokobagus, berniaga, zalora, bhinneka.com
google, bing, yahoo
Contoh Website (2)
Archive Wikipedia, Google Groups, dll
Blog
Blogspot, Wordpress, Tumblr, dll
Corporate Website
Website ITS, BUMN, Perbankan, dll
Komponen Penyusun Website
web browser web server database server
web editor image editor
Unsur-Unsur Website .com, .org, .or.id, .co.id, .net
http://................................. .com
Ho
sting
HTML, CSS, Javascript
Domain
jagoanhosting, idwebhost, dll
Hosting
HTML, CSS, HTML 5, CSS 3, jQuery
Desain & Scripting
Teknologi Web
HTML
CSS Javascript
CMS
PHP
XML JSON
WEBGL
HTML 5
CSS 3
SQL
ASP.NET
HTML
HTML adalah singkatan dari HyperText Markup Language yaitu bahasa pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet (Browser). HTML dapat juga digunakan sebagai link link antara file-file dalam situs atau dalam komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam dunia internet.
CSS
CSS adalah singkatan dari Casading Style Sheet yang merupakan kumpulan perintah yang dibentuk dari berbagai sumber yang disusun menurut urutan tertentu sehingga mampu mengatasi konfik style. CSS digunakan untuk mendukung pembuatan website sehingga dapat mempercantik tampilan halaman website.
Javascript
JavaScript adalah bahasa pemrograman berbasis prototipe yang berjalan disisi client. Jika kita berbicara dalam konteks web, sederhananya, kita dapat memahami JavaScript sebagai bahasa pemrograman yang berjalan khusus untuk di browser atau halaman web agar halaman web menjadi lebih hidup.
element
HTML
CSS
fontcolor : white backcolor : blue textweight : bold width : 100px weight : 40px font-family : calibri
width
height
Relasi antara HTML dan CSS
CMS CMS (Content Management System) merupakan perangkat lunak yang memungkinkan seseorang untuk menambahkan dan/atau memanipulasi (mengubah) isi dari suatu situs Web.
Pemanfaatan CMS : - Website perusahaan, bisnis, organisasi atau
komunitas. - Portal - Galeri foto - Aplikasi E-Commerce. - Mengelola website pribadi / blog. - Dan lain-lain
Kelebihan CMS : Waktu pembuatan website cepat, manajemen data mudah, banyak tersedia template dan plugin yang bisa ditambahkan
WordPress WordPress adalah sebuah perangkat lunak blog yang ditulis dalam PHP dan mendukung sistem basis data MySQL. WordPress dibuat oleh pengembangnya sebagai perangkat lunak weblogging atau blogging. Tetapi seiring perkembangannya, WordPress banyak digunakan sebagai engine utama dalam website-website perusahaan dan organisasi di dunia. WordPress memiliki banyak modul yang bisa ditambahkan, seperti desain template dan plugin yang dikembangkan oleh banyak komunitas. Desain template dan plugin yang ditawarkan beragam, dari yang free sampai yang berharga ratusan dolar.
Langkah-langkah membangun website yang interaktif
- Tentukan tujuan website - Tentukan sasaran target pengunjung website - Rancang Sitemap Website - Siapkan Content Website (gambar, artikel,
identitas website, motto, disesuaikan dengan sitemap)
- Tentukan teknologi website (CMS, Framework, bahasa pemrograman, database, dll)
- Tentukan alamat website (domain). Pemilihan jenis domain, fasilitas, harga, provider domain.
- Tentukan tempat penyimpanan website (hosting). Pemilihan berdasarkan kapasitas (space), bandwith, layanan provider, harga.
Demo Wordpress
Referensi Belajar
W3Schools : http://www.w3schools.com Wordpress : http://www.wordpress.org IlmuKomputer : http://www.ilmukomputer.org Dan banyak lagi..
Sekian, Terima Kasih
Facebook : Fadlika Dita Nurjanto Twitter : @fadlikadn Blog : fadlikadn.wordpress.com