My Web Site

Hello visitors –
My own Web site is finally up and running, at
http://wordmarshal.com
It is based upon the Final Project, below, but that is destined to be neglected and ultimately disappear because I am no longer a student at Anne Arundel Community College. I will be updating the new one, though. Please take a look.
–JVR

Final Site Design

Triumph! This is the Final Project in my Web Design class at Anne Arundel Community College, fulfilling the assignment to design a professional-looking Web site on a subject of our choosing. Several of us took the opportunity to peddle various wares, such as cakes made by a spouse or quilts made by a daughter. One undertook to design a Website for a cancer fund sponsored by her family, and it was in my view the best.

Mine presents samples of my writing and photography. It won’t be accessible where it is for very long because my access to the school’s server lasts only until the end of this semester. If you have a comment about it, please let me know–particularly if you think it would be worthwhile for me to put this site up on the World Wide Web for real!

Essays, aka Op Eds

After I posted that Final Project on the Anne Arundel Community College Server, I finally received permission to link to the photograph by David Douglas Duncan that inspired me to write an essay about it. I have felt an obligation to write this piece for years but felt too humbled by the task. What forced me to finish was the deadline for my Final Project.

The photo is in the University of Texas archive of Duncan’s photography. I no longer have access to the Anne Arundel Community College server to update my project, so I have pasted the essay below, including the direct link to that inspirational photo. Click on the blue words “it shows.” You can zoom in on the photo once it opens.

–JVR

Always Faithful

by J.V. Reistrup
Copyright 2009

Out of the thousands of memorable photographs taken by David Douglas Duncan in his long and distinguished career, one particularly haunts me. Taken in North Korea in the winter of 1950, it shows U.S. Marine riflemen walking down a frozen road alongside a tarpaulin-covered military vehicle, probably an ammunition trailer, on which the frozen bodies of their dead are stacked like cordwood.

At first glance the image is almost repellent, as if these bodies are being treated with disrespect. The men alongside are trudging down the mountain road in “route step,” rather than marching in cadence, and they appear casual. One has a cigarette dangling out of the corner of his mouth. But the photo tells a deeper story: The men on their feet are bringing out their dead after a setback that could have become a disaster.

It is easy to imagine other troops in this situation tossing out the bodies and jumping on the vehicles so they could ride instead. These men have had no such thoughts. They never doubted that their role was to slog alongside while their dead comrades ride. Marines bring out their dead.

In its own way, the picture is as iconic as Joe Rosenthal’s famous photo of the flag-raising at Iwo Jima. But that image is a celebration of triumph. This one is a tribute to loyalty. These Marines are paying the highest imaginable price to make good on their motto: Semper Fidelis, “Always Faithful.” As a retired Navy chief petty officer said of the Marines, at a World War II commemoration I was once assigned to cover, “They have never, ever let you down, and they never, ever will.”

Beneath the surface of David Douglas Duncan’s striking picture of fidelity is yet another lesson: Heroism vindicates only itself. It cannot justify foolish policy. The men in the photo were forced to fight their way out of an untenable position into which their top commanders put them. In his Reminiscences, General of the Army Douglas MacArthur later rationalized those decisions, as he rationalized everything he ever did: “I myself felt we had reached up, sprung the Red trap, and escaped it.”

Sometimes it happens that warriors leave something lasting behind–perhaps a monument like those scattered all around Gettysburg, perhaps the unadorned memory of their heroism. The spot at Thermopylae where 300 Spartans kept hordes of Persians away from Greece was marked by a simple stone that said, in translation, “Go and tell the Spartans, you stranger passing by, that here, obedient to their laws, we lie.”

In the tradition of Sparta, that inscription was succinct. By contrast, citizens of the rival city-state, Athens, traditionally honored their heroes with lengthy funeral orations. The historian Thucydides wrote down one he attributed to the Athenian leader Pericles after one of the first battles of the Peloponnesian wars in which Athens and Sparta fought for supremacy in their peninsula. The speech survives as a stirring reminder of the duty of Athenians to their city-state and to their fallen.

But often the efforts of heroes leave little trace. Two centuries after Lieutenant Presley O’Bannon and his squad of Marines stormed the shores of Tripoli to thwart the Barbary pirates, Muammar Qaddafi runs Libya and pirates again prey upon international shipping. The banana republics where Marine hero Smedley Butler won two Medals of Honor, before concluding “War Is A Racket,” still seem restive. The Japanese flag again flies over Iwo Jima.

The frustrating and inconclusive conflict in Korea falls somewhere in between these examples. That country today is divided, as it was before the war began. For me, however, this photo offers a final, personal lesson: If it were not for troops like these, a woman who turned out to be my daughter-in-law would still be over there, at the mercy of North Korea’s Dear Leader, and two of my grandchildren would not even exist.

I hope they grow up to appreciate the Chosin Few.

Meshing Hopes, Dreams and Fire

Our Web Design class is progressing from laying out prototype web pages in a program called Fireworks to implementing them in another program called Dreamweaver. That is, the rest of the class appears to be progressing. I am having a lot of trouble getting the programs to mesh, although they are both products of Adobe. Well, as King Henry V said, “Once more into the breach, dear friends, once more . . . ” Except the rest of the quote is “or close the wall up with our English dead.”

But I was able to do the assigned reading, which is sure to be useful in helping me master the software. One consists of CSS Cheat Sheets, which gathers together how-tos on using Cascading Style Sheets to build web pages. I am going to print them out to have on hand as I proceed. The cheat sheets put together the bits and pieces we have studied separately.

Another assignment was a little scarier, saying that how people really use the web is different from how web designers imagine they will. Basically, web surfers appear to be an impatient lot. They tend to skip around — or entirely off your site.

Which brings us the the third assignment, on “Killer Web Content.” The author has tracked which stories people read about the same four news events. They appear drawn to snappy treatment indicating how they themselves will be affected — more like the “news you can use” favored by the Kiplinger newsletter publisher than the windy anecdotal leads favored, at least in the past, by the Wall Street Journal and my former publisher at the Toronto Star, Beland Honderich, among many in the print world.

I wonder how the Washington Post will handle this phenomenon as it merges its print and online editing functions. One of the stories that drew zero readership online was by a Post alumnus who went on to Newsday.

Updated Links

It has been called to my attention that I have not always posted links here to my homework assignments. Here are some:



http://bcts-potomac.aacc.edu/cat/cat17/week11/OLA-reistrup-final.png
http://bcts-potomac.aacc.edu/cat/cat17/templates/hereandback.dwt

http://bcts-potomac.aacc.edu/cat/cat17/week11/digitaljenn-start.html
http://bcts-potomac.aacc.edu/cat/cat17/week10/DESIGN-pages-reistrup.png
http://bcts-potomac.aacc.edu/cat/cat17/week10facultyprotoJVR.png
http://bcts-potomac.aacc.edu/cat/cat17/week10facultyprotoJVR.pdf
http://bcts-potomac.aacc.edu/cat/cat17/week10/reistrupproto1.png
http://bcts-potomac.aacc.edu/cat/cat17/week910/reistrupproto2.png
http://bcts-potomac.aacc.edu/cat/cat17/week9/facultyJVR.jpg
http://bcts-potomac.aacc.edu/cat/cat17/week9/reistrupsite1.jpg
http://bcts-potomac.aacc.edu/cat/cat17/week9/reistrupsite2.jpg
http://bcts-potomac.aacc.edu/cat/cat17/week9/nutrition.jpg

Left, Right, Who Is Right?

No, no, no, I am not talking about political ideology. I am talking about received wisdom among designers about where the eye naturally goes when it first beholds a newspaper or web page.

I have long been told that it goes to the right side, and American newspapers generally have followed the practice of putting their top stories on that side of the front page. Inside the paper, advertising buyers coveted the right-hand pages — especially Page 3 — leaving the news department to fill up the left-hand pages. But as I noted in an earlier post, the practice is different in the United Kingdom and other parts of the British Commonwealth. There it is common for the top story to run down the left side of the front page. Who is right? How solid is their evidence?

My mystification was deepened when our instructor referred us to some exemplary websites, listed below:

http://www.markboulton.co.uk/index.php
http://www.stuffandnonsense.co.uk/
http://www.playgroundblues.com/
http://blog.criticalwebdesign.co.uk/
http://www.nclud.com/work/
http://www2.jeffcroft.com/
http://www.subtraction.com/
http://alistapart.com
http://unspace.ca/
http://www.designobserver.com/
http://www.smashingmagazine.com/2007/05/21/60-elegant-and-visually-appealling-designs/

As you can see, some of them — not all from the UK — put the most important material on the left-hand side of the page. Why? Others follow the right-hand rule. Why?

One website on the list follows no discernible rule. Across the top are a couple of strips of artsy, unintelligible stuff. Under them is text divided into three columns of equal width. The only hint the user gets about where he or she is supposed to start is that the size of the text gradually diminishes from left to right. Duh. Surprisingly, this is the website of a professional designer:
http://www.andyrutledge.com/

Here is a link to a homework assignment, which was to complete a design for a template Anne Arundel Community College faculty could adapt for their own use. It incorporates some suggestions about an earlier version, which was posted below. Mostly it gets rid of a clashing color and provides some more room for the element at lower right.

The assignment to produce two differing design “comps,” or mockups, for our own website projects gave me the chance to try putting the dominant elements on both the right-hand and left-hand side of the page. Other than that, they have many elements in common:

Color scheme: I am my own client for this page, so I started with a personal preference for using both blues and greens in my design. I needed a contrasting tan to depict the file folders to enclose my writing and photos, so using a website called colorschemedesigner.com I picked a scheme making use of a triad of colors, rather than complementary colors. The scheme includes both bright and cool greens and blues along with some warmer browns. (You have to click on the link to get it; the “Snapshot” you see when the mouse passes over it is different.)

Another common element is the content. I wanted the work I produce to be the main focus, and although lots of web pages hint at file-folder-like tabs, as a writer and editor displaying my work I wanted to make an explicit reference to manila file folders. On the first mockup, the “Photos” folder is open to show a stand-alone photo with caption, a pair of young ospreys on a channel marker. On the second mockup, the “Features” folder is open to show the headline and first paragraph of a magazine article I wrote about unseen but important things under the Chesapeake Bay, such as footings for the Bay Bridge. It is illustrated by a photo I took while passing under the two spans.

I plan for the secondary element on each of these possible home pages to be a brief bio of myself illustrated by a head shot.

I could have used either blue or green for the footer across the bottom of the page, where the links for navigating the site go, but I picked green for a couple of reasons. One is that it picks up the color of the strip of shoreline behind the ospreys; another is that I like the contrast. Blue and green aren’t used together that often, except by the Seattle Seahawks — and Mother Nature.

– J.V. Reistrup

Faculty Commons

Our class was assigned to come up with a common template to be used by faculty members, whose web pages now differ wildly with no common theme. Here is what I came up with, in both a small

Common faculty template.

and large version.

Each page would feature the AACC logo at upper left, carrying on the teal and gray colors used by the college, with a stack of mostly common links down the left side of the page. (The departmental links would vary.) A contrasting red-brown color was selected for the main headline and for an overline intended to grab attention. Texture is provided by a subtle gradient in the links sidebar, which also offers the option for faculty members to insert a picture of their choice if they want to; if they don’t, leaving it out and spacing out the links somewhat more doesn’t detract from the design. The main block of text starts on the upper right-hand side and continues down the middle, while a subsidiary block starts on the lower right. I tried the template with several examples we were given of existing pages, and in each case the common template would work with a minimum of tinkering.

AACC Sponsored Math Contest:

(The existing math contest page needs more than a redesign: It needs more information about when, where and why the contest is held, what students must do and how their work is judged. The page is upside down, too, placing the most recent results at the bottom instead of at the top where common sense would place them. AACC is missing an opportunity to promote math scholarship on its web pages.)

Professor Allen-Chabot:

Online Science: Tutoring Page

Professor Chesley:

Dr. Bronfenbrenner Faculty Page:

Nutrition Homepage:

For comparison, here are links to a couple of the other existing pages:
http://ola4.aacc.edu/amallenchabot/nutrition/default.htm

http://ola.aacc.edu/ostc/

What made it possible for me to undertake this project was that I had just completed a project we started in class, finishing the design of a website from a detailed storyboard and set of instructions. The result is here.

Assigned reading for the week included “A Dao of Web Design,”
by John Allsopp, from “A List Apart,” a website for people who make websites
http://www.alistapart.com/articles/dao/

Allsopp writes that Tao Ta Ching is an ancient text whose common theme is harmony. Working with style sheets, he has come to understand there is a strong association between web design and the Tao (or Dao) and senses “a real tension between the web as we know it and the web as it would be, the tension between the already-existing medium of the printed page and its child, the web. It’s time to understand the relationship and let the child go its own way, “time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.” Mostly what his advice boils down to is: Stop fretting about font sizes. He says a lack of complete control over what appears in a browser often frustrates developers, but the answer is adaptability to the needs of the reader — that is, accessibility. “Let your design flow from the services which [its pages] will provide to your users, rather than from some ovearching idea of what you want pages to look like.” The most important step is to separate the content and its appearance. If you are using italic for emphasis rather than appearance, he says, use the “em” coding element denoting emphasis rather than the “i” element signifiying italic, so browsers that aren’t PC-based can handle it. Use style sheet “classes” rather than HTML for presentation, he advises. “If you use style sheets properly, to suggest the appearance of a page, not to control the appearance of a page, and you don’t rely on your style sheet to convey information, then your pages will ‘work’ fine in any browser, past or future. Browsers which don’t support style sheets simply present pages that look a little on the plain side.” Avoid absolute units like pixels or points, and don’t rely on color, he adds. The same point size looks smaller on a Mac than a PC because the “logical resolution” is 72dpi instead of 96dpi. Plus, a significant number of people have trouble reading anything smaller than 14 pts on paper. “With CSS you can specify font size as a percentage of a parent element.” And if you don’t, the text of the body will be the size the reader has chosen as default size. Thus rather than specifying a size in points or picas, you can specify Heading1 will be 30% larger, heading2 25% larger, etc. These can adapt to the reader’s preference for size of body font. Similarly, margins, text indentation and other layout aspects can be specified in relation to text size, e.g.
p {margin – left: 1.5em} means margin is 1.5 times the height of the font of that paragraph.
“It is the nature of the web to be flexible, and it should be our role as designers and developers to embrace this flexibility, and produce pages which, by being flexible, are accessible to all.”

Picas and Pixels

The assigned chapter in The Principles of Beautiful Web Design went over some basic principles of typography and how they apply to web design — that is, when they do. The fonts available to a web designer are limited to those that can show up on a web browser, and even then the computer screen has some limitations. For example, the old principle of printed type is that sans serif fonts are good for headlines and captions whereas large blocks of text need serif fonts (those with strokes across the tops and bottoms of letters) for legibility, but some web designers are now using sans serif fonts for blocks of type because they are more readable in the smaller sizes typical on computer screens. Another thing the chapter did for me was to demystify the use of “pixels” — the picture elements on a computer screen. I know what an inch is, and what a pica is, but because a pixel is a relative measure I had trouble grasping how to draw a design using that measure. Author Jason Beaird provides a nice, simple formula: The default font size is 16 pixels, but that is too big for text, so in coding for the web he defines the size of his body font as 62.5% [of that 16], which makes it 10 pixels, or about an em. He defines paragraph size as 1.2 em and h1 [main headline] size as 3.5 em. So when the choice is up to me, I am going to avoid puzzling about it and simply apply that formula.

The assigned chapter in our Dreamweaver textbook was a lesson on providing users with tools to navigate websites, including links and panels. The result is here.

Our class assignment was to finish an animation in Photoshop and then come up with an original. The first is here and you will see that the second bears an uncanny resemblance to it. We were allowed to be more creative, and I spent some time experimenting with more original designs for the background including tracing several women throwing pots or a woman holding a painter’s palette, but they gave me trouble so I opted for at least finishing a project that does what it is supposed to do, which is to morph into different versions.

I finished my proposed website banners and submitted them. Here is a copy of the final version:

As submitted, incorporating classmates' suggestions

Among other things, it wasn’t apparent to everyone that the font and placement of “MyAACC” in the version below under “Banner Day” was meant to suggest clouds, so a classmate proposed softening but enlarging the letters and moving them behind the bridge, which I did. I also moved a gull that appeared to be strafing the containership passing under the center span. Here is a link to the full-size version, which shows more detail. I also made a smaller version for interior web pages: Here is a link to our classroom project in animation. If you watch it for a few seconds, stuff happens.

Banner Day

I slowly and painstakingly finished a revision of my proposal for a website banner to enter in a school contest. The winning banner is to replace one there now, which has a winter theme. We were supposed to provide a spring theme, which I failed to do, but I like it anyway. It does incorporate several other suggestions from our instructor, the commenter who signed herself Gigi-Mo in a critique of my first effort.

preferred proposed design

The banner is built around several photos:

1. A shot I took of the Chesapeake Bay Bridge looking toward the Eastern Shore of Maryland. I used a rougher tracing of this in my initial effort.
2. A shot I took of a sailboat during a race.
3. Three shots of seagulls downloaded from a photo-sharing site called Stock Exchange, which classmate Mark P. told us about. The fourth seagull, the one closest to the bridge, was in the original photo although I didn’t spot it until I enlarged the shot to trace it.

The tracing was done in Adobe Illustrator, another part of Adobe Creative Suite 4, because I find the program more intuitive than the Adobe Fireworks software we were using to create our banners. Then I imported each drawing into the banner, placed them and colored them white. The other colors in the banner I picked using an Adobe utility called Kuler, provided to help coordinate colors on web pages and protect us tyros from dumb mistakes. Kuler can be a bit formalistic, in my opinion, but rules are rules. I used the “triad” method, allowing me to pick across the color spectrum, so I could get not only blue and green but also a sandy color to line the Bay. I added some texture for the Bay itself with a pattern called Goo Blue. And in lieu of the delicate latticework that would be needed to represent the girders under the near end of the bridge, I stripped in a tweedy weave pattern called Berber. Finally I chose Jagger FF as the type font for the words “My AACC” and placed them in white in the upper right, sort of like clouds.

I took the original bridge photo on a visit to Sandy Point State Park in Anne Arundel County with my brother-in-law Erik Wolhowe, who as a civil engineer with the Minnesota Department of Transportation is always ready to look at bridges. (It happens he was assigned to supervise rebuilding of that old bridge that collapsed into the Mississippi River in 2007, and they brought the project in on time and under budget.) The original photo was taken at about 9:30 in the morning when there was a flock of seagulls clustered along the shoreline for a post-breakfast chat. That was too much detail for this effort, so I settled for a single gull strutting along the sand.

The only change I made to my second banner proposal, at our instructor’s suggestion, was to tame down some of the clashing colors.

Another assignment in Fireworks for the week was far more frustrating for me, though. I kept trying to produce those “rollover” buttons you see on web pages, which change color when you roll a mouse over them. I finally finished the project on perhaps my sixth try, but I have trouble getting rid of mistakes I make in Fireworks, and they are immortalized when you click on the URL. Of course nobody in his right mind would label all buttons “Contact” and stack them on top of each other. Mine were supposed to read, from left to right, “Home,” “About,” “Info,” “Products” and “Contact,” but nothing happened when I pressed shift/alt/mouse in the approved method for duplicating buttons, so I tried a series of workarounds, which appeared to work in Dreamweaver but didn’t carry over to the college website.

In our assigned reading, the article saying what is “above the fold” isn’t the only thing that matters reminded me of some lessons learned designing newspaper front pages, which is where the expression comes from. The first point is that these layouts must change not only every day but between editions. Headlines like “Mideast Peace Hopes Rise (or Fade)” or “Brazil — Land of Promise” may work in mockups, but not out on the streets or in the stores. Those of us who got the chance to lay out page one were taught that what was above the fold was important principally for street sales, which were crucial for raising average circulation even if they were only a small slice of the total, and that a design that grabbed readers would sell more papers — a few thousand in big cities. The Toronto Star had a roster of editors who rotated into the post, and there were a few basis precepts when I worked there in the 1970s before the advent of offset presses that allowed us to use color more frequently. The most important and significant news of the day was to get the “black line,” a multi-column headline over a story stripped either down the right-hand side of the page like an American paper or down the left like a British paper (this Canadian paper gave us both options). A second critical element was the most interesting story of the day, which got the “red line,” so called because the headline was printed in red ink separately from the rest of the page. This story and headline were stripped across the top of the page, above the newspaper’s nameplate. (By the way, it was important to give readers the gist of the story on the front page rather than leading them inside with some windy anecdotal lede.) The third crucial element above the fold was a multi-column photo, which could stand alone or accompany a story but whose content had to be immediately discernible to readers. The editor-in-chief told us that changing any or all three of these elements between editions could boost circulation for that day by thousands. I never laid out the front page of the Washington Post, but I remember the executive editor’s saying that running a banner line about a Redskins game over the nameplate the following Monday would raise street sales by several thousand, even though by the time the paper appeared all the readers surely knew the outcome. These examples may be dated, but the principle remains: What goes above the fold can grab readers (or browsers). But whether they will become subscribers (or regular browsers) depends more heavily on the rest of the content.

The article on making websites attractive provided useful tips, which I hope to use while working on my project. So did the article on web design tactics. But the article that really struck a responsive chord was by Joshua Porter, who among other things wrote that design is different from art — which is about personal expression — because it is about being used by people. “Technology serves humans. Humans do not serve technology,” he said. Right.

–J.V. Reistrup

Perspective

This week in Web Design class, we got started on a couple of long-term projects.

One was to come up with proposed designs for a “My AACC” banner to be stripped across the top of the Anne Arundel Community College web page where students log in. These should have springtime themes, because the college will be replacing a banner with a winter theme, which you can see if you click here and then on “Welcome.”

That long horizontal strip made me think of a couple of things, one of them being a photo of the westward span of the Chesapeake Bay Bridge, which I took from Sandy Point State Park in Anne Arundel County. When tightly cropped from top and bottom, the photo fit quite well. But the assignment called on us to use only “vector” tools — that is, line-drawing tools as opposed to photos. So I managed to trace the outline of the bridge, then lift it off the photo and place it in the space. As it happened, the lines representing the suspension towers at the center of the span almost fit into the double Ls in “College,” so I moved them enough to do exactly that. I had trouble getting the “pen tool” to lift off the page when I was finished drawing a line, and the bridge ended up clumsily drawn. But you can get the idea, and the use of perspective does add some depth to the page, just as Jason Beaird suggests in the chapter on “texture” in his book, The Principles of Beautiful Web Design. I used bright yellow as the background in the logo, to represent the sun coming up over the Eastern Shore.

There isn’t anything in this banner particularly suggesting springtime, though, so I did that on my second offering. I always associate track meets with spring, so I used some stick figures to represent hurdlers. Maybe that is me flailing away in the rear, while more gifted students dash ahead. After I finished, I learned that AACC doesn’t compete in track — maybe a stick figure hitting a baseball would have been better.

Anybody is welcome to tinker around with either of these ideas if they wish.

The second long-term project is to create a website from start to finish. I think I am going to opt for creating a portfolio website for myself, including professional content such as published writing and photos. A relatively recent example is here. Some of the older stuff will take some digging and polishing. Photocopies of articles I wrote for The Washington Post decades ago are still accessible from the archives, for example, and I may end up just quoting a few excerpts and linking to the originals if anybody wants to go there. These search results are presented in chronological order, starting when I was most callow, so they need to be culled.

Meanwhile, our assignments have included visiting a site called Web Pages That Suck, maintained by Vincent Flanders:
http://www.webpagesthatsuck.com/
I looked at what he considers the 10 worst web pages of 2008, and some of them are excruciatingly, unbelievably bad — one that looks worse than those printed shoppers that fill up your mailbox and another for a boutique of female fashions that, although based in Florida, inexplicably includes bagpipe music that sounds to me like a dirge (or what the Scots call a Lament).

But I differ on this choice:
http://www.brillpublications.com/
“Does anyone think it’s clever? Does anyone not hit the back button?” Flanders asks rhetorically. Well, yes. I thought it was clever and did not hit the back button. I actually kind of like the site in a perverse way. It reminds me of the graphics in old Monty Python episodes, and although the style is doubtless dated rather than trendy, remember that Monty Python episodes live on forever on cable. I like it that when the “lift” door opens, a bloke with a mustache (Mr. Brill?) greets me on one floor as a gruff, shirt-sleeved editor and on another as a fussy, buttoned-up librarian with a finger to his lips. I even thought about buying an “i-am-a-writer” baseball cap at the store on one floor.

Maybe it is a cultural thing. Brill is an Aussie, and my experience with print people from the British Commonwealth is that they tend to take themselves less seriously than Americans, who go to Schools of Journalism (to listen to “failed editors dressed up like professors,” Rupert Murdoch is quoted as saying) and go on to join the Society of Professional Journalists.

And maybe, like Monty Python episodes, Brill’s site may be better enjoyed when stoned.

Rollover Buttons

Bay Bridge theme

Spring track theme
– J.V. Reistrup

Images and Colors

In the fourth week of our web design course, assignments focused on creating web pages, working with text and images within them and linking them. In my classroom exercise, one photo I picked out from Getty Images looked particularly like a commercial, so that is how I used it — creating linked web pages touting Florida orange juice. For background and text colors I drew on what Jason Beaird describes in Chapter 2 of his book as the warm end of the spectrum. I also appreciated his explaining the seemingly arbitrary hexadecimal coding for colors.

Here is a link to the outcome, which is an example of image mapping, in which the user can click on a face to see a linked page:

http://bcts-potomac.aacc.edu/cat/cat17/week4/mapexample.html

Here is a link to the textbook exercise, which continues our effort to work on web pages promoting a travel agency that specializes in the Greek islands:

http://bcts-potomac.aacc.edu/cat/cat17/lesson04/naxos.html

I used Fireworks instead of Photoshop as an image editor because I am having difficulty installing Photoshop on my home computer, which lacks a DVD drive. Adobe has a TechNote that provides a workaround using a flash drive, but the CS4 Install program balks at cooperating. Does anybody in the class have a portable DVD I could borrow overnight? I hate to make that investment for a one-shot use.

P.S. I want to thank Mark and Gigi-Mo for their advice about wrestling with Dreamweaver’s links. I think it has soaked in.