web design miftahul huda digital signal processing laboratory [email protected] medayu selatan...
TRANSCRIPT
Web Design
Miftahul HudaDigital Signal Processing [email protected]://lecturer.eepis-its.eduMedayu Selatan XI/11 Surabaya
Web DesignContent:
Target : Develop your own personnel Web Site and upload all files to the free web hosting (Geocities, 100Webspace.net, co.cc, dll)
Topics: -Basic WEB Design-Introduction To HTML-CASCADING STYLE SHEETS-Photo editing using PhotoShop
Evaluation-Homework + Project (30%)-Mid Test (30%)-Final Test (30%)
Lecture Materials-http://lecturer.eepis-its.edu/~huda/PJJ
Web DesignTools Low-end web editorsCoffeCup HTML,
CuteHTML, etc
Higher-end web design software—e.g.,
DreamWeaverHighly flexibleMore difficult to use
MS FrontPageEasier to useAutomatic standard formattingBy default somewhat less sophisticated
Web DesignHow to build a Web site:
1. Open CuteHTML and type the following:
<html><head> <title>Robby's Page</title></head><body> This is a picture of my cat, Lou.<br /> <img src="cat.jpg“ /></body></html>
2. Save the file as test.html on your desktop.
3. Double-click the file’s icon on the desktop and, if you have a picture called cat.jpg, you should see a page similar to this one.
Thanks for joining!
Web DesignWhat is a web site?
• Text & GraphicsPrintable information available at user’s terminal
• Animation (Flash)
• Video & Sound
Web Design
Who is your audience?How do they expect to get it? How do you know?
Consider surveying your current visitors.
Take inventory:
• What information do you already have and what do you have to create?
• Graphics... create, steal, or borrow?
• How much information should you give? Any security issues?
Web DesignWeb Page Elements
• StructureThe arrangement of content
• NavigationThe means by which content may be found
• ContextThe connection between menu and content groupings
• ContentThe goal of Web browsing
Web DesignStructure• Layout is not just decorative – it can also
provide visual organization for your content.
Google News
http://10.252.13.90
Fairly simple structure
and easily understood
Web Design
Web Design
Web Design
Web Design
Web Design
Things you can’t control
• User's browser (type, version, plug-ins, etc.)• User's network speed • User's monitor • Browser window size • Image loading • Color • Fonts (type, size, character set)• ETC
Web DesignThings you can’t control
User’s Language
Getting Started
<HTML><HEAD><TITLE>Title goes here </TITLE><META name="description" content=""><META name="keywords" content=""><META name="generator" content="CuteHTML"></HEAD><BODY BGCOLOR="#FFFFFF" TEXT="#000000"
LINK="#0000FF" VLINK="#800080">Body goes here</BODY></HTML>
Make your own folder (your_name) and sub folder (gambar, dokumen, …)
Getting Started