JBird

JBird Design

Web Design Essentials for Businesses - How the Web Works

Posted by Jordan Burke on Monday June 6 2011 |

Previously...

Last week in Web Design Essentials, we discussed the differences between a designer and a developer. Here's a quick recap:

  • Designer: Someone who deals with the look and feel of your website. Creative, but restrained by design principles.

  • Developer: Someone who focuses on the function of your website, both what the customer sees, and how you administer the website.

As we discussed last week, developers can be split into two groups: front-end developers and back-end developers. This week, we're going to define these terms a little more and go into the technology used to display and run your websites. To do that, we need to talk a little about the Internet and the World Wide Web.

In the beginning...

The Internet is a series of interconnected computers and devices that host services such as file transfers, email, and the connected documents of the World Wide Web (W3), which is the area we're concerned with. The Internet began its life as ARPANET in 1969, but did not take the form of the W3 until 1989. Sir Tim Berners-Lee and Belgian computer scientist Robert Cailliau put together a proposal at CERN in Geneva, Switzerland called the "Hypertext Project":


HyperText is a way to link and access information of various kinds as a web of nodes in which the user can browse at will. It provides a single user-interface to large classes of information (reports, notes, data-bases, computer documentation and on-line help). We propose a simple scheme incorporating servers already available at CERN.http://www.w3.org/Proposal.html

While the origin and early days of the W3 are fascinating, they are a little beyond the scope of this article. What you need to know is that the HyperText project led to the creation of the infrastructure of the web as we know it - a series of documents, hosted by web servers, which can be viewed using web browser clients. 

Oh, what a tangled web we weave...

You have questions. "What's a web browser? What's a web server? And you're telling me that websites like Facebook and CNN are just a series of Microsoft Word documents linked together?!" Not quite.

Client-Server Architecture

Let's take a look at the above diagram and work through the sequence of events in loading a website. You go to sit down at your computer, click on Chrome/Firefox/Safari/Internet Explorer and check out your favorite website (Facebook, ESPN.com, JBird Design - hint, hint). Your computer, specifically whichever program you used to visit that website, in this instance would be the client. These programs are web browser - web browsers such as Chrome, Safari, Firefox, and Internet Explorer version 9 (IE9) are referred to as "modern browsers", because they are compatible with the most recent and upcoming web standards (more on that next week). 

So, you go to the address bar in your web browser and type in facebook.com. What that does is send a request over the Internet to grab the latest information for your particular Facebook account. That information is then "served" up by a web server (see what I did there?) and sent back to be displayed by your web browser. Web servers do the heavy lifting for the websites you visit. From login authentication for Twitter to uploading and storing pictures for Flickr, web servers provide both the code and connection to the database servers to perform these and many more actions.

There and back again

Based on these descriptions, I'll bet you can guess which parts of this process would be created and maintained by front-end personnel and back-end personnel. That's right - anything having to do with the client side of this process would fall under the purview of a front-end developer; anything on the server side would fall to a back-end developer, including database creation and hosting configuration. 

Once again, we come to the main question: what does this mean to me, a business owner?

A lot of new terms and technical information have been thrown at you, but the least you need to know is this: your website must be hosted on a server somewhere, and visitors will use web browser to view your website. The two main platforms for web hosting these days are Linux hosting (using the Apache Web Server), or Windows hosting (using Microsoft's IIS software). If you have hosting, but are just now looking to create your website or need a redesign, find out which kind of hosting you have and make sure the agency you go with can work with it.

Most modern browsers display websites in the same way, with very minor differences. Older web browsers, such as Internet Explorer versions 6, 7, and 8 all have their own unique ways of displaying things. Why are people still using these browsers then? For some, it's a comfort thing - you use what you know. For others, it's a corporate or restrictions issue. The highest version of Internet Explorer (IE) you can install on Windows XP, for example, is IE8. At the moment, that's not wholly a bad thing, but it will be in a few years when HTML5 rears its head in earnest.

At JBird Design, we make sure the content of your website is displayed as consistently as possible, regardless of the web browser. We support all browsers except IE6 for several reasons, the main reason being it usually costs you more time and money to support it. We use a universal stylesheet to make sure visitors using IE6 can still find the information they need, but we HIGHLY recommend encouraging your staff and your customers to switch to a modern browser.

Next week

I snuck in a couple of terms you might be scratching your head about: HTML5, stylesheet, web standards. If you want to know the secrets behind these words, and more, tune in next week!