Dokumen ini adalah pengantar tentang dasar-dasar web yang ditulis oleh Fadlika Dita Nurjanto, mencakup sejarah dan perkembangan website, jenis-jenis website, serta teknologi yang digunakan dalam pembuatan website. Selain itu, dokumen ini membahas peran penting CMS seperti WordPress dan langkah-langkah untuk membangun website yang interaktif. Penulis juga menyertakan informasi tentang faedah dan komponen teknis yang terlibat dalam pembuatan situs web.

2. Pengenalan Dasar Web
Fadlika Dita Nurjanto
Upgrading KOMINFO FTI
BEM FTI ITS 2013

3. 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
:
fadlikadn@gmail.com
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 

4. Be Carefull!
Rileks, Santai, Fokus

5. Apa itu WWW, Website??
Seberapa penting website untuk organisasi

6. 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

7. 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

8. web 1.0
web 1.0
teknologi awal website. server berperan sebagai pembari informasi,
client berperan sebagai pembaca. bahasa yang digunakan HTML
web 2.0
web 2.0
web 3.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.

9. 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
Jenis-jenis Website

10. Contoh Website
news
detiknews, kompas, BBC, reuters
social network
facebook, twitter, tumblr, wordpress, blogger
forum
kaskus, indowebster, detik forum
e-commerce
tokobagus, berniaga, zalora, bhinneka.com
search engine
google, bing, yahoo

11. Contoh Website (2)
Archive
Wikipedia, Google Groups, dll
Blog
Blogspot, Wordpress, Tumblr, dll
Corporate Website
Website ITS, BUMN, Perbankan, dll

12. Komponen Penyusun Website
web browser
database server
web server
web editor
image editor

13. Unsur-Unsur Website
.com, .org, .or.id, .co.id, .net
Domain
jagoanhosting, idwebhost, dll
http://................................. .com
Hosting
HTML, CSS,
Javascript
Hosting
HTML, CSS, HTML 5, CSS 3, jQuery
Desain & Scripting

14. Teknologi Web
HTML
CSS
Javascript
XML
CMS
WEBGL
PHP
HTML 5
JSON
CSS 3
ASP.NET
SQL

15. 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.

16. 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.

17. 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.

18. Relasi antara HTML dan CSS
HTML
CSS
fontcolor : white
backcolor : blue
textweight : bold
width : 100px
weight : 40px
font-family : calibri
element
width
height

19. 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

20. 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 websitewebsite 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.

21. 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.

22. Demo Wordpress

23. Referensi Belajar
W3Schools : http://www.w3schools.com
Wordpress : http://www.wordpress.org
IlmuKomputer : http://www.ilmukomputer.org
Dan banyak lagi..

24. Facebook : Fadlika Dita Nurjanto
Twitter
: @fadlikadn
Blog
: fadlikadn.wordpress.com
Sekian, Terima Kasih