1 / 49

WEB PROTOCOL GUIDELINES

WEB PROTOCOL GUIDELINES. 24. OCT. 2013 WEB AUTHORING SUBIN JIN(SOPHIA). INDEX. 0. PROTOCOL WEB PAGE HTML CSS TERMINOLOGY. 2013 WEB PROTOCOL GUIDELINES. PROTOCOL. _ CONCEPTUAL UNDERSTANDING. What is protocols?

meadow
Download Presentation

WEB PROTOCOL GUIDELINES

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. WEB PROTOCOLGUIDELINES 24. OCT. 2013 WEB AUTHORING SUBIN JIN(SOPHIA)

  2. INDEX 0. PROTOCOL WEB PAGE HTML CSS TERMINOLOGY

  3. 2013 WEB PROTOCOL GUIDELINES PROTOCOL _ CONCEPTUAL UNDERSTANDING What is protocols? Before we talk about web page construction, we need to know concept of web protocols. What is protocols? Why it is important? Because it means the standards, rules and accepted conventions. It is the start and the core of web. HTTP is Hyper Text Transfer Protocol, it is a protocol that are used on the Web. It is rules for delivered to the user of web, and it is a standard delivered from all of common web server to the clients. When a user request documents user want by the web browser, server change the document and web browser converted this document to the appropriate type again. And it become displayed to the user. So, it serves to transmitting files that contains web pages to user based on web protocols. 즉, In other words, when we communicate with Englishman, he can’t understand our words if we speak Korean. Likewise, people made standards that can communicate with all of webs. We called this standards a protocol, and when we communicate on the web, we can communicate to match web protocols.

  4. 2013 WEB PROTOCOL GUIDELINES PROTOCOL _ WORK HOW THE MIND WORKS User’s computer- Internet– Web server(Google, Yahoo, etc.) For example, we can see how the mind works when we write access to the google. • Enter http://www.google.co.uk in the address bar using a web browser. 2. Web browser request information to the google web server by the HTTP protocols. 3. Web server receive requests, and it send the answer to the computer. 4. Web browser received the HTTP protocol information represented by texts and pictures.

  5. 2013 WEB PROTOCOL GUIDELINES PROTOCOL _ CONTENT What’s in it? 사용자 컴퓨터 - 인터넷 망 - 웹서버(구글, 야후 등등의 웹서버) In the other words, You can see HTTP protocol is standards when you send a letter. The standards are as follows: Address and name, ZIP code of sender-> sending computer’sIP and information of web browser Address and name, ZIP code of receiver-> receiving computer’s address Letter’s information-> Request of sending computer Component of HTTP 1. Transfer time 2. My computerIP 3. Web serverIP 4. Method(get/post) 5. HTTP protocol version(1.0/1.1) 6. File format(flash, file data, etc.) 7. Reference(Previous web page address) 8. Language(Language type) 9. Encoding(Encoding type of Korean) 10. Information of web browser(IE6.0/Firefox1.0, etc.) 11. Cookies(Cookie values stored on my computer) 12. Real transfer content (id = iboss/ password=1234, etc.)

  6. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ WEB PAGE CONSTRUCTION STRUCTURE OF A WEB PAGE Web pages are now an essential part of people's lives and perform their jobs. More and more computer functions are now moving to web based applications and it is important that you are familiar with this technology. You can make some web sites using WYSIWYG editors such as Front Page and Dreamweaver. We are going to take a look at the code that these editors produce, and how to structure webpages with code. Open google page in any browser and click CTRL+U in Firefox / Chrome or View -> Page Source in Internet Explorer, you should have the webpage code in front of you. All web pages have the following basic structure: * HTML - specifies that this is a web page = Head - contains the title of the page with code and css includes = Body - displays the main page content Which can be represented in HTML code using the following Tags: <html> <head> <title>TITLE OF DOCUMENT</title> <style> CSS CONTENT </style> </head> <body> <b>CONTENT OF WEB, EXPRESS IN TAGS</b> </body> </html>

  7. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ WEB PAGE CONSTRUCTION TAGS Web pages are built out of tags. These tags define what is on the page and how it should be structured. There are two types of tags that you can use, and all tags should be written in lower case. You can see the first type, it has an opening tag <h1> something in the middle "A book About Computing" and a closing tag</h1>. This tells us that everything between these tags should be treated as a level one heading (h1). On line two you can see the second type of tag, there is no closing tag, the tag is entirely self contained. The <hr /> stands for a horizontal rule, a line across the page. Block-level tags Block tags allow you give a tag attributes such as padding and margin. This allows you to insert tags into various parts of a page. And rely on the other elements there to move to make space for it without worrying about overlap. <h1>A Book About Computing</h1> <hr />

  8. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ WEB PAGE CONSTRUCTION INLINE TAGS These don't take up any physical space on the page (they don't cause a new line) and can overlap each other. produces the following: HTML5 What I have been learning so far are the very basics of web design. If I like what I've been doing I better check out HTML5. HTML5 is starting to make websites fully interactive with the ability to quickly embed videos and interact with web pages. Over the next few years I'll increasingly see applications moving over to this new technology. <span></span> : Break the page into sections but it don’t create new lines. <strong></strong> : It makes text bold. <em></em> : It makes text itallic. <a></a> : It creates a link or an anchor. <a href=http://www.google.com> link </a> produces the following link. <img /> : It adds an image. <imgsrc =http://en.wikipedia.org/wiki/File:Googlelogo.png” />

  9. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ TEXT TEXT PROPERTIES Text is the bare contents in web page construct. On the structural aspect, text properties is inline type, block type, inline-block type. And, in physical side, it can adjust the scale, colour, movement and shadows of text using Cascading Style Sheet.

  10. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ TEXT TEXT PROPERTIES O : In all versions of the browser supports the property ★ : Only new versions of the browser supports the property X : Not supports ※ The default value of this property is shown in bold

  11. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ TEXT TEXT PROPERTIES

  12. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ FONTS IMPORTANCE OF FONTS In web design, font is most important part of web.Because it have a strong influence readability and visibility of web page. Readability of web page is relevant to typography, I have examples of serif and sans-serif. Information delivery capability of web depends on the use of fonts, and it is relevant to accessibility. Serif Serif is a small line attached to the end of a stroke in a letter or symbol. Times new Roman is a representative font of serif. Serif has highly readable typography, but it is not consistent for Web page design. Sans-Serif Sansmeans ‘None’ in French. In the other words, it doesn’t have serif, and it is used accuracy and rapidity. Helvetica is a representative font of sans-serif, Apple’s display design use sans-serif fonts.

  13. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ FONTS FONT PROPERTIES The font property sets all the font properties. The properties that can be set, are (in order): "font-style font-variant font-weight font-size/line-height font-family". The font-size and font-family value is required. If one of the other value are missing, the default values will be inserted. You can practice in this web site(http://www.w3schools.com/cssref/tryit.asp?filename=trycss_font)

  14. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ COLOUR COLOUR VALUES Colors are displayed combining RED, GREEN, and BLUE light. In CSS, color is defined using a hexadecimal notation for the combination of Red, Green, and Blue color values (RGB). The lowest value is 0 (hex 00). The highest value is 255(FF). The values are written as 3 double digit numbers, starting with a # sign. The combination of the Red, Green and Blue values from 0 to 255 give a total of more than 16 million different colors to display with (256 x 256 x 256). Most of modern monitors are capable of displaying at the least 16384 different colors.

  15. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ COLOUR WEB SAFE COLOUR Few years ago, when computers supported max 256 different colors, lists of 216 "Web Safe Colors" was suggested as a Web standard. Now, This is not important, since the most computers can display millions of different colors, but the choice is left to user. The 216 cross-browser color palette was create to ensure that the all computers would displayed the colors correctly when running a 256 color palette.

  16. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ IMAGES IMAGE FORMAT There are many kinds of image formats, but JPG(JPEG), PNG, GIF ismainly used on the web. Then, What is the difference between these three factors? And What is the characteristic of each format? The main characteristics of the three image formats briefly be summarized as follows. JPG (JPEG) • Lossy compression method. It isa way to reduce the amount of image by damaging the original. The more I resaved images, the quality of the image is steadily declining disadvantage.(Deepening a staircase phenomenon) Actually,it is the most widely used image format on the web. GIF • Lossless compression method. Image format is a lossless compression, but the color of the image can be stored in one is limited.But if images with more than 256 kinds of color like true color(24 bit)save as gif format, it is a loss occurs. PNG • Lossless compression method. Original images can be stored intact without any damage. It can give a transparent effect precisely by adjusting the concentration of images If you look at the quality of the image when used to store pictures, it is often used. Because, there’s no damage.

  17. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ IMAGES JPG(JPEG) The first, JPG format is lossy compression. It is way to remove information that difficult to identified in images. And, it is merge these areas(difficult to identified), so the file size is reduce. When you save image files, if you lowered the image quality or save again and again, image is badly broken. For reference, complex and unclear images can't identify the difference. But, simple and clear images is detected damage more easily. So, JPG is a specific format for simple and unclear images.. HIGH QUALITY LOW QUALITY

  18. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ IMAGES GIF GIF is the lossless compression method, but it save only 256 colors is expressed. It is different from JPG, PNG format that support 24 bit(16,777,216 colors). So, images carrying more than 256 colors information can lose quality. However, 256 colors that are saved as GIF format is not fixed. when I saved the image files, 256 colors are determine. After decide the most common 256 colors in image, it reconfigure and save a image file. similar color images aren't seriously damaged. GIF ORIGINAL But, images in various colors and contrasts aren't good for GIF format.

  19. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ IMAGES PNG BMP(984KB) PNG format is lossless compression method, it supported 24 bits colors and 8 bits alpha channel, 32 bit colors information. In other words, if we save a image as PNG format, the image is not damaged at all. Because, it is lossless compression method and supported all of colors. So, PNG format mainly used to save the original image. Let's compare PNG format to BMP format. BMP means the source of the image. PNG images is not original, but it reduce the capacity of the image without any damage. So PNG format image is smaller than BMP's. But it is still bigger than JPG format and GIF format. PNG format is inefficient in photographs. PNG(596KB)

  20. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ IMAGES The way to express path It is indicated by the folder where the document is written. IMG TAG <imgsrc = “file name or URL” > It means ‘image’ Image file name Real image address that stored in web If the images in subfolder Subfolder name/File name Command to load real image If the images in same folder File name The tag represented the images is denoted by img(acronym for image). Images have to defined as "THIS IS A IMAGE", because it doesn't represent text. It is the role of the image tag. The file path(URL) represents the address that contains the file. If the images posted on the web, URL is image's address on the web. And, if it is just file of the computer, it means file path. If the images in parentfolder ../File name When the image exist in same folder : filename(ex. image1.gif) When the image exist in subfolders : folder name/file name When the image exist in parent folder : ../filename

  21. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ TABLES TABLE TAG Table tag is used to make diagram on the HTML page. Diagram means frame divided into horizontal and vertical like excel sheet. If similar information is repeat, we can use table tag on the web. For example, class attendance, bank account transactions. In the past, table tag is used for layout of the web, and it used for make the gap. But it makes separation of code and design worse and more difficult to repair. Actually, table tag's processing speed is quiet slower than div tag. tr tr td td

  22. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ TABLES TABLE TAG PROPERTIES Application <table border="1" bordercolor="red"> <tr> <td colspan="2"></td><td></td> </tr><tr> <td rowspan="2"></td><td></td><td></td> </tr><tr> <td></td><td></td> </tr> </table>

  23. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ HYPERLINKS WHAT IS THE HYPERLINK, HYPERTEXT, HYPERMEDIA? Hyperlink means 'connection'. It is the core concept of hypertext. Hypertext means documents that linked to another documents. It is same as normal text documents, but it can be connected to another documents. Hypertext documents can connect to any type connection beyond the physical and logical space. In other words, it can be said new concept of the form of documents. If you use Hypertext documents, you can read the necessary data at any time. And, this connection method can be said the Hyperlink. Hyperlink plays a role in transfer to the document or file you want. But, in the internet, it can be access various media like text, sound, video, picture. So, it can be explained integration concepts. Connect

  24. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ HYPERLINKS ATTRIBUTES EXAMPLE <a href="http://www.google.co.uk">Visit Gooooogle!</a>

  25. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ METADATA CONCEPT OF METADATA Put simply, metadata is “DATA ABOUT DATA". It is not real data(video, audio, text, etc.), but it provide information about real data. It can be described in this picture. Digital Camera can store metadata in the image. These metadata provide information of sensitivity, type of camera, exposure information, Shooting date. It able to find the exact information about the image. So, we can search and manage more easier. If you use metadata, you can check data's type and information. so, you can find the images you want more faster. In the other words, metadata is text, but it able to express for various types media.

  26. 2013 WEB PROTOCOL GUIDELINES WEB PAGE _ METADATA METADATA TAG PROPERTY EXAMPLE <head> <meta name="description" content="Free Web tutorials"> <meta name="keywords" content="HTML,CSS,XML,JavaScript"> <meta name="author" content="Style References"> <meta charset="UTF-8"> </head>

  27. 2013 WEB PROTOCOL GUIDELINES HTML _ NATURE What is HTML? Uncomfortable, HTML is the abbreviation of "Hypertext Markup language". It is too long, but I have to mention it. Because "HyperText Markup Language" is most effective word to explain HTML. Hypertext means document systems that can be choose information you want. Analog book delivered information sequentially, but internet based on hypertext system provide information non-sequential. In the internet, you can get what you want in the various documents based on Connections. So, What is the 'Mark-up'? We can find answers in Web's history. At first, internet was comprised of text, because computer's performance was not good. But web has develped greatly, so developer have to express the webdesign more specifically. And, CSS and Javascript was developed, it helps designing the web. CSS express the phisical design and Javascript make web dynamically. When these language is working, it is connect to the HTML. So, HTML can be described a frame of the web. And, Mark-up can be explained "Making the frame". Hypertext Markup Language = The Language that markup the structure of Hypertext, This is HTML's Nature.

  28. 2013 WEB PROTOCOL GUIDELINES HTML _ FEATURES 1. There's no case-sensitive in tags. If you use capital letters, computer recognizes it same as lower case. 2. Filename extension is '.htm' or '.html'. You can use HTML filename extension either on '.htm' or '.html'. But .htm is different than .html. 3. Enter, Space bar, Tab does not apply to HTML. When you create some empty spaces, it will not apply to HTML sources. If you want to make some spaces, you should to use special character or tags that recognize the space. 4. You have to follow the order of tags. Most tags consists of a pair of couple, beginning tag and exit tag. You have to follow the order about beginning tag and exit tag. 5. It implement sequentially from beginning to end. HTML implement sequentially from beginning to end. In the other word, it implement the content of <head>, and next it implement the order of <body>. So, javascript and css define in <head>.

  29. 2013 WEB PROTOCOL GUIDELINES HTML _ HOW TO USE START TO HTML Step 1: Start Notepad Type[Start] - [All Programs] - [Accessories] - [Notepad]: Step 2: Edit Your HTML with Notepad Type your HTML code into your Notepad:

  30. 2013 WEB PROTOCOL GUIDELINES HTML _ HOW TO USE START TO HTML Step 3: Save Your HTML Select [Save as] in Notepad's file menu. When you save an HTML file, you can use either the .htm or the .html file extension. There is no difference, it is entirely up to you. Save the file in a folder that is easy to remember. Step 4: Run the HTML in Your Browser Start your web browser and open your html file from the File, Open menu, or just browse the folder and double-click your HTML file. The result should look much like this:

  31. 2013 WEB PROTOCOL GUIDELINES HTML _ HOW TO USE HTML BASIC HTML can be edited by using a professional HTML editor like this. Use method depends on HTML editor. This is basic coding of HTML. HTML’ basic structure is comprised of <header>, <body>. CSS style and metadata is in the <header>. And, basic structure and contents, information of the web is in <body>. <html> <head> <title>TITLE OF DOCUMENT</title> <style> CSS CONTENT </style> </head> <body> <b>CONTENT OF WEB, EXPRESS IN TAGS</b> </body> </html> Adobe Dreamweaver Microsoft Expression Web Microsoft Expression Web Coffee Cup HTML Editor

  32. 2013 WEB PROTOCOL GUIDELINES XHTML _ NATURE What is XHTML? * XHTML stands for EXtensibleHyperText Markup Language * XHTML is almost identical to HTML 4.01 * HTML is a stricter and cleaner version of HTML 4.01 * XHTML is HTML defined as an XML application * XHTML is supported by all major browsers. * XHTML is a W3C Recommendation Why we use XHTML? Many pages on the internet contain "bad" HTML. XML is a markup language where documents must be marked up correctly and "well-formed". Today's market consists of different browser technologies. Some browsers run on computers, and some browsers run on mobile phones or other small devices. Smaller devices often lack the resources or power to interpret a "bad" markup language. Therefore - by combine the strengths of HTML and XML, XHTML was developed. XHTML is HTML redesigned as XML. Extensible = Able to extend

  33. 2013 WEB PROTOCOL GUIDELINES XHTML _ FEATURES 1. <!DOCTYPE ....> is mandatory. AXHTML document must have XHTML DOCTYPE declaration. 6. Attribute values must be quoted. <table width=100%> (X) <table width="100%">(O) 2. XHTML elements must be properly nested. <b><i>This text is bold and italic</b></i> (X) <b><i>This text is bold and italic</i></b> (O) 7. Attribute minimization is forbidden. <input checked> <input readonly> <input disabled> <option selected> (X) <input checked="checked"> <input readonly="readonly"> <input disabled="disabled"> <option selected="selected"> (O) 3. Empty elements must also be closed. An image: <imgsrc="happy.gif" alt="Happy face"> (X) An image: <imgsrc="happy.gif" alt="Happy face" /> (O) 4. XHTML elements must be in lower case. <P>This is a paragraph</P> (X) <p>This is a paragraph</p> (O) 5. Attribute names must be in lower case. <table WIDTH="100%"> (X) <table width="100%“> (O)

  34. 2013 WEB PROTOCOL GUIDELINES XHTML _ FEATURES The Most Important Differences from HTML Document Structure • XHTML DOCTYPE is mandatory • The XML namespace attribute in <html> is mandatory • <html>, <head>, <title>, and <body> is mandatory XHTML Elements • XHTML elements must be properly nested • XHTML elements must always be closed • XHTML elements must be in lowercase • XHTML documents must have one root element XHTML Attributes • Attribute names must be in lower case • Attribute values must be quoted • Attribute minimization is forbidden

  35. 2013 WEB PROTOCOL GUIDELINES XHTML _ HOW TO USE HOW TO USE XHTML If you use XHTML, check the markup is valid and well-formed, as the specifications are strict than what you used to. Rather than building the web pages that work and look the way you want, using XHTML means a try to maintaining a high standard within your page structures. DOCTYPE code is most commonly format, and it is divided into Transitional form and Strict form. HTML 4.01 Transitional support tags that was in the past, and it support missing tags. HTML 4.01 strict applied HTML strictly. The best way to define DOCTYPE is using Strict form. It able to define all of the HTML tag properties by CSS. In the other words, if you write 'b{fontweight:normal;}, <b> does not see bold strokes. However, we have to use <embed> or non-standard tags because of the compatibility of web. So best document format that provides the best browser compatibility is XHTML 1.0 Transitional. XTML 1.1 STANDARD FORM <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko-KR"> <head> <title>TITLE OF DOCUMENT</title> </head> <body> </body> </html>

  36. 2013 WEB PROTOCOL GUIDELINES CSS _ NATURE What is CSS? = CSS stands for Cascading Style Sheets. = Styles define how to display HTML elements = Styles were added to HTML 4.0 to solve a problem = External Style Sheets can save a lot of work = External Style Sheets are stored in CSS files HTML was never intended to contain tags for formatting a document. HTML was intended to define the content of a document, like: When tags like <font>, and color attributes were added to the HTML 3.2 specification, it started a nightmare for web developers. Development of large web sites, where fonts and color information were added to every single page, became a long and expensive process. To solve this problem, the World Wide Web Consortium (W3C) created CSS. In HTML 4.0, all formatting could be removed from the HTML document, and stored in a separate CSS file. All browsers support CSS today. <p>I am sophia.</p>

  37. 2013 WEB PROTOCOL GUIDELINES CSS _ FEATURES 1. Rich style effect = It is possible to expression that not possible in HTML. = margin, border, padding, layout, etc. 2. Easy to use = It save information about visual effects in one place(CSS file), without distributed. = If you change the <h2> tag property to purple in all pages, 3. Cascading = Able to process the opposite regulation. = Able to apply again to another pages. = Able to redefine regulation that already defined. Able to change CSS for the blind people and elderly people. 4. Small file size = Gone meaningless elements like table tag for layout and font tag, etc. = File size becomes more smaller, and able to reduce the loading time. = More faster loading time, because it doesn't load the CSS that already loaded..

  38. 2013 WEB PROTOCOL GUIDELINES CSS _ HOW TO USE HOW TO INSERT CSS = External style sheet : The style sheet is ideal when the style is applied to many pages. With an external style sheet, you can change the look of an entire Web site by changing one file. Each page must link to the style sheet using the <link> tag. The <link> tag goes inside the head section. = Internal style sheet : An internal style sheet should be used when a single document has a unique style. You define internal styles in the head section of an HTML page, by using the <style> tag, like this = Inline style : To use inline styles you use the style attribute in the relevant tag. The style attribute can contain any CSS property.

  39. 2013 WEB PROTOCOL GUIDELINES CSS _ HOW TO USE CSS RULES = A CSS rule has two main parts: a selector, and one or more declarations: The selector is normally the HTML element you want to style. Each declaration consists of a property and a value. The property is the style attribute you want to change. Each property has a value. CSS EXAMPLES = A CSS declaration always ends with a semicolon, and declaration groups are surrounded by curly brackets: (1) In the case of Id selector (2) In the case of Class selector

  40. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ AUTHORING AUTHORING Web authoring is software that enables a user to develop Web content in a desktop publishing format. It is also used to describe the process of building a website from writing the HTML(Hypertext Markup Language) to the textual content of the pages. A web authoring package is a website development system which allows web pages to be visually created like a desktop publishing program. It can generate the HTML code needed for the pages and can switch back and forth between the HTML and the page layout. WEB-AUTHORING APPLICATION/TOOL A computer program used to create or maintain websites is often referred to as a ‘web-authoring tool’. Examples include: Macromedia Dreamweaver, Adobe Go-live Cyberstudio, Microsoft FrontPage, and BBEdit. Go-live Cyberstudio Microsoft Front-page BBEdit Adobe Dreamweaver

  41. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ AUTHORING NOTEPAD++ Notepad++ is a free software available on the internet for download. It is a text editor, similar to Microsoft Notepad. It includes many extra features that make it more appealing than Notepad. It has a tabbed screen system, colored text, and extra features specific to programming. All of these features were tested by the class in our usability test. GOOD USABILITY It is very useful tool when I make a simple website. Because it based on MS notepad, but some comfortable function was added it. Example, It have excellent visibility. Color and line feed helps me to concentrate coding. And, it able to write as various programming language, not only HTML or CSS. It’s very important strength about web authoring, because recently, Web authoring program is becoming more complex and varied. Notepad++ is optimized into the latest web authoring.

  42. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ SITES SITES A site is a related collection of World Wide Web (WWW) files that include a beginning file called the home page. It is hosted on at least one web server that able to connect via the internet or LAN. Web page expressed in the form of HTML/XHTML, but generally, it is document written in a string. Web pages are connected via HTTP, sometimes it provides security and Privacy to user using encryption over HTTPS. All Web sites which can be connected in officially are collectively make up the World Wide Web. TYPES of WEBSITES Websites can be divided into two broad categories - static and interactive. Some web sites are produced for personal use or entertainment. Many web sites do aim to make money, using one or more business models. There are many kinds of websites, each specializing in a particular type of content or use. A few such divisions might include, • Blog : Sites generally used to post online diaries which may include discussion forums. • Community site : A site where persons with similar interests communicate with each other. • e-commerce : A site offering goods and services for online sale and enabling online transactions for such sales. • Government Site : A website made by the local, state, department or national government of a country. • News site : Similar to an information site, but dedicated to dispensing news, politics, and commentary. • Social networking site : site where users could communicate with one another and share media. • Wiki site : A site which users collaboratively edit its content.

  43. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ SITES EXAMPLE • UK Government Site : https://www.gov.uk/ : In government site’s url is always ends in gov.uk. ‘gov’ means government. 2. E-Commercial Site : http://www.ebay.co.uk/ : It buy and sell the things using internet.

  44. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ SITES EXAMPLE 3. Blog Site : https://www.wordpress.org : It helps people to make personal website. People can choose color and style, so they make their own web page. 4. Information Site : http://en.wikipedia.org/wiki/Main_Page : It give information about things you want. It’s very useful and It usually called ‘dictionary’.

  45. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ UPLOADING UPLOADING Uploading is the transmission of a file from one computer system to another, usually larger computer system. From a network user's point-of-view, to upload a file is to send it to another computer that is set up to receive it. People who share images with others on Facebook upload files to the Facebook. And transmission in the other direction is downloading - from one, usually larger computer to another, usually smaller computer. From an Internet user's point-of-view, downloading is receiving a file from another computer. When you send or receive an attached file with an e-mail note, this is just an attachment, not a download or an upload. However, many people use "upload" to mean "send" and "download" to mean receive. The term is used loosely in practice and if someone says to you "Download (or upload) such--and-such a file to me" via e-mail, they simply mean "Send it to me.“ In short, from the ordinary workstation or small computer user's point-of-view, to upload is to send a file and to download is to receive a file.

  46. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ UPLOADING EXAMPLE Everyday, I upload my daily report on the school website. I can explain about upload concept using my experience. It saved in server(I don’t know where sever is) In Korea, Teachers can find my file on server. In the UK, I upload my daily report file. In short, upload is save files on server, and download means get the file on server. In the server, people can exchange files anywhere.

  47. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ FTP FTP The File Transfer Protocol is the Internet facility for downloading and uploading files. It is a standard Internet protocol for transmitting files between computers on the Internet. Like the Hypertext Transfer Protocol (HTTP), which transfers displayable Web pages and related files, and the Simple Mail Transfer Protocol (SMTP), which transfers e-mail, FTP is an application protocol that uses the Internet's TCP/IP protocols. FTP is commonly used to transfer Web page files from their creator to the computer that acts as their server for everyone on the Internet. It's also commonly used to download programs and other files to your computer from other servers.

  48. 2013 WEB PROTOCOL GUIDELINES TERMINOLOGY _ FTP FTP Commander Pro It is FTP client for Windows. This program is developed by Internetsoft Corporation. FTP Commander is simple and easy to use ftp client. It's really the bare minimum with no extra frills or thrills. It offers a no-nonsense interface consisting of two side-by-side local computer and FTP server panels. The latter contains a list of about a dozen pre-set FTP servers. It's easy as pie to establish a connection. All you have to do is select the server you want on the list and push the Connect button.

  49. WEB PROTOCOL GUIDELINES WEDESIGNYOU 2013 SUBIN JIN

More Related