Poetry and technology brain dump at Very Like a Whale

In lieu of a Via Negativa post today, I have a guest post at Nic S.’s blog Very Like a Whale — actually a series of ten mini-essays in response to 10 Questions on Poets & Technology. Please go read.

If you have the time, I highly recommend reading the other responses to the interview so far (see the links at the bottom of my piece). I’ve been really impressed by the breadth and depth of replies, and have ended up posting links to almost all of them at Facebook. Clearly, this is a topic I get pretty passionate about, as witnessed by the length of my own response. I started jotting down ideas a month ago, and thought I had it mostly finished yesterday morning, but instead spent another ten hours working on it. I know, I know, it’s just supposed to be an interview…

Blanket

On muggy summer nights
without air conditioning

it’s so hard to find just
the right, light blanket.

I want something like the moss
bordering a stony path,

blurry verge of all that flourishes
without our say-so,

a fresh fuzz so minute
one forgets that it is after all

made up of individuals,
each of which will in time

sprout green feathers
of dubious utility, learn

to save & spend slowly
in a time of drought

& wait for its own turn
in the common bed.

*

Just a reminder that submissions for the next issue of qarrtsiluni, The Crowd, must be in by Wednesday.

World Cup haiku

Night game:
every player in the crosshairs
of his own four shadows

*

Even when he floats,
landing is just as hard:
slow-motion replay

*

Back and forth
from head to head to head—
& the ball makes four

*

Behind the prone body,
the perimeter ads
all turn over

*

Hand on his solar plexus
where a foot connected,
he jogs upfield

*

Waving the flag
of their just-beaten team—
“We’re on TV!”

*

Six hours later
I go outside to see it,
that African moon

Weeding

After a rain,
the weeds yield
to the gentlest tug,

even the deep-rooted dock
& the brittle rhizomes
of brome grass:

they let go, they give up
their fistfuls of dirt to
a few hard shakes,

& for at least
one morning out of
all those that are left to me

it feels as if I am winning
this tug-of-war
with the earth.

How to format poetry on the web: an incomplete guide

CONTENTS

Introduction

Web content is written in HTML, which stands for hypertext markup language. Your browser (Internet Explorer, Safari, Firefox, Chrome, etc., including whatever the hell your mobile device uses) parses this to produce the text and images you see. HTML can be styled any number of ways, but a couple widespread conventions are friendly to poetry: paragraphs are almost universally separated by spaces, as stanzas are in poetry, and it’s unusual for the first line of a paragraph to be indented, though special code does exist to do that (more on that later). And poets who like to center their text or present it in fully justified rectangular blocks are in luck: those are things HTML does very easily.

Aside from that, though, HTML is not particularly poetry-friendly, and special measures are required to preserve a lot of the formatting which an earlier technology, the typewriter, made all too easy. Web developers have created some awesome, easy-to-use web publishing tools which are democratizing poetry publication and helping us reach new audiences in an unprecedented manner, but we poets and online magazine editors still struggle to figure out how to post anything more complicated than simple, left-justified stanzas with short lines. I’ve even seen some literary magazines that advise authors not to submit anything that can’t be easily formatted!

One problem is that many poets like to space text across the page in unconventional manners or indent lines in various ways, but HTML will not reproduce more than two consecutive spaces in a row without special coding. If online poets represented a numerically significant proportion of web content creators, there might be a blogging platform or content management system (CMS) just for us, with a poetry-attuned visual editor in which one could add intraline spaces merely by clicking an icon, in the same way one adds italics, links, underlines, etc. But in fact I can’t even find a WordPress plugin that does this, among all the thousands of plugins out there, which is especially galling considering that for its entire history, WordPress has used the slogan, “Code is Poetry.” I call bullshit on the self-styled code poets at WordPress.

A second problem concerns interline spaces, which different blogging and CMS systems approach in different ways. In most visual or WYSIWYG (“what you see is what you get”) editors, a hard return skips a line, so poets have to either compose in the code editor if they want single-spaced text, or paste their text in from a text editor on their computer. (Of course, if it’s a Word document, you have to first copy and paste into a text editor such as Notepad to remove all the extraneous bits of mystery-meat Microsoft code. Never paste directly from Word into the visual editor of a blog, CMS, or other website creation system! If you’re using WordPress, the visual editor includes a tool to paste from Word, which preserves universal code, such as that for italics and bold type, while stripping out all the B.S. code.)

A third and more intractable problem concerns the formatting of lines too long for the content space. Current versions of HTML make no distinction between prose and poetry, so all text wraps in the same way — there’s no out-of-the-box way to indent the continuation of a line as is customary for printed poems. In fact, lines don’t even exist as separate entities in HTML!
(Back to top)

Using Images

One solution favored by some web publishers is to turn difficult-to-format poems into JPEGs or other image files, and publish those instead of text. The problem is that this renders the poem invisible to search engines and to the visually impaired, who use devices called screen readers to access web content. You can get around the problem by putting the text of the poem into the image code using the alt attribution, but this is really only practical for short poems such as those included in haiga or poetry postcards — genres where presentation in image form is of course essential.

“Alt” stands for “alternate text,” the text that appears when the image either isn’t visible or hasn’t loaded yet (still a common situation for many people in rural locations with slow, dial-up connections). It’s not to be confused with the mouseover text, which can be identical but has to be included separately using the title attribute. For optimal usability, include a descriptive term such as “poem” or “poetry postcard” in the alt text. Here’s an example from my “Postcards from a Conquistador” series, for a poem called “Misfit“:

<img src="https://www.vianegativa.us/wp-content/uploads/2008/12/postcard-from-a-conquistador-9.jpg" border="1" alt="Poem: I was the village misfit, the one who refused to stop dreaming. I could be an entrepreneur, they said, accountable only to the crown. Those who brought daggers were given swords. Those who brought nothing were stripped and beaten." />

Since this article is about publishing to the web, I won’t get into other formats that can be shared on the web, such as PDFs and the new ebook/ezine platforms that build upon them. But from time to time I see online poetry magazines sharing all their textual content via images, and I have to wonder why the heck they aren’t just using Issuu or Scribd.
(Back to top)

What About “Invisible” Dots?

Another quick-and-dirty solution to the spacing problem is to hold the spaces with dots (using the period key) or other type elements, then use the visual editor’s font color tool to white them out, rendering them invisible to most readers — except, again, those using screen readers, who presumably hear a lot of “dot dot dot” in such poems and assume the poet is afflicted with a bad case of ellipsisitis. Also, this only really works if your blog or website’s background is white. Sure, you can turn text the same color as any background, but anyone who accesses your content via feed reader or email subscription is going to see it, unless you also specially style the background for each and every page or post you publish, because the default background in probably every feed reader happens to be white. And some content re-publishers strip out such styling in any case — those text excerpts that appear with a link in Facebook, for example. So I think this is kind of a dotty approach.
(Back to top)

The Mighty Pre Tag

A poem by Daniela Elza which we just published as part of qarrtsiluni‘s current New Classics issue, “Andy Warhol (The Vancouver Art Gallery, 2004),” contains a lot of intraline spaces, and Daniela mentioned that her usual advice to editors wondering how to format such a poem is to wrap it in pre tags. I told her we usually take a different approach, but she’s right: that is indeed the quickest and easiest way to preserve intraline and interline spaces in a block of text. In my web research for this article, I found a lot of geeks in various fora offering the same advice to people inquiring about how to format poems.

Pre is short for presentation, and the whole purpose of the tag is to preserve the formatting of whatever text it encloses. The trouble is that in most browsers, presentation tags are displayed using a monospaced font, e.g. Courier or Courier New. But you can add a style definition to make it display in the same font as the rest of your site. In the case of Via Negativa, with the present blog theme, that’s Georgia. Let’s use the first several lines of Daniela’s poem to illustrate. I’ll wrap the text in pre tags as follows:

<pre style="font-family:Georgia,serif;">[text of poem]<pre>

Here’s the result:

"an i.con   turned    around
upside d.own     until      it does not

make sense.
until    symbol is    b.led from

the hammer and the sick.le—
they lie flat    as if the workers were

in a hurry for their lunch break.     and
someone forgot their shoe in the picture."

If you’re comfortable editing CSS (cascading stylesheets, which control site-wide HTML appearance on most modern websites and blogs), you could achieve the same thing by adding a new class, such as:

pre.poem {font-family: Georgia, 'Times New Roman', Serif;}

and then calling it up as follows:

<pre class="poem">

The trouble with the CSS approach is that it doesn’t change what people see in their feeds, so the first approach is a little better, if less elegant. But that’s not perfect either, because if everything else is in Arial — as it generally is in a feed reader — and the poem appears in Georgia or Times New Roman, that’s almost as wrong-looking as if you’d just used unmodified pre tags and let the poem appear in Courier. (Evidently RSS feeds can be styled through something called an XSL stylesheet, but I don’t know of any easy tools to help us do that.)

Pre tags can also be used for poems with extra-long lines, to prevent them from wrapping, but the results can be ungainly. Here’s a small section from “An Irish Blessing” by M.V. Montgomery, published in qarrtsiluni‘s Words of Power issue, without any special formatting added:

“May your appetite be hearty and the waistband of your trousers slack. May there be
no household project to ever get the better of you. May you shit out the colon cancer
if it starts to grow back, and then may the doctors go broke trying to find anything else
wrong with you.”

You see the problem? In qarrtsiluni itself, our extra-wide main column and smallish font prevent these lines from wrapping, but not so here. Well, what happens when we apply our pre-tag solution?

"May your appetite be hearty and the waistband of your trousers slack. May there be
no household project to ever get the better of you. May you shit out the colon cancer
if it starts to grow back, and then may the doctors go broke trying to find anything else
wrong with you."

This might not look too bad, but that’s only because this is a lengthy post and we’re already past the bottom of the sidebar. Otherwise, the ends of those lines would disappear under it. Pre tags are not a very elegant solution for formatting poems with long lines.

(UPDATE 6/24/10) However, with CSS you can change the overflow property from the default “visible” to “scroll” for a special “poem” pre class. In layman’s terms, you turn the content area into a box with a scroll bar rather than letting the content spill beyond the confines of the area (which is what “visible” means). Let’s try it! I’ve added this code to Via Negativa’s CSS:

pre.poem {font-family: Georgia, 'Times New Roman', Serif; overflow:scroll;}

Now let’s wrap the M.V. Montgomery text in pre tags as shown above, <pre class="poem">[text]<pre>.

"May your appetite be hearty and the waistband of your trousers slack. May there be
no household project to ever get the better of you. May you shit out the colon cancer
if it starts to grow back, and then may the doctors go broke trying to find anything else
wrong with you."

(Back to top)

Non-Breaking Spaces, Span Padding, and Empty Paragraphs

There’s really one canonical way to add extra spaces to a line in HTML, and that’s with the character entity called a non-breaking space, which is written &nbsp;. (It’s called that because it was designed not to format poetry but to keep a two-word combination from breaking in the middle if it happens to appear at the end of a line; inserting a &nbsp; between the two words forces them to be treated as a single unit.) For smaller gaps in poems, strings of non-breaking spaces can certainly work. I believe all modern browsers correctly recognize and reproduce such strings. For example, to format the Daniela Elza excerpt I’ve been using, I’d type something like this:

an i.con &nbsp; &nbsp; turned &nbsp; &nbsp;&nbsp; around
upside d.own &nbsp; &nbsp; &nbsp; until &nbsp; &nbsp; &nbsp; it does not

make sense.
until &nbsp; &nbsp;&nbsp; symbol is &nbsp; &nbsp;&nbsp; b.led from

the hammer and the sick.le—
they lie flat &nbsp; &nbsp; &nbsp; as if the workers were

in a hurry for their lunch break. &nbsp; &nbsp; &nbsp; and
someone forgot their shoe in the picture.

Even though copying and pasting strings of non-breaking space entities can make it go relatively quickly, the resulting code is hell to look at and keep track of for poems with really deep indents or large spaces. You have to use a text editor (for Windows users, try Notepad — it’s under Accessories) and expand it to full screen width.

(UPDATE 6/24) Andre Tan left a comment that makes a couple of valuable suggestions:

One tip regarding non-breaking spaces is to format with standard spaces in Word (or your text editor of choice) and “Find and Replace” all ” ” (a single space) with &nbsp; or better yet &#160;. Technically speaking, &nbsp; isn’t valid XML, so they can potentially cause finicky RSS readers to balk or spit out “double-escaped” text (i.e., &amp;nbsp;).

In Notepad, use “Replace” from the Edit drop-down menu to do the find-and-replace action Andre mentions. A huge time-saver! (Why didn’t I think of that?)

His other suggestion makes a point I was totally unaware of. XML is the language in which RSS feeds are written. The code he suggests as an alternative to &nbsp;, &#160;, is simply the alternate, numerical way of writing it. (Many character entities in HTML can be written in two different ways, and I tend to favor the abbreviated name rather than the number simply because it’s easier to remember. Here’s the reference guide I use.)

I think this approach — the insertion of non-breaking spaces — would be the way to go for an automated system such as that WordPress plugin I’m fantasizing about, but unless and until we get that, I’m going to stick with the less ungainly approach I use at qarrtsiluni: using special padding definitions. Here is what I actually posted into the code editor screen for our post of Daniela’s poem:

an i.con <span style="padding-left:15px;">turned</span> <span style="padding-left:20px;">around</span>
upside d.own <span style="padding-left:35px;">until</span> <span style="padding-left:30px;">it does not</span>

make sense.
until <span style="padding-left:30px;">symbol is</span> <span style="padding-left:30px;">b.led from</span>

the hammer and the sick.le&mdash;
they lie flat <span style="padding-left:20px;">as if the workers were</span>

in a hurry for their lunch break.

What I’m doing there is probably pretty self-explanatory. Span tags exist solely to apply styling to a unit of text of any size; it doesn’t otherwise affect the look of it. (If the same styling were included in a p tag, it would indent the whole paragraph, but with span, it only applies the padding at the beginning of the enclosed area.) Using pixels allows pretty fine-grained control, but remember that the spacing will not remain consistent if font and font-size are altered at some point. So by adopting this approach, I’ve pretty much locked us into our current font. But it’s much easier to deal with than strings of &nbsp;s.

(UPDATE 6/30) One could define the spaces with ems instead of pixels, as Adam Chambers points out in a comment. Ems are used for proportional rather than absolute spacing, so they tend to remain much more consistent with changes in font style and size. They are equal to the height of a capital M in a website’s base font (whence the name). See CSS: Units of Measurement.

I mentioned in the introduction that extra interline spaces are relatively easy to code. In Blogger, you don’t have to worry about it because the visual editor will preserve all the hard returns in a row you want to enter, coding them as linebreak tags (<br /> or <br>). In most other web publishing platforms, columns of br tags will be removed, so what you have to use instead are empty paragraphs — or to be more specific, paragraphs that consist of a single non-breaking space. They look like this:

<p>&nbsp;</p>

and you can stack them as high as you want.
(Back to top)

Using CSS to Whip Poetic Lines Into Shape

The only ways I’ve found to make long lines of poetry properly indent on the wrap involve CSS. I’m not saying it can’t be done in HTML, because my coding skills are pretty unexceptional, but I wasn’t able to figure anything out. (If you know of any tricks, please leave a comment!)

This approach takes advantage of the text-indent property, which was added mainly for designers who want traditional paragraphs, but as it says in the tutorial I just linked, negative values are allowed, too. So in your CSS you define special classes for stanzas (or whole poems) and for lines, use padding or margin definitions to indent the stanzas by whatever amount you want wrapping lines to indent, then assign the same amount in a negative value to the lines using text-indent.

This is probably easier to show than to explain. I’ve added the following to the Via Negativa stylesheet:

.stanza {padding-left:30px;}
.line {text-indent:-30px;}

So I type this:

<div class="stanza">
<div class="line">"May your appetite be hearty and the waistband of your trousers slack. May there be</div>
<div class="line">no household project to ever get the better of you. May you shit out the colon cancer</div>
<div class="line">if it starts to grow back, and then may the doctors go broke trying to find anything else</div>
<div class="line">wrong with you." </div>
</div>

And here’s what we get (shrink the width of the window to watch them indent):

“May your appetite be hearty and the waistband of your trousers slack. May there be
no household project to ever get the better of you. May you shit out the colon cancer
if it starts to grow back, and then may the doctors go broke trying to find anything else
wrong with you.”

This isn’t the only possible CSS solution — you could create a special class of unordered lists, for example — but I believe it’s the one that best takes the semantic web into account. But that’s a topic best left for another article.
(Back to top)

UPDATE (8/25/10): I didn’t cover the problem of how to center a block of text on the longest line, which is a useful thing to know how to do in presenting poetry. See Poetry and Verse in the HTML Page for tips. (Thanks to the author for bringing this to our attention in a comment below.)

Available light

Indian pipes

Solstice though it may be, this is nothing like the bright and open woods of midwinter, when the low sun floods the leafless trees and blue shadows craze the snowy ground. In the midsummer woods, small patches of sunlight appear, inch across the forest floor, and fade out. A photographer searches first for available light, and only then for subjects. These Indian pipes that were all aglow one moment were in shadow again before I could change the settings on the camera. One shot was all I got.

red maple burl

I was pleased to see a favorite burl illuminated. Grotesque arboreal bulges and hollows may be easier to spot in the winter, but they gain in mystery and significance when surrounded by the noisy, fecund life of high summer. What might have seemed as inert as the head of a mannequin now appears to pulse, the tree’s extruded heart — until the sun moves on.

funnel spider web

Funnel spider webs are everywhere. In full sun, their layers of silk act as prisms, capturing not just insects and bits of leaf dropped by caterpillars, but every color of the spectrum as they vibrate back and forth in what passes, this time of year, for a wind.

Under the Sky Born After the Rain, by Jorge Teillier

I think Chile in the 20th century produced more great poets per capita than any other country on earth. Jorge Teillier (1935-1996) grew up in the rainy south, and is best known for his poems of nostalgia and melancholy. But perhaps it takes a poet steeped in melancholy to write a convincing poem about happiness. Here’s my attempt to translate “Bajo el cielo nacido tras la lluvia,” the Spanish text of which may be found on his Wikipedia page.

Under the sky born after the rain,
I hear the quiet slap of oars against the water
and I’m thinking: happiness is nothing
but the quiet slap of oars against the water.
Or maybe it’s nothing but the light
on a small boat, appearing and disappearing
on the dark swell of years
slow as a funeral supper.

Or the light of a house discovered behind the hill
when we’d thought nothing remained but to walk and walk.
Or the gulf of silence
between my voice and the voice of someone
revealing to me the true names of things
simply by calling them up: poplars, roofs.
The distance between the clinking of a bell
on a sheep’s neck at dawn
and the thud of a door closing after a party.
The space between the cry of a wounded bird out on the marsh
and the folded wings of a butterfly
just over the crest of a wind-swept ridge.

That was happiness:
drawing random figures in the frost,
fully aware they’d hardly last at all,
breaking off a pine bough on the spur of the moment
to write our names in the damp ground,
catching a piece of thistledown
to try and stop the flight of a whole season.

That’s what happiness was like:
brief as the dream of a felled sweet acacia tree
or the dance of a crazy old woman in front of a broken mirror.
Happy days pass as quickly as the journey
of a star cut loose from the sky, but it doesn’t matter.
We can always reconstruct them from memory,
just as the boy sent out to the courtyard for punishment
collects pebbles to form resplendent armies.
We can always be in the day that’s neither yesterday nor tomorrow,
gazing up at a sky born after the rain
and listening from afar
to a quiet slap of oars against the water.

***

Thanks to everyone who helped out on Facebook with the line about the solterona loca. I’ll have to make a habit of “friend-sourcing” translation problems from now on. Further critiques are of course welcome, too. This was somewhat freer than my usual attempts at translation.

Bear family

Video link.
“Don’t get between the mother and her cubs.” That’s always what people say when they’re trying to scare you about black bears. Well, this morning in the woods above my house, I may not have gotten between them, but I got within 20 feet of them as they played beside one of our moss-covered trails, and I never felt as if I were in the slightest danger. You can see the reaction when the mother finally caught my scent — they were gone. Only afterwards did it occur to me that if she’d decided to charge, I wouldn’t have had any time to react.

Windy days are great for sneaking up on critters that rely more on their noses than their eyes. I wasn’t making any special attempt to walk quietly; the bears were simply making more noise than I was with their rustling around in the leaf duff, and didn’t hear my approach. I had the still camera around my neck and the video camera in my pocket, and I had to make two decisions pretty quickly once I realized a bear family was running towards me: first, do I lose myself in the moment and experience the encounter as deeply as I can, so as to better remember and write about it, or do I try and capture it photographically so I can share the experience with Via Negativa readers? And if the latter, should I take still photos or video?

I am still not sure I made the right decision on either account. I quickly went into a crouch to make myself less visible and prolong the encounter, which I think worked well, but it’s a less than perfect video because I couldn’t keep my eyes on the LCD display — I kept glancing past the camera at the bears. It was fun to see the bear cubs horsing around at such close range, and I regret not keeping the focus on them the whole time. There might have been more cubs up in the woods; we hardly ever see a mother bear with fewer than three cubs. But I suppose this could’ve been a first-year mother. She didn’t seem very big.

The bears ran up over the ridge and I didn’t attempt to follow them, though I did walk as quietly as I could after that. If I’d gone straight back to the house after the encounter, the whole walk wouldn’t have taken more than ten minutes out of my morning: a great reminder of why one should get up from the computer every once in a while. “It’s a dangerous business, Frodo, going out your door…”

Exchange

I cough into the night
& a deer snorts in alarm.
I am hungry & dangerous;
small bones & bits of muscle
get stuck in my throat.
My feline love of comfort
may dull my instincts, but
I still read fear as a form of praise.
And I want to tell the deer:
I am the animal who rid
these hills of your original killers.
Shall we resent each other’s part
in the conquest? We share
almost the pact between
a pastoralist & his herd.
The tamed woods are as easy
to walk through as a pasture now;
few thickets remain where a big cat
could lie in ambush.
But a summer night still teems
with things that rasp & tick,
other things that flash at eye-level
& in between, the dark milk of stars.

*

This was an exercise using all the words in the latest prompt from Big Tent Poetry.

(Update) Other responses to the prompt are here