citrusmoon

Not a BlogScarf

First of all, I'm cold. We ran out of heating fuel over a month ago, and so far it's been okay - an especially mild early spring, so we decided to suck it up and wait 'til next fall to spend the 200+ euros it takes to fill the tank. But today is rainy and coldish, and it feels damp and clammy inside. Therefore, in about 15 minutes I'm going to throw all care to the wind, put aside all the things I want to work on and all the things I should work on, and go snuggle on the couch with a book. Under a blanket. With a hot plate of yesterday's homemade tuna casserole.

However, I wanted to stop in to say that I was playing around with more blogscarf stuff this morning, and I have a nice one that I will put up later, as soon as I get a section set up for this. In the meantime you can look at a page example using one that I'm not going to offer as a blogscarf. Basically it's a failure for that idea because it's not self-contained in the sense that it needs at least top and bottom rules to work, plus it really only works well with bright colored, sort of vague and smeary patterns in the background, which makes choosing background tiles to use with it quite limited. Also, in the end, I'm not satisfied with design; it's almost nice, but some things about the balance of it bug me a lot. Nevertheless, there it is; you're free to use it if you find something to do with it that works, but it's not going on the "A" list. You'll find the background I used on this posted here.

Posted by taz on April 21, 2004 at 05:51 AM in BlogScarf | Permalink | Comments (0) | TrackBack

BlogScarf: day iii

I'm terribly scattered today, but I do have one new blogscarf (blogscarf? are we going with that name?) graphic that I've played with a bit by adding some slight shadow features to try to tame the jaggies a bit. The other two were from basic webding fonts, but this guy's my very own, and I'm calling him "Blobby". You can see him here.

Now, let's try something else: To pick up the pattern that I used behind Blobby, try clicking here for a direct link to the .gif. I've changed the file permissions (or whatever the hell you call it - "access permissions"?) at citrusmoon.net to allow direct linking of image files from this site. But of course, I have everything in cache on my browsers, so I can't really be certain if it's working (- even when I delete the cache, I don't feel like I really know, you know?). If this file will not come up for you, please leave a comment here, or drop me an email.

Posted by taz on April 20, 2004 at 03:52 AM in BlogScarf | Permalink | Comments (0) | TrackBack

BlogScarf: day ii

A small note on yesterday's BlogScarf post: I've updated that entry to link to a better page for the example that lets you view different backgrounds behind the image. Also, I'd just like to menton that this .gif, in particular (the leaf), is a pretty touchy example of what can be done. Since we are using .gif transparency to define the image area, we lose the ability to blend from the color area to the surrounding white field, so all of these image will suffer at least a little from the "jaggies", and an image like the leaf that has very thin areas is especially prone to that problem. But part of the reason for making the "different-backgrounds" example page is to show how different patterns can minimize or maximise the problem, and using a more demanding image like the leaf is good for that (this one, for example, with its light and dark print, visually reduces the problem). Some background patterns will work better, and some will look worse, so you'll want to try different backgrounds with different images. I'm testing various things at the moment - like trying out images with shadows, for example - and will be putting together a gallery of .gifs-with-transparency that are best suited for this usage.

Posted by taz on April 19, 2004 at 01:49 AM in BlogScarf, Site design, Site News, Tips, TypePad | Permalink | Comments (3) | TrackBack

BlogScarf?

So. I've had a little bit of time in the last day or so to play around with an idea that has been on my mind a while: creating site graphics that use repeating patterns behind .gif transparency to create a design. I've re-written that sentence five times, and it still isn't clear at all, so just go look here. The image on the left is simply a .gif in which the negative space is white and the positive space is transparent, and I've used CSS to give the .gif a background image. (Like this: <img src="http://citrusmoon.typepad.com/photos/tiletest/scarf.gif" border="0" style="background: url(http://citrusmoon.typepad.com/photos/tiletest/lilly2.gif);">)

The idea is to make something that is totally simple to insert into any web page even if one is a complete novice, that will allow you to change the background (and therefore the whole feeling of the graphic) very easily, and that offers a lot of pizzazz at very small download sizes. For that example blog page, for instance, I used only the options offered by Typepad's most basic template sets, with no customization at all (no converted, advanced templates, in other words). To put the image in the left sidebar I just made a TypeList "link" entry, ignoring "Link title" and Link URL" and putting the html in the notes section and then, under "Configure", choosing "Display notes As Text" (following Matt Haughey's tip for including a Google search form). Since I didn't want any text on top of the graphic, though, I just put a spacebar space into the TypeList "List name" field when creating a new TypeList. Setting up the entire blog probably took about 20 minutes (though of course I already knew exactly what I wanted to do, and already had the transparent .gif image and the title image).

I'm calling this a "blogscarf" at the moment, because like a scarf or a tie, it enables you to quickly express different looks and moods while the basic "suit" remains the same. I'm not sure about the name, though; too silly? Suggestions, anyone? Please?

I've only just started really finally dealing with this, and I want to put together a variety of graphics enabled this way, so I'm not quite ready to set up a section for it yet. However, you can play a bit by going to this example page where you can click on different backgrounds to see how they work behind another magic .gif. Click a tile and you'll see the background of the .gif appear; click another tile and the background will change. Tthis will give you an idea of the possibilities. Please note, though, that in order to allow you to see different backgrounds behind the .gif I used Javascript; when actually putting one of these on your own page, there's no need to do this - you just put in the .gif with a background image, then change the background or the .gif image whenever you feel like it. This page has a lot of images to load, but the real deal is really quite small. The one I used on the actual blogscarf blog page takes up about 6-7K altogether. Once I get a few designs together I will create a space for this, with everything spelled out. In the meantime, Thoughts? Ideas?


A note: I've updated this post to link to the improved version of the second example page instead of the one-big-gif-on-top version.

Posted by taz on April 18, 2004 at 06:16 AM in BlogScarf, Site design, Site News, Tips, TypePad | Permalink | Comments (5) | TrackBack