Desain web
Upcoming SlideShare
Loading in...5
×
 

Desain web

on

  • 659 views

 

Statistics

Views

Total Views
659
Views on SlideShare
659
Embed Views
0

Actions

Likes
0
Downloads
8
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Desain web Desain web Presentation Transcript

  • 1. 2. 3. 4. Restu Rahayuningtyas Muhammad Harun R. Septiana Intan Wulandari Melda Kusuma Wardani (13130026) (13130028) (13130029) (13130030)
  • Web menurut para desainer: JASMADI & E-MEDIA SOLUSINDO Web adalah salah satu bagian dari website. Jika sebuah website ibarat buku, maka halaman web adalah halaman-halaman di dalamnya BOONE (THOMSON) Web adalah koleksi sumber informasi kaya grafis yang saling berhubungan satu sama lain dalam internet yang lebih besar YUHEFIZAR Web adalah suatu metode untuk menampilan informasi di internet, baik berupa teks, gambar, suara maupun video yang interaktif dan mempunyai kelebihan untuk menghubungkan (link) satu dokumen dengan dokumen lainnya (hypertext) yang dapat diakses melalui sebuah browser FERI INDAYUDHA Web adalah suatu program yang dapat emmuat film, gambar, suara, serta musik yang ditampilkan dalam internet
  • “world wide web” adalah sumber daya internet yang sangat populer dan dapat digunakan untuk memperoleh informasi atau bahkan melakukan transaksi pembelian barang. Web menggunakan HTTP (HyperText Transfer Protocol) yang berjalan pada TCP/IP dan ditulis dalam format HTML (HyperText Markup Languange).
  • HTML HTML (Hyper Text Markup Language) adalah sekumpulan simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser. Tag-tag tadi memberitahu browser bagaimana menampilkan halaman web dengan lengkap kepada pengguna. Tag-tag HTML selalu diawali dengan <x> dan diakhiri dengan </x> di mana x tag HTML b, I, u dsb.
  • PHP adalah bahasa server-side scripting yang didesain khusus untuk web. Pada halaman HTML anda dapat menempelkan(embed) kode PHP. Kode PHP dieksekusi di sisi server bukan di komputer klien. Dan hasil yang ditampilkan adalah kode HTML. PHP merupakan hasil kerja seorang bernama Rasmus Lerdorf pada 1995. Namun kemudian PHP berkembang dan tidak hanya merupakan proyek pribadi Rasmus. PHP ditulis ulang dan dengan banyak menambahkan fungsi-fungsi baru oleh Zeev Suraski dan Andi Gutmants (disingkat Zend) dan lahirlah PHP 3 pada 1998. PHP masih terus dikembangkan, pada tahun 2002 PHP hadir dengan versi ke 4. PHP 4 dilengkapi dengan Zend Engine dan mengalami banyak peningkatan performa. Dan yang paling akhir pada tahun 2005 PHP 5 hadir dengan dukungan Zend Engine 2. Banyak fitur baru khususnya pada OOP(Object Oriented Programming) dan XML.
  • MySQL adalah program relational database management system (RDMS) yang bersifat free dan open source. MySQL sangat cepat, gratis, mudah dikonfigurasi, mudah dipelajari dan tersedia source codenya. Itulah beberapa kelebihan utama dari MySQL dibanding RDMS komersial yang ada. MySQL menggunakan SQL (Structured Query Language) yang merupakan standar global dalam management dabatase.
  • Apache adalah HTTP web server yang bersifat free dan open source. Oleh karena itu penggunaannya biasanya dibarengkan dengan PHP dan MySQL. Denga apache, komputer kita seolah-olah menjadi sebuah server yang menangai request dari klien.
  • phpMyAdmin adalah kumpulan script PHP yang dijalankan pada browser yang fungsinya untuk administrasi database MySQL. Dengan menggunakan phpMyAdmin kita lebih mudah dalam melakukan manipulasi database karena phpMyAdmin menyediakan user interface yang baik.
  • Aplikasi (software) yang digunakan untuk membuat desain web • • • • • Macromedia dreamweaver Microsoft frontpage Adobe Photoshop Coreldraw Notepad
  • Macromedia Dreamweaver 8 Pengertian dari Macromedia Dreamweaver 8 ini adalah program aplikasi professional untuk mengedit HTML secara visual dan mengelola halaman sebuah situs. Program Aplikasi Macromedia Dreamweaver 8 menyertakan banyak perangkat yang berkaitan dengan pengkodean dan fitur seperti HTML, CSS, JavaScript, PHP, ASP, ColdFusion, dan XML.
  • Lembar Kerja Dreamweaver 8 Pada tampilan ini, kita akan dipandu dalam beberapa menu. 1. Insert Bar Insert bar merupakan tool yang digunakan untuk menyisipkan objek ke dalam dokumen web. Ada enam kelompok kategori yang digunakan untuk insert bar yaitu Common, Layout, Form, Text, HTML, dan Application yang masing-masing memiliki beberapa tool beserta kegunaannya. 2. Document Window Jendela kerja dokumen terdiri atas layar kerja serta fasilitasnya. Yang dimaksud dengan fasilitas adalah tool untuk mengatur layar kerja atau sering disebut Document Toolbar, antara lain Coding tool dan Zoom & Guide tool. Di samping Document Toolbar, tersedia fasilitas lain yaitu Tag Selection. 3. . Panel Groups Panel pada Macromedia Dreamweaver 8 merupakan suatu media yang berfungsi sebagai fasilisator. Kumpulan berbagai panel disebut Panel Groups, terletak pada sebelah kanan layar kerja. Panel-panel tersebut diantaranya CSS, Application, Tag Inspector, Files dan History yang masing-masing memiliki bagian dan fungsi .
  • Lanjutan…… 4. Property Inspector Property Inspector merupakan area kerja untuk mengatur dalam mengelola properti-properti seperti pada text, image, maupun tabel dalam suatu dokumen web. Cara kerja Property Inspector hanya dengan memasukkan nilai-nilai parameter yang sudah disediakan. Secara umum Property Inspector terdiri dari Page Property, Table Property, Image Property, dan Form Property. 5. Page Property Page Property berguna untuk mengatur properti halaman. Page Property Inspector juga menyediakan fasilitas Page Properties
  • Kelebihan 1. 2. Kemampuannya membuat halaman web yang terlihat konsisten. Adobe Dreamweaver sudah terinstall beberapa template yang elegan dan menarik. Tentunya ini memudahkan anda yang ingin belajar membuat sebuah web namun anda belum mampu membuat design web sendiri. Jika anda ingin membuat lebih dari 10 halaman web dengan didasarkan design template tertentu maka web anda akan memiliki gaya halaman web yang sama dan terlihat konsisten dari halaman perhalaman. Kemudahan dan efisiensi dalam penggunaan Program ini tidak hanya dirancang untuk anda yang sudah mahir dan mengerti bahasa pemrograma. Bagi anda yang belum mengerti bahasa pemrograman, anda bisa membuat halaman web dengan hanya cara mengklik atau drag and drop menggunakan mouse serta anda juga bisa melihat halaman html-nya selama proses desain berlangsung. Atau yang lebih dikenal dengan sebutan WYSIWYG (What You See Is What You Get).
  • Lanjutan…… Selain itu dreamweaver memiliki kemampuan memperlihatkan 3 proses yang berbeda, yaitu : • Code View : Berfungsi untuk hanya menampilkan script html saja. • Desain View : Berfungsi menampilkan kode-kode html yang anda tulis menjadi sebuah design/template yang nantinya akan ditampilkan di browser. • Split View : Berfungsi menampilkan gabungan antara Code View dan Desain View pada saat bersamaan.Jadi anda bisa langsung melihat perubahan pada saat anda mengubah htmlnya.
  • Lanjutan…. 3. 4. Mudah untuk mengupload melalui FTP Dreamweaver sudah dilengkapi dengan fitur FTP jadi setelah anda selesai membangun sebuah web, anda bisa langsung menguploadnya melalui FTP . FTP (singkatan dari File Transfer Protocol) adalah sebuah protokol Internet yang berjalan di dalam lapisan aplikasi yang merupakan standar untuk pentransferan berkas (file) komputer antar mesin-mesin dalam sebuah internetwork. Dapat dikustom Dreamweaver dapat disesuaikan dengan kebutuhan yang anda perlukan. Menu, tab, perintah, font dan warna semua kode dapat disesuaikan dengan preferensi pribadi. Hal ini dapat secara efektif memudahkan proses desain web. Selain itu dreamweaver didukung banyak plug-in yang membantu anda dalam proses desain.
  • Kekurangan 1. Harga Software yang Cukup Mahal. Mungkin salah satu kekurangan dari Dreamweaver ini adalah dari segi harga. Dreamweaver CS5 dibandrol oleh Adobe sekitar $399. Harga yang mungkin terjangkau oleh kalangan tertentu saja.
  • Ilustrasi FTP