Archive for the 'Web' Category

TEI

Monday, December 16th, 2002

DocBook is intended for technical documentation, so it’s missing quite a few features I’m looking for in a fanfic management system. Specifically, it doesn’t handle verse and drama, though they’re essential for songfic, filk and screenplays.

Fortunately, there’s the Text Encoding Initiative, the somewhat dusty academic standard for marking up classic texts. Here are a few links:

DocBook

Wednesday, December 11th, 2002

Every time a customer sneezes, my company has a new product to support. The documentation issue is swiftly becoming a nightmare, so today I started looking into content management systems. Blogs are technically CMS’s, but I was looking for SGML or at least XML. I used to know a bit about this stuff, and I recognized DocBook straight off. Here’s my DocBook link dump:

It was unseasonably warm tonight, yet they’re predicting a snowstorm for tomorrow. The Boston weather might just be rain.

Towards Goofing Off

Monday, December 2nd, 2002

I’ve been trying to goof off, really I have. I had to try from work, though, and that made it harder. I did manage to download a new version of Analog, the world’s most popular web log analyzer. (That’s web server logs, not blogs.) Along the way I picked up DNSTrans to speed up the DNS lookups, and then I did them all over the DSL at work. Working on Sunday isn’t all bad.

I also downloaded JAXP, the Java XML Processing tools and Xeena, a Java-based DTD editor, so that I can play with my FicML DTD for fanfic. First, however, I must run the web logs. It’s been four months.

Netscape Without Pain

Monday, October 21st, 2002

After Windows ate her Mozilla installation, I convinced Jade to download Netscape 7. It’s just like Mozilla, except more bloated, with more popups. AOL’s not about to leave in the no-popup checkbox when they’re one of the worst popup offenders on the net. Don’t despair, though - ad-blocking can be restored easily with two clicks, thanks to the Unofficial Netscape FAQ.

On the style front, I wrote up something resembling instructions for all the recent blog geekiness. I’m also considering a change to my tan boxy pages, since they look too green on Windows. Green is for Buffy.

Moveable Color

Sunday, October 20th, 2002

I couldn’t help myself - I had to convert the technicolor blogger template I found a few entries back to Moveable Type. You can see it by clicking on the Technicolor link, or (soon) by visiting the sample blog.

Be warned, however, that the technicolor blog is somewhat processor-intensive, since the entire page changes color slightly every half-second or so. Also, it tends to leave color behind, so be sure to reload the page if you
switch to or from the Technicolor style.

The Latin text for the sample blog came from Lorem Ipsum’s Lorem Ipsum generator. If you need sample blog text, you can use the MoveableType import file I used to generate the 18 entries of my sample blog: loremipsum.txt. Note that
the entries have old dates and will not show up on the main page of a fresh
blog unless you change the MTEntries tag of that page to include lastn=”7″ or whatever number of entries you desire. I set MT to do the dates in Portuguese for that blog; it was the closest offering to Latin, but is different enough to do the nonsense-Latin theme justice.

I’m making a separate blog for Technicolor because it requires javascript, just like the style switcher, and I had to mesh the two scripts somewhat in my
main blog to get them to work together. I also made my sidebar unusually narrow, because that’s my blog style. In the sample blog, it’s wider and includes
the MT default calendar. Full instructions for using the stylesheet and javascript are included in those files: colorswitcher.css and colorswitcher.js. (As always, right-click and download if you can’t see the raw file in your browser.) You may want to cut out my instructions once you’ve followed them to reduce download time. You must leave Eric Costello’s header, however - those are his terms of use.

I’ve also changed my approach to backwards-browser compatibility again, so the Netscape 4 Khaki stylesheet has been taken down. This time, I put in a persistent stylesheet that looks almost like no style at all (persistent.css, if you’re curious). That way, it lurks underneath all the switchable styles, doing (hopefully) nothing, and for users with backwards browsers, it shows up just like Netscape 1.1. Yes, it’s backwards-compatibility with a vengeance. I was actually trying to fix the download delay problem; I’m not sure yet whether I’ve succeeded.

I almost forgot to mention that I made a second LCARS stylesheet, too. Like the first, it only works with Mozilla, Mozilla-derivatives like Chimera, and possibly Netscape 7.

Colorific

Friday, October 18th, 2002

I’ll get over my current geek phase soon, at least in time for NaNoWriMo, but for now, I’ve tweaked LCARS-1 for better text color and tracked down the source of that eye-bleeding technicolor blog template that was driving Seema and me crazy a while back: eric costello, with another good CSS resource.

In the quest for style I’ve also glanced at the W3 CSS Validator and some sites devoted to blog templates: Blogstyles and its sister site Blogplates. That’s all I could manage and work, too.

LCARS Style

Thursday, October 17th, 2002

LCARS stands for Library Computer Access and Retrieval System, and is the bane, or the Holy Grail, of Trek web design. I’m all for controversial designs based on authentic Trek colors so I’ve made an LCARS style sheet for MoveableType. There’s just one catch: you have to use Mozilla to see it. Netscape 7 would probably also work, but IE is counterindicated.

Usually LCARS sites are nasty table-based graphics-heavy things, but by specifying curved borders in your stylesheets, you can reproduce a Star Trek-style computer console without a single image. Only Mozilla supports curved borders, using the -moz-border-radius tags. I am not responsible for what you see if you click the LCARS-1 link in an unsupported browser.

Besides sprucing up the archives page, I also spent some time blogsurfing for good MT style. I found someone’s old entry on the issue of stylesheets and images - that is, how people who use CSS for web design look down on images. I hadn’t thought about it, but I also have a ingrained prejudice against images, which probably dates back to the days of Netscape 1.1 and plain grey pages with plain black text and plain blue links. It doesn’t help that I still connect with a 56k modem over a bad phone line - images make me run screaming the other way.

I did surf into some nice uses of images in blog design, though, in the rather restricted arena of banners and backgrounds: take a look at a plain banner, a fancy banner, and a banner that’s also a fixed background image.

On a mostly-unrelated Trek note, I saw “Time and Again”, one of the very first episodes of Voyager, recently with Dr. Deb. I annoyed her to no end by exclaiming how cute Janeway and Paris were together. The technobabble was a bit painful, but the episode was relatively good for first season Voyager. I should also confess that I saw Enterprise: Return of the Shower Scene this week while I was waiting for The Twilight Zone to come on. There was absolutely nothing interesting about the episode - but then, similar comments have been made about “Resolutions,” the sleeper that spawned an entire shipper movement.

I think it’s safe to say I will never write Archer/T’Pol.

Moveable Style III

Wednesday, October 16th, 2002

The style switcher seems to be working fine now, though there’s an odd delay loading the first styled page over slow links in certain browsers. Perhaps it has something to do with browser support for preferred stylesheets. In my fruitless investigation of the issue, I learned that the technical meaning of a preferred stylesheet is one with a LINK rel=”stylesheet” statement that also has a title attribute. If you have rel=”stylesheet” but no title, the stylesheet becomes persistent, which means that style in that file should apply to all the alternates as well. I’m not claiming it works - this is all rumor, hearsay and specifications.

I finally got around to adding switchable style to the search templates. (There’s a search box partway down the menu on the main page, if you want to try it out.) The two search templates can be found in a folder called =search_templates= at the same level as the MoveableType cgi scripts. You have to edit them in a text editor, since they’re not accessible through the MT interface in this version (2.5). You can import a template module into the search templates, but if you run more than one blog through the same MT installation, you might want to look at the manual before trying to use modules.

Some browsers (which is to say, Chimera) didn’t run my styleswitcher’s onload function in TrackBack popups, presumably because there was an onload attribute in the BODY tag of the TrackBack popup to seize the focus. I figured that was less important than supporting Chimera users, so I took it out, but it probably wouldn’t bother most people if it were left in.

I’ve stumbled across some nice MT stylesheets now that I’m on the lookout for them. Tapestry use a stylesheet for the archives, while the main page adds table layout. There’s no reason the main page couldn’t be done with CSS, also. The colors, while somewhat web-unsafe, are lovely.

Moveable Blog is clean, clear, and a great resource for MT users. My first TrackBack experiment will be pinging that blog from my first Moveable Style entry. Look for it over there.

Moveable Style II

Tuesday, October 15th, 2002

Being unable to leave well enough alone, I’ve added another stylesheet (Salmon Roe) and an improved version of styleswitcher.js which also handles the Netscape 4 issue.

The first change in mystyleswitcher.js is setting the cookie at the time a new stylesheet is chosen, rather than when leaving the page as the original script did. This fixes the odd instances where you switched styles, then opened a comment window which then appeared in the previous style. I thought this was important for checking out stylesheets and also cutting down on cookie (re)setting in general, though if the cookie gets corrupted the user will get no style at all. (Thanks to Jade for discovering the bug.) That situation can always be rectified by selecting a new stylesheet manually.

The Netscape 4 handling is just something that seems to work. I changed the javascript function that was used to look up the first stylesheet (that was, the one with a rel=”stylesheet” instead of a rel=”stylesheet”) so
that it would look up a stylesheet with “Default” in its title instead. [I’m not doing it this way anymore - I just hardcoded the name of my default stylesheet to save computing time. To see the code for finding a stylesheet with “Default” in the title, check out the broken switcher. (That wasn’t the broken part.) To see the original code for finding the primary stylesheet, see the original switcher. The function is called getPreferredStyleSheet() in both places.]

In effect,
this gives two default stylesheets, one for browsers that can’t do the javascript switching at all (that is, the rel=”stylesheet” one), and another for browsers that can (with title=”Default …”). I already had a default stylesheet for this blog (Classic Khaki, whose real title is Default Khaki) as well as a version of it I’d dumbed down for Netscape 4 (Netscape 4 Khaki, a.k.a. For Older Browsers), so I
just put those in the appropriate spots.

Next time, I’ll make that Ume Shiso Maki stylesheet, and perhaps spruce up Lavender’s Blue.

Moveable Style

Monday, October 14th, 2002

Take A List Apart’s article on style sheets, MoveableType’s set of default styles, one geek, and one holiday weekend, and you get…Switchable Type. Click on the various links under the Style header in the menu (probably directly to the right, unless you’ve strayed from the main page or have already changed styles).

How to do it yourself: (You may have to right-click on some of the following links and save them, if your browser won’t display them.) First, you need a set of CSS stylesheets to switch between. I used a couple that I had already made for MT, plus the full set of seven from the MT website. Each of the stylesheets must be listed in the header of the pages (that is, at the top of each page template in MT), in the usual place for LINK tags, and must have a title element:

<link rel=”stylesheet” href=”<$MTBlogURL$>styles-site.css” type=”text/css” title=”Default” />
<link rel=”stylesheet” href=”<$MTBlogURL$>mtclean.css” type=”text/css” title=”MT Clean” />
<link rel=”stylesheet” href=”<$MTBlogURL$>mttrendy.css” type=”text/css” title=”MT Trendy” />

If you’re using Mozilla, you can already switch between these styles from the View menu. Otherwise, you’ll need a javascript program to do the actual switching, styleswitcher.js. The javascript must be loaded by every page in the blog (or site) so it should be left in a separate file and loaded with a line in the header (near the LINK tags) thus:

<script type=”text/javascript” src=”<$MTBlogURL$>styleswitcher.js”></script>

Next, you need the links that will run the program when clicked. As an added bonus, the javascript program includes a cookie to keep track of which style has been selected, and remembers it from page to page. All pages must include the javascript itself, and the LINK tags, but the switching links can be put on just the main page. These HTML links call the function setActiveStyleSheet, according to the title listed in the LINK tag:

<a href=”#” onclick=”setActiveStyleSheet(’Default Khaki’); return false;”>Classic Khaki</a>
<a href=”#” onclick=”setActiveStyleSheet(’MT Clean’); return false;”>MT Clean</a>
<a href=”#” onclick=”setActiveStyleSheet(’MT Trendy’); return false;”>MT Trendy</a>

That’s all it takes. Feel free to grab my copies of the MoveableType style sheets as well as my own stylesheets for MT, or, if you’re working on a switcher for a website rather than a blog, take a look at the style section of my site for more generic style sheets.

The most irritating part of the process is editing each of your MoveableType templates to include the LINK tags and the SCRIPT line. For full style effect, you should do every template, including the ones you click to edit and the hidden search template. There’s a lot of clicking, pasting, and saving involved. I ended up linking all the templates to external files and making my own template modules to simplify matters, but even then it was the most time-consuming part of the process.

Templates are the peskiest part of blogging. MT is ahead of the pack, but it would help if all the templates were linked to files automatically the way the search template is. They could at least provide a power-editing mode for templates (indices, archives, and modules) so you could create them or link them to files in one fell swoop.

Another pesky MT problem I had was with the blog description, right under the blog title. The on-page blog title became an H1 header in the latest MT templates, which was all right and compliant and good, but the description beneath it was wrapped in SPAN tags, rather than DIV tags. I went through some trouble trying to figure out why I couldn’t reduce the H1 margins (at least in Chimera, my home browser), until I switched that SPAN to a DIV. My change doesn’t seem to do any harm to the MT stylesheets - I’m not sure whether those work properly without my change, or, if they do, why they do.

I’ve made a new stylesheet for the occasion: Lavender’s Blue. One other thing I should do is rewrite styleswitcher.js so that it forces Netscape 4.x to use the stylesheet that’s safe for old browsers. I’m not sure old browser-users can use the switcher at all - I’ll test that tomorrow. If they can, I may leave it up to them to click the link for paleo-browsers. Browser detection is not my cup of tea. I’d rather make more stylesheets.