Lie Notes (Lessons 5-8) - Web Development

LIE NOTES (LESSONS 5-8) Web 2.0 (Read-write interactive web): LESSON 5: THE WEB ↪ A platform that gives users the WORLD WIDE WEB possibility (liberty) to c...

LIE NOTES (LESSONS 5-8) Web 2.0 (Read-write interactive web): LESSON 5: THE WEB ↪ A platform that gives users the WORLD WIDE WEB possibility (liberty) to control their ↳ Information organized into Web data. pages containing text and graphic ↪ User-generated content and the images. read-write web. ↳ Larger collection of ↪ People are consuming as well as interconnected documents or contributing information through content. blogs or sites ↳ Contains hypertext links, or ↪ Dynamic Page: Allows user to highlighted keywords and images interact with the page; May be able that lead to related information. to comment or create a user WEBSITE account; Refers to the web pages ↳ Collection of linked Web pages that are affected by user input or that has a common theme or focus. preference. ↳ The Main page that all the pages ↪ Focused on the ability for people on a particular Web site are to collaborate and share organized around and link back to information online via social media, is called the site’s home page. blogging and Web-based SIR TIMOTHY JOHN BERNERS-LEE communities. ↳ Inventor of the World Wide Web Examples: ↳ English engineer and computer ↦ Social Networking: scientist - Internet-based social ↳ Professorial Fellow of Computer media sites to stay Science at the University of Oxford connected with friends, and a professor at the family, colleagues, Massachusetts Institute of customers, or clients. Technology - Examples: Facebook, DIFFERENT VERSIONS OF WEB: LinkedIn, Pinterest, Instagram, etc. Web 1.0 (Read Only Static ↦ Blogs: Web): - A discussion or ↪ Most read only web informational website ↪ Dividing the world wide web into published on the world usable directories wide web consisting of ↪ Web is use as “Information discrete, often informal Portal” diary-style text entries ↪ Started with the simple idea “put (posts). content together” - Examples: Wordpress, ⇨ Examples: Blogger, Tumbler, etc., - Mp3.com, Home Page, ↦ Wikis: Directories, Page Views, - Hypertext publication HTML/Portals, Yahoo!, collaboratively edited msn, AoI, Webvan, and managed by its own Google, Lycos, NBC, audience directly using Slashdot, Kozmo.com, a web browser. Rediff.com, etc., - Examples: Wikipedia, Disadvantages of Web 1.0 Commons, Wikispecies, ↪ Read only web Wiktionary, Wikinews, ↪ Limited user interaction Wikidata, MediaWiki, ↪ Lack of standards Wikivoyage, etc.,  ↦Video Sharing: ↪ Web of data - People upload and ↪ Changing the web into a share their video clips language that can be read and with the public at large categorized by the system rather or to invited guests. than humans. - Examples: Facebook, Tiktok, Youtube, Venmo, TYPES OF WEBSITES: Dailymotion, Instagram, ↳ Ecommerce Website Medium, Pinterest, Reddit, etc., ↳ Business Website ↪ Key Features of Web 2.0: ↳ Entertainment Website - Folksonomy – allows users to categorize and classify/arrange ↳ Portfolio Website information using freely chosen ↳ Media Website keywords (e.g., tagging). - Rich User Interface – content is ↳ Brochure Website dynamic and is responsive to user’s ↳ Nonprofit Website input. An example would be a website that shows local content. ↳ Educational Website - User Participation – the owner of ↳ Infopreneur Website website is not the only one who is able to put content. Others can ↳ Personal Website place a content on their own by ↳ WebPortal Website means of comments, reviews, and evaluation. ↳ Wiki or Community Forum - Long Tail – services are offered on demand rather than on a one- time purchase. This is synonymous to subscribing to a data plan that charges you for time you spent on Internet or a data plan that charges you for bandwidth you used. Web 3.0: (Read-write intelligent web): ↪ Suggested name by John Markoff of the New York Times for the third generation of the web. ↪ All the application on web or mobile will be upgraded with more features; It applies same principles as Web 2.0: two-way interaction. ↪ Web 3.0 will be more connected, open, and intelligent, with semantic web technologies, distributed databases, natural language processing, machine learning, machine reasoning and autonomous agents. ↪ Semantic Web - provides a framework that allows data to be shared and reuse to deliver web content specifically targeting the user. LESSON 6: THE INTERNET ↳ Domain Name System (DNS) – INTERNET: is the phonebook of internet. We ↳ “Network of Network” access information online through ↳ Largest computer network in the domain names. Example of DNS: world that connects billions of www.facebook.com, computer user. www.ssct.edu.ph, ↳ Comes from combination www.academia.edu between “interconnection” and ↳ Internet Service Provider (ISP) “network” – is an organization that provides NETWORK services for accessing, using, or ↳ Collection of computers and participating in the internet. devices connected via Two types of ISP: communication channels and National ISP – provided transmission media that allows to internet access to a specific share resources (hardware, geographic area. software, data, information) Regional ISP – business BRIEF HISTORY OF INTERNET that provides internet ↳ APPA: Advanced Research access in cities and towns Project Agency; January 2, 1969; nationwide. Example of ISP: started an experimental network. Sky Broadband, PLDT, ↳ 1982 ⎯ Internet started Converge ↳ 1986 ⎯ First “free net”; created TYPES OF SERVERS in Case Western Reserve ↳ Application Server – a program University; US government allowed in computer that provides the business agencies to connect to business logic for an application internet program. ↳ VINTON GRAY CERF ↳ Web Server – a computer FORMEMRS: American Internet program that serves requested pioneer; recognized as one of "the HTML pages or files. fathers of the Internet", sharing this ↳ Proxy Server – is a software that title with TCP/IP co-developer Bob acts as an intermediary between an Kahn. endpoint device, such as computer and another server from which a MAJOR COMPONENTS OF THE user is requesting. INTERNET ↳ Mail Server – is an application ↳ Server – is a computer program that receives incoming e-mail from that provides service to another local users and remote senders and computer program and its user. forward outgoing e-mail for delivery ↳ IP Address (Internet Protocol) – ↳ File Server – is a computer is a numerical label assigned to responsible for central storage and each device. This provides identity management of data files so that to a network device. another computer on the same ↳ Browser – is an application network can access them. program that provides a way to look ↳ Policy Server – is a security information on the web. Example of component of a policy – based browsers: Google chrome, safari, network that provides authorization internet explorer, opera, Mozilla  services and facilities tracking and LESSON 7: WEB DEVELOPMENT control of files. PROCESS USES OF INTERNET WEB DEVELOPMENT PROCESS: Look for information 1. Planning School works, jobs, and home 2. Development purposes 3. Testing Send and receive electronic mail 4. Publishing Video teleconferencing PLANNING PHASE Buy and sell product 1. Identify the requirements. Social networking 2. Make the budget. Watch & post videos 3. Identify the constraints Games 4. Finalize the website content and Take college courses scope. Monitor home while away DEVELOPMENT PHASE Financial transactions 1. Make the schedule Download music and movies 2. Identify the milestone INTERNET TERMS AND DEFINITION 3. Assign the task, person responsible, Bit - is a single digit in the binary start date, end date, status, and numbering system (base 2). For make comments example: 1 is a bit or 0 is a bit. TESTING PAHSE Byte - generally consists of eight Two main areas of testing: bits. 1. Technical: front-end coding Upload - To upload is to transfer data from your computer to another 2. Design: how well the content computer. appears, e.g. accessibility and Download - To download is to usability of the contents transfer data from another PUBLISHING PHASE computer to your computer. 1. Making your website accessible HTTP - is the acronym for online. Hypertext Transfer Protocol, the data communication standard of 2. File Transfer Protocol (FTP) - Cloud web pages. When a web page has Computing this prefix, the links, text, and 3. Web-based applications pictures should work correctly in a WEB HOSTING AND PUBLISHING web browser. Website Host – is a repository HTTPS - is the acronym for where all files and scripts of your Hypertext Transfer Protocol Secure. website are stored. This indicates that the web page has a special layer of encryption Things to consider: added to hide your personal a. Hosting space information and passwords from b. Bandwith others. c. Server Software Router or router-modem- d. Operating System combination- is the hardware device that acts as the traffic cop for network signals arriving at your home or business from your ISP. A router can be wired or wireless or both. PUBLISHING TO THE WEB WEB HOST PROVIDER Steps to consider for website 1. Web host provider – are service publication: provider of your website. 1. Testing the site offline; 2. Things to consider: 2. Registering a domain name for - Cost the site; - Space 3. Finding a web host provider; - Bandwith 4. Uploading the web data; - Technology 5. Testing the site online; - Support 6. Promoting the site; and LESSON 8: THE WEB USABILITY 7. Maintaining the site; WEB USABILITY SITE TESTING - The ease of using or browsing a Testing is done to check the website. following: IMPORTANCE OF WEB USABILITY: 1. Download and uploading of files 1. Allows users to easily find the and documents; information; 2. All hyperlinks and the 2. It can hold attention of the visitors; navigation are working properly; 3. It has advanced features; 3. The design of the webpages 4. It has highly interactive properties; and web content layout are in 5. The contents load quickly; order; WEB USABILITY STANDARDS 4. No errors in coding HTML, CSS, A. ACCESSIBILITY and Javascript. - All major pages are accessible DOMAIN NAMES AND WEB HOSTS from the Home Page. Domain Name or URL (Unified - The Home Page is accessible Resource Locator) – uniquely from all pages of the site. identifies the website’s web - Relevant information are address. searchable. Cyber-squatting – the act of - Content are understandable and registering a domain at a higher presented in a language that the price. Internet Corporation for target site visitor can understand. Assigned Names and Numbers B. FUNCTIONALITY (ICANN) - Functions are clearly labeled and STEPS TO REGISTER A DOMAIN NAME easily understood. 1. Identify desired domain name. - Supports end-user’s workflow. 2. Check the availability of the - Interactive feature support is the chose domain name. site information. 3. Check registration prices. C. INFORMATION AND CONTENT 4. Register the domain name. - The most relevant information is 5. Pay the domain name placed on the Home Page. registration. - The website has a clear 6. Get a confirmation message. information structure. - Information are placed in their proper categories. - Information is relevant and up-to- date.  - Content loads easily and is displayed properly. D. DESIGN - Design and layout are straightforward and consistent. - Pages have only the right amount of content. - There are minimal horizontal and vertical scrolling. - There are no unnecessary animation and audio files. - Background colors and images do not interfere with the readability of text. - Images used are relevant to – and support – text information.