The Triumph of a Draft

The clouds are finished -- not perfect, but finished, and supported on all browsers. My About Me and FAQ pages are in presentable forms; there are no more Lorem Ipsums. My footer is clean and gives credit where credit is due, as well as duplicating the Contact link. I have some nice art on the About page that breaks out of the one-column mold a little bit, using simple CSS code inspired by a classmate's website. I have, in short, a website that is no longer just a placeholder.

There are ways it could be improved. Up until the last minute, I'll be trying to figure out what I need to figure out to improve it. But one thing I've realized about Web pages, over the course of this semester, is that they can always be improved. There is always something that doesn't work quite right: an element whose behavior you don't like when you resize your browser window, a cool idea that would take forever to implement, some text whose offset you don't like and can't easily change. At some point you have to say "good enough." If the site I have today is the site I turn in, I'll have some small disappointments. But I'll be able to point with justice to the triumph of a blog, the interesting aesthetic design with respect to theme and purpose, the incorporation of useful PHP scripts, and above all the lessons I've learned about how -- when necessary -- to work, rework, and re-rework until something looks great and does what I want it to.

Not bad, for a semester's work!

All Downhill From Here?

I'm getting close to having a presentable finished product. Today I wrote up a draft of my site's commentary in FAQ format, and did some graphical work on my top nav menu. The nav links had been bare words, and I thought that the sea-and-sky theme merited something a little more interesting. I booted up GIMP, drew a white cloud on a transparent background, and (with the help of a YouTube tutorial) made it into an animated GIF. When you hover your mouse over the cloud, it turns gray, then starts dropping rain and lightning. Then I inserted my links into the clouds. Web designers are always playing with fire when they include animated GIFs in their designs, but I liked the feel of these. They only move when you touch them, so they aren't needlessly distracting to the user; they just heighten the feeling of interactivity and reinforce the playful tone of the site.

Here's the thing. I got the mouse-over effect working by using a built-in Dreamweaver feature. But when I run the automatically generated code through an XHTML validator, it spews venomous hatred at me! Thus alerted, I tried the page in a few different browsers. The clouds work great in Chrome, but the transparency fails in Internet Explorer, and the mouse-over image doesn't load at all in Firefox. How frustrating! If I have time, I will see if I can fix this. Still to do, in rough order by priority: write an About Me page; clean up the footer; finalize the FAQs; play with the blog's CSS; fix the clouds; add a little more art, preferably box-breaking; get a Creative Commons license for the Verses page.

Week 14: How Do You Spell Relief? P-H-P

After my rewarding and yet deeply frustrating results in Week 13, I took the weekend off from web development and let the problem percolate in the back of my mind. At some point -- I think I was in the shower, which is where I usually am when these things happen -- I had an idea.

I had been trying to give Wordpress a new "theme," to use their language -- that is, to strip it of its out-of-the-box default look and dress it up in my pretty CSS. At the end of the process, my site would have been a Wordpress site dressed in my site's clothes. This would be the cleanest and most elegant way to solve the problem. But the complex interdependencies between the chunks of HTML and PHP that make up Wordpress probably make this solution unsuitable for my level of skill. I spent the weekend worrying, justifiably, that I wouldn't be able to do it, and wondering whether there was another way to make Wordpress do what I wanted it to.

But now I realize that this was the wrong question. I shouldn't be trying to change how Wordpress looks; that is too enormous a project. I should be trying to change how my website runs. I am not a tailor. I should not be trying to strip Wordpress down and dress it up. I am a surgeon. I should be doing an organ transplant. I need to identify the bits of PHP that make Wordpress display the blog, and then copy-paste them wholesale into my nice handmade index page, completely free of the baggage of Wordpress's default theme. It is such a simple solution that it's hard to believe it isn't the first thing I thought of.

So I booted up Dreamweaver, and twenty minutes later I have an index page that uses my CSS and shows Wordpress's blog. It was so easy. I couldn't believe how easy it was. It only took two PHP commands. Wordpress's back-end took care of the rest.

There are still problems. When users click on any of the links within a blog post -- on the Leave a Comment link, for instance -- they're redirected to a page that still uses the Wordpress default theme. I think I should be able to solve this the same way I solved the original problem, though, and if not -- well, hopefully users won't be too confused by the mishmash of styles involved in searching the blog or commenting on a post. I'd also like to restyle the internal CSS of the blog component. But what's important to me is that my blog is now usable! Particularly if I can solve these secondary problems, the blog will really be the capstone of the semester for me. I'm so happy to have gotten it working. :)

Upside Down and In Over My Feet

It turns out USF tech support works 24/7. No idea whether that's because it's in India or whether we have grad students who are that desperate for a buck, but it's handy for me! After a brief chat with the support guy about what I needed, I learned that USF doesn't let students set up MySQL databases. If we want blogs, we're supposed to use the tools at blog.usf.edu. I needed a different host.

I found one with some help from my friend, who kindly let me take a subdomain on her own site, which uses CPanel. I'm very proud of myself; without any further help from her, I managed to create the subdomain, transfer my website, set up a MySQL database, configure Wordpress, and install the blog. At the time this felt like a very significant achievement, a real leveling-up moment for my nascent web-guru ability.

I quickly discovered, though, that Wordpress is much more than I thought it was. It isn't blogging software at all, it's a whole enormous pre-built website that happens to be shaped like a blog. Installing it is the easy part. The hard part is making it do what you want, and, more to the present point, making it look the way you want -- because goddamn if it didn't circumvent my nice CSS sheet in favor of its own. And the labyrinthine design of the out-of-the-box Wordpress website means that it's really hard to figure out what to change. In principle, I want to take the CSS design I had, stick Wordpress's blog in the content box, create a little box under that one where the sidebar is supposed to go, and have done. But things do not seem to be that simple. Frustration sets in. I wonder whether I should have settled for news updates in text format, with no blog technology at all.

But I am lucky enough to have two aces in the hole. My first is my friend, who has reskinned Wordpress sites before. Maybe she can help me. My second, my fallback, is that my original site is still on the USF server. I have lost nothing if this experiment fails, and I've learned a great deal!

Week 13: Wherein the Protagonist Discovers the Advantages of Corporate Hosting

Last week was an art week, so this week is a content week. The big item of content still unaccounted for is the blog, so I went to work on that today. I went for Wordpress, of course, since it's a free and versatile tool written in PHP, which I already know works on my site. But I soon discovered that installing Wordpress requires a MySQL database to be set up. Okay, how does that work? Well -- said the Wordpress instructions -- you set up a database using the database client provided by your host, like CPanel or PHPMyAdmin. Er... come again?

So yeah, it turns out that real hosting companies give their customers a set of standardized tools that allow built-in management of things like databases. A friend with a website of her own was even nice enough to let me log into her site's CPanel interface so that I could poke around. It's neat, it's exactly what I need, and as far as I can tell it's completely absent from USF student webspace. I tried to be clever and manually install PHPMyAdmin, but I got "access denied" on ten files related to importing and exporting. USF is being cautious about what it lets its students put on its servers. Tomorrow I will call tech support, and if they can't help me I will pay for the hosting I need to give my website the features I want!

Week 12: Breaking Mondrian

Last week I was a little frustrated at feeling like I didn't know enough to make my website look like something other than boxes stacked on top of each other. This week I resolved to do something about that. I've revamped the site to give it a distinctive style, and while I'm not sure the result is aesthetically better -- yet -- it certainly is less boxy and more unique.

I started off by finally changing the damn font. Adobe Garamond Pro Bold is an eye-catching, impactful font that works nicely for headings, but it is absolute crap for content. I used CSS to change all my content boxes to Georgia, whose clarity and distinctive serifs make it easy to read. That was an easy call. Then I got down to hard work.

What I wanted was to eliminate some of the straight lines in my CSS template without destroying the site's clear organization. This took the most concerted foray into GIMP I've thus far attempted. The background of the site had been a tiled image, one pixel wide, with a thick white zone separating the light blue heading from the dark blue body of the page. I widened the image to fifty pixels and turned the straight white border into a hand-drawn curvy shape like an elementary school ocean. It took quite a while to get the ends to line up right, but when I was done, like magic my page had a distinct sky-and-sea theme. I was taken aback by how this one change completely changed the feel of the layout.

I wanted to run with the maritime idea suggested by my new border, so I took my site logo -- a blue-and-black box -- and revisited it in GIMP to see if I could give it an island shape that could sit on the waves. I had to deal with layers and transparency a good deal to make this work, since I didn't want to surround my island with a white box, and I discovered that PNG images can be partly transparent while JPGs cannot! I considered ditching transparency and just coloring the background of the logo with the same color scheme used for the site background, but that might have caused issues on computers with different screen dimensions from mine. In the end, my island-logo sat nicely on my ocean, properly centered above my content, with a nice, transparent background.

I liked the evolving line-drawing feeling of the site's art, so I went ahead and replaced a horizontal rule element on the verses page with a curlicue section divider I drew with the pencil in MS Paint. I really like the outcome; I only wish I'd been able to figure out how to use CSS to make the [hr /] tag default to this graphic.

Still on my artistic to-do list: make some seaweed out of line drawings to overlap the boundary of my still-boxy content pane; turn the menu items into clouds. Still on my technical to-do list: implement a blog for the news page; get a Creative Commons license on the verses page. Still on my miscellaneous to-do list: clean up the footer; write content for the About and FAQ pages.

Week 11: Spring

I had a nice spring break last week, returning to my roots as a recreational BASIC programmer and not thinking very much about professionally valuable languages like HTML. Now that I'm back, it's time for more website reviews!

The sad thing about lists of useful websites from 2008 is that some of them have dropped off the Internet here in 2011. My eye was drawn immediately to the CSSFights.com website, which looked from the thumbnail graphic like an engaging way to compare and evaluate web designs. But the site no longer exists as such. It's been replaced by a mere gallery of designs that the webmaster presumably thinks are cool, indistinguishable from most of the other sites we've looked at this semester.

Speaking of indistinguishable websites, how about the other twenty-six of this week's readings, huh? Look, let's be honest. Five or ten websites that showcase really good web design make a valuable and useful list. Forty or fifty is just redundant, especially when they often link to each other in a big backpatting circle. Yes, there is lots of interesting web design out there. Some of it is fun and artistic in spite of being completely dysfunctional, like iamyuna.com, which I found through CSSBased.com. Some of it is practical and unexceptionally brilliant in its thoroughly best-practices integration of form and function, like volusion.co.uk, which I found through CSSHeaven.com. But there are only so many sites you can look at before you feel like you're not going to see anything new, and more to the point, only so many compendia of "good design" you can look at before your eyes start bleeding at the samey samey sameness. It's not that I think I know everything. I know I don't. But what I don't know is no longer the kind of stuff I can pick up just by looking at websites and thinking about them real hard. Here are some things I don't know.

1. I don't know how to implement most of the designs I consider good. I know enough CSS to put together a workmanlike site that will neither confuse or annoy my audience, nor win any awards for innovation. But I don't know how to do the snazzy stuff that injects art into otherwise by-the-book websites. I barely know how to do mouseover effects. The scrolling banner graphic and pop-out content boxes on volusion.co.uk? No idea where to begin. Can't learn just by looking.

2. On a related note, I don't know how to write original scripts. I'm proud of being able to make someone else's PHP work on my website, but I can't write PHP (or Flash, or Java, or other mainstays of the Web 2.0 "look"). Can't learn that just by looking at websites, either.

3. I don't have great artistic vision. I look at my current website and I think, "well, the font's ugly, the banner needs work, the background is bland." Those are things I sort of know how to do something about, and I will do something about each of them before I turn in the site, but the result will still obviously be a set of boxes stacked on top of one another. About the limit of my creativity is feeling that I ought to find a way to make some kind of graphic that overlaps my content column into the background area, and I don't even know how to do that. But I can't learn artistic vision just by looking. That's like thinking you can watch a hundred New York Yankees games and know how to hit home runs yourself at the end of it.

So, sadly, I don't have much to say about this week's websites. They didn't do anything for me, in the sense of teaching me to be a better designer. I could rattle off some criticism of random designs I found through the sites, but my heart wouldn't be in it, since I can't do a tenth of what the worst designer featured on those sites can do. True, you don't have to be a vintner to know good wine from bad, or to say "this wine is bad and here is why." But I'm not trying to become a web design critic, I'm trying to become a web designer, and I've reached the limit of where criticism can take me.

Week 9: The Free Web

Coding is different. A fledgling lawyer who wants an off-the-cuff opinion from a more experienced colleague in a different firm might have to pay for a legal consultation. A medical layman interested in psychological disorders is likely to have to pony up tuition for the opportunity to learn from someone who knows what she's talking about. But coding? Coding is different. Coding is egalitarian. Coding in any particular language, from XHTML to PHP to C++, is taught for free on a hundred websites. If you have questions, a hundred forums will answer them. If you need code, ten thousand frighteningly skilled coders are at your service to produce short snippets. They help freely: because they can, and because there's no reason not to, and because they were learners once too, and because they still are, and because coding is different. There are no trade secrets, no mindset that valuable skills are to be hoarded and guarded from unlicensed practitioners or future competitors, not even a presumption that a student pays a master for instruction. Information is free. It's a refreshing environment to work in.

That's the preamble to this week's website reviews. I love that HotScripts has tens of thousands of prewritten scripts across the linguistic board, free for the taking. I love that all the tools of web design, right down to web editors themselves, can be had freely from Amaya and SeaMonkey and Komodo. I love that WordPress is open source. I love that even where a for-profit ethic exists, as in cases like Pandora and Google, companies find ways to provide their basic services for free. (I love that they have to -- because if they don't, someone else will! Photoshop is needlessly expensive, so I'm using GIMP, money out of Adobe's pocket.) In a professional world where all these tools can be had free of charge, and often free of license, the only restrictions on a would-be Web developer are the cost of server space and his own free time to develop his site and his talent. It's like learning the guitar, only the guitar is free, and so are all the books on playing it. This in a profession where some people earn six figures or even more. It's staggering. I love all this week's websites, even the commercial ones, and even the ones with bad design (who are you, SoundStageAV.com? What do you do? Does your site have other pages? How do I get to them?)

I'm raving because I love this ethic. It's a good ethic, even if it leads to occurrences like professors of information science explicitly encouraging their students to pirate Dreamweaver from Demonoid (not to name any names). It promotes growth. And I'm growing!

Week 8: Now With Content!

I spent the evening on some overdue Web development, and I missed it! It's fun to make my website bend to my will like a faulty dam before a storm tide. The first order of the night was to address the height of the page header. The CSS's default design is awful for my purposes here; a tall header and an enormous default picture combine to push the page's content two-thirds of the way down the page. Changing the picture was easy -- I replaced it with a much shorter placeholder graphic I hacked together in GIMP. (It looks just okay enough to put me in danger of letting the placeholder turn into the final product.) The header was harder. I couldn't figure out what part of the CSS code governed it. I fiddled with all the pixel heights to see what they did, even changed a bunch of colors to see if I could find the right part of the code, but the height of the header remained resolutely stuck. At last I figured it out, and the joke was on me: the "header" is actually nothing more than a cleverly designed, tiled background graphic! Once I figured that out, I booted GIMP again, shaved off a few dozen pixels, and elevated my content comfortably into the upper half of the screen.

Then came the part I'd been worried about. It was time to implement the central feature of the site: the array grab that populates the Verses page with a random poem. I built it up in my mind into an invincible monster made of PHP, server-side execution, and databases. To my amazement, though, everything went smoothly in a way that almost never happens in coding. My slightly-modified code pasted from StackOverflow.com worked perfectly (once I figured out that only the server could execute it, anyway). I didn't need a database, just a one-dimensional array in the form of a text file and the insight to realize that I could totally embed HTML elements into lines of the text array to create titles, line breaks, and so on. Then it was just a matter of figuring out that the page name had to end in .php, and just like that, my site had content. I quickly added a copyright notice. I should think about Creative Commons.

This thing ain't finished yet. I still need to add one major content element -- the news blog -- and revamp the site's look, especially that increasingly grating font. There's lots else, too, but those tasks stand out. Unfinished or not, though, there is now a reason for people to come to my website. And that is kind of cool!

Week 7: Not my type

Time for some more website reviews! Many of this week's websites are of great interest to professional typographers and not of much interest to average Web designers. Histories, anatomies, and tutorials of typology share the assumption that we will be designing fonts -- not just the graphic logos or banners to which Web typography is mostly limited. By far the most interesting site this week was Digital Web Magazine's article on CSS typography, which is refreshingly honest about both the possibilities and the limits of type on the Web. It would also have been interesting to read about the psychological impact of serif vs. sans-serif fonts, connotations of common Web typefaces like Verdana and Georgia, and other topics that fall more wholly within the control of Web developers than typology as a discipline does.

My own website is probably going to need a new font. The default for the CSS template I chose is not bad -- once I increased the size to the point where a lowercase e could be readily distinguished from a c -- but experimentation will be salutary. I've made use of the Wichita University study linked to by the DWM article above, and agree with the intuitive result that margins and optimal leading make for a more pleasant reading experience than the alternatives; these elements will be incorporated into my site.

Week 6: Wait, what happened to Week 5?

What happened to Week 5 was that I got caught up in other projects and sidetracked -- a hazard when one doesn't do web design for a living! But I'm all read up now, and I'm happy to report that I have a PHP script live on my website: a contact form. It was a little harder than I imagined. Coding the form was not too hard, though it still needs some polish from the CSS side. The script itself was also not hard to get (with a little modification) from tele-pro.co.uk. What was hard was making the form and the script play nicely together. Here's that story.

1. I downloaded the script wholesale into the folder for my site, and added a call to the script in the markup for the Submit button. This seemed like a logical place to put it, since that's where a mailto command would go. I uploaded the result to my site and tried to send myself the feedback "Watson, come here, I need you." The page refreshed itself, and my inbox remained empty.

2. Okay. Maybe there's a problem with the script. I had set the email to originate from the address stop@nothing. Maybe it doesn't like that "nothing" isn't a real domain name. I changed it to nothing.com. Same result.

3. Serious debugging time. I set the script, if successful, to redirect the submitter to Google, and if unsuccessful, to redirect to Yahoo. That way -- I reasoned -- I can figure out whether the problem is that the script isn't working (Yahoo), or whether it's working but isn't doing what it's supposed to (Google). Instead, I got another page refresh -- no Google or Yahoo!

4. Wow, all right, so something is really wrong: the script is not getting called at all. Perhaps MyWeb doesn't support PHP. I looked that up in the tech support FAQs, and it turns out that PHP is the one and only supported scripting language -- lucky me, but it doesn't explain my problem!

5. Well, if the problem is not server-side, and it's not the script, it must be the XHTML. I finally stumbled on putting the call to the script inside the form tag instead of the Submit button's tag. On reflection, this made more intuitive sense. I tried it again and was rewarded with a trip to Google and an email from stop@nothing.com in my inbox! I threw together a quick "thanks for submitting your feedback" page to replace Google in the script, and that concluded my first sally into PHP!

Full congratulations and possibly a Congressional Medal of Honor are due to me for figuring all this out, but it's also interesting to observe how much I'm relying on the work of other people at every stage -- tele-pro, Dreamweaver, Chrome, the PHP team, Tim Berners-Lee's successors, whoever wrote the CSS template I'm using, and others. It takes decades of work from thousands if not millions of web developers before I can so easily put one silly script on my website. I am beginning to understand the fierce sense of community among Web developers and GNU enthusiasts!

Week 4: Pages from other books

I've been falling behind in my website reviews. I have a number of excuses for this. The readings are more immediately relevant to the course project than most of the websites are; the websites often have so much content that there's no way for me to review the site comprehensively; working on my website is much more interesting than reading Jesse James Garrett's self-marketing materials; I frequently have little to say about a website beyond "well, it's good that this exists." But these are just excuses. Let's get to work.

This week, I reacted the most strongly to Smashing Magazine's inventory of interesting blog designs. The author's commentary on what makes these designs unique, cool, and functional is making me wonder whether I've got the right idea about including a blog on the front page of my site. For one thing, all these blogs have at least two columns. They need the second column for navigational tools ranging from keyword search to a Blogger-like list of previous posts. A blog with no navigational tools is rather difficult to use for anyone interested in dated material. This should have been obvious, but it took fifty pictures of two-column blogs for me to figure this out with confidence. But to deal with it, I have to either adopt a two-column template, in which case I'm obliged to find stuff to put in the second column on the other pages of my site, or else (in the ideal case) figure out how to give only the blog two columns without breaking CSS. Since the blog is a very simple one, it's not inconceivable I could find a way to make a blog work in one column -- say, a contextual link to the archives at the top of the content -- but it could be tricky, and doesn't seem to be "best practices."

Interestingly, neither the Web Style Guide nor the Universal Usability site -- each the length of a textbook -- has much to say about designing blogs. The UU site is almost completely silent on the topic, and the Web Style Guide's advice is exceedingly general. I wonder how useful these sites are for people who aren't designing from scratch.

Week 3: A staff waiting for notes

Today I chose the CSS template that I expect will govern my site from here to the end of the course. It's called "An Ocean of Sky" -- a simple, functional template with one column and a nav bar at the top. My choice was governed by the nature of the project. A literary website should have a clean, uncluttered look, and my needs are not very complex; in particular, I don't need local navigation menus, sidebars, or other frills that take up a whole column of my nice whitespace. This particular template also gives me room for a picture between the nav bar and the content, and I think that something abstract and slim could give the site a very distinctive look. I haven't played yet with color or font, but I've figured out how to do that sort of thing easily. CSS is pretty cool.

In experimenting with "An Ocean of Sky," I got a couple giggles. The template's developer made a couple mistakes; he misspelled the word "navigation" in naming an element, and, having done it once, he was obliged to do it again every time he called that part of the code. He also forgot to make one of his nav bar headings into a link. Seeing developers make mistakes gives me the confidence I need to make brand-new mistakes of my own!

I've created five basically identical pages: News (my index), Verses, About Me, FAQ, and Contact. In the end, these pages will all be rather different. I expect News to have a simple blog, Verses to use the PHP script I mentioned in my last post, and About Me to have some multimedia; if I have time and can figure out how it works, I'm going to try to implement an automatic feedback form on the Contact page. If all goes as planned, I'll have some experience working with the bells and whistles I'll need when I'm developing web pages "for real!"

Poems as the wind blows

I haven't touched my site since the class meeting on Tuesday, but I've done some research into my idea about fetching a random poem whenever a page is refreshed. I knew that I'd have to write or adapt some kind of script for it, and I needed to find out whether I could do it without teaching myself PHP from scratch at the same time that I'm learning HTML, Dreamweaver, and the contents of two other LIS courses. Happily, it looks like I can. I started my search by using View Source on the page of Neil Gaiman's that inspired this idea in the first place, but I wasn't able to identify what part of the code he uses to randomize the page's content. So I turned to Google.

A little cursory Googling around revealed a number of useful script-support sites, and fortunately, there are a number of people out there who for various reasons want to do the kind of thing I'm doing. It seems that the best-practices solution is that I should create an array -- not a full-fledged database, to my relief -- and use PHP for my scripting. I found good code on StackOverflow.com, and by looking it over I understand the principles I'll be using. I'll have an array called $poems, or something similar, and I'll populate it from a text file using a command like "$poems = file('poems.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES)". Then I'll use the command "echo $poems[mt_rand(0,count($poems)-1)]" to have the script select a random number and pick the array entry corresponding to that number. I understand every part of that from my days coding in BASIC except the command "echo," which I assume outputs the picked entry to the webpage.

This is still going to require a lot of experimenting. I don't even know whether I need to explicitly install PHP support on my site somehow, or whether browsers and/or servers all already know what [?php] means. But if I can pull this off, I'll feel really happy about that piece of my site.

LOL

I'm home from the semester's first blended session, and thanks to the class activities, my website is live! It's not much right now, admittedly. It's a picture of a kitten sleeping on a laptop, with the caption "i iz on teh interwobz" written below it. (This will change later in the semester.) But it represents the ability to draft a webpage and upload it to a host, and that is pretty cool. I still need to install Dreamweaver on my home computer, and then learn the differences between the CS3 software we used in class and the CS5 that I bought.

At this point in the course I'm a little worried about CSS trivializing the web design process. It seems like there are a number of free templates with good artistic and architectural design; I could probably use their combination of layout, font, color, and so on off the shelf without ever making an original decision. I'll have to be on guard against laziness and ready to edit whatever template I decide on to give it whatever flavor I decide to convey. And of course figuring out how to incorporate a blog and a database will be a challenge as well!

Week 2: Build a site.

But what kind of site to build? During week 1, the textbook delivered the shocking revelation that, since an HTML document is basically just a normal document with angle brackets, Notepad is a perfectly functional basic HTML editor. Following some examples from the book, I built my first webpage from scratch using Notepad. I incorporated all the basic tags from Chapter 2, and got them all working. There was nothing radically new to me here except for the !DOCTYPE bit -- I already knew how to use [a] and [img], and the rest of the tags were all less complicated than those -- but I'd never put them all together into a webpage without the help of a crappy Web interface like those of Geocities or Google Sites. There's still a lot to learn, but I'm feeling the exhilaration of seeing the first dividends of a new skill!

So I can build (very simple) webpages. But what will I put on them? I tutor students to pay the bills, but for the moment I don't want a Web presence for my business; that would make me look altogether too professional. I would rather create a site about a personal interest. The obvious choice, and the one I'll probably go with, is poetry. I play with verse here and there, and have written some stuff I want to put up on the Internet. The normal venue for publishing hobbyist creativity on the Web seems to be DeviantArt, but DA doesn't give you a lot of control over the presentation of your work. A self-built site, in theory, gives you as much control as you like.

A website about my poetry, of course, needs at least one page containing a poem, and I have some half-formed thoughts about that topic. Neil Gaiman's website has a feature that grabs a few random essays from some behind-the-scenes database whenever you refresh the page, and I like this serendipitous way of delivering creative content, even though it takes control away from both me and the user. It creates the sensation of hidden depths, as well as the aesthetic feeling of the evanescence of what you're looking at, both of which are entirely appropriate ways for poetry readers to engage with a poem. If I can figure out how to create this effect with databases and/or scripts, I'd like to try and replicate it with poems. Elsewhere on the site, I want a blog -- possibly as the main page, possibly not -- as a way to talk to whatever audience the site ends up drawing. I should put up a resume, too. As I keep learning about the tricks of the Web publishing trade, I'll keep an alert eye for which ones fall in line with this vision for my site!

Week 1: Dyeing to Design

Welcome to my course blog for the University of South Florida's LIS 5937, Web Design for Librarians!

In perusing this week's assigned websites, I especially enjoyed browsing the archives of webpagesthatsuck.com, a site whose wall of shame is likely to provide ample instruction (and winces) throughout this course. Among the sites they call out is relogik.com, which is rightly mocked for its use of nigh-illegible medium gray text on a light gray background. I followed a few of the links on their send-up of Relogik and arrived at a discussion of contrast on web pages, which in turn led me to a set of tools for developing pages that work for color-blind users.

It was at this point that I had my first oh-no moment of the course. The color-blindness simulation tools were undoubtedly well adapted for their intended purpose -- that is, showing designers without any color deficiency what their color scheme will look like to a color-blind person. Unfortunately, the tools weren't so useful to me, as I am protanomalous (or "red-weak") myself! So already, in the first week of the course, I've made a mental note that if I design color schemes that use a lot of reds, I ought to run them past someone with normal color vision. I've rarely had trouble using a website because of my protanomaly, but I've often played video games whose shades of red and green looked too similar for me to distinguish, and I wouldn't want to inflict an analogous experience on my hapless majority of users who are color-normal!