Introduction to the Development of Personal Web Pages

Slides:



Advertisements
Similar presentations
HTML. The World Wide Web Protocols Addresses HTML.
Advertisements

A Basic Introduction to the WWW and HTML How the World Wide Web Works.
 To publish information for global distribution, one needs a universally understood language, a kind of publishing mother tongue that all computers may.
Web development  World Wide Web (web) is the Internet system for hypertext linking.  A hypertext document (web page) is an online document. It contains.
CIS101 Introduction to Computing Week 05. Agenda Your questions Exam next week - Excel Introduction to the Internet & HTML Online HTML Resources Using.
CIS101 Introduction to Computing Week 05. Agenda Your questions CIS101 Survey Introduction to the Internet & HTML Online HTML Resources Using the HTML.
CIS101 Introduction to Computing
Introduction to HTML 2006 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
Introduction to HTML 2006 INT197B. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
IST 221 Internet Concepts and Applications Internet, WWW and HTML 1.
Introduction to HTML 2004 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
HTML Introduction HTML
Chapter 2 Introduction to HTML5 Internet & World Wide Web How to Program, 5/e Copyright © Pearson, Inc All Rights Reserved.
CIS101 Introduction to Computing Week 06. Agenda Your questions Excel Exam during second hour Our status after the snow day Introduction to the Internet.
1 Introduction to Web Development. Web Basics The Web consists of computers on the Internet connected to each other in a specific way Used in all levels.
CS 299 – Web Programming and Design CS299: Web Programming and Design Instructor: Dr. Fang (Daisy) Tang.
_______________________________________________________________________________________________________________ E-Commerce: Fundamentals and Applications1.
Computer Science 101 Introduction to Web Pages. Origins of the Web Vannevar Bush (Memex, 1945) Ted Nelson (Xanadu, 1968) Doug Englebart and Alan Kay (
Introduction to Computers Section 8A. home How the Internet Works Anyone with access to the Internet can exchange text, data files, and programs with.
CP2022 Multimedia Internet Communication1 HTML and Hypertext The workings of the web Lecture 7.
NASRULLAH KHAN.  Lecturer : Nasrullah   Website :
Basic HTML Workshop By: Preeda Chunjongkolkul (Pete) Systems Librarian/Webmaster
Just Enough HTML How to Create Basic HTML Documents.
Introduction to World Wide Web Authoring © Directorate of Information Systems and Services University of Aberdeen, 1999 IT Training Workshop.
HTML ~ Web Design.
Chapter 13. Applets and HTML HTML Applets Computer Programming with JAVA.
CIS 250 Advanced Computer Applications Internet/WWW Review.
Lesson 7 – World Wide Web. What is the World Wide Web?  The content of the worldwide web is held on individual web pages gathered together to form websites.
1 John Magee 9 November 2012 CS120 Lecture 17: The World Wide Web and HTML Web Publishing.
CPSC 203 Introduction to Computers Lab 33 By Jie Gao.
Web Design (1) Terminology. Coding ‘languages’ (1) HTML - Hypertext Markup Language - describes the content of a web page CSS - Cascading Style Sheets.
Web Page Design Introduction. The ________________ is a large collection of pages stored on computers, or ______________ around the world. Hypertext ________.
Introduction to HTML. Today’s Discussion What is HTML ? What is HTML ? What is Web Page ? What is Web Page ? Web Server Web Server Web Browser Web Browser.
CPSC 203 Introduction to Computers Lab 66 By Jie Gao.
1 Chapter 01: Introduction by Tharith Sriv. This course covers the following topics:  Hypertext Markup Language (HTML)  Cascading Style Sheets  JavaScript.
Chapter 29 World Wide Web & Browsing World Wide Web (WWW) is a distributed hypermedia (hypertext & graphics) on-line repository of information that users.
CS 330 Class 2: Programming Plan for Today Recap from last time More UNIX Begin HTML (material from Chapters 5-8) –Tags and attributes –Hyperlinks Features.
NASRULLAH KHAN.  Lecturer : Nasrullah   Website :
Introduction to HTML UWWD. Agenda What do you need? What do you need? What are HTML, CSS, and tags? What are HTML, CSS, and tags? html, head, and body.
Department of Computer Science, Florida State University CGS 3066: Web Programming and Design Spring
Introduction to the World Wide Web & Internet CIS 101.
Web Design Terminology Unit 2 STEM. 1. Accessibility – a web page or site that address the users limitations or disabilities 2. Active server page (ASP)
The Internet Salihu Ibrahim Dasuki (PhD) CSC102 INTRODUCTION TO COMPUTER SCIENCE.
Web Page Design The Basics. The Web Page A document (file) created using the HTML scripting language. A document (file) created using the HTML scripting.
Web Page Programming Terms. Chapter 1 Objectives Describe Internet and Understand Key terms Describe World Wide Web and its Key terms Identify types and.
HTML PROJECT #1 Project 1 Introduction to HTML. HTML Project 1: Introduction to HTML 2 Project Objectives 1.Describe the Internet and its associated key.
4.01 How Web Pages Work.
CS299: Web Programming and Design Instructor: Dr. Fang (Daisy) Tang
Web Basics: HTML/CSS/JavaScript What are they?
4.01 How Web Pages Work.
Chapter 10: Web Basics.
WWW and HTTP King Fahd University of Petroleum & Minerals
CISC103 Web Development Basics: Web site:
Chapter 1 Introduction to HTML.
11 October Building a Web Site.
Sec (4.3) The World Wide Web.
Introduction to Computers
Project 1 Introduction to HTML.
Department of Computer Science, Florida State University
Internet Programming.
CISC103 Web Development Basics: Web site:
Web Design & Development
Introduction to HTML Simple facts yet crucial to beginning of study in fundamentals of web page design!
The Problems in Using Visual C and Homework #2 Assignment
Chapter 16 The World Wide Web.
Introduction to World Wide Web
INFS 230 L Internet Technology
4.01 How Web Pages Work.
Web Programming : Building Internet Applications Chris Bates CSE :
CGS 3066: Web Programming and Design Fall 2019
Presentation transcript:

Introduction to the Development of Personal Web Pages Speaker: Yao-Ting Huang Advisor: Kun-Mao Chao National Taiwan University Department of Computer Science & Information Engineering Algorithms and Computational Biology Lab. 2018/11/22

Introduction to Web Technologies World Wide Web (WWW) Integrate all the resources on the Internet and provide interfaces to be accessed through a Web browser. HyperText Markup Language (HTML) A kind of language that describes the components of a web page. Web server A kind of server that stores the resources (e.g., web pages) and can be accessed by the user. Web browser A kind of software that can download web pages from web server and display to the user (e.g., IE, Netscape). Uniform Resources Locator (URL) The address rule that describes the location of web resources. http://www.ntu.edu.tw/

Introduction to Web Technologies HyperText Transmission Protocol (HTTP) A network transmission protocol for the communication between the web server and web browser. Web browser Web server

The Tools You May Need FTP client: HTML editor: Telnet client: A kind of software for the connection to the FTP server. CuteFTP, LeapFTP, SmartFTP, etc. HTML editor: A kind of software for the development of web pages. FrontPage, Dreamwaver, etc. Telnet client: A text-mode software that can connect to a Telnet server. NetTerm, KKMAN, Windows Telnet, etc.

Introduction to HTML HTML is a kind of markup language It contains pairs of starting tags and end tags. Each tag may contain several attributes. <html> <head> <title>文件標題</title>  : </head> <body Text = “#808080”> </body> </html> The starting tag Header Body The end tag

Introduction to HTML HTML tag:<HTML>…</HTML> Declare the beginning and end of this document. Head tag:<HEAD>…</HEAD> The header part of this document. Title tag:<TITLE>…</TITLE> The title of this page which will be displayed on top-left of the browser. Body tag:<BODY>…</BODY> Attributes Background figure:BACKGROUND=” URL of the figure” Background color:BGCOLOR=”#RRGGBB”,R、G、B=0~F Text Color:TEXT=”#RRGGBB”,R、G、B=0~F HyperLink Color:LINK=”#RRGGBB”,R、G、B=0~F

Introduction to HTML <HTML> <HEAD><TITLE>我是標題</TITLE></HEAD> <BODY TEXT="#808080" LINK="#008000" VLINK="blue" ALINK="yellow"> <Center>This is a test!!<br> <a href=http://www.ntu.edu.tw>to my homepage</a> </Center> </BODY> </HTML>

Introduction to HTML <HTML> <BODY> <CENTER> <FONT SIZE="1">一號字</FONT><BR> <FONT SIZE ="2">二號字</FONT><BR> <FONT SIZE ="3">三號字</FONT><BR> <FONT SIZE ="4">四號字</FONT><BR> <FONT SIZE ="5">五號字</FONT><BR> <FONT SIZE ="6">六號字</FONT><BR> <FONT SIZE ="7">七號字</FONT><BR> </CENTER> </BODY> </HTML>

Introduction to HTML <HTML> <head> <title>表格練習</title> </head> <BODY> <TABLE BORDER=5> <TR><TH>標題一</TH><TH>標題二</TH></TR> <TR><TD>第一格</TD><TD>第二格</TD></TR> <TR><TD>第三格</TD><TD>第四格</TD></TR> </TABLE> </BODY> </HTML>

Other Functions Other HTML tags Other advanced techniques Marquee, Frame, etc. Other advanced techniques Cascading Style Sheet (CSS) Java script Java Applet Flash PHP, ASP, JSP, etc.

Requirement 1. At least 5 web pages. 2. Your major, name, student ID. 3. Your autobiography. 4. Your picture. 5. Your email. 6. At least 5 hyperlinks. The grading will depend on how much efforts you spend on it.

Where to Store Your Web Pages Please use the web service provided by the NTU computer center. For the details, please refer to http://ccms.ntu.edu.tw/~jsc/ntucc/homepage/student-homepage.html Your URL will be like http://homepage.ntu.edu.tw/~b90123456 You have to use an FTP client to upload your web pages to the web server. Use the suggested FTP clients: SmartFTP or CuteFTP Pro. The TAs will check your URL by deadline 10/20.

Important Stuff Please email to TA 莊竣捷 by deadline 10/20 Email address: chemeng@ntu.edu.tw The email should contain subject formatted as CME_HOMEWORK_StudentID e.g., my student ID is b90123456, the email subject should be “CME_HOMEWORK_b90123456” The email content should be in the following format. Otherwise, TA won’t be able to receive your email and demo. 姓名: 黃小明 學號: b90123456 網址: http://homepage.ntu.edu.tw/~b90123456

References Google is your best TA 網頁製作教學 HTML教學目錄 FrontPage 教學 http://www.google.com 網頁製作教學 http://content1.edu.tw/publish/jackson/material/593084/webpg1203/ HTML教學目錄 http://www.csie.nctu.edu.tw/~jglee/teacher/content.htm FrontPage 教學 http://www.twbts.com/frontpage/

Outline of the Following Lecture Introduction to the usage of FrontPage. Build a simple web page by FrontPage. Upload the web page to the web server via an FTP client.