Entries tagged with ‘jontangerine’

Display:

Tags

  1. Naked in Tahiti (where’s Ms CSS?)

    Naked!

    Naked again. Why, oh why every year do I feel the urge to cast off the perfidity of style and expose my structure to the world? A question never to be answered, but merely enjoyed on CSS naked day!

    Love my semanticness (sp?). Love my form, my structure, my HTML, your browser (which is actually styling the HTML right now,) and markup in general raw and unabridged.

    Hey, on an unrelated note, did I tell you about that time in The Seychelles when I was naked and kinda playing guitar with my…

    Oi! You have a filthy mind. Enjoy the day folks, long may the tradition continue!

    Share

  2. Elastic to Elástico

    After the recent translations of The Incredible Em & Elastic Layouts with CSS article in to Italiano and Deutsch, Raul Blanco of bitebit has kindly stepped up to the plate with an Español version:

    “Como crear Layouts elásticos usando la medida Em”

    It’s hosted for Spanish comments and discussion at Macoteca.

    Muchas gracias, Raul! Another hero to add to the ranks of those kind enough to give their time to massage my prose in to a more eloquent tongue. If Spanish is your language, please consider dropping by there to show him some appreciation, or give a little link love. Thanks!

    Share

  3. From Elastic to Elastisch

    Screenshot of http://greattalk.ch

    Another hero volunteer has been kind enough to translate the Elastic layout article—this time into German. All praise to Pascal Birchler for taking the time to wade through the detailed prose and extract some local meaning from it.

    Die unglaublichen Em & elastischen Layouts mit CSS is available on his web site where discussion and comment in German would be most welcome. Thanks, Pascal!

    Thanks to Michael Kalina for the kind email correcting my title for this post. It’s now been changed to actually make sense to German-speaking folks!

    Share

  4. Complex Type: CSS Fix, ClearType Miss

    When an elusive penny drops, it’s always a good moment. Earlier today, I was thinking about the complex type rendering problem of a few days back. Skim that post, before you carry on and things will make much more sense.

    Suddenly, I realised what the solution was, and fixed the IE7 CSS problem in 5 minutes: After giving every element some padding and an invisible border—effectively forcing IE to recognise the element dimensions—it now renders the glyphs properly and doesn’t cut off loops or terminals that are outside the conventional em. Tinkering afterwards took another two hours but now the homepage has a new type experiment type folly for the masthead!

    So that’s the CSS sorted. I bumped into a IE7 problem with Eric Meyer’s unitless line heights along the way too, but that needs more research.

    Unfortunately, the ClearType anti-aliasing problem is out of my control. We simply can’t tell Windows to not use it, or to do it better. That’s up to users themselves, or Microsoft. So, for anyone looking at this site using Vista with ClearType enabled, here’s what you're missing:

    Safari screenshot

    Fig 1. OS X/Safari 2 screenshot of the masthead.

    For those of you lucky enough to be viewing using a Mac, or Safari on Windows, here’s what you're not missing:

    IE7 screenshot

    Fig 2. Parallels/Vista/IE7 screenshot of the masthead.

    The difference is stark. Even Windows standard rendering smooths large-sized text better than this. Update: See for yourself:

    Screenshot in IE7 using standard font rendering

    Fig 3. Parallels/Vista/IE7 with ClearType switched for standard rendering.

    ClearType seems to get worse as the font size increases. It sounds impossible that ClearType could be so bad, but my copy of Vista is a virgin Vista Ultimate, running on Parallels. No settings have been changed at all, and the only software installed apart from standard applications are browsers and anti-virus.

    So, there we have it, I predicted my own pedantry wouldn’t allow me to leave it be. With character predilections, as with rendering engines, knowing is only half the battle.

    Let me know what you think of the masthead type. You might even see it completely differently to me with a similar configuration. I’d be very interested in seeing a screenshot. I've not tested it in IE6, so bear with me while I get around to that. Is it worth keeping, even with the absence of decent smoothing in IE7/Vista?

    Share

  5. From Elastic to Elastici

    Screen type.

    Thanks to the fantastic voluntary effort of Nicola Pressi, the elastic design tutorial has been translated into Italian. May good karma reign down on her him (oops!).

    If anyone else is bilingual and would like to translate the article for the benefit of local technicians, please download my vCard and get in touch. A few thank you links are the least you will receive, to go with the good karma from such a generous gift of time and skill.

    Share

  6. An Ode to Exersize Book Margins

    Remember your old school exersize books? If you went to school in the UK, you’ll probably remember the margins, with a red or grey vertical line giving the page a little elbow room (and trying to make your writing line up.)

    Mine would end up full of all sorts of things: Numerous red “Sp” spelling reminders from the teacher (nothing᾿s changed you’ll note), with oft–begrudged marks of “7/10”, as well as my own art, in the loosest sense of the word. That would include snippets of ubiquitous bubble writing; predictably inspired by the girls who seemed to love it—and anyone who could do it well—even more than Wotsits or Cabbage Patch Kids. There would be various malformed “Chad” and Fido Dido sketches (inspired by 7-Up ads in Singapore when I was younger,) and carefully crafted reproductions of Biffa Bacon next to attempts at rendering male reproductive anatomy. Banksy wasn’t even a twinkle in his mummy’s eye at that point, and anyway, Chad and mutated willys were easier to draw than teddybears with Molotov cocktails.

    Therefore, I decided to resurrect the exersize book margin in my print stylesheet. It’s still a little messy and very verbose and will, no doubt, be massaged into pedantic cleanliness over time. The stylesheet, that is, not the margin.

    Asides and small pictures are pulled into the margin where they belong, leaving you bags of room for your own notes, doodles and experiments in anatomical drawings of the male reproductive organ. Ah, but if only browsers would respect orphans, page-break-after:avoid, page-break-inside:avoid and other useful print CSS, but that is a tale for another day. Do a print preview to take a peek. Perhaps the best margin art™ should win a prize—what was in yours all those years ago?

    Share

  7. One Giant Leap for Tangerines

    Houston, we have lift off! It was a bright, crisp autumn day in Bristol to match the launch of this shiny new site. Share the joy of this milestone with me. Share my desktop too:

    Moleskine doodles and my desk

    Between starting this site and now, the keyboard has created many a client’s site by being depressed, and many a bizarre idea has destroyed the clean pages of the notebook. It almost sounds like this site is the product of mild mental illness. I’m saying nothing. It’s been a long road. Anyone for a pint?

    Now, time for the sober, serious business: None of this would have been possible without the tender ministrations, and occasional mayhem of developer extraordinaire, Jon Gibbins. May the gods look kindly on his transgressions in pursuit of his art. Say no more. Nudge, nudge. Oh, I was being serious, wans’t I? OK, OK. He’s great. I owe him more than a sane man would give, or tolerate receiving. There’s more about Jon’s contribution in the colophon.

    Jon Gibbins

    Jon Gibbins

    Wow, I feel like I'm playing pretend Oscars in front of the mirror clutching a hairbrush and a vase, but it’s all good. Let the exuberance flow where it may. Thanks also go to Chris, for never ceasing to apply the subtle pressure of asking about jontangerine.com—beware this man, he’s a lethal friend and webapp security guru.

    Chris Shiflett

    Chris Shiflett

    So, what have we here? Well, let me show you around (imagine a big grin:) Under the hood (that’s bonnet for us Brits) we have some plain old semantic HTML (POSH) with juicy slices of microformats from hAtom to rel-tag and lots in between. It has been remixed with CSS but delivered to you without any background images or superfluous presentational shenanigans.

    I think of this site in terms of user’s experience: Mine, as a publisher, will hopefully be one of managing a lifelong file; a notebook for my own life. In fact, that’s what you'll be seeing – notes garnered from diverse sources crafted hacked into entries. Hopefully, it will be something my family and I can read in years to come and laugh at Daddy’s dodgy writing style. Up to now we have a blog, and aggregated asides from my bookmarks, tweets and events. You may think of it as a blog. I call it log. Part humour, part true denominator. Hopefully you'll be entertained, at least for a little while.

    Over the coming months and years you'll find me publishing on all kinds of different topics from interface design to typography to user experience, whether Web or not. There may even be a few tangerines hanging around. I'll try not to bore you, and I hope you like what you see. In the meantime, if you stumble across any bugs, please let me know, it will be much appreciated. Thanks for taking the time to wade through this thorny prose and please feel free to say hello, anytime.

    Share

  8. IA Update

    Just a note to point you in the direction of the site rather than the feed if you want a peek at the latest update.

    The homepage has changed: Random, rotating images with captions have been added using an adapted version of Jon’s PHP randomiser, and I’ve used the excellent customisable Feed Digest service to display my latest del.icio.us links with their PHP include option. An about page has also been revealed which includes most of the information that used to be on the holding page like contact details and my personal note.

    Hope you like it! As always, it’s temporary until we finish the latest round of the application (now code–named Lifelong File). The phrase “code–named” always makes me smile. It makes the application sound like a secret agent. During these baby steps towards full launch, all feedback is still appreciated. I will get around to ironing out any IE creases shortly but in the meantime that poor cousin of a browser can hold fire with it’s embarrassing imperfections.

    Share

  9. Feeding the Growth Culture

    Experience designer, Alan Colville has just joined our collective. He’s an experienced user centred design specialist who previously designed the interface for Telewest’s video on demand and personal recorder services — no mean feat given the constraints of Web TV so we’re all happy to be working with him. Please head over to Grow and commiserate with him if you wish.

    Alan Colville

    Alan Colville

    In the next few days he’s going to be publishing some great insights into usability and experience design which I’ve been lucky enough to have a sneak peek at. Keep an eye on the Grow feed if you’d like some practical insights into the user centred design.

    I’ve added a Feedburner feed for anyone masochistic enough to subscribe to my special fried spam. It’s hand coded and seems to be valid, but feel free to let me know if you get any problems.

    This is my lo–fi intermin solution. Neat, eh? Apart from sating my natural urge to publish and venting a little verbosity, there’s something appealing about not having to field comment spam, too. We’re old school, baby!

    Share

  10. First Glimpse into The Tangerine

    In the last few weeks I’ve sorely neglected the development of this site. Sorry site. In mitigation I should say I’ve moved house (on the hottest day of the year so far no less) and been laid low by a virus.

    Today I’m juggling a few proposals and jumping a train to London for a late meeting around a new social media site we’re developing. To be followed by a little supper, time allowing. I’d tell you more about it but I want it to be a surprise. Suffice to say, we’re excited, British humour is coming to a domain near you.

    My youngest son managed to front flip himself out of his cot last night like a scene from the imagined movie, “Escape from Cotatraz”. He achieved this feat of gymnastics even while encapsulated in a baby bag. Unfortunately, apart from a hug from his dad, a carpet burn on his forehead was his only reward. Cot adjustment was called for and completed with a 5mm allen key. “Man work” as my wife would say.

    Today is shaping up as a good day. Perhaps I’ll feel differently when I get back home at midnight but in the meantime all is good with the world. May the same be said for yours!

    Share