1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: [email protected] spjeong@u Web:...

20
1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong @u ic.edu.hk Web: http :// u ic.edu.hk/~spjeong

Transcript of 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: [email protected] spjeong@u Web:...

Page 1: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

1

TESL 4340 – Basic web-publishing

Dr. Sunny Jeong Email: [email protected]: http://uic.edu.hk/~spjeong

Page 2: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

2

Introductory Stuff Have Fun! Please turn

off your phones!

DODO interact with me!

Page 3: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

3

Outline What is Web Publishing?

Web Publishing Tools and Applications

How to upload files Protocol as an interpreter in the net e-Book and Internet

Applications V.S. Contents

Page 4: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

4

What is Web Publishing? Web Publishing literally means 'to publish

content or information on the Internet‘

Content or information most commonly includes:

Words Pictures Music Video Downloadable content – PDF, Doc, .ZIP etc.

Page 5: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

5

Why Publish to the Web? Anyone publishing to the web does so to

serve a purpose, be it personal or professional

Web Publishing: ...is cost-effective (no print costs) ...is time-efficient (flexible deadlines) ...is expandable (add more when needed) ...is changeable (update or fix errors any time!)

Page 6: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

To Publish to the Web There are four main steps to take to publish

to the web: Plan -> Structure – What are you trying to convey? Content -> text, images, video, etc. Design –> colours, logos etc. Publish -> FTP & HTTP

Page 7: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

7

How to Publish to the Web

Page 8: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

8

An Introduction to HTML The most common file-type used to

present information on-line is HTML.

Other file-types commonly found on-line include:

PDF, MP3, JPG, GIF, PHP, CFM, ASP, HTM, PNG, AVI, SWF, ICO, ASPX and more

HTML stands for Hypertext Mark-up Language

Page 9: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

9

The HTML Code Every HTML file starts with '<html>' and

ends with '</html>'

There are then two main sections to the file:

<head> ... </head>

<body> ... </body>

At any point within the code we can (and should!) write comments, like so:

<!-- this is a comment – for code-view only! -->

<img src=…> tag?

Page 10: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

10

What is the Protocol? An agreed-upon format for transmitting

data between two different type devices. The problem of heterogeneity can be solved

by the protocol. Working as interpreters in an international

conference FTP HTTP TCP/IP …

Page 11: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

11

FTP Software File Transfer Protocol(FTP) We can upload the files using an

FTP program like Filezilla or FTPVoyager

Firefox also has a free FTP extension called FireFTP

We can upload many kinds of files such as pdf, doc, ppt…etc

The easiest ways is…

Page 12: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

12

Uploading multimedia file

Page 13: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

13

Uploading multimedia file

Embed tag allows to upload all kinds of multimedia files onto your webpage.

(mpg, mp3, mov, avi…)

<embed src=file_name.xxx height=00 width=00 …etc>

Page 14: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

14

Embed tag’s options Sample Result /Display

<embed src=“source" width="300" height="250" controls="playbutton" autostart="false">

1) Only play button

<embed src=" source" width="300" height="250" autostart="false">

2) Only play and stop

<embed src=" source " width="300" height="250" type="audio/x-pn-realaudio-plugin" controls="controlpanel" autostart="false">

3) Every buttons

<embed src="http://rewq.net/sto/simple/work/etc/wanted.wma" width="300" height="250" type="audio/x-pn-realaudio-plugin" controls="controlpanel" autostart="false" volume="-1">

4) Maximizing the volume

<embed src=" source " width="300" height="250" vspace="0" hspace="0" border="0" loop="100" showdisplay="0" showstatusbar="1">

5) Status button

<embed src="source" hidden="true" loop="-1"> 7) hiding player

Page 15: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

15

Multi media file and Codec A codec is a programme capable of

encoding and/or decoding a multi media stream file.

The word codec is a combination of 'compressor-decompressor‘

To enjoy the multimedia files, we need to install proper codecs an our computer machine.

Page 16: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

16

Codec problems You may face codec problems There are various multimedia codecs in

the Net But…not many users are ready Don’t post the newest multimedia format

file - your visitors will be frustrated Convert the newest multimedia file to

universal file format (i.e. avi -> mpeg)

Page 17: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

17

Converting codecs Mpeg4directmaker

Page 18: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

18

A new stream of web-publishing e-Book

Page 19: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

19

Various e-Book contents and applications

Applications VS Contents Which one is more important?

Page 20: 1 TESL 4340 – Basic web-publishing Dr. Sunny Jeong Email: spjeong@uic.edu.hk spjeong@u Web: spjeong

20

Summary HTML is a basic language in web

publishing. How to make html page and web

site Understanding protocol e-Book