tag:blogger.com,1999:blog-207449382024-03-13T20:08:02.347-07:00Scooter Graphics BlogMarty Pfeiffer's design adventuresMarty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.comBlogger102125tag:blogger.com,1999:blog-20744938.post-33538840278401126872010-07-10T21:28:00.000-07:002010-07-10T21:29:59.756-07:00I've got big plans for the new Fontographer...<span class="Apple-style-span" style=" ;font-family:Arial;font-size:medium;"><p>I finally finished reading the Fontographer manual! It's over 500 pages.</p><p>A few things I'd like to try have to do with OpenType. I'd like to standardize my fonts with certain features--like automatic ligatures, fractions, etc. I haven't decided exactly which ones, but I'm excited that it will all be doable in Fontographer. Of course, it's not exactly straightforward--you have to create a text file using Adobe's language to define features. However, once that file is set up, as long as the fonts all have the proper characters, you can reuse that file for other fonts.</p><p>I think I'll experiment with a new font and release it as freeware to test out the features. Of course, <a href="mailto:scooterboy@mac.com">feedback</a> will be welcome and appreciated. Look forward to it!</p></span>Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-52582541879525126852010-06-27T00:30:00.000-07:002010-06-27T00:32:18.895-07:00New Fontographer! Release planned for updated Nu Casual<span class="Apple-style-span" style="font-family: Arial; font-size: medium; "><p>Fontographer has finally been updated to version 5.0! I'm in the process of reading the manual. It's a bit of deja vu, as I'm sure I've read it over a decade ago. However, there are a few new things here and there, so it's worth going through the whole thing again.</p><p>My plan is to regenerate all the fonts in OpenType format. Then there will just be one format for all the fonts--no more worrying about whether it's TrueType or PostScript, Mac or PC. I'm sure that it will be much less confusing for customers as well. Sometimes too much choice is a bad thing.</p><p>Anyway, we'll take it one font at a time. I'm going to get Nu Casual ready for re-release. As you can see in previous entries, I was in the middle of a small re-design. Unfortunately, I never released the update due to circumstances.</p></span>Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1153024288837398022006-07-15T21:28:00.000-07:002006-07-15T21:31:28.846-07:00Vampires and cedilliasWorking on the extended character set for Nu Casual to match the design work I've done in the main alphabet. Today, I fixed the cedilla characters.<br /><img src="http://www.scootergraphics.com/blog/images/Nu-Casual-old-vs-new6.gif" alt="" width="125" height="261" border="0"><br /><br />I went to Anime Expo 2006 a couple weeks ago. It was a lot of fun! The highlight was being able to see not only CLAMP in person, but also another of my favorite Manga creators, Koge-Donbo. Koge-Donbo's Pita Ten is one of my favorite manga outside of CLAMP works. I'm currently enjoying her Kamichama Karin series as well.<br /><br />I also got to see the first two episodes of <a href="http://www.moonphase.tv/">Moon Phase</a> (coming out 8/29/06--just in time for my birthday!) in the English dub. I've been wanting to see this one for a while, since my favorite american voice actor, Monica Rial, is playing the lead. You may have heard Monica on such shows as RaXephon, Full Metal Panic, Kodocha, Burst Angel or Excel Saga. She's a very flexible voice actor, and not just in the kinds of voices she does (most folks can't recognize her voice in Burst Angel), but also on the type of energy she brings to each character.<br /><br />Anyway, Monica is wonderful as Hazuki the cute (<a href="http://en.wikipedia.org/wiki/Tsundere">tsundere</a>) vampire.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1140413098253977142006-02-19T21:23:00.000-08:002006-02-19T21:24:58.376-08:00Almost Finished Nu CasualI saw snow on the mountains for the first time this year! Woo hoo :-)<br /><br />OK, here's an almost finished Nu Casual:<br /><br /><img src="http://scootergraphics.com/blog/images/NuCasComplete.gif"><br /><br />So basically just a bit of spacing and other testing to do and I'll be able to release it. There will be a bit of a change to the formats available. I'm discontinuing plain PostScript and instead I'll be releasing TrueType and OpenType (PostScript flavored). Since the OpenType version is exactly the same for both platforms, that cuts down on a bit of work for me. That's not the only advantage, of course! Basically, plain PostScript is a dead format, and it has been for years. Adobe doesn't even sell plain PostScript fonts anymore.<br /><br />So I'm off to watch the third episode of Pretty Cure Splash Star... Hope you had a good weekend, too :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1140297557844201472006-02-18T13:18:00.000-08:002006-02-18T13:19:17.856-08:00Table + CSSA Table + CSS combination seems to be the the best way to format pages like this blog. The problem is the sidebar. The current workaround in CSS for a colored sidebar is to put a background image the size of the bar you want and have it repeat all the way down. This has problems, too, though.<br /><br />So I decided that on non-navigation only pages (basically every page other than the home page, really!), I will use tables and CSS for positioning and formatting. I'll be sure to keep the tables simple and let CSS do most of the heavy lifting. Currently, I'm using just one 3 x 3 table to format an entire page, so I don't think that's too heinous. I think that when you start putting tables in tables, you have to rethink your approach.<br /><br />I've been working on Nu Casual, too! Probably have something to show on Sunday.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1139806317921399672006-02-12T20:44:00.000-08:002006-02-12T20:51:57.933-08:00Nu Casual Splash StarOn my walk this morning, I had a design revelation: the design of each of the three sizes of Nu Casual needs to be the same. So, specifically, if the 20 pt font has a rounded end, the 14 and 16 pt fonts also need a rounded end, even if the bitmap font for those sizes does not allude to one. I don't know why I didn't design with this in mind from the beginning, as I have applied this approach on Essence. I spent a few hours today fixing the 14 and 16 pt fonts to match this new design philosophy and I am pleased with the results of the blend of the three fonts now:<br /><br /><img src="http://www.scootergraphics.com/blog/images/Nu-Casual-old-vs-new4.gif" alt="" width="450" height="261" border="0"><br /><br />I've also made sure to include overshoot in all of the curved endings, so they will appear to be just as tall as the endings that are not curved. I don't know how relevant this is, however, since the Casual font has a very variable baseline and x-height :-)<br /><br />In other news, the new season of Pretty Cure has started. This time, it is a whole new cast. They have also changed the name of the show to Pretty Cure Splash Star. Two episodes have broadcast so far, and I think that the show gets away from the "fake Dukes of Hazard" syndrome with Mai and Saki being the stand-ins for Nagisa and Honoka. The scenarios are very similar: cute little creatures from another world recruit two girls to be Pretty Cure and fight against powers that would destroy the little creatures world and probably move on to Earth, too, for good measure.<br /><br />However, there are already some differences in the setups of the two shows, for one Mai and Saki seem to be willing to take up the mantle of Pretty Cure right away, whereas Nagisa didn't want to (partly because she thought she could never get along with Honoka). Also, it turns out that Mai and Saki met each other (and the magical creatures) before becoming Pretty Cure years ago. So they have a bit of destiny playing out for them in the new show.<br /><br />The production values for the new show are excellent. There is a greater use of CG (unobtrusively) and the character designs are appealing (Cure Bloom's pineapple hairdo notwithstanding). Basically it looks like they know what worked well in the first show and have expanded on it, rather than reinventing everything. Like Nagisa, Mai is into sports and like Honoka, Saki is the brainy one. It worked as a good contrast before, so there's no reason to change it.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1139111428343810052006-02-04T19:47:00.000-08:002006-02-04T19:50:28.353-08:00Now with cuter tails!This week was really busy at work. So today was the first time I was able to work on Nu Casual again. This time, I've added overshoot to the upper and lower case characters and changed the tails to be more consistent. Here's the sample:<br /><br /><img src="http:/www.scootergraphics.com/blog/images/Nu-Casual-old-vs-new3.gif" alt="now with cuter tails" height="261" width="390" border="0"><br /><br />I think that I'm going to go back to the old "4"--since it's more "charming."Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1138605420637744972006-01-29T23:13:00.000-08:002006-01-29T23:17:00.650-08:00Horie MituskoWell the first month of the new year is almost over. I feel that I've accomplished a lot, but there's still a lot more to do. I finally finished up the number in Nu Casual 3. However, the blended design needs some further tweeking, so I'll post a sample later.<br /><br />Lately, I've been listening to <a href="http://www.animenewsnetwork.com/encyclopedia/people.php?id=2595">Horie Mitsuko</a> and the Pretty Cure image albums. An odd combination! Horie is one of those singers that you can immediately identify. She's been around forever (she's been singing professionally longer than I've been alive) and has done a good job maintaining her voice. I was unsurprised to read that she also plays violin. Her expert use of vibrato on long notes belies her other skills :-)<br /><br />Most of her songs from the 70s are in an American 50s style which I like quite a lot (current favorite: Candy Candy). Times were simpler then, or at least the music was. Her latest work can be heard on the ending music duet in the first season of <a href="http://www.advfilms.com/titles/godannar/">Godannar</a>. Great show, BTW.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1138082259837676022006-01-23T21:56:00.000-08:002006-01-23T21:57:39.846-08:00Nu Casual 3I've done more work on Nu Casual 3. Today I focused on the lower case characters. Mostly I'm finding that the type of design choices are making tend to be making Nu Casual a bit more normal. The original Nu Casual had a few design oddities that were purely a result of the process, rather than aesthetic choices. So I'm taking a less mechanical approach this time.<br /><img src="http://www.scootergraphics.com/blog/images/Nu-Casual-old-vs-new2.gif" alt="" width="390" height="261" border="0">Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137992468491766272006-01-22T20:57:00.000-08:002006-01-22T21:01:08.696-08:00Well, well, well...Have you ever tried to do something new and found that it was harder than you thought? And along the way, has someone shaken your confidence--making it even harder to accomplish your goals? Well that's happened to me. But I'm not giving up, no way. I'm going to keep trying until I get it right (<a href="http://www.advfilms.com/titles/kaleidostar/">Kaleidostar</a> reference, by the way).<br /><br />So anyway, I've been working on Nu Casual lately. I started on a 3.0 version back in 2000, but I got distracted and never finished. The funny thing is that Nu Casual was a design prototype for Essence. I took the three bitmap sizes of Apple's Casual font from the Newton OS and made an outline font for each one. I then merged them together to make one outline font that had all the characteristics of the three bitmap designs.<br /><br />I was very happy with the results from the original Nu Casual, however, I've always thought it could be a bit better. So that's what I'm doing. But instead of just working on the one font that is Nu Casual, I'm going back to the original three outline designs. I figure that I can come up with better ways of approximating the original bitmap design by working directly on that.<br /><br />I use the template layer to store the original bitmap of the size I'm working on. So I need to be able to see the original bitmap and the vector shape at the same time. The problem that I've been having (at least up until today), is that FontLab altered Fontographer's template layer display. Fontographer displayed the template image as pure black, instead of the grey that the older version of Fontographer. This makes working on the vector shape difficult because you can't see what you are doing.<br /><br />Thankfully, version 4.7.2 fixed this problem!<br /><img src="http://www.scootergraphics.com/blog/images/Nu-Casual-old-vs-new.gif" alt="" width="390" height="261" border="0">Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137647241288439062006-01-18T21:06:00.000-08:002006-01-18T21:07:21.303-08:00Moving the blog to BloggerIn the near future, the Scooter Graphics Font Blog will be on <a href="http://www.blogger.com/">Blogger</a>. I've already transferred all the entries (from 1996 to today) to <a href="http://scootergraphics.blogspot.com/">http://scootergraphics.blogspot.com/</a>. The only thing left to do is to develop a template so that my blog has the same look as the rest of the Scooter Graphics web site. I don't imagine that will be too hard.<br /><br />I got the UNDER17 final concert DVD yesterday. Super sweet! Halko has super powers over audiences. It was amazing to see all those glow sticks waving and people jumping in sync to the music. Not just a group of people near the front--the whole place was connected up.<br /><br />I've been listening to Halko's newer material (post-UNDER17, that is) and I can definitely hear a difference. The UNDER17 material was really good, but it was more limited than the songs that Halko is doing as a solo performer/composer. She's broadening her scope these days to many different styles. She's already mastered the dempa music style, so it's on to the next challenge for her.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630764253505532006-01-14T16:31:00.000-08:002006-01-18T16:32:44.253-08:00Home page up-scalingYou will notice that the <a href="http://www.scootergraphics.com/index.html">home page</a> is a bit larger. I've increased the size of everything by 33%. It was pretty easy to do, once I had the CSS code all set. Just multiply all the pixel dimensions by 1.33333 and you're set :-) I also increased the size of the images. The eWorld style icons were enlarged using two different methods. For some of the icons, I have designed scalable vector versions in Photoshop. So resizing those is trivial. For the rest, I found a method that seems to give good results without looking too fuzzy (a problem when resizing images from small to large).<br /><br />First, I quadrupled the size of the original image with nearest neighbor resampling. Then, I copied the color table to the desktop. After that, I convert from index color to RGB. Next, I resize the image down to the size I want using bilinear resampling. I finish by converting from RGB to index color, using the color table I have on the desktop to make sure the colors stay the same.<br /><br />Pretty easy, but it took a bit of experimenting with different resampling methods to get satisfactory results.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630693731146002006-01-13T16:29:00.000-08:002006-01-18T16:31:33.733-08:00Early morning adventure & Essence updateSo I got up this morning at 2 am to get cat food. However, I had to go to three stores to find one that was open 24 hours a day. Here's a surprise to me: the real world is NOT like the Internet. On the Internet, everything is open 24 hours a day. The real world, not so much.<br /><br />Pixel is happy, though, and that's what matters.<br /><br />Essence is coming along nicely. I'm considering selling a "deluxe" version with all the different point size fonts included. Basically a recap: I'm designing another Espy Sans font called Essence. This time, I'm creating a scalable font based on four different point sizes of the original Espy Sans font.<br /><br />So to do that, I: 1) create a scalable font for each of the 10, 12, 14 and 16 point sizes Espy Sans, 2) use Fontographer's Blend function to create a 11 point font based on the 10 and 12 point fonts, 3) Blend the 14 and 16 point fonts to make a 15 point font, 4) Blend the resulting blended fonts (11 and 15 point) to make a 13 point font. Simple!<br /><br />Each different point size of Espy Sans is a little different in design. So each of my fonts <i>based on</i> those sizes is also different. It seems like a shame to design four fonts and then just release one.<br /><br />In related Essence news, I've decided not to alter the letter spacing from my blended design. I tried that, and what I got was a font that looks OK, but doesn't really look that much like Espy Sans on screen. So the extremely tight letter spacing of Espy Sans will be carried through into the design of Essence.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630581603241442006-01-10T16:29:00.000-08:002006-01-18T16:29:41.603-08:002nd Level SolutionAfter investigating a way of doing the secondary navigation with a seperate unordered list, I've decided to do something even simpler: just a single line of HTML with pipes between the links. This was the look I wanted for the secondary navigation, anyway! (I tend to prefer simplier design. Intricate work is beautiful, but it's not my specialty, so I design what I do best.)<br /><br />The secondary navigation goes into the banner area, so I either have to put the banner as a background image or use a seperate DIV for a shortened banner. I'm thinking I'm going with the seperate DIV for the banner graphic under the navigation. My primary reason: in CSS-less browsers, putting the banner image in the background will result in no banner at all being displayed. I'm sure, dear reader, you would agree that outcome is non-optimal!Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630530670979102006-01-09T16:27:00.000-08:002006-01-18T16:28:50.673-08:002nd Level NavigationI think that FLOAT is best avoided if possible. What worked fine in Safari and IE on the Mac did NOT work fine on IE on Windows. I was previously floating the SG corner logo and the putting the banner next to it. Totally unnecessary, now that I think about it. When you have two elements that have known pixel dimensions, using absolute positioning makes much more sense. I keep running into this at work, too: if you have two possible solutions, pick the simplest one. A lot of times, I think I understand something, but I really don't. But that's OK! Part of learning is getting over the fact that you don't know everything you need to know :-)<br /><br />So I've been searching and searching for tutorials on doing second level navigation with CSS tabs. Most of the solutions I have seen require the first level of tabs to be all the same width and in some implementations, changing the font size in the browser badly breaks the tabs. Not good... Too many compromises are being made to do something that should be simple. That should be your first clue that you are barking up the wrong tree.<br /><br />I think the problem is that folks are trying to used nested unordered lists to acheive the two levels. This is a mistake, in my opinion. It would make sense to do that if access to second level navigation was <b>necessary</b> on every page. But that's hardly ever the case. Second level navigations is only of any good to users if it is attached to the first level navigation that it goes with! Using nested unordered lists in this manner produces a site map on every page in browsers that don't support CSS.<br /><br />Loading the user up with information that they don't currently need is no favor to them!<br /><br />So my two-level navigation solution is simple: instead of using nested unordered lists, I'll use two <b>sets</b> of unordered lists. The main tabs will be on the first set and the second level navigation will be on the second set. This means that the main tabs can stay the same for each page, while the second level navigation will have to be re-written for each main level. That's not so bad, really. And it keeps a lot of unnecessary code out of individual pages.<br /><br />I can't believe I've wasted a whole day looking for a no-good solution when there was a simple, <i>correct,</i> one waiting for me at 9 pm!<br /><br />P.S. I still don't know how/when to use FLOATs :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1136838288963424852006-01-09T12:21:00.000-08:002006-01-09T12:24:48.970-08:00EssenceSo have begun finishing the work on my Essence typeface. I am very happy with the appearance of Essence on anti-aliased displays. It's very Espy Sans-ish. I've been using Essence for about 3 years now, but I've decided to finally release it this year. Yeah! Finally a new font :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630437671868502006-01-07T16:25:00.000-08:002006-01-18T16:27:17.673-08:00CSS conversionThe <a href="http://www.scootergraphics.com/index.html">home page</a> is now formatted entierly with CSS. I got the "Reaching Out" to float in the <a href="http://www.scootergraphics.com/blog/examples/quickanswers.html">correct position</a> this morning. It is just a nested list! Simple solutions are the best.<br /><br />I'm starting to think that an enlargement of 150% from the original design might be a little too big. I was basing my change on the improvement in screen resolution since the site was launched. The difference between 72 ppi and 96 ppi is 1-1/3x, so that would mean just 133.3%. Fortunately, pencils have erasers and graphics can be resized down.<br /><br />I'm looking forward to adding tabs to all the pages. Maybe I'll work on that tonight after I get back from riding my <a href="http://www.vespausa.com/">Vespa</a>. Ciao!Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630330514141212006-01-06T16:24:00.000-08:002006-01-18T16:25:30.516-08:00Old eWorld recreationsI've been having fun trying to recreate old screens from eWorld in CSS and HTML. Since most computers don't have the old eWorld fonts on them, the recreations don't look exactly the same, but they are pretty close.<br /><br />The original eWorld screenshot:<br /><img src="http://www.scootergraphics.com/blog/images/quickanswers.gif" alt="" width="512" height="321" border="0"><br /><br />My <a href="http://www.scootergraphics.com/blog/examples/quickanswers.html">HTLM/CSS version</a> :-)<br /><br />I'm having trouble getting the "Reaching Out" to float, so I left that off on my first attempt. Perhaps a different apporach will get the same effect. I'm thining that maybe if I make that a second level unordered list, it might work.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630219005352222006-01-03T16:22:00.000-08:002006-01-18T16:23:39.006-08:00HalkoI think I've found something that will solve my font problem. It's an automated system of replacing text with a graphic called <a href="http://artypapers.com/csshelppile/pcdtr/">PHP + CSS Dynamic Text Replacement</a>. Yeah!<br /><br />In other news, I went to the Post Office this morning to pick up my package from Japan. I ordered two Halko (<a href="http://www.animenewsnetwork.com/encyclopedia/people.php?id=8546">Haruko Momoi</a>) items. One was a CD+DVD of <a href="http://www.starchild.co.jp/special/tsukune/staff_cast.html">Majokko Tsukune-Chan</a>. It's a 15 minute show (just one short episode on the DVD) about a magical girl who seems to be a bit of a troublemaker. I've watched it and wish I could tell you more about it, but my Japanese is very limited :-(. Another problem is that there is almost zero information about the series in English. (Just watch, this blog entry will become #1 in <a href="http://www.google.com/">Google</a>.) In the very first part of the episode, she "rescues" a stranded, starving hiker by magically barbecuing her mascot character for him. He appears as a ghost in the remainder of the episode.<br /><br />So Halko provides the voice for the main character as well as singing and composing the opening and ending songs (the full versions are on the accompanying CD). The songs are very different from her previous work, at least in terms of instrumentation. I may be wrong, but I don't think I heard a synthesizer of drum machine on either one! The opening song starts with violin (played "fiddle" style), xylophone, banjo and drums. A flute, glockenspiel and spoons can be heard later in the song. Halko sings in her "cute" voice, of course.<br /><br />The other Halko item was Wonder Momo-i. This has two songs that NAMCO uses in the game "Taiko no tatsujin." Folks that are familiar with Halko's sound are bound to be surprised by the title song.<br /><br />Wonder Momo-i starts out electronic and then quickly moves into horns, guitar, Hammond organ and drums played in a <a href="http://phobos.apple.com/WebObjects/MZStore.woa/wa/viewAlbum?playlistId=73648469&i=73648580">Mighty Mighty Bosstones</a> style. Halko sings in her "cute voice" mode. Suddenly, a hard rock guitar starts up and the vocals take a more aggressive tone--the first time I heard it, I was sure there was another vocalist on the track. Someone really good, too. Nope, still Halko! She has an amazingly flexible voice. (A similar surprise is waiting for fans of <a href="http://www.animenewsnetwork.com/encyclopedia/people.php?id=2074">Monica Rial</a> when they hear her performance as Jo in <a href="http://www.burstangel.com/">Burst Angel</a>.)<br /><br />She also sings her own baking vocals on this track. I've noticed this before, she has developed a "method" to these. She uses a <i>different</i> voice for each baking part. So if the main vocal is say: cute and a little sexy, the baking vocal will be VERY cute and innocent. Quirky, but very, very good!<br /><br />L-O-V-E! Do your best! Momoi!Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630134899949662006-01-02T16:21:00.000-08:002006-01-18T16:22:14.900-08:00Table-less layout using CSSHappy New Year!<br /><br />I'm getting a lot closer to having a table-less layout using CSS. I'm finding that of all the technical tricks I'm learning, the most important trick is to stay organized. I've actually sketched out the different parts of the site on a piece of paper and refer to this as I'm working with nested DIVs. It's really helpful.<br /><br /><img src="http://www.scootergraphics.com/blog/images/byhandwebdesign.JPG" alt="" width="319" height="254" border="0"><br /><br />What isn't helpful is font embedding. I'm trying to acheive a certain "look" based on the eWorld user interface. So I need to use a bold narrow font for some of the text. Unfortunately, Impact is a bit too bold and not narrow enough. Arial Narrow is OK, but doesn't really duplicate the look. If I could just embed the font I want to use, I wouldn't have to go through this compromise! But current embedding technologies for web browsers are pretty bad and not well supported.<br /><br />So maybe I'll use images for the text I want. I know that sounds very non-CSS-y, but as a designer, it's what is necessary. Hopefully the future will provide a better solution. In the meantime, I'll just make sure that the alt tags of the images are correct. THAT is a compromise I can live with :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137630061881488962005-12-30T16:20:00.000-08:002006-01-18T16:21:01.883-08:00Simple = SimpleGot up this morning at 5 am and continued. It turns out that I had misunderstood how padding works. I was previously using layer positioning to put the tabs where they should go. However, this approach doesn't work when you want to cover something that is to the left with white (the blue bar is a repeating image, 1 px tall by 91 wide). So I knew I had to put the layer at the very left and top of the page. But when I did this, the tabs lined up against the SG logo, not the colored banner.<br /><br />So if I can't move the layer, what do I do? I guessed that the solution was in moving the content inside the layer. All it took was a simple padding-left: 91px and my <a href="http://www.scootergraphics.com/new-logo.html">blue bar problem was solved</a>.<br /><br />The lesson here is that if you are trying to do something simple, the implementation should also be simple. Stop and re-think if it is not, chances are, you've missed something basic.<br /><br />In other news, I am eagerly awaiting Momoi Haruko's WONDER MOMO.i CD from <a href="http://www.cdjapan.co.jp/">CDJapan</a>. I also ordered Majokko Tsukune-chan volume 1 + CD--an OVA series I know almost nothing about. Momoi plays Tsukune-chan as well as performing the OP and ED music. That's good enough for me! Momoi is probably best known for her role as <a href="http://www.advfilms.com/titles/komugi/">Nurse Witch Komugi</a>. She was also the singer/songwriter in the duo UNDER17. Her voice is unbelievably cute :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137629993119992672005-12-29T16:19:00.000-08:002006-01-18T16:19:53.120-08:00Side bar troubleAlmost have the design in <a href="http://www.scootergraphics.com/new-logo.html">CSS down</a>... As you can see, the side bar is giving me a little trouble. I'd continue working on it, but if I stare at this screen any longer, my eyes will fall out.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137629946689410912005-12-28T16:18:00.000-08:002006-01-18T16:19:06.690-08:00I take it all backCSS-based formatting is the way to go. I've spent the day struggling to understand how to make tabs with text instead of images using CSS. Basically, I've put together two techniques I learned from two different web sites to just get the simple effect I was trying for. Now that I've spent all this time, I fell like I'm fully committed to making CSS-based formatting the default for this web site.<br /><br />The benefits are pretty amazing, even if you don't utilize all the features CSS can provide--seperate style sheets for print vs. on screen, more accessible web design by reducing the reliance on images for navigation, layers, etc. So I'm going to spend the time to do it right. It's the language of the modern web.<br /><br />I've also decided from a practical and design perspective, different colors for each section of the web site is no good. So we'll be going with what I call "Scooter Blue" or #3366CC AKA #36C. You know, <b><font color="#3366cc">THIS COLOR</font></b>. Please look forward to it!Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137629881367615402005-12-27T16:17:00.000-08:002006-01-18T16:18:01.366-08:00Navigation BarsSo I have been working on the navigation bar at the top of this page (soon to be at the top of every page). I added a mouseover in Adobe ImageReady, but I'm not sure it's absolutely necessary. It's neat but maybe a bit gimmicky. I took a look at the HTML for the mouseover and was pretty surprised to see how long it was! Back in the old days of the Internet, that kind of superfluous nonsense wouldn't be tolerated. Why, eight years ago if you put that on your page, you would have people boycotting your site outside your house with picket signs and everything (my memory on this may not be exact...)<br /><br />So back to reality. I'd like to have this on every page and if I need to make changes, I'd like it to change automatically (or at least magically) in GoLive. I'm sure there is some way to do that using stationary or something.Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0tag:blogger.com,1999:blog-20744938.post-1137629835775609762005-12-23T16:16:00.000-08:002006-01-18T16:17:15.776-08:00Cubase acting upAggh! I know that it is a poor workman who blames his tools, but Cubase is starting to drive me nuts! My Tascam firewire audio interface doesn't fully control Cubase even though it's in Mackie emulation mode... Why? Who knows... Maybe I need to upgrade. Why can't stuff just work? Should I spend the money to upgrade from SL 2 to SX 3 or should I jump the boat entirely? I think that once I get all my hardware/software stuff on my music mac sorted out, everything should just work all the time. I just need to do some more research to get everything to work properly. Next year, that is!<br /><br />Merry Christmas, y'all! :-)Marty Pfeifferhttp://www.blogger.com/profile/16240075593571034740noreply@blogger.com0