Socio-technological thinking behind browser


Warning: Use of undefined constant user_level - assumed 'user_level' (this will throw an Error in a future version of PHP) in /home/commons/public_html/wp-content/plugins/ultimate-google-analytics/ultimate_ga.php on line 524

Socio-technological thinking behind browser

CCTP-820 Leading by design

Professor Irvine

The Web and web browsers, Image 1

Abstract

Today we interact with web browsers all the time. In the morning, people open up Safari with their Iphones to search for today’s weather; or turn on their laptops and use Chrome to fill out the miss of news during our sleep. With using the web browsers on all kinds of electronic devices, we can say that the whole world is on our fingerprint. Browsing online has been an important part not only in people’s daily life, but also in the whole human society. The web browser was first designed as an tool, and was the only tool at that time, to connect to the Web. While with the technology developing, web browser serves more than an useful daily used tool and medium to access websites nowadays, but as a digital mediation. People might understand how to use the web browsers with simple clicks, but not the the socio-technological design idea behind it, or its transformation from a medium to a digital mediation, which changes the world we live in. In order to do so, we need to go deeper than simply judging from the surface, and de-blackbox the invisible part of it. This paper provides an overview of the history of the web and the web browsers, introduces the principles behind it and examines the socio-technical design thinking and its impact behind web browsers.

Introduction

Web browser, is an internet-based application used to access and view websites on multiple electronic devices (Techterms). According to the statistics conducted by StatCounter, the major web browsers that we used today are but limited to: Chrome, Safari, Firefox, Opera, UC Browser and Internet Explorer. And also as shown on the web browser global market share graph on StatCounter, these six web browsers make up around 92% of global desktop browser usage (StatCounter).

The main function of web browsers is to access and view websites. And as Ron White explained in his book How Computers Work, the brief process behind the “clicks” is that it processes the HTML or the hyperlink, which is the web source, and then request through router to the site server, then display the webpage in the browser window (White, 2008).

From the users view point, we can only see visible user interfaces on web browser windows, such as the search bar, the address bar, the bookmark drop down list etc, while other parts are remain “blackboxed”. It’s hard for us to explore and examines the social and technical design thinking behind it by only examines from the user interface, since web browser is not only a thing but a product of its socio-cultural milieu. As for this reason, we start with examining the history behind web browsers as the history takes an important role in technology development and builds what web browser we see today.  

The Web

Web browsers cannot live alone without the Web. The Web was first designed and invented by Tim Berners-Lee in 1989. As Berners-Lee states in his book Weaving the Web: The Original Design and Ultimative Destiny of the World Wide Web, that his initial design idea of the Web is to have a open, united and global place to share and access information, as “a space in which anything could be linked to anything (Berners-Lee, 1999)” So what are the technology process behind this information-share web? According to Professor Irvine, World Wide Web is “a group of protocol layers, designed to enable intercommunications between internet servers (and services) and individual connected devices with the Internet/Web software (the “client” system, with softwares connecting to Web service) (Irvine, 2018).” Which indicates that web is not, again, a simple thing, but is created by different layers and modules. These protocol layered architecture enables the web to be extensible and scalable for new applications, because the layers made up architecture is independent which allows other applications to run on it.

The Web is designed as a hypermedia system, which allows it to include non-linear text and other media such as graphics, sounds or videos. As Irvine introduces that the “open, standard-based, device-independent” Web architecture including a network system that across client/server implementation; unlimited modulars and layers that can be added in the future; entensible for future applications; a model for interoperability for all software and hardware manufacturer and also to be scalable for new services and users (Irvine, 2018).

The client/server architecture

Going off to the client/server architecture mentioned above, it is the key architecture of the Web architecture. According to Berners-Lee, the modele of the client/server architecture has two important parts, the server side and the client side. The web server provides service to the clients. The client request a service, then the HTTP software on the server responds to the client’s file request, send the requested data packed as an HTML file. Then the graphic, sound or text rendering and displays on the web window interface at the client side as formatted content. While in this process, HTML file is an important part which enables the assumed interaction. As explained by Irvine, HTML is the core markup language for the Web, which is designed to describe hypertext and documents. HTML file is the carrier of contents such as images and texts that will be displayed on webpages. This also indicates the hypermedia design thinking behind the Web.

Client/server architecture, Image 2

The Web Browser

You affect the world by what you browse. —— Berners-Lee

People all know about the basic function of the web browsers, which allows us to search online, view websites, online shopping and watching videos. It has came a long way to what we see today. As introduced in A Brief History of Web Browsers and How They Work (Mcpeak, 2018), the brief history lists:

The earliest version of web browser is the WorldWideWeb, which then renamed as Nexus, is also designed by Berners-Lee in 1990, as an text-based application to display contents and access the Web.

Then in 1993, Mosaic was designed which was the first browser that enables the graphic content displaying.

In 1995, Microsoft introduced their first web browser – Internet Explorer

Then 1996, Opera was first introduced to the public

In 2003, Apple launched Safari, which then has dominating IOS market

Later come to closer time in 2015, Microsoft Edge was designed

For us as users, what we can see on the browsers are the user interfaces (UI), which is surface of web browser. Generally web browsers all contains the address bar where users can enter the URL, the search bar, the home button, refresh button, the back and forward button, tab management area and bookmark options.

For the users, all they need to do is couple “clicks”, then they can get whatever they want to find and can enjoy the content on the web window. But, if we see this process from a technology pointview, it also involves multiple layers and modules. As introduced earlier about the client/server architecture, web browser as a web application carrier, follows the same process and structure. The basic process is that the browser acts as the client, retrieves the hypermedia content from the server side and then displays it on user interfaces.

Generally, web browsers contains seven layers, lists from the top layer to the bottom, including the User Interface, the browser engine, the rendering engine, the networking component, the JavaScript engine, the UI backend and the data storage.

Browser layers, Image 3

The UI (User Interface) part, as introduced above, is what visible for users as they open up browsers. Let’s take a further step and take a closer look at the process of opening and displaying web page on the “code” level. As explained by White, the process of opening the page starts by directing the browser with hyperlink or typed URL. Then the browser sends the address to a network, or a cable-connected ISP (Internet Service Provider). The internet provider sends the address to the nearest DNS (Domain Name System) to find the correct number-formed  IP (Internet Protocol) behind URL. With the IP address, the browser sends a HTTP request to the web server through a router. The web server would read the address and return a signal to acknowledge that it received the request and successfully connect. Then the process of displaying starts. After successfully connected, the web server would send back files contain HTML or CSS to the browser part, which at the same time requests all the documents to compose the whole web page to send back to the browser. As all the files arrived, they will be displayed on the screen, and these files will be also stored in a cache to save time of loading and operating the same page in the future (White, 2007). The JavaScript interpreters enables the display of JavaScript animations and interactives. While the browser engine works as the middleman between the User Interface and the rendering engine. The rendering engine would read the HTML documents to make a Document Object Model tree and display the content (McPeak, 2018).

The process of opening and displaying web pages proves the layered design thinking behind web browsers as well as the computational thinking which used abstraction to display simple and easy output to the users while hiding the heavy and complicated process behind it, for a better and easier consumer experience.

Cookies and Tracking issues

As mentioned earlier that in the operating process of web browsers, the last layer situated at the end is the data storage part. This leads to the contentious feature of the Web and the web browser, the tracking, which raises privacy concerns of users. The tracking feature represents the socio-technical design thinking behind web browsers .

This “haunted-Ad” situation must has been happened to all modern people: after searching about organic coconut water on Google, with using Safari on laptop, this specific brand coconut water appears on the sidebar ads when opening Facebook with laptop, and even also on Instagram sponsored stories on your cell phone. This is a, but not the only, performance of browser tracking.

In order to figure out what is browser tracking and the process of browser tracking, we should first look at cookies. The name of “Cookie” was introduced by Lou Montulli, is acquired from the term “magic cookie”, which is designed to describe the packet of data passed between programs (Stuart, 2002).

Cookies or “cookie.txt”, as White introduced, are small pieces of information stored on devices by websites people visit. The cookies would be sent back to the website each time the user visit this website and notify previous activities on it. So that the web server would get an idea of user preference, which page is most hitted, what articles user read last time he visit, in order to provide better experience and meet the needs of the users (“What are cookies”, 2018). For example, cookies are commonly used for online shopping websites. These cookies would record the personal information that user voluntarily entered, and also the item in electronic carts. So that next time the user open up the same shopping website, the user could see the items he put in the cart last time, just in case he still want to purchase it. This is another example of browser tracking with using cookies.

How cookies work, Image 4

Cookie and Cache seems very similar as they both store data, the biggest difference between is that they serve different purpose. A cache, as introduced earlier, is a information technology to cache web HTML documents and images, as a way to reduce loading time. While Cookies track user characteristics and preferences. Tracking user preference and web activity can be seen as a way to better serve users. For example, streaming websites can have more accurate suggestion for videos, or searching engines can suggest more relevant searches, or even as simple as showing the right language for the website. This feature of web browser embodies the computational thinking, that simplify the complicated features and only present simple abstraction outputs to users.

But, this convenient feature can also be used for advertising and commercial purposes. Even though each cookie from different website takes only a small piece of the information, it is possible that they can be generated and create a profile or a unique id of the user. The “haunted-Ad” situation is possible because of the unique id provided by third-party cookies. Third-party cookies appear when websites feature content from other external websites such as sidebar or banner advertisements (“Internet Safety”). This indicates that the browser tracking feature also reflects the social design thinking of meeting social needs by simplifying the process of advertising.

Conclusion  

The web browser we use today is no longer just a simple tool, a thing, but more as a digital mediation which formed by multiple layers and modules, and embedded with the socio-technical design thinkings. The development of the Web and web browsers changed the society and people’s behaviors. Going through the history and background of the Web and web browsers, we can clearly see the architecture they follow reflect the basic technology design thinking and the evolved features enabled them to meet the social need, as a proof of the embedded social design thinking.

Works Cited

Text

“Web Browser.” P2P (Peer To Peer) Definition. Accessed December 10, 2018. https://techterms.com/definition

“Browser, OS, Search Engine including Mobile Usage Share.” StatCounter Global Stats. Accessed December 11, 2018. http://gs.statcounter.com/.

White, Ron. How the Internet Works. 9th ed. Que Publishing, 2007

Irvine, Martin.The World Wide Web: From Open Extensible Design to Fragmented “Appification”. November 2018

Berners-Lee, Tim. Weaving the Web: The Original Design and Ultimative Destiny of the World Wide Web. New York, NY: Harper Business, 2000.

McPeak, Alex, and Thomas Volt. “A Brief History of Web Browsers and How They Work.” CrossBrowserTesting.com. September 07, 2018. Accessed December 11, 2018. https://crossbrowsertesting.com/blog/test-automation/history-of-web-browsers/.

Stuart, Andrew. “Where Cookie Comes from.” ZATZ, June 1, 2002. http://dominopower.com/article/where-cookie-comes-from/.

“What Are Cookies?” Indiana University. January 8, 2018. Last Modified January 8, 2018. https://kb.iu.edu/d/agwm.

“Internet Safety: Understanding Browser Tracking.” GCF Global. Accessed December 9, 2018. https://edu.gcfglobal.org/en/internetsafety/understanding-browser-tracking/1/.

Images

Image 1, https://www.pcmag.com/article2/0,2817,1815833,00.asp

Image 2, https://docs.google.com/presentation/d/1K-ldsd88nyhgLYYbY7ftoi9dH-M1BrDdnp60N0nqLV8/edit#slide=id.g2a04c0c44c_0_11

Image 3, https://crossbrowsertesting.com/blog/test-automation/history-of-web-browsers/

Image 4, https://en.wikipedia.org/wiki/HTTP_cookie#/media/File:HTTP_cookie_exchange.svg