Posts Tagged ‘web design’

Why is hypertext blue?

Tuesday, February 3rd, 2009

A student asked the design question, “Why is hypertext blue?”

I was able to speculate why as a designer I might have chosen the color blue over another; like red. Red indicates alarm where blue is less intimidating yet still provides a strong contrast with surrounding black text and a white background. However, I could not answer the question in terms of any supporting specification on the W3C (World Wide Consortium) web site.

After some searching, I discovered the following answer from the inventor of the World Wide Web, Lee Berners. The following quote is an excerpt from his FAQ web page…

“There is no reason why one should use color, or blue, to signify links: it is just a default. I think the first WWW client (WorldWideWeb I wrote for the NeXT) used just underline to represent link, as it was a spare emphasis form which isn’t used much in real documents. Blue came in as browsers went color – I don’t remember which was the first to use blue. You can change the defaults in most browsers, and certainly in HTML documents, and of course with CSS style sheets. There are many examples of style sheets which use different colors.

My guess is that blue is the darkest color and so threatens the legibility least. I used green whenever I could in the early WWW design, for nature and because it is supposed to be relaxing. Robert Cailliau made the WWW icon in many colors but chose green as he had always seen W in his head as green.”

Well there you have it. Blue is a default. There was no design decision on the part of the W3C and the reasons for its usage might be more attributed to  decisions of particular browser developers. My guess is that someone used it, it worked, and others reasoned that “if it ain’t broke, don’t fix it.” Sometimes standards come into practice more out of habit than anything else. This may be one of those instances.

Note: If any reader knows for sure, I welcome a comment indicating as such.

References

Berners, Lee (n.d.) Frequently Asked Questions. http://www.w3.org/People/Berners-Lee/FAQ.html

About archiving files

Tuesday, January 20th, 2009

Definition

According to the Merriam-Webster online dictionary, an archive is a repository or collection especially of information 1. Using this definition we can say that to a web designer, an archive is the collection of all the files necessary for a web site to function properly. A web site is a collection of files. Those files, which can reside in one or more folders (directories), will often include the following types of information:

  1. HTML formatted content
  2. Graphics (image files like jpg, gif, and png formats)
  3. Videos
  4. Audio
  5. External CSS (Cascading Style Sheet)
  6. External Javascript
  7. Flash

Imagine taking your entire web site, with all of its html, images, CSS files, and media files and saving them all into one file that can easily be backed up or sent to another person over a network or through email. Next imagine compressing that one file so that it is smaller than the sum total of the entire web site. That is a web archive. When the file is decompressed, it returns to its previous size, each folder is recreated in the right hierarchy and each file is placed back into its original folder.

Archiving can be used in the following situations:

  1. You need to send a folder of files to another member of a design team
  2. You do not have direct access to a web server and need to send the web site archive to the webmaster. The web master will then decompress the file and place the files in the correct folder on the web server (this is more common than you might think).
  3. The project is completed and you want to back up the project without wasting a lot of space. For example, it it is a large project, you want it to be able to file on a single CD or thumb drive
  4. You are taking an online class and the instructor wants you to upload your project to a submissions folder for a grade
  5. You are backing up different versions of the design process and will name each archive with a date so that you can document the project timeline or simply be able to revert back to a previous design idea

Compression formats

There are many different types of archiving and compression formats. Some only archive, some only compress, some do both. Several of the most common are .zip, .sit, .tar, .rar, and .tgz. Wikipedia has a great article on the different formats and their purpose and platform2. For our purposes, we will only examine the process of creating a .zip archive because it is supported natively on both the PC and Mac platform. The term natively means that no additional software is required beyond the most current version of the operating system. There are software applications designed to create, and expand archives, however we will look at the ways to create the .zip archive using the built-in tools that come with Windows and OSX.

The process

While you can individually select specific files on a one by one basic to include in a compressed archive when it is better to do so, to archive an entire web project it is usually easier to select the root directory file that contains all the files you want to archive. For example, let’s say we have a folder named unitA. The unitA folder contains all of the files necessary to complete the unit A activities.

In Windows

  1. Select the unitA folder
  2. Click the right mouse button. You will get a context sensitive menu
  3. Select the Send to option. A submenu will appear
  4. Select the Compressed (zipped) folder from the options. A new file will be created and named unitA.zip

In OSX

  1. Select the unitA folder
  2. Press and hold down the Control key and then click the mouse. You will get a context sensitive menu
  3. Select Compress “unitA” from the options. A new file will be created and named unitA.zip

Extracting an archive

Extracting or expanding is the term used to describe taking an archive and returning it to its original set of files and folders. On both the PC and Mac platforms, the .zip format files are self-extracting. This means that double-clicking the .zip file will automatically create a new folder with the same name and create a copy of all of the files and subfolders in the correct order and hierarchy. No special software is needed.

Note: An assumption is being made that Windows XP and OSX are being used. If you are using an old version of the operating systems, then a third party software application may need to be used to create and extract the archives.

References

1.Definition of archive. Merriam-Webster online dictionary. http://www.merriam-webster.com/dictionary/archive
2.List of Archive Formats. Wikipedia. http://en.wikipedia.org/wiki/List_of_archive_formats

Zeldman on Web Design

Wednesday, December 31st, 2008

I thought you would enjoy this video from http://www.aiga.org.

The video is Understanding Web Design with Jeffery Zeldman. As you may know Zeldman is the founder of A List Apart, one of the oldest and most successful Webzines on Web design. Enjoy the video. You will be taken to the aiga web site for viewing.
http://www.aiga.org//content.cfm/video-gain-2008-zeldman

A quick note on naming conventions

Monday, September 29th, 2008

Many of my students don’t see the need or pay much attention to naming conventions; especially in the beginning stages of learning web design. The subject of naming conventions is a big one and there are several articles that deal with it well. Brielfly, understand that how you name your file does matter for several reasons:

  1. The files should have meaningful names so you can easily identify them
  2. Other files may reference them and are looking for specific names
  3. Javascript functions sometimes require filenames to have a specific pattern to work properly
  4. Many Content Management systems, like Wordpress, require template files to be named in a specific way so the application can call them.
  5. Some files like RSS feeds, require specific filenames so applications like iTunes can recognize them.

For all of these reasons and more, understanding the importance of filenaming conventions is important for web designers and producers of digital content.