REB #21: “We’ve heard that a million monkeys at a million keyboards could produce the complete works of Shakespeare; now, thanks to the Internet, we know that is not true.”

– Robert Wilensky

Okay, it isn’t exactly Shakespeare, but I think I’ve got about everything on my writer’s website that I wanted to have by the due date on Monday. Of course, I will add more in the future, but this is it for now. Here is a link to the temporary location (my free U.B. webspace); I’m going to work on transferring it to my rogermarket.com domain – and, thus, self-hosting my WordPress blog – at some point, but that’s not a priority right now. We’ll see it on class on Monday, briefly, but I wanted to post the link anyway, especially for those reading this who won’t be in class or aren’t students at U.B.

While searching for the quote for this title, I found a few more that I loved. Here they are:

“Information on the Internet is subject to the same rules and regulations as a conversation at a bar.”
– George Lundberg

“My favorite thing about the Internet is that you get to go into private world of real creeps without having to smell them.”
– Penn Jillet

“Hooked on Internet? Help is just a click away.”
– Author Unknown

“The Internet is the most powerful magnifier of slack ever invented.”
– Author Unknown

“You can’t take something off the Internet – it’s like taking pee out of a pool.”
– Author Unknown

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #11: “A common mistake that people make when trying to design something completely foolproof is to underestimate the ingenuity of complete fools.”

– Douglas Adams

Finally, the design of my website!

Although I may be going back to the dark ages of computing by using frames on my website (because, let’s face it, not many websites seem to use frames these days), I think it’s the best possible design choice for me. Maybe I’ll change my mind, but as of right now—considering everything I want on my site, how I want it to act, and so on—frames is the way to go, and I’ll explain why.

First of all, I’ve already started playing with Dreamweaver, and from my experience so far, it is not nearly as easy to use as the rest of the Adobe Creative Suite. There are bugs and inconsistencies that don’t exist in the other applications, but I won’t go into that right now. One good thing about Dreamweaver is that it offers several nice templates to use when starting to build your website (if you can figure out how to use them). I went through a few before I decided to try the three-frame approach.

For those of you who don’t already know, frames is basically a way of embedding more than one web page into a single window. In my case, I would have three frames (i.e., web pages) that would make up any given page of my website. The frame at the top will just be the header; there won’t be a scrollbar, nor will there be any division lines between the header frame and the frame for the main text. It will be fluid. The viewer will only see a difference when he or she scrolls through the text of the main frame (which, obviously, will have a scroll bar, assuming the content is long enough to need one), because the header will always be visible. That’s a boon, actually, because it means the viewer will always be able to click the header to return to the main page, without having to scroll back to the top. This is the equivalent of using freeze panes in Microsoft Excel, if that helps you any.

The bottom frame will contain the menu, the navigation for the site. This will be a simple row of mostly text-based “icons,” created in PhotoShop, that will take the viewer from page to page. The potential hyptertext story, for example, would be one menu choice. The story would appear as its own page, in the main frame of the site. Again, the only scrollbar would be for this middle/main frame, where the content is. So, when the content gets long enough to need a scrollbar, one will appear; otherwise, the interface will be very simple.

This is probably really confusing for people who have never built a website before and/or who don’t know what frames looks like. So, I’ll end this post with a screenshot from a design I’ve been working on. Click on it to make it bigger.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #10: “Navigation is power of a limited sort – it enables us to manage the immensity of the media torrent.”

– Todd Gitlin

Next up, if you haven’t already guessed: the navigation of my website.

As Vinny mentions on his navigation post, simplicity is key. I’ve thought a lot about different navigation methods, and I keep coming back to two time-tested ideas: (1) a horizontal header with a horizontal navigation bar underneath it, right along the top of the page or (2) a horizontal header at the top and a vertical navigation bar on the left. Some web designers choose to put the navigation bar on the right (or they utilize a left and right design). I’m not considering that at this point because I prefer the left side. Perhaps that decision is subconsciously linked to politics; more likely, it’s because I was raised in a country that reads from left to right.

However, as I was brainstorming, I decided to go out on a limb: I want to try putting my navigation bar on the bottom of the site. It’s a risky move, in a way, but it’s also a very familiar paradigm for the average computer user, who has to use a “start” menu or a dock of icons (both of which are at the bottom of the screen, by default) to launch his or her applications. I want my website to be easy to use, and I think that having the navigation bar on the bottom is just as easy as having it on the top—but it’s just different enough to be mildly refreshing and interesting, while still providing that sense of familiarity we’ve been discussing. If I do end up deciding on this design, I’ll want my navigation bar to look similar to a computer dock, so I’ll be creating buttons that remind the user of icons. In fact, I’ve already made a few in PhotoShop. In any case, these buttons will allow the user to move comfortably from page to page.

The biggest departure from this will/would be the hypertext story that I may or may not create (I just need time), because the links to navigate the story would be in the story itself, not on a menu. Seemingly random words would take the reader to a new experience, a new definition, a new page. The choices the reader makes would affect the story’s message, perhaps its actual outcome. Of course, this is all assuming I can come up with the right story concept.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #9: “Once you know what the story is and get it right—as right as you can, anyway—it belongs to anyone who wants to read it. Or criticize it.”

– On Writing by Stephen King

This week, we’re writing about our author/artist websites, which we will be designing and potentially publishing over the course of the next month. First up: the content of my site.

I’ve had a blog for almost a year now, one that I’ve actually managed to update on a fairly regular basis. I’ve tried to start blogs before but have never stuck with them. That said, since I’ve already got a blog started, I would like to try to incorporate it in some way. But that topic is better suited for my forthcoming posts on navigation and design, so I’ll go into more detail in the next two posts.

On this blog, I do have an “about me” page, a résumé page, a favorites page (favorite books, movies, and TV shows), and even a page to post completed/published stories, books, videos, and other projects (which I’ve done nothing with, as of yet). I’m trying to think of the best way to integrate all this information into the new website or if I even want to; I’m not sure just yet. My best bet may be to keep it on the blog and use the website for something else.

In any case, I’ve already started playing with Dreamweaver—and even tried out a couple of designs—but right now, my favorite design uses the controversial frames method, with a header on the top, a menu on the bottom, and the content in the middle (again, more to come on design and navigation in a future post). If that’s confusing, I’ll try to explain: these are all in the same browser window but are in separate “frames” (kind of like picture-in-picture for the Internet).

The content that appears in the middle frame, so far, consists of a page on which I can list my published works, an about me page, and even my entire blog (with the header and menu intact, in their respective frames, which doesn’t look great with the blog design but could be worse). I’m struggling to come up with more content for the middle frame of the home page, though, the one the reader sees first. As I said in a comment on Mike’s blog, I would also like to include a hypertext narrative of some kind (and maybe some other stories that I’ve written), but that will take a lot of time and effort to (1) write and (2) implement correctly; I suppose it’s something that will evolve over time, even if I have to work on it beyond the deadline for class.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #6: “There are 10 types of people in the world: those who understand binary and those who don’t.”

– Unknown author/coiner, but I found it at Board of Wisdom

I’ve been making websites since I was about 12 or 13, when I taught myself HTML (HyperText Markup Language) from a book. Yes, I was a geek—am a geek. That said, I’ve worked with HTML (and the newer CSS) off and on for over a decade.

In 7th grade, I redesigned my school corporation’s website, and the director of my jr./sr. high school’s computer club (called Buddy Step-Up, which is since defunct) liked it enough to ask if we could take over the corporation’s web design. We got it approved, and my design went live. It went through a couple of different iterations after that; it’s now unrecognizable, and frankly, I’m not a huge fan of the latest design, which uses Javascript and is rather slow (sorry Ben, if you’re the designer; it’s nothing personal!).

In any case, I’m not yet up-to-date on the newest version of HTML (which is 5.0), not that it’s officially “released” yet, but it is available for people to use while the bigwigs work out the bugs. So, I guess I would like to learn some of the new tags added in version 5.0. I know about the video tag, and it’s very easy to use. What I don’t know, however, is how to make something like this nifty little page that lets the user drag the text boxes to the trash can. While this looks very simple and, at first glance, not very useful, I think there could be some interesting applications for it. One thing I could do is make a website with short stories on it, and then use this code in order to provide the reader with a way to track what he/she has already read. The reader would drag a story to a trash can, or something else, and it would disappear. He or she could then go through the rest of the stories (or other website elements), out of order, until there is nothing left to read. Then it’s time to log off.

Granted, this trash can webpage is actually done with HTML and Javascript, which I don’t know at all, but I do know that it wouldn’t be possible without the update to HTML. Maybe it’s time to learn Javascript, at least the basics.

I’ve done programming before but never with Java or Javascript. On the other hand, I did use Alice for a class in undergrad; it’s like a front-end to Java, and it’s very cool. The user can program in Java without realizing it. It’s just like making an animated story. Seriously, it’s just drag-and-drop, moving characters and other elements around to create an animated Java program. It’s designed for high schoolers and college students, so it’s very use to use, once you know the basics of the program. Check it out if you’re interested in programming; ignore this paragraph if you’re not.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #3: “Fiction is the truth inside the lie.”

– Stephen King

Well, I’m still not sure if it’s more productive or not to find things we dislike rather than like, but here’s what I do know: I love Stephen King’s website.

It’s the polar opposite of Stephenie Meyer’s, in both content and design. Stephen King (Stephenie, Stephen—interesting coincidence there, eh?) has not only produced a much vaster (and far superior) body of work but has also managed to hire an excellent web designer and team of professionals to help him. Just look at his latest book cover (see picture above)! It’s so smooth and sexy, yet simple, which also happens to be a perfect description of his website.

The layout of the home page (and the entire site, in fact) is crisp, symmetrical, and has great contrast. A Flash slideshow at the top of the page announces King’s latest endeavors and books, while a tabbed menu runs along the top to navigate from page to page. When necessary (on subsequent pages), a well-implemented vertical menu appears to the left, unlike the plain, ugly, looks-like-a-mistake vertical menu of Meyer’s website. Text is sometimes divided into two columns—e.g., in order to separate news updates from product/book releases (on the home page), showcase certain multimedia items as distinct from multimedia news (on the Multimedia page), and minimize scrolling (on the FAQ page). Likewise, text and pictures are divided into two invisible but distinct columns (on the Misc. page), providing a crisp and beautiful but small separating line that announces close association between picture and text while still providing a little distance. Finally, while the website does use Arial, it does not do so exclusively, as the large section headers as well as the top matter (tabbed menu, etc.) are set in seriffed fonts like Times New Roman, to provide a little contrast and, therefore, separate the different elements of the page.

As far as content goes, King has taken great care to provide a wealth of information about his works and himself. Whereas Meyer’s page looks almost amateurish and barren, King’s is sophisticated, full, and dark, and it matches his personality as well as those of his characters. It is essentially another extension of his work, adding to the dozens of movies, miniseries, electronic stories/books, and other projects based on King’s work. For instance, he is currently in the middle of a project wherein he invites readers to take photographs that have some connection to his body of work and send them in (e.g., King’s Cross station in London shares his name and, King jokes, there must be a Deschain Bakery and something like a “Welcome to Stephenville” sign that can be photographed, somewhere in the world). FYI, if you don’t know, Deschain is one of King’s memorable characters.

In short, this is the website of a great writer who has been around the block a time or two and who, most importantly, has a strong, established voice and style. King knows himself, his characters, and his readers, and his website reflects this knowledge. His fictional world is generally so real and truthful, so well-crafted, that the seam of the “lie”/myth/fantasy is barely noticeable; likewise, the structure and design of his website are both so fitting and proper that they do not hinder the reader’s online surfing experience.

Meyer could learn a thing or two (or fifty) from him.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.

REB #2: “I guess I just violated the treaty.”

– Twilight by Stephenie Meyer

I’m sorry to any Twilight fans, and actually, I swear this has nothing to do with the fact that Stephenie Meyer wrote those much-loved-but-much-hated books or that her name has a weird spelling (Steven-ee? Mee-er?), but I just don’t like her website. It’s unfortunate, but it’s not really her fault—unless she designed it.

I dislike her website because of its design inconsistencies and the butt-ugly “Click to order Bree Tanner” button on this page. Indeed, that page is probably the worst on the site. The lone book cover at the top, next to that ugly button, looks out of place; the mouseover does nothing for it. The iframe of Stephenie’s Amazon store has an unnecessary scroll bar. The “Choose a Book” section is segregated, not to mention redundant and clumsy (click the book title to see an ugly pop-up, featuring yet another picture of the book covers for each of her books; click the covers to buy them from Barnes & Noble, which, okay, is valid because it’s different than Amazon, but still…). Once you’ve got a book chosen and its pop-up opened, each one has a title—except the last one. Oh, and the first book? Yeah, that link goes to Amazon, not Barnes & Noble, and did I mention there’s no ugly pop-up for this one?

Inconsistency personified.

Moving on, I find that the horizontal and vertical menus on the site are fighting each other for attention, particularly because there isn’t a vertical menu on the home page, so that just looks awkward. Additionally, the background pictures at the top of the page are inconsistent from page to page (tab to tab). Furthermore, I think that the text lines of the pages with large chunks of text (e.g., the blog-styled home page, the bio page, etc.) are far too wide. The reader has to follow each line almost all the way across the computer screen (at least on my 15.4″ MacBook Pro), which is tedious, and it therefore discourages the reading process. I’d rather read War and Peace all the way through—in one sitting—than read each page of Stephenie Meyer’s website, or any of the pages.

The final straw is that, as per the site’s CSS file and my eyeballs, the site is set in Arial with Helvetica as a backup and the generic sans-serif specification as a fallback; I’d love to know what that generic sans-serif font would be and look like because these (Arial and Helvetica) are ugly fonts!

Is this too harsh? I’m wondering if it’s more fun or just more productive to highlight things we dislike/hate rather than things we do like. I suppose we’ll find out in the next blog, when I discuss a writer’s site that I actually like.

And again, I’m not saying this is Stephenie Meyer’s (or Twilight’s) fault, even though some might agree that I have every right to blame them just because the books exist and because Meyer is a terrible writer, from a line level (even my friends who are Twilight fans—you know who you are—agree).

No, I won’t go that far—not today.

*NOTE: This blog entry is syndicated from a blog I had to start for my Electronic Publishing class at U.B. this semester. I may or may not delete the extraneous blog when the class is over, but I thought I would at least give my readers the opportunity to read the contents of that blog indefinitely.