The document outlines a two-day course on the fundamental concepts of web development and management, covering topics such as basic internet concepts, website creation using web page editors, and IP addressing principles. It includes detailed schedules for practical sessions on building websites, registering free domains, and understanding dynamic versus static websites. Additionally, the document provides insights into HTML coding, client-server models, and various internet protocols relevant to web technologies.

1. Konsep Pembangunan & Pengurusan Tapak & Laman WEB Oleh Ahmad Faizar Jaafar Unit Web & Digital Komponen Jabatan Pengurusan Sistem & Teknologi Maklumat (JPSTM) PTAR, UiTM http://faizar.atspace.com/courses.html http://faizaronestop.blogspot.com http://faizar.multiply.com

2. Konsep Pembangunan serta Pengurusan Tapak & Laman WEB Tahap : Asas Panjang Kursus : 2 hari Objektif Kursus Untuk mengetahui konsep-konsep asas pembanguan sesebuah tapak & laman web Menyediakan satu tapak & laman web dengan menggunakan aplikasi web page editor Menghantar web page yang telah siap ke laman web percuma

4. HARI PERTAMA 8.00 pagi Peserta Mengambil Tempat 8.30 pagi Bahagian Pertama -Pengenalan Internet & www 9.45 pagi Rehat 10.00 pagi Sambungan 12.00 t/hari Rehat 2.00 ptg Bahagian Kedua - Konsep tapak & laman web 3.00 ptg Rehat 3.15 ptg Sambungan 4.00 ptg Bersambung hari kedua Learn Discover

5. HARI KEDUA 8.00 pagi Peserta Mengambil Tempat 8.30 pagi Bahagian Ketiga - Membangunkan Laman Web 9.45 pagi Rehat 10.00 pagi Sambungan 12.00 t/hari Rehat 2.00 ptg Bahagian Keempat - Daftar laman web percuma 3.00 ptg Rehat 3.15 ptg Sambungan 4.00 ptg Tamat Experience

6. Overview Of Internet Classful IP Addressing Subnetting a Network Planning IP Addressing Assigning TCP/IP Addresses

7. Classful IP Addressing IP Addresses IP Address Classes

8. IP Addresses 192.168.1.0 192.168.3.0 192.168.1.100 192.168.2.101 192.168.2.100 192.168.3.100 192.168.2.0 Host ID Network ID 192.168.1.100 IP Address

9. IP Address Classes w x y z Class A Network ID Host ID Class B Network ID Host ID Class C Network ID Host ID

10. Subnetting a Network Subnets Subnet Masks Determining Local and Remote Hosts

11. Subnets Router Subnet 1 Subnet 2 1 2 Hub Hub

12. Subnet Masks IP Address Host ID Network ID 192.168. 2.200 Subnet Mask 255.255. 0.0 192.168. IP Address 10. 50.100.200 Subnet Mask 255. 0.0.0 Network ID 10. 0.0.0 IP Address 10.50. 100.200 Subnet Mask 255.255. 0.0 Network ID 10.50. 0.0 IP Address 10.50.100. 200 Subnet Mask 255.255.255. 0 Network ID 10.50.100. 0

13. Determining Local and Remote Hosts Example 1 1 192.168.1.100 Local Hosts 192.168.2.100 2 Router 255.255.0.0 Subnet Mask A B C D E F Example 2 1 192.168.1.100 2 Remote Hosts 192.168.2.100 Router 255.255.255.0 Subnet Mask A B C D E F

14. Lab A: Determining Class Addresses and Subnet Masks

15. Planning IP Addressing Addressing Guidelines Assigning Network IDs Assigning Host IDs

16. Addressing Guidelines The Host ID Cannot Be All Zeros The Host ID Cannot Be All 255s The First Number in the Network ID Cannot Be 127 The Host ID Must Be Unique to the Local Network ID

17. Assigning Network IDs 1 2 3 10. 0 . 0 . 0 192.168.2 . 0 172.16 . 0 . 0 Router

18. Assigning Host IDs 1 2 172.16. 0.12 172.16. 0.11 172.16. 0.10 10 .0.0.12 10 .0.0.11 10 .0.0.10 192.168.2 .11 192.168.2 .10 192.168.2. 1 10. 0.0.1 172.16. 0.1 3 10 . 0 . 0 . 0 192.168.2 . 0 172.16 . 0 . 0 Router

19. Lab B: Identifying Valid IP Addresses

20. Assigning TCP/IP Addresses Static IP Addressing Automatic IP Addressing Viewing TCP/IP Configuration Viewing TCP/IP Configuration Using Ipconfig

22. Static IP Addressing Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings. O btain an IP address automatically U s e the following IP address : IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: 192 . 168 . 1 . 200 192. 168 . 1 . 1 255 . 255 . 255. 0 Subnet mask : Default gateway: OK Cancel

23. Automatic IP Addressing Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings . O btain an IP address automatically U s e the following IP address: IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: Subnet mask : Default gateway : OK Cancel

24. Viewing TCP/IP Configuration Internet Protocol (TCP/IP) Properties General You can get IP settings assigned automatically if your network supports this capability. Otherwise, you need to ask your network administrator for the appropriate IP settings. O btain an IP address automatically U s e the following IP address: IP address: Us e the following DNS server addresses: P referred DNS server: Obtain DNS server address automatically Ad v anced... A lternate DNS server: 192 . 168 . 1 . 200 192. 168 . 1 . 1 255 . 255 . 255. 0 Subnet mask : Default gateway: OK Cancel

25. Viewing TCP/IP Configuration Using c:\>ipconfig Command Prompt Microsoft Windows 2000 [version 5.00.2195] (C) Copyright 1985-1999 Microsoft Corp. C:\>ipconfig Windows 2000 IP Configuration Ethernet adapter Local Area Connection: Connection-specific DNS Suffix . : IP Address. . . . . . . . . . . . : 192.168.1.200 Subnet Mask . . . . . . . . . . . : 255.255.255.0 Default Gateway . . . . . . . . . : 192.168.1.1 C:\>_

26. Lab C: Examining the Configuration of TCP/IP

27. Identifying Internet Concepts The Internet Internet Services Intranets Domain Naming

28. Overview Identifying Internet Concepts Using Client Technologies Connecting to the Internet Identifying Web Server Concepts

29. History of the Web History of the Web • Tim Berners- Lee “invented” the Web in 1990 writing the first Web server and browser. • Marc Andreesen exposed the Web to the masses with Mosaic the first GUI Web browser in 1993. • The rest is history... History Internet & WWW

30. Sejarah Internet & WWW http://www.netvalley.com/intval1.html

31. Bagaimana World Wide Web berfungsi WWW Server Methods to Use to Connect: Home user – Direct Modem Organization - LAN PC Browser Contoh: Internet Explorer

32. Lab B: Identifying Web Concepts

33. Review Identifying Internet Concepts Using Client Technologies Connecting to the Internet Identifying Web Server Concepts

34. Hypertext Markup Language < HTML> <HEAD> <TITLE>Sales Report</TITLE> </HEAD> <BODY> <H2>Q3 Sales by Region</H2> </BODY> </HTML> Hypertext Markup Language ( HTML )

35. Hypertext Markup Language Generally text is unformatted in your Web documents. However, to emphasize specific letters, words, or phrases you can use some text formatting options including boldfacing and italicizing. Depending on your browser, you may also be able to add underlining to emphasize characters. The following examples show the code for boldfacing and italicizing. <B> This is bold. </B> <STRONG> This is also bold. </STRONG> <I> This is italics. </I> <EM> This is also italics. </EM>

36. Heading Styles Heading styles are used to emphasize different levels of information in Web documents. Heading style level one (H1) is the largest. The phrase &quot;formatting basics&quot; at the top of this page is an example of heading one. Heading styles range from level one (the largest) to the level six (the smallest). In addition to the font size, heading styles also include boldfacing and/or italicizing and some paragraph spacing. Text Formatted as Heading Level with Code Sample <H1>Heading 1</H1> Heading 1 <H4>Heading 4</H4> Heading 4 <H2>Heading 2</H2> Heading 2 <H5>Heading 5</H5> Heading 5 <H3>Heading 3</H3> Heading 3 <H6>Heading 6</H6> Heading 5

37. Static Static vs Dynamic Web Site Static Web Site • HTML page content is same for each request • Change to content requires HTML page edit • No user interaction • No access to live data •“ Web Site”

38. Static Static vs Dynamic Web Site Dynamic Web Site • HTML pages dynamically enerated for each request • Content changes based on data, user login, etc. • Allows user interaction • Access to data real- time • “ Web Application”

39. Dynamic Web Sites • Web server • responds to HTTP requests and retrieves resources • Expand Web server capabilities by providing a gateway between it and external programs • Common Gateway Interface (CGI) • uses standard I/ O • new process for each request • slow and inefficient

40. Dynamic Web Sites cont. • NSAPI, ISAPI • Web Server API • runs in- process, making it faster than CGI • Java Servlets

41. The Internet Client Connection Using TCP/IP Protocol Server Text, Audio, Video, and Graphics Data Internet

42. Internet Services Electronic Mail (e-mail) World Wide Web (WWW) Chat Internet News File Transfer Protocol (FTP) Telnet Internet

43. Intranets Intranet Extranet Internet

44. Domain Naming Domain Name (istudent.uitm.edu.my) Top-level domain (edu) Second-level domain (uitm.edu) Subdomain (istudent.uitm.edu.my) edu istudent,.uitm.edu.my uitm.edu

45. Using Client Technologies Newsreaders Web Browsers Internet Protocols Uniform Resource Locator (URL)

46. Newsreaders msnews.microsoft.com - Outlook Express File Edit Tools Message Help New Post Reply Group Reply Forward Print Stop Send/Recv Addresses Find Newsgroups msnews.microsoft.com Folders msnews.microsoft.com Synchronization of Newsgroups on msnews.microsoft.com To change offline settings, first select a newsgroup, then click Settings Synchronize Account Newsgroups... Settings Newsgroup Unread Total microsoft.public.ddk.win2000.general (18) microsoft.public.ddk.win2000.network microsoft.public.ddk.win2000.setup (3) microsoft.public.win2000.accessibility microsoft.public.win2000.advancedserv microsoft.public.win2000.announcemen microsoft.public.win2000.app_deploy microsoft.public.win2000.applications microsoft.public.win2000.clusterservice microsoft.public.win2000.networking microsoft.public.win2000.outlook.expires microsoft.public.win2000.printing microsoft.public.win2000.radius microsoft.public.win2000.ras_routing microsoft.public.win2000.security microsoft.public.win2000.setup microsoft.public.win2000.setup.deploym microsoft.public.win2000.setup.upgrade microsoft.public.win2000.storage microsoft.public.win2000.system_admin microsoft.public.win2000.terminal_srv microsoft.public.win2000.terminal_srv_h microsoft.public.win2000.user_interface microsoft.public.ddk.win2000.general microsoft.public.ddk.win2000.network microsoft.public.ddk.win2000.setup microsoft.public.win2000.accessibility microsoft.public.win2000.advancedserver microsoft.public.win2000.announcements microsoft.public.win2000.applications microsoft.public.win2000.app_deploy microsoft.public.win2000.clusterservice microsoft.public.win2000.networking microsoft.public.win2000.outlook.express microsoft.public.win2000.printing microsoft.public.win2000.radius microsoft.public.win2000.ras_routing microsoft.public.win2000.security microsoft.public.win2000.setup microsoft.public.win2000.setup.deployment microsoft.public.win2000.setup.upgrade microsoft.public.win2000.storage microsoft.public.win2000.system_admin 18 5 3 6 13 8 6 15 2 2163 11 21 13 8 4 7 1 4 10 2 18 12 3 6 13 8 6 18 2 2164 14 21 13 8 4 10 5 4 10 2

47. Web Browsers Windows 2000 Server Overview - Microsoft Internet Explorer F ile E dit V iew F avorites T ools Help Back Search Favorites History Address http://www.microsoft.com/windows2000/server/overview/default.asp Go All products Support Search microsoft.com Guide Windows Home Pages Windows 2000 Home Page Product Guide Windows 2000 Platform Client Server Technical Library Upgrading to Window 2000 Beta Users IT Pros Developers Search for: Go Home Product Guide Windows 2000 Server Family Server Server Features System Requirements What Others are Saying Comparisons With the Windows® 2000 Server operating system, Microsoft has accomplished a goal rarely achieved in the software industry: delivered a product that is evolutionary and revolutionary at the same time. Evolutionary in that Windows 2000 builds on the great things about the Windows NT® Server 4.0 operating system. Revolutionary in that Windows 2000 Server sets a new standard for how well am operating system can be integrated with Web, application, networking, communication, and infrastructure services. For the first time, you have an easy choice to make about the next server operating system you deploy - whatever your needs. Continued Browse the features that make the Windows 2000 Server Family the leading solution for running more reliable and manageable file, print, intranet, communications, e-commerce, and infrastructure server. Find out what it takes to run Windows 2000 Server and Windows 2000 Advanced Server. Check out the buzz on Windows 2000 Server: reviews and commentary from technology journalists and industry analysts. See how Windows 2000 Server compares with other operating systems. Browser Contoh: Internet Explorer

48. Internet Protocols HTTP HTTPS FTP SMTP NNTP HTML DHTML Server Data Client Connection Using an Internet Protocol Internet

49. Uniform Resource Locator (URL) URL (http://example.microsoft.com/tutorial/default.html) Protocol used (http://) DNS address (example.microsoft.com) Path on the server (/tutorial/default.html) http:// example.microsoft.com / tutorial / default.html

50. Lab A: Accessing an FTP Site by Using Internet Explorer

51. Connecting to the Internet Network Address Translators (NATs) Proxy Servers Firewalls Microsoft Proxy Server

52. Network Address Translators (NATs) Internet 192.168.0.10 w1.x1.y1.z1 w2.x2.y2.z2 Web Browser NAT Web Server

53. Proxy Servers Proxy Server Authorized Web Site Restricted Web Site Internet LAN LAN LAN

54. Firewalls Firewall Authorized User Unauthorized User LAN LAN LAN Internet

55. Microsoft Proxy Server Microsoft Proxy Server Authorized User or Web Site Unauthorized User or Web Site LAN LAN LAN Internet

56. Defining a Web Server Microsoft Internet Information Services (IIS) Identifying Web Server Concepts

57. Defining a Web Server Web Server Client with Web Browser Network TCP/IP TCP/IP HTTP IP Address HTTP Internet Explorer

58. Microsoft Internet Information Services (IIS) Indexing Service Secure Sockets Layer Windows Media Services Additional Developer Support Active Server Pages VBScript and JavaScript support Remote administration Features of IIS IIS Internet

59. Big Picture

60. Keperluan host laman web Perkakasan / Hardware Ada beberapa jenama Perisian / Software Ada beberapa jenama http://www.serverwatch.com/stypes/ http://search.about.com/fullsearch.htm?terms=Internet%20%20HTTP%20%20web%20%20server

61. PHASE 1: DEFINING SITE GOALS

62. Asas Laman Web Berkualiti Apa Siapa Dimana Bagaimana Bila Temuramah

63. The Dream We will enable Web professionals to efficiently develop dynamic content and applications delivered on multiple devices. Display Deliver Develop Design

64. Macromedia Products Flash Player Shockwave Player Deliver Display Develop Design ColdFusion Server JRun Server Generator Spectra ColdFusion Studio UltraDev HomeSite JRun Studio Director Dreamweaver Fireworks Flash FreeHand Flash Player Shockwave Player

65. Perkara Yang Perlu Di Ambil Kira Gaya Laman Web Imbangan Grafik dan Teks Susun Atur Laman Web Jangka Masa Muat Turun Mengimbang Setiap Laman Web Konsisten dan Identiti Isu Hakcipta

66. Case Study Company’s Web Site Corporate Web Site Discover

67. Case Study

68. WYSIWYG What I See What I Get WYSIWYG (What You See Is What You Get) site building tool with an intuitive environment for building cross-platform sites.

69. Popular Tools Dreamweaver Net Object Fusion Front Page Express Home Site GoLive

70. Web Development Prep Purpose: Prepare material for web publishing http:// faizar.freehosting.net / Web Server Your PC Text Digitized pics URLs Build Web Site Publish Story board

71. Text Prepare in MS Word Save it using short meaningful file name in your web folder (unitone) http:// faizar.freehosting.net /

72. Graphics Digitize graphics - Digital Camera Prepare graphics - crop, size in Photoshop / Graphics program Save it as a jpg/gif file yourname.jpg Save in images folder http:// faizar.freehosting.net /

73. Linked Resources Write a short notation about the site Write the exact URL for the site http://faizar.atspace.com http:// faizar.freehosting.net /

74. Checkout the Samples Home Page Course Name TOC Samples - Portfolio Page / Tech Page Components of Culminating Product Samples - http:// faizar.freehosting.net /

75. Storyboard Humanities 101 TOC Syllabus Forum Resources Portfolio Home Page Portfolio TOC Intro Context Unit PD Goals Sample Work Analysis, Concl Next Steps Implementation Art Perspectives Pics Pics Intro Pics Context Unit.doc Pics Pics discuss.jpg Present.jpg http:// faizar.freehosting.net /

76. NEXT STEP Build Site Publish Site http:// faizar.freehosting.net /

77. HARI KEDUA 8.00 pagi Peserta Mengambil Tempat 8.30 pagi Bahagian Ketiga -Sambungan 9.45 pagi Rehat 10.00 pagi Bahagian Ketiga - Sambungan 12.00 t/hari Rehat 2.00 ptg Bahagian Keempat - Daftar laman web percuma 3.00 ptg Rehat 3.15 ptg Bahagian Keempat – Sambung Daftar laman web percuma 4.00 ptg Tamat http:// faizar.freehosting.net /

78. Buat Laman WEB http:// faizar.freehosting.net /

79. NEXT STEP Build Site Using Adobe Dreamweaver/ Microsoft Front Page/ Microsoft Microsoft Expression Web/Studio / Notepad / textedit and other web editing tools http:// faizar.freehosting.net / http://webdesign.about.com/od/windowshtmleditors/tp/windows-web-editing-suites.htm Experience

80. NEXT STEP Publish Site http://faizar.atspace.com http:// faizar.freehosting.net /

81. Daftar laman web percuma http:// faizar.freehosting.net / http:// www.atspace.com / http:// www.bravenet.com / http:// www.weebly.com / http:// faizar.freehosting.net /