Web Design for Business PDF

WEB DESIGN FOR BUSINESS By: bnc_clr LESSON 1 - THE INTERNET INTERNET The interconnection of computers on a global scale. It is the biggest network in the world today, connecting computers from all over the world. INTERNET SERVICE PROVIDER (ISP) Provides internet connection EXP...

WEB DESIGN FOR BUSINESS By: bnc_clr LESSON 1 - THE INTERNET INTERNET The interconnection of computers on a global scale. It is the biggest network in the world today, connecting computers from all over the world. INTERNET SERVICE PROVIDER (ISP) Provides internet connection EXP: PLDT DSL, Globe, Smart Bro, Converge WORLD WIDE WEB (WWW) The infrastructure or application to support email, and peer-to-peer networks for file sharing and telephony. WEB SITE Collections of web pages connected with each other through hyperlinks. WEB PAGES Are simply text documents. These text documents are written in Hypertext Markup Language or HTML for short. With HTML web pages can display text, images, and videos. Web pages can also play sound and call on programs to run applications, games, animations, and so on. WEB BROWSERS Are applications or software that allows us to see web sites. A web browser simply interprets the HTML document (e.g. the web page)and displays the content as specified in the HTML document. EXP: Internet Explorer, Mozilla Firefox, Opera, Safari, Google Chrome, Konqueror, Arora, Dillo, K-Meleon, Lynx, Kazekhase, Amaya, NetPositive, Planetweb, Netscape Navigates. WEB ADDRESSES Web sites and the pages they contain each have a unique worldwide address. This address (or Uniform Resource Locator, URL, in Internet jargon). The address for Microsoft is www.microsoft.com. For most sites, this is all you need to specify and it defaults to the main page (or home page) for the site. In some cases, you may also need or want to specify the path and file name such as www.microsoft.com/office2016. Note the extension.com after microsoft. There are six extensions that help to divide the computers on the Internet into understandable groups or domains. 6 DOMAINS: 1..com = Commercial 2..gov = Government 3..edu = Education 4..org = Organizations 5..net = Networks 6..mil = Military EXTENSIONS FOR SITES OUTSIDE OF THE U.S.: 1..jp = Japan 2..uk = United Kingdom  3..fr = France 4..ph = Philippines 5..sg = Singapore HOW TO SEARCH THE WEB? There are basically 3 Major Search Services available for handling different tasks: 1. DIRECTORIES Sites that like a gigantic phone book, provide a listing of the sites on the web. Sites are typically categorized, and you can search by descriptive keywords. Directories do not include all the sites on the web, but generally include all of the major sites and companies. Yahoo is a great directory. 2. SEARCH ENGINES Read the entire text of all sites on the web and create an index based on the occurrence of key words for each site. AltaVista and Infoseek are powerful search engines. 3. META SEARCH ENGINES Submit your query to both directory and search engines. Metacrawler is a popular meta search engine. DOWNLOADING SOFTWARE In addition to serving Web pages to your browser, the Web also provides opportunities to easily download programs and files. 1. BROWSER EXTENSIONS Both Netscape Navigator and Microsoft Internet Explorer browsers provide the ability to extend the functionality of your browser by downloading additional programs that work within the browser. Navigator calls such programs "Plug-Ins" and you can find a collection of these at www.netscape.com/plugins. Microsoft calls them "ActiveX Controls" and can be found at www.activex.com. 2. FILE COMPRESSION Most files are compressed to make them smaller in size and faster to download. You will need to know how it was compressed and have the corresponding decompression program to view the file (most decompression programs are available as shareware). There are different compression programs for different computers, but the most common for the PC include WinZip and PKZIP (files end in.zip), and for the Mac, BinHex (.hqx) and Stuffit (.sit). 3. WEB MULTIMEDIA The Web is rapidly evolving from primarily text-based documents to multimedia experience of sight, sound and motion which rival CD-ROM titles. There are a number of new multimedia technologies and browser add-ins that can enhance your Web surfing. 4. AUDIO Hear live broadcasts, sample songs from your favorite bands, or even use the Web to have two-way "web phone" conversations. Some good sites to start include: Real Audio at www.realaudio.com Web Phone at www.webphone.com 5. VIDEO Participate in a live video-conference or see the latest movie clips. ○ RealVideo at www.realnetworks.com ○ CU-SeeMe at www.whitepine.com 6. 3D  Manipulate three dimensional objects and experience virtual reality on the Web. ○ VRML at www.vrml.sgi.com 7. ANIMATION Interact with some of the most engaging and entertaining sites on the web. ○ Macromedia Shockwave at www.macromedia.com ○ Narrative Enliven at www.narrative.com 8. ELECTRONIC MAIL Often abbreviated as email, e.mail or e-mail, is a method of exchanging digital messages. E-mail systems are based on a store-and-forward model in which e- mail computer server systems accept, forward, deliver and store messages on behalf of users, who only need to connect to the e-mail infrastructure, typically an e-mail server, with a network-enabled device (e.g., a personal computer) for the duration of message submission or retrieval. Originally, e-mail was always transmitted directly from one user's device to another's; nowadays this is rarely the case. An electronic mail message consists of two components, the message header, and the message body, which is the email's content. The message header contains control information, including, minimally, an originator's email address and one or more recipient addresses. Usually additional information is added, such as a subject header field. Originally a text-only communications medium, email was extended to carry multi- media content attachments, which were standardized in with RFC 2045 through RFC 2049, collectively called Multipurpose Internet Mail Extensions (MIME). Internet e-mail messages consist of two major sections: ○ Header — structured into fields such as summary, sender, receiver, and other information about the e-mail. ○ Body — the message itself as unstructured text; sometimes containing a signature block at the end. This is exactly the same as the body of a regular letter. The header is separated from the body by a blank line 9. MESSAGE HEADER Each message has exactly one header, which is structured into fields. Each field has a name and a value. RFC 5322 specifies the precise syntax. Informally, each line of text in the header that begins with a printable character begins a separate field. The field name starts in the first character of the line and ends before the separator character ":". The separator is then followed by the field value (the "body" of the field). The value is continued onto subsequent lines if those lines have a space or tab as their first character. Field names and values are restricted to 7-bit ASCII characters. Non-ASCII values may be represented using MIME encoded words. 10. HEADER FIELDS The message header should include at least the following fields: ○ From: The e-mail address, and optionally the name of the author(s). In many e-mail clients not changeable except through changing account ○ To: The e-mail address(es), and optionally name(s) of the message's recipient(s). Indicates primary recipients (multiple allowed), for secondary recipients see Cc: and Bcc: below. ○ Subject: A brief summary of the topic of the message. ○ Date: The local time and date when the message was written. Like the From: field, many email clients fill this in automatically when sending. The  recipient's client may then display the time in the format and time zone local to her. ○ Message-ID: Also an automatically generated field; used to prevent multiple delivery and for reference in In-Reply-To: (see below). ○ Note that the "To:" field is not necessarily related to the addresses to which the message is delivered. The actual delivery list is supplied separately to the transport protocol, SMTP, which may or may not originally have been extracted from the header content. NOTE: The "To:" field is similar to the addressing at the top of a conventional letter which is delivered according to the address on the outer envelope. Also note that the "From:" field does not have to be the real part of the e-mail message. One reason is that it is very easy to fake the "From:" field and let a message seem to be from any mail address. It is possible to digitally sign e-mail, which is much harder to fake, but such signatures require extra programming and often external programs to verify. Some Internet service providers do not relay e-mail claiming to come from a domain not hosted by them, but very few (if any) check to make sure that the person or even e-mail address named in the "From:" field is the one associated with the connection. Some Internet service providers apply e-mail authentication systems to e-mail being sent through their MTA to allow other MTAs to detect forged spam that might appear to come from them. RFC 3864 describes registration procedures for message header fields at the IANA; it provides for permanent and provisional message header field names, including also fields defined for MIME, netnews, and http, and referencing relevant RFCs. Common header fields for email include: ○ Bcc: Blind Carbon Copy; addresses added to the SMTP delivery list but not (usually) listed in the message data, remaining invisible to other recipients. ○ Cc: Carbon copy; Many e-mail clients will mark e-mail in your inbox differently depending on whether you are in the To: or Cc: list. ○ Content-Type: Information about how the message is to be displayed, usually a MIME type. ○ In-Reply-To: Message-ID of the message that this is a reply to. Used to link related messages together. ○ Precedence: commonly with values "bulk", "junk", or "list"; used to indicate that automated "vacation" or "out of office" responses should not be returned for this mail, eg. to prevent vacation notices from being sent to all other subscribers of a mailing list. ○ Received: Tracking information generated by mail servers that have previously handled a message, in reverse order (last handler first). ○ References: Message-ID of the message that this is a reply to, and the message-id of the message the previous was reply to, etc. ○ Reply-To: Address that should be used to reply to the message. ○ Sender: Address of the actual sender acting on behalf of the author listed in the From: field (secretary, list manager, etc.). 11. PING Is a computer network administration utility used to test the reachability of a host on an Internet Protocol (IP) network and to measure the round-trip time for messages sent from the originating host to a destination computer. The name comes from active sonar terminology which sends a pulse of sound and listens for the echo to detect objects underwater. LESSON 2 - DATA COMMUNICATION & NETWORKING DATA COMMUNICATION: DATA TRANSMISSION/ DIGITAL TRANSMISSION/ DIGITAL COMMUNICATIONS Is the physical transfer of data (a digital bit stream) over a point-to-point or point-to-multipoint communication channel. EXMP: Copper wires, optical fibers, wireless communication channels, storage media, and computer buses. The data are represented as an electromagnetic signal such as an electric voltage, radio wave, microwave, or infrared signal. ANALOG TRANSMISSION Is the transfer of a continuously varying analog signal. DIGITAL COMMUNICATIONS Is the transfer of discrete messages. BASEBAND TRANSMISSION The messages are either represented by a sequence of pulses by means of a line code. PASSBAND TRANSMISSION A limited set of continuously varying waveforms using a digital modulation method. DETECTION The passband modulation and corresponding demodulation carried out by modem equipment. NOTES: According to the most common definition of digital signal, both baseband and passband signals representing bit-streams are considered the baseband signal as digital and passband transmission of digital data as a form of digital-to-analog transmission. Data transmitted may be digital messages originating from a data source, for example a Computer or a Keyboard. It may also be an analog signal such as a Phone call or Video signal digitized into a bit-stream for example using Pulse-Code Modulation (PCM) or more advanced source coding (Analog-to-Digital Conversion and Data Compression) schemes. This source coding and decoding is carried out by Codec Equipment. 5 BASIC COMPONENTS OF DATA COMMUNICATION: 1. Data Source - Where the data originates. 2. Transmitter - Device used to transmit data. 3. Transmission Medium - Cables or Non-cable. 4. Receiver - Device used to receive data. 5. Destination - Where the data will be placed. ➔ TRANSMISSION MEDIA SPEED 1. Bandwidth - The amount of data which can be transmitted on a medium over a fixed amount of time (second). It is measured on Bits per Second or Baud. 2. Bits per Second (bps) - A measure of transmission speed. The number of bits (0 or 1) which can be transmitted in a second. 3. Packets - Transmissions are broken up into smaller units or data transmission called packets. - EX: (1) A data file is divided into packets. (2) It doesn't matter what the transmission is. It could be Word document, a PowerPoint or an MP3  ➔ TRANSMISSION DIRECTION 1. Simplex Transmission - One direction only. 2. Half Duplex Transmission - Both directions but only one direction at a time. 3. Full Duplex Transmission - Send and receive both directions at once. EXAMPLES OF COMMUNICATION SYSTEMS: E-mail Voice Mail Fax Smart Phone Instant Messaging Telecommuting Video-conferencing Groupware Telephony E-commerce The Internet The Web Global Positioning System ETHERNET Developed at Xerox in 1976. First protocol approved as an industry standard protocol 1983. LAN protocol used on bus and star. Most popular LAN protocol Inexpensive TCP/IP Developed in 1973 for use on the ARPANET which was a defense force research network. Adopted in 1983 as the internet standard. All hosts on the Internet are required to use TCP/IP. Allows transfer of data using packet switching. LAN vs WAN LAN - “Local Area Network” which is a network confined to a small geographic area which is a building or a group of buildings. EX: Ring, Bus, Star WAN - “Wide Area Network” which is a network spread over a large geographic area. The largest WAN is the Internet. NETWORK A number of computers and peripheral devices connected together so as to be able to communicate (i.e. transfer data. Each device in a network is called a node. Terminals are data entry points which can also display. INTERNET, INTRANET, EXTRANET 1. Internet Public/international network, which is used to access information, e-shopping, e-banking, email. 2. Intranet Private networks (LAN or WAN) used to share resources in a secure environment. Uses web pages (HTML to view) TCP/IP protocols (to make connection) 3. Extranet Intranet that has been extended to include access to or from selected external organizations such as customers, but not the general public. Note: Connections via leased lines, or network interconnections. TRANSMISSION MEDIA Twisted pair - Telephone cable Coaxial cable - Thick black cable used for higher bandwidth communications than twisted pair (i.e. Optus cable) Fibre optic - Data transferred through pulses of light. Extremely fast. Non cable - Methods such as Satellite, Microwave, Wireless, and Bluetooth. NETWORK HARDWARE 1. Servers Help to manage the network and the resources of that network. On larger networks servers commonly have specialized tasks such as: ○ File Servers stores and manages files. ○ Print Servers manages printers and print jobs. ○ Mail Server manages email. ○ Web Server manages web access. 2. Routers Connects multiple networks and are protocol independent. Can be used in place of a switch or bridge. 3. Switches Smart hubs which transmit packets to the destination port only. 4. Hubs Like double adapters/power boards in the home except instead of plugging in extension cords we are plugging in computers to allow them to communicate. NETWORKING What is a Computer Network? A system containing any combination of computers, computer terminals. Printers, audio, or visual display devices, or telephones interconnected by telecommunication equipment or cables: used to transmit or receive information. Network Diagram Basic Layout and map of a traditional computer network. Network Types Computer networks vary in shape and size depending on usage. The Three types of Networks: 1. WAN A Wide Area Network exists over a large area. Data travels through telephone or cable lines. Usually requires a Modem The world’s largest Wide Area Network on the Internet. 2. LAN A Local Area Network spans a relatively small area LAN are usually confined to one building or a group of buildings. Data travel between network devices via network cables. The most common type of Local Area Network is called Ethernet. 3. Peer to Peer Usually very small networks. Each workstation has equivalent capabilities and responsibilities that do not require a switch or a hub. These types of networks do not perform well under heavy data loads. Fiber Optic Cable One of the latest innovations ub network cabling. Switches and Hubs The central device within a network that transmits data.  Servers The central storage device for the names and locations of various data. IP Addresses. Topologies The layouts of various network designs. Star Bus Ring Firewalls The network software that keeps destructive forces from a network. Routers The device that lets messages flow between networks. Wireless Networks Allows computers to be moved without wires or cables. The Internet The World’s largest network. Fiber Optic Reduces interference in the network. Transmit data faster than copper network cable. Allows for more bandwidth. Smaller and more fragile than copper cable. Network Switches Data travels faster through switches because data is not sequenced as it is in a hub. Information travels more efficiently through a switch because it travels directly to its destination as opposed to being broadcast to all PC’s on the network hub. Users are connected to certain servers which will fulfill the required request. 3 Principle Types of Servers: 1. Print Servers Contains the name and location of all printers that are on the Network. 2. File Servers Contain the location and names of the various drives, files, and folders on a network. 3. Web Servers Contain the Programs, Files, and Internet Web Sites. IP ADDRESSES Internet Protocol Serve as the location of websites on the Internet as well as the workstations that are connected to the web. Made up of four sets of numbers called “Octets”. There are two types of IP Addresses; Static and Temporary. STATIC IP ADDRESSES TEMPORARY ID ADDRESSES Found only on servers and remain the Found only on PC’s are constantly same. changing each time it is logged on. A Domain Name Server assigns a Are assigned by an ISP (Internet “human readable” web address to Service Provider) each time it is each static IP address to make it more logged on to the Internet. user friendly. NETWORK TOPOLOGY Refers to the shape of a network, or the network’s layout. How different nodes in a network are connected to each other and how they communicate are determined by the network’s topology. There are three basic topologies: 1. Star Topology All devices are connected to a central hub. Nodes communicate across the network by passing data through the hub or switch. 2. Ring Topology All devices are connected to one another in the shape of a closed loop. Each device is connected directly to two other devices, one on either side of it. 3. Bus Topology All devices are connected to a central cable, called the bus or backbone. There are terminators at each end of the bus that stops the signal and keeps it from traveling backwards. FIREWALL Is a software that can be loaded on to a network that can serve as a barrier that keeps destructive forces away from a network of computers. Packets of Data are analyzed against a set of criteria or standards called filters. ROUTER Whether a router is traditional or wireless, its purposes remain the same. Are specialized computers that send your messages and those of every other Internet use speeding to their destinations along thousands of pathways. Are crucial devices that let messages flow between networks, rather than within networks. Allows for computers to be moved easily without having to worry about wires or cables. HOW INFORMATION TRAVELS THROUGH THE INTERNET? 1. Header - Provides the complete destination address for the packet. 2. Data Block - The portion of the overall information carried by the packet. 3. Sequence ID - ID’s where the information belongs in relation to the rest of the information. 4. End of Message - ID’s the end of the packet. NOTE: A page on the Internet, whether it’s full of words, images or both, doesn't come to you in one shipment. Its translated into digital information, chopped into 1500 byte pieces called PACKETS, and sent to you like a puzzle that needs to be reassembled. Each part of the packet has a specific function:  When you connect to a Web site through an ISP and start exchanging information, there isn’t a fixed connection between your computer and the Web server computer hosting the Web site. Instead, information is exchanged using the best possible path at that particular time. Special computers called routers determine these paths, avoiding slow links and favoring fast ones. LESSON 3: INTERNET SECURITY INTERNET SECURITY Internet security threats have become increasingly prevalent in the digital age, encompassing various forms of attacks that exploit both technical vulnerabilities and human weaknesses. Common threats include Phishing, Malware, Ransomware, and Social Engineering attacks. Information and cyberliteracy are key components of defense against these hazards when accessing the internet. Malware and Phishing = Two most typical forms of cyberattacks. MALWARE Any software designed to damage or steal data from computer systems is known as malware. Can spread in other ways via downloaded files, damaged USB drives, and email attachments. Malware can do serious harm to a computer once it is installed, such as stealing personal data or making the device unusable. 1. Viruses - Are programs that affix themselves to healthy files and propagate when the contaminated file is shared. 2. Worms - Are self-replicating malware that spreads to other systems by taking advantage of network weaknesses. 3. Trojan horses - Are programs which pose as trustworthy software, could open backdoors for intruders. 4. Ransomware - Is a dangerous type of virus that encrypts a victim’s files and demands money to unlock them. Significant data loss and business interruption are potential consequences of ransomware attacks. PHISHING A kind of cyberattack that involves tricking victims into divulging private information, such as passwords, usernames, and bank account information. Sending bogus emails pretending to be from reputable sources, including banks or retailers who sell online, is a common tactic used in phishing scams. A kind of network assault in which the attacker impersonates a legitimate website to trick a victim into disclosing personal information. Is the practice of tricking a user into disclosing personal information by using technical and social engineering techniques. 1. Email Phishing - Are fraudulent emails that pretend to be from reliable sources and persuade the receiver to click on harmful inks or expose personal information. 2. Spear Phishing - Is a type of targeted phishing assault in which the attacker focuses on a particular person or organization, frequently exploiting personal information that gives legitimacy to their attack. 3. Whaling - Is a highly skilled phishing attempt to obtain private company data by targeting notable individuals such as executives. RANSOMWARE Is a type of malicious software that encrypts files and folders on a user’s computer to prevent them from being accessed. The virus then demands payment, usually in bitcoin, in order to unlock the encrypted files and return the computer to regular operation. 1. Ransomware spreads through phishing emails that include malicious attachments or links. 2. Ransomware can proliferate through drive-by downloads, in which accessing a compromised website triggers the malware’s automatic download. 3. Utilizing Social Engineering Techniques to trick users into opening malware-laden files or clicking on links. SOCIAL ENGINEERING Refers to the act of exploiting human vulnerabilities via deception to achieve a malevolent objective. Social Engineers = prey on victims in order to obtain private information that may be sold on the dark web and black market or utilized for particular reasons. Social engineering attacks follow a similar pattern and go through comparable phases: 1. Gather details on the intended person. 2. Establish a connection with a target. 3. Utilize the information at your disposal to carry out the attack. 4. Set off without leaving any trace. Types of Social Engineering attacks: 1. Human-based - the attacker interacts with the victim directly to obtain the necessary information. They can therefore only affect a certain number of victims. 2. Computer-based - To obtain information from the targets, software-based attacks are carried out utilizing gadgets like computers or mobile phones. They can attack many targets quickly. 3. Social-based - These attacks take us of the victims’ relationships to manipulate their emotions and mind. Because they entail human contact, these attacks are the most successful and harmful. Important strategies in Social Engineering attacks: 1. Pretexting - When an attacker fixes a situation in order to win over the victim and obtain information. 2. Baiting - The practice of luring someone into a trap by offering them a prize, like a USB drive contaminated with malware. 3. Vishing - Voice phishing is a tactic used by attackers to obtain sensitive information from victims over the phone. Other prominent risks consist of: 1. Man-in-the-Middle - Attackers that intercept communications between two parties to steal or alter data. 2. Password attacks - Accounts and systems can be hacked by methods like attempting assaults, in which attackers try to guess passwords. 3. Adware and Spyware - These malware categories have the ability to monitor user activity and show intrusive advertisements, which may result in data theft. SECURITY PRACTICES: 1. Employing robust passwords by keeping it between 12 to 16 characters while using a combination of special characters, numerals, capital, and lowercase letters. 2. Steering away from utilizing guessable information such as birthdays or well-known terms. 3. By managing passwords, creating a safe storage for your passwords to reduce risk of getting hacked. 4. Applying a distinct password for each account does not compromise all your accounts. 5. To provide an additional layer of protection, two-factor authentication requires a second method of verification in addition to a password, such as SMS code. 6. SMS codes are text messages delivered to your phone along with a code. 7. Another layer of protection is Biometric Verification, this protection is equipped to the devices with fingerprint or facial recognition functions.  8. Updating your antivirus program, operating system, and apps frequently to guard against security flaws is one way to secure your devices. 9. Whenever possible, enable automatic updates to guarantee you get the most recent security updates. 10. Public Wi-Fi networks may be vulnerable to attacks and unsecure. To keep your data safe, make use of a VPN. By encrypting your internet traffic, a virtual private network makes it more difficult for hackers to intercept your information. When using a public Wi-Fi, stay away from sensitive accounts (such bank accounts). HOW TO REMAIN ALERT FOR PHISHING ATTEMPTS? Verify email links for typos or strange domain names. Use official channels to get in touch with the organization directly if you are asked for confidential information in an unexpected manner. Emails with sloppy grammar, rushed phrases, or unexpected attachments should be avoided. Protect your devices such as PC’s, tablets, and cellphones, use passwords, PINs, or biometric locks. To safeguard data from theft, turn on encryption options on your devices. Installing antivirus software is a way to find and get rid of malware. Make sure to frequently review your bank accounts and internet platforms for any unusual or suspicious activities. If possible, set up notifications for strange behavior on your account. Keep up with the most recent risks to security and suggested solutions. Give your loved ones and acquaintances this information to assist them guard their internet activities as well. NOTE: Internet security encompasses several key concepts related to online privacy. Data encryption is crucial for protecting sensitive information, with encryption keys managed securely to ensure data deletion when required. A comprehensive approach to internet security involves implementing robust encryption methods, secure storage solutions, and enforceable privacy policies. DATA ENCRYPTION Is a security measure that transforms readable data into an encoded format, making it inaccessible to unauthorized users. This process ensures that even if data is intercepted during transmission or accessed without permission, it remains unreadable without the appropriate decryption key. Encryption secures personal data, financial information, and confidential communications from cybercriminals. Implementing encryption can enhance customer trust, as users feel more secure knowing their data is protected. Data encryption is a fundamental technique for protecting online privacy by scrambling information so that only authorized parties can access it. Data is converted into a coded format using an encryption algorithm and a secret key. The encrypted data (ciphertext) appears as random gibberish to anyone without the decryption key. To decrypt the data, the authorized party uses the correct decryption key and algorithm to convert it back into readable plaintext. Encryption prevents unauthorized access to sensitive information. The encrypted data cannot be altered without detection. The digital signatures using encryption prove the identity of the sender. Many data protection regulations require encryption to secure personal data. SECURE DATA STORAGE Secure data storage refers to the methods and technologies used to protect data from unauthorized access, corruption, or loss. Implementing strict access controls ensures that only authorized personnel can access sensitive data.  Performing a regular backup for the data protects it from loss due to hardware failure, cyberattacks, or natural disasters. This technique involves removing personally identifiable information from data sets, making it less vulnerable to misuse while still allowing for data analysis. PRIVACY POLICIES Are legal documents that outline how an organization collects, uses, stores, and shares personal data. They are essential for transparency and compliance with data protection regulations. Privacy policies should outline these security practices, including encryption, access controls, and regular audits, to reassure users that their data is safe. LESSON 4: INTRODUCTION TO E-COMMERCE E-COMMERCE Encompasses various business models that define the relationships between participants in online transactions. The four primary e-commerce models are B2B (Business-to-Business), B2C (Business-to-Consumer), C2C (Consumer-to-Consumer), and C2B (Consumer-to-Business). Each model has distinct characteristics, objectives and transaction types. A. B2B (Business-to-Business) Transactions occur between businesses. Establish business relationships. Exp: Suppliers and Manufactures that provide goods necessary for other businesses; operations. B. B2C (Business-to-Consumer) Refers to the direct sale of products and services from businesses to individual consumers. Meet consumer needs. Exp: Online stores like Amazon, and e-commerce platforms for various consumer goods. C. C2C (Consumer-to-Consumer) Facilitates transactions between consumers, often through a third-party platform that provides the necessary infrastructure for buying and selling. Facilitate peer transactions. Exp: Marketplaces, eBay, Etsy, and facebook Marketplace. D. C2B (Consumer-to-Business) Individuals sell products or services to businesses. Enable consumer offerings to businesses. Exp: Freelance platforms where individuals can bid for projects or influencers promoting products to businesses. KEY TECHNOLOGIES USED IN E-COMMERCE: PAYMENT GATEWAYS Are crucial for processing online transactions securely. They act as intermediaries between the customer and the merchant, enabling the transfer of payment information. POPULAR PAYMENT GATEWAYS: 1. PAYPAL - Is a globally recognized payment gateway, widely used in the Philippines for both domestic and international transactions. Paypal charges around 3.9% for domestic payments and 4.4% for international transactions, supporting multiple currencies, including the Philippine peso. 2. GCASH - Is a prominent e-wallet and payment gateway in the Philippines, boasting over 81 million users. It facilitates various transactions, including online purchases, bill payments, and money transfers.  3. MAYA BUSINESS - (Formerly PayMaya) offers a range of payment solutions, including e-wallet services and online payment processing. It is known for its fast transactions and integration capabilities with various e-commerce platforms. SHOPPING CART SYSTEMS Are essential for managing online sales. They allow customers to select products, manage their orders and proceed to checkout. POPULAR SHOPPING CART SYSTEMS: 1. SHOPIFY - Is a comprehensive e-commerce platform that includes a shopping cart payment processing, and marketing tools. 2. WOOCOMMERCE - A WordPress plugin that turns a site into a fully functional e-commerce store, offering extensive customization options. 3. BIGCOMMERCE - Is a cloud-based e-commerce platform that provides built-in features for managing sales, inventory, and marketing. DIGITAL MARKETING TOOLS Are vital for promoting e-commerce businesses and driving traffic to online stores. CURRENT TRENDS IN E-COMMERCE Significantly influenced by mobile commerce and social commerce, both of which reshaping consumer behavior and business strategies. MOBILE COMMERCE This feature simplifies the purchasing process, allowing customers to make quick transactions with minimal input. AUGMENTED REALITY (AR) and VIRTUAL REALITY (VR) Technologies are enhancing the shopping experience by allowing customers to visualize products in their own environments. SOCIAL COMMERCE: The popularity of visual content on social media is driving sales. Brand that utilize high-quality images and videos in their posts can significantly boost traffic and revenue. TRENDS IN E-COMMERCE: 1. Personalization through AI - Artificial Intelligence (AI) is revolutionizing the e-commerce landscape by enabling highly personalized shopping experiences. Businesses can analyze customer data to offer tailored product recommendations, dynamic pricing, and customized marketing messages. 2. Augmented and Virtual Reality (AR/VR) - AR and VR are enhancing product visualization, allowing customers to “try before they buy”. 3. Voice Commerce - This trend simplifies the shopping process and caters to the growing demand for convenience, making it easier for customers to order products hands-free. 4. Social Commerce - Social media platforms are increasingly integrating shopping features, allowing users to purchase products directly through their feeds. 5. Mobile Commerce (M-commerce) - Innovations in mobile payment solutions, app development, and responsive design are making it easier for consumers to shop on-the-go NOTE: The future of the business industry, particularly with the implementation of mobile and social commerce, is poised for transformative changes driven by technological advancements and evolving consumer behaviors. Increased Personalization Growth of Mobile Shopping Expansion of Social Commerce LESSON 5: SOCIAL MEDIA AND DIGITAL MARKETING THE SOCIAL MEDIA AS MEANS OF INFORMATION DISSEMINATION In this ade of the internet, knowledge can be shared instantly, and people are able to access information quicker and easier than ever before. Scientists and researchers need to use this tool to their advantage to promote their work and share information with the world. SOCIAL MEDIA Is the most effective tool for sharing and marketing. CHANGING THE WAY SCIENTIFIC KNOWLEDGE IS DISSEMINATED Blogging and Vlogging (Video Blogging) have become a new way for scientists to share their work with the general public. Science news media is a growing industry, with magazines, websites, TV shows and documentaries. Scientists need to take advantage of these platforms to share their work with more of the world. SOCIAL MEDIA PLATFORMS 1. X (formerly known as Twitter) X or commonly known as Twitter, is arguably the best social media platform for sharing scientific research and knowledge. It is a microblogging system that enables real-time interaction between posters and followers. The advantage to using twitter is the ability to post links to other websites and tag certain themes to attract readers to your posts. 2. Instagram Another microblogging platform, but it largely focuses on pictures and short video content. Advantage: Instagram over Twitter is you can write as much as your heart desires on your posts. Disadvantage: other than the focus on pictures, is that you can’t post links to other websites directly on your posts. 3. Facebook Most people have an active account simply because it offers easy communication tools. Advantage: Facebook is the ability to create groups and pages. Disadvantage: Is the challenge of standing out. The Facebook algorithm makes it so that users see only what interests them. 4. LinkedIn Created to give people a place to document their professional life. A social networking platform that enables users to connect with other professionals and share information that they find interesting and relevant. Advantage: Knowledge dissemination is that the people who are likely to engage with your work and posts are those with the goal of professionalism. Disadvantage: It is not a very wide-reaching platform, in that you are not going to reach a diverse group of readers. 5. Reddit (Including other Forum Platforms) An open-source community where users can submit original content or content taken from somewhere else Subreddits: specific pages designated for certain topics. EFFECTIVELY SHARING YOUR WORK ON SOCIAL MEDIA Using platforms correctly, your work can become extremely popular and it is possible that you could gain opportunities that you never knew existed, like speaking at conferences, or on podcasts, or writing for magazines. Algorithm:it takes information about what specific users like and dislike and then sends them suggestions like people to follow, or posts to check out. ADVANTAGES OF SOCIAL MEDIA 1. You reach large audiences. 2. You have a direct connection with your audience. a. You get to know them better. b. You provide better customer service. c. You gain valuable insight about your customers. d. You see how your audience perceives your business. 3. You can create organic content. 4. You have access to paid advertising services. 5. You build your brand. 6. You drive traffic to your website. 7. You can evaluate your performance. 8. You can join social media networks for free. 9. You can create viral content. 10. You can uncover valuable insights. DISADVANTAGES OF SOCIAL MEDIA 1. You can receive negative feedback. 2. You open up to the potential for embarrassment. 3. You must spend a lot of time on your campaigns. 4. You have to wait to see the results. LESSON 6: SEARCH ENGINE OPTIMIZATION SEARCH ENGINE OPTIMIZATION SEO, Focuses on improving a website’s visibility on search engine result pages (SERPs). It involves practices such as keyword optimization, meta descriptions, link building, and content creation among others, with the objective of attracting and increasing organic traffic (Patel & Hines, 2018). SEO has been focused on satisfying search engine algorithms, keywords, backlinks, and meta tags are fundamental components of Search Engine Optimization, each serving distinct roles in enhancing a website’s visibility and ranking in search engine results. A cost-effective marketing strategy compared to paid advertising methods. KEY COMPONENTS OF SEO 1. Keywords Help align content with user searches. Specific words or phrases that users enter search engines when looking for information. Effective keyword research allows website owners to identify what users are searching for, enabling the creation of content that meets those needs. 2. Backlinks Enhance authority and trust. Links from other websites that point to your site. High-quality backlinks from reputable sites signal to search engines that your content is credible and valuable, which can improve your site’s authority and ranking. Can drive referral traffic as users may click on links from other sites to visit yours. Search engines like Google consider backlinks as a major ranking factor. 3. Meta Tags Improve visibility and click-through rates. Snippets of text that describe a webpage’s content. These define the title of a webpage and appear in search results. Provides a summary of the page content. Used to specify relevant keywords for search engines. OPTIMIZATION OF SEO Implementing effective practices and strategies for keywords, backlinks, and meta tags is essential for optimizing website’s SEO. 1. Keywords Incorporate your main keyword within the first 100 words of your content, as search engines give more weight to keywords appearing early on the page. Additionally, use keywords in headings (H1, H2, etc.) to enhance relevance. Ensure that keywords are integrated naturally into your content. Avoid keyword stuffing, as this can lead to penalties from search engines. Aim for a keyword density of about 1-2%. Include variations and synonyms of your primary keywords to capture a broader range of search queries while maintaining readability. 2. Backlinks Produce valuable and informative content that others will want to link to. Content types that tend to attract backlinks include infographics, in-depth guides, and original research. Reach out to other websites and bloggers in your niche to promote your content. Building relationships can lead to guest blogging opportunities and natural backlinks. Share your content on social media platforms to increase visibility and encourage others to link back to your site. Engaging with your audience can also lead to organic backlinks. 3. Meta tags Include your primary keyword in the title tag, ideally at the beginning. Keep the title concise (50-60 characters) and ensure it accurately reflects the page's content. Write unique meta descriptions for each page, incorporating the primary keyword and a call-to-action. Aim for around 155 characters to ensure the description displays fully in search results. Ensure that each page on your site has a unique title and meta description. Duplicate tags can confuse search engines and dilute the effectiveness of your SEO efforts. ELEMENTS OF SEO SEO is a multifaceted discipline that requires a comprehensive understanding of its core components. By focusing on technical aspects, optimizing on-page elements, building quality backlinks, and producing valuable content, businesses can significantly improve their online presence and search engine rankings. Each component must work in harmony to create a successful SEO strategy that adapts to the evolving landscape of search engines and user behavior. 1. Technical SEO Refers to the optimization of the technical aspects of a website to improve its visibility to search engines. Ensuring a clean and organized site structure that allows search engines to crawl and index pages efficiently. 2. On-page SEO Involves optimizing individual web pages to rank higher and earn more relevant traffic. Utilizing meta titles and descriptions to enhance click-through rates from search results. Creating valuable, engaging, and informative content that meets user intent and answers their queries effectively. 3. Off-page SEO Focuses on activities conducted outside the website to improve its authority and ranking. The quality of links is more important than quantity; links from authoritative sites carry more weight. Promoting content through social media channels to drive traffic and increase visibility. Writing articles for other websites to build relationships and earn backlinks. 4. Content Often referred to as the backbone of SEO.  Keeping content fresh and updated to maintain relevance and authority in search engines' eyes. Crafting content that encourages user interaction and sharing, which can enhance visibility and ranking over time. ADVANTAGES OF SEO: 1. Improved search engine rankings. Effective SEO begins with thorough keyword research, which helps identify the terms and phrases that potential customers are searching for. By strategically incorporating these keywords into website content, titles, and meta tags, businesses can improve their relevance to search queries. 2. Enhanced user experience. Technical SEO ensures that a website is structured in a way that search engines can easily crawl and index its pages. This includes optimizing site speed, mobile responsiveness, and overall site architecture. A well-structured site not only improves rankings but also enhances user experience, leading to longer visit durations and lower bounce rates, which are positive signals to search engines. High-quality, informative, and engaging content is crucial for SEO. Content that meets user intent and answers their questions effectively tends to rank better. Search engines prioritize content that provides value, which in turn drives more organic traffic as users find the information they need. 3. Increased click-through rates (CTR) Optimizing meta tags, including title tags and meta descriptions, can significantly influence click-through rates. A compelling title and description that accurately reflect the content can entice users to click on the link in search results. Higher CTRs can improve rankings as search engines interpret increased engagement as a sign of relevant content. 4. Building authority through backlinks. Backlinks from reputable websites serve as endorsements of your content. The more high-quality backlinks a site has, the more authority it gains in the eyes of search engines. This authority can lead to higher rankings, as search engines view these links as votes of confidence in the quality of the content. Effective internal linking helps establish a hierarchy of information on a website, guiding both users and search engines to important content. This practice not only improves navigation but also distributes page authority across the site, enhancing overall visibility. LESSON 7: USER DESIGN EXPERIENCE USER EXPERIENCE (UX) DESIGN Concerns itself with the overall experience a user has when navigating a website. It encompasses aspects such as the site’s usability, accessibility, performance, design/aesthetics, utility, ergonomics, overall human interaction, and perception (Norman & Nielsen, 2019). UX design has been concerned with fulfilling the needs and expectations of human users. KEY ELEMENTS OF USER EXPERIENCE (UX) DESIGN User Experience (UX) design is a crucial aspect of creating effective and engaging digital products. It focuses on enhancing the overall experience of users interacting with a website, app, or any other digital interface. User Experience (UX) design is fundamentally about creating products that provide meaningful and relevant experiences to users. Among the various elements that contribute to effective UX design, usability, accessibility, and visual hierarchy stand out as critical components. 1. USABILITY Foundation of good UX design. It ensures that the interface is easy to use, intuitive, and efficient.  Cornerstone of UX design and refers to how easily and efficiently users can interact with a product. a. Characteristics of usable UX design: Clear and logical navigation structure. Easy to learn and understand. Allows users to accomplish tasks quickly. Easy to remember how to use after a period of not using it. b. Aspects of usability include: Users should be able to navigate through the interface without confusion. = Clear menus, breadcrumbs, and logical pathways enhance usability. The design should facilitate quick completion of tasks. = can be achieved through streamlined processes, such as minimizing the number of clicks needed to accomplish a goal. New users should find the interface easy to learn. = while experienced users should be able to use it efficiently without extensive training. A usable design anticipates potential user errors. = provides helpful error messages, allowing users to recover easily. 2. ACCESSIBILITY Ensures that the interface is inclusive and usable by people with various abilities and disabilities. Accessibility ensures that all users, including those with disabilities, can effectively use a product. This is not just a legal requirement in many jurisdictions but also a moral imperative to create inclusive experiences. a. Characteristics of usable UX design: Providing alternative text for images and other non-text content. Ensuring proper color contrast for readability. Allowing keyboard navigation for users who cannot use a mouse. Providing clear and concise content that is easy to understand. b. Aspects of accessibility include: Providing descriptive text for images and non-text = content allows screen readers to convey information to visually impaired users. Ensuring that all interactive elements can be accessed = via keyboard shortcuts is crucial for users who cannot use a mouse. High contrast between text and background colors = improves readability for users with visual impairments. Using straightforward language and avoiding jargon = makes content accessible to users with varying levels of literacy and comprehension. 3. VISUAL HIERARCHY The arrangement of elements on a page to guide the user’s attention and create a logical flow. It helps users focus on the most important information first. Visual hierarchy organizes content in a way that naturally guides users’ attention to the most important elements first. It plays a vital role in both usability and accessibility. a. Elements of usable UX design: Size: Larger elements attract more attention. Color: Contrasting colors draw the eye. Proximity: Elements that are close together are perceived as related. Alignment: Consistent alignment creates a clean and organized look.  Whitespace: Proper use of whitespace enhances readability and focus. b. Principles of Visual Hierarchy include: Larger elements = call-to-action buttons draw more attention and signal their importance in the content structure. Using contrasting colors = key information and create focal points, helping users to quickly identify essential content. Related items should be grouped together = allowing users to make connections quickly and understand relationships between different pieces of information. Adequate spacing around elements = helps reduce clutter, making it easier for users to focus on the content without feeling overwhelmed. NOTE: INTERACTION DESIGN - focuses on how users interact with the interface, providing clear and consistent feedback to users. USER RESEARCH - foundation of UX design. It involves understanding the target audience, their needs, goals, and pain points. Incorporating usability, accessibility, and visual hierarchy into UX design is essential for creating effective digital products. UX DESIGN USER SATISFACTION AND ENGAGEMENT: 1. ACCESSIBILITY UX design profoundly impacts user satisfaction and engagement by ensuring that all users, regardless of their abilities, can effectively interact with digital products. Accessibility in UX design plays a crucial role in enhancing user satisfaction by creating inclusive, engaging, and frustration-free experiences. 2. USABILITY Has a profound impact on user satisfaction and engagement. A well-designed user interface allows users to complete tasks quickly and with minimal effort. Usability in UX Directly influences user satisfaction by providing efficient, intuitive, and user-centric experience. CREATING A SIMPLE WIREFRAME FOR A WEBSITE 1. USABILITY Design the navigation menu to be straightforward and logical. Use clear labels for menu items and ensure that the most important sections (like Home, Shop, Cart, and Account) are easily accessible. This can be represented in the wireframe with a horizontal navigation bar at the top of the page, allowing users to find what they need quickly. Organize the wireframe into distinct sections (header, body, footer) to create a clear structure. This layout helps users understand where to find information and how to navigate through the site. For example, the header can contain the main navigation links, while the body can showcase featured products or content. 2. ACCESSIBILITY Ensure that the wireframe includes elements that cater to users with disabilities. This might include designing for keyboard navigation or ensuring that buttons are large enough to be easily clicked. Accessibility features should be integrated into the wireframe from the start to avoid costly changes later. 3. VISUAL HIERARCHY Use size, color, and placement to establish a visual hierarchy in the wireframe. Important elements, such as calls-to-action (e.g., "Add to Cart" buttons), should be prominent.  For example, larger buttons or contrasting colors can draw attention to key actions that users need to take. Incorporate sufficient whitespace between elements to reduce clutter and enhance readability. This makes it easier for users to focus on individual components without feeling overwhelmed, thus improving navigation.