Internet

Summary
A website comprises related web pages, images, videos, and other digital assets, accessible via a
common URL. Hosted on web servers and delivered through HTTP or HTTPS, web pages are
formatted in HTML and can include links from other sites. Websites serve various purposes,
including personal, commercial, and nonprofit, with the homepage acting as the main entry point
for users.

Highlights - 🌐
1. Collection of Assets: A website consists of web pages, images, and videos. 📄
2. Common URL: Each website is identified by a unique URL or IP address. 🔗
3. Web Server Hosting: Websites are hosted on web servers, enabling access over networks. 🖥️
4. HTML Formatting: Web pages use HTML to structure content for browsers. 📝
5. HTTP/HTTPS Protocols: Content is delivered via HTTP or the secure HTTPS for privacy. 🔒
6. User Navigation: Hyperlinks help users navigate through the site’s structure. 🧭
7. Diverse Purposes: Websites can be personal, commercial, governmental, or nonprofit. 🌍
Key Insights - 📊
1. Interconnectedness of Web Assets: Websites are more than just a single page; they integrate
multimedia elements that enhance user experience. This interconnectedness creates a richer
digital environment, making navigation seamless and engaging. 🌐
2. Importance of URL Structure: The organization of URLs is crucial for user navigation and
search engine optimization (SEO). A logical hierarchy helps users find information quickly and
improves site visibility on search engines. 🔗
3. Role of Web Servers: Web servers are essential for hosting websites, as they process
requests and deliver content to users. Understanding the server's role is key for web
developers and businesses aiming for reliable site performance. 🖥️
4. HTML as a Foundation: HTML is the backbone of web pages, enabling developers to create
structured content easily. Mastering HTML is fundamental for anyone interested in web
development, as it affects how content is displayed.📝
5. Security with HTTPS: The adoption of HTTPS is vital for securing user data and building trust.
Websites that implement HTTPS are more likely to retain users, as they ensure privacy and
protect against cyber threats. 🔒
6. Navigation Through Hyperlinks: Hyperlinks not only connect web pages but also guide users
through their journey online. Effective hyperlinking can lead to a better user experience and

Internet 1
 increased time spent on a site. 🧭
7. Diverse Applications of Websites: The versatility of websites makes them valuable for various
sectors, from personal blogs to large commercial platforms. Each type serves a unique
audience and purpose, showcasing the internet's vast potential. 🌍
______________________________________________________________________________________________________

About the first Website

The first web site was built by Tim Berners-Lee at

http://info.cern.ch/ and was first put online on August 6, 1991.

It provided an explanation about what the internet was, how to
get your own browser, how to set up your own web server and
so on.

______________________________________________________________________________________________________

Summary
Web design is the creation of content presentations for the web, integral to web development. It
involves planning the website's purpose, audience, and content before launch. Understanding the
target audience and defining the website's goals are crucial for effective design and
communication.

Highlights - 🖥️
1. Web Design: Skill of creating web content presentations.

2. Web Development: Broad term encompassing all website creation activities.

3. Purpose Planning: Essential to define the website's goals early.

4. Target Audience: Identifying who the site is for guides design decisions.

5. Content Strategy: Key to ensure relevant information is provided.

6. Measurable Goals: Set short and long-term objectives to track success.

7. Digital Framework: Web design utilizes coding for information distribution.

Key Insights - 💡
1. Integration of Design and Development: Web design is part of a larger web development
framework, emphasizing the need for collaboration between designers and developers to
create cohesive user experiences. This integration ensures that both aesthetics and
functionality are optimized.

2. Importance of Purpose: A clearly defined purpose statement not only directs the design
process but also enhances user engagement by aligning the website’s offerings with user

Internet 2
 expectations. It serves as a foundation for all content and design decisions.

3. Understanding the Audience: Knowing the target audience enables designers to tailor content
and features effectively, ensuring that the website meets user needs and preferences. This
understanding can increase site traffic and user satisfaction.

4. Content as a Priority: The content must be relevant, engaging, and well-organized to facilitate
user interaction. A solid content strategy enhances the website's functionality, making it a
valuable resource for visitors.

5. Setting Goals for Growth: Establishing measurable goals helps track the website's
performance over time, allowing for data-driven improvements. This practice ensures the
website remains relevant and effective in meeting user needs.

6. Complexity of Web Design: Compared to traditional print media, web design requires
navigating various digital formats and technologies. This complexity necessitates ongoing
learning and adaptation from designers to maintain competitive and effective web presences.

7. Evolving Digital Landscape: As technology and user expectations evolve, web designers must
stay updated on trends and tools to ensure their designs are modern, user-friendly, and
accessible across various devices and platforms.

______________________________________________________________________________________________________

Summary
Planning documentation is essential for web design, serving as a prototype that outlines site
structure, content, and interactions. It begins with information architecture, leading to a site map
and storyboarding for page layouts. Documentation can range from simple sketches to detailed
wireframes. Websites can be static or dynamic, with distinct approaches in web design and
development, utilizing various disciplines and technologies.

Highlights
📊 Planning Documentation: Visual models for site structure and layout.
🗂️ Information Architecture: Organizes content into a coherent structure.
🗺️ Site Map Creation: Visual representation of interconnected web pages.
🎨 Storyboard Development: Describes and links page functions and titles.
🔄 Static vs. Dynamic: Differentiates unchanging content from adaptable web pages.
🖥️ Web Design vs. Web Development: Highlights the distinction between graphic design and
programming.

🛠️ Technological Components: Utilizes markup, style, and scripting languages for web
functionality.

Key Insights

Internet 3
 📈 Importance of Planning: Effective documentation is crucial for the successful design and
functionality of a website. By serving as a prototype, it allows stakeholders to visualize and
critique the project early in the process, leading to better outcomes.

🧩 Role of Information Architecture: Proper categorization of content is foundational. A well-

structured information architecture ensures users can navigate effortlessly, enhancing user
experience and accessibility.

📐 Site Maps as Guides: Site maps are essential visual tools that clarify the relationship
between pages. They aid in content organization and help designers and developers
understand how users will interact with the site.

🖼️ Storyboarding for Clarity: Storyboarding helps in outlining the purpose of each page and
ensures that all elements serve a specific function, improving the overall design coherence
and user engagement.

📊 Static vs. Dynamic Content: Understanding the differences between static and dynamic
content is vital for meeting user needs. Static pages are straightforward, while dynamic pages
offer personalized experiences, which can improve user retention.

🎨 Separation of Design and Development: Recognizing the distinction between web design
and web development allows for specialization within teams, leading to higher quality
outcomes in both aesthetics and functionality.

🔧 Diverse Skill Sets Needed: The web design process requires a blend of multiple
disciplines, emphasizing the necessity for collaboration among graphic designers, developers,
and content strategists to create effective web solutions.

______________________________________________________________________________________________________

HTTP is the fundamental protocol for web communication, facilitating requests and responses
between clients (browsers) and servers. GIF, JPEG, HTML, XML, and XHTML are essential formats
for images and web content, each with unique characteristics. GIFs support limited colors and
animations, while JPEGs offer lossy compression ideal for photographs. HTML structures web
pages, XML encodes documents, and XHTML combines HTML and XML standards for better
compatibility.

Highlights - 🌐
HTTP Protocol: The backbone of web communication.

GIF Format: Suitable for simple images and animations.

JPEG Compression: Balances image quality and storage size.

HTML Structure: Core language for web page creation.

XML Encoding: Provides a standardized format for documents.

XHTML Compatibility: Merges HTML with XML for improved parsing.

Client-Server Model: Defines the interaction between users and web services.

Internet 4
 Key Insights - 🔍
HTTP’s Role in Client-Server Architecture: HTTP establishes a clear framework for data
exchange, where browsers act as clients and servers respond to requests. This model is
crucial for the functioning of the internet.

GIF Limitations and Use Cases: While GIFs are popular for their ability to support animations,
their color limitations restrict their use for detailed images, making them ideal for logos and
simpler graphics.

JPEG’s Compression Technique: JPEG's ability to compress images significantly while

maintaining quality makes it the preferred choice for photographers, balancing file size and
visual fidelity.

HTML’s Versatility: HTML serves as the foundation for web design, allowing for the integration
of multimedia elements and interactive features, enhancing user experience.

XML’s Universal Application: XML is not just for documents; its flexibility allows it to represent
complex data structures, making it vital for web services and data interchange.

XHTML’s Strictness: The stricter rules of XHTML ensure better compatibility with XML
parsers, promoting consistent rendering across various browsers, which is essential for
modern web development.

Intermediaries in Data Transfer: The presence of proxies and gateways in the HTTP model
highlights the complexity of web communication, ensuring enhanced performance and
security in data exchanges

PHP (Hypertext Preprocessor) is a versatile scripting language primarily utilized for web
development, enabling the creation of dynamic web pages through HTML embedding and
server-side processing. Effective website content planning involves defining the site’s
purpose, organizing necessary content according to audience needs, and testing this content
with focus groups to ensure alignment with user expectations.

Highlights - 📌
1. Widely Used: PHP is a popular choice for web development. 🌍
⚡
2. Dynamic Pages: It enables the creation of interactive and dynamic web content.

3. HTML Integration: PHP code can be embedded directly into HTML documents. 🔗

4. General-Purpose: Beyond web development, PHP can serve various programming needs. 💻
5. Content Planning: Defining a website's purpose is crucial for effective content organization.
🗂️
6. User-Centric: Content should be tailored to meet the audience's needs and preferences. 🧑‍🤝‍🧑
7. Testing: Utilizing focus groups helps validate content and purpose alignment. ✅
Key Insights - 💡
Internet 5
 1. PHP Versatility: PHP's ability to function as both a web server module and a standalone
interpreter grants developers flexibility, allowing it to cater to a wide range of applications
beyond web pages. This versatility increases its adoption across different platforms and use
cases. 🌐
2. Dynamic Web Development: The capacity to embed PHP within HTML facilitates creating
interactive and user-driven websites—essential for modern web applications where dynamic
content is paramount for user engagement. 🔄
3. Content Strategy Importance: Establishing a clear purpose for a website is foundational. It
ensures all content aligns with the site’s goals, leading to a coherent user experience and
effective communication. 🎯
4. Audience-Centric Design: Organizing content based on audience needs enhances usability
and satisfaction. By focusing on the target demographic, developers can create content that
resonates, leading to higher engagement rates. 👥
5. Iterative Testing: Engaging focus groups in the content evaluation process allows for real-time
feedback, ensuring that the website meets user expectations before launch. This iterative
approach can significantly reduce the risk of website failure. 🔍
6. Structured Information Architecture: Categorizing and labeling content effectively creates an
intuitive navigation experience for users, which is critical for retaining visitors and enhancing
user satisfaction. 🗺️
7. Cross-Platform Availability: PHP’s availability on multiple operating systems and computing
platforms facilitates its integration into diverse development environments, making it
accessible for a wide range of developers and projects. 📲
______________________________________________________________________________________________________

Basic Aspects of Web Design (pg 15 of ppt for more context)

1. Content:

Relevant information targeting the intended audience.

2. Usability:

User-friendly design with simple and reliable navigation.

3. Appearance:

Consistent style across graphics and text, maintaining professionalism and relevance.

4. Visibility:

Easy discoverability through search engines and advertising.

5. Multidisciplinary Requirements:

Involves multiple disciplines (IT, design, communication).

Internet 6
 Front-End: Observable content (UI, layout, graphics).

Back-End: Source code, server-side processing.

6. Environment:

Layout influences design and content delivery.

Balances technical and social factors.

Adapts to various platforms and standards.

7. Collaboration:

Websites should integrate with broader business strategies.

Many sites remain disconnected from overall project goals.

8. Form vs. Function:

Balance between aesthetic design and functional usability.

Effective integration of graphics and text for communication.

9. Layout/Layout Types:

Content dimensioning for various devices.

Layout frameworks can be fixed, relative, or fluid.

Popular measurement units: pixels, percentages.

10. Device Considerations:

Designers cannot control device/browser variables.

Need for proficiency in resetting HTML to ensure consistent display.

11. Browser Testing:

Use browsers like Firefox (recommended) and Safari for testing.

Tools like Firebug enhance development in Firefox.

12. Text Editor:

Recommended editors: Notepad++ (Windows), Smultron/TextWrangler (Mac), gedit/Kate

(Linux).

Avoid using word processors like Microsoft Word.

13. URL Structure:

URLs consist of four parts: protocol, domain, path, file.

Provides information on file locations on a web server.

______________________________________________________________________________________________________

Internet 7
 URL Analysis Summary:
http://www.example.com/public/blog/2008/entry1.html
Gray: Indicates the use of HTTP (Hypertext Transfer Protocol), the standard for serving
websites.

Black: Represents the domain ( www.example.com ), which indicates the family of websites.

Blue: Shows the path of directories leading to the file, with directories separated by forward
slashes:

public → blog → 2008

Green: Refers to the webpage file ( entry1.html ), located in the specified directory path.

Internet 8