Entries Tagged as 'Featured'

10 Geeky Web Tricks with HTML5 and CSS3

It’s a glorious time to be a web geek! Did you see the cool effect the folks at Google added to their logo the day before they made their big announcement about changes to the perennial search engine? It’s gone now, but for a brief period when you moused over the logo, it flew apart in colorful blobs avoiding your mouse.

To most people’s surprise (OK, maybe only to most web geeks’ surprise), this interactivity was not created with Adobe Flash, but instead using the most recent versions of common Web technologies. It’s likely that you’ve already benefited from these new Web technologies: HTML5 and CSS3. They are already popping up all over the place, despite the fact that they are not supported in the most popular browser, Internet Explorer <insert dramatic pause here> at least not until today!

That’s right, the next version of Internet Explorer version 9 will support HTML5 and CSS3 and that version will be released today 15 September as a public beta!!

And there was much rejoicing!!!

Our long nightmare is finally over. Now everyone will be using a modern browser and Web designers can finally do really cool things without Flash. Ok, maybe I’m being premature — it’ll take a while before everyone is upgraded — but a guy can dream, can’t he?

The great thing about any ground breaking technology is all of the cool experiments that get thrown together. The early adopters are less worried about finding practical applications and more interested in just playing around to create new toys. Let’s play with a few today!

Below is a list of my favorite 10 new Web toys. Of course you will need a modern browser — Safari 5 or Chrome 6 are usually best, but Firefox 3.6 will work for a lot of them. If you are running Windows — and are very brave person — you should go download Internet Explorer 9 right now and test these toys out. Let me know in the comments if all of them are working for you in your browser of choice.

Continue Reading “10 Geeky Web Tricks with HTML5 and CSS3″ on GeekDad»

via GeekDad.

Beyond Biff, Bam, Pow: 10 Graphic Novels To Enjoy With Kids of Every Age

The Little Endless Storybook by Jill Thompson

The Little Endless Storybook by Jill Thompson

Comic books, graphic novels, sequential art or manga; whatever you call them, illustrated books are a great way to tell a story. I’ve been reading comics for most of life, except for a brief period from age 12 to 16 when I thought I was too old for them. Boy was I wrong.

I’ve been reading comics to my kids almost since the day they were born, mixing them in with other storybooks and eventually novels. One of the great things about reading comics is that graphic stories cut out all of the boring “He said” and “She said” stuff. If you combine this with distinctive voices for the different characters, your kids will always know who’s saying what, making stories much easier to keep up with.

Here are a few of their favorites, roughly arranged for age appropriateness from younger to older readers.

Read the full article on GeekDad »

Headed to Web Directions USA

The Web typography road show is heading to the southern USofA for the Web Directions USA Conference. Oddly enough, the conference was originally to be called Web Directions North, as a follow up to Web Directions in South, which is held in Australia. Someone must have pointed out to the organizers that any event with the word “North” in the title was not likely to draw a huge audience in Georgia.

Web Directions USA

A lot has been happening this years, and—now that I’ve finished my new book on CSS3—I’m turning my full attention back to Web typography. I’ve retooled and reworked my 2010: The Year of Web Typography presentation, expanding and enhancing information about Webfont service bureaus,and refining the slide layout and color scheme to make them a lot easier to read on those big brother style projectors we use to show our slides.

Web Directions USA isn’t free, but you can save a bunch of money using my discount code to get $100 off the ticket price. Just go to the Web Directions registration page and enter the discount code WDUSA-JCT.

But that’s not all! The day after the conference (Saturday) there will be a hack day event called Amped. I’ll be on hand to give 1:1 Web typography and CSS3 advice all day long:

Amped is the Hackday, reloaded, brought to you by Web Directions, happening in Atlanta this September 25. We’ve taken the traditional hack day, pulled it apart, thought long and hard about what’s great, what’s not so great, and how as many different kinds of web folks can come together for one intense 10 hour period of hacking, designing and making amazing things.
So come on out and say hello. See you in Atlanta.

Join Me At Voices That Matter

Voice That Matter Web  Design Confernece

Join Me!

I’m approaching the half way mark for my new CSS3 book, but I’m getting psyched up to amongst some heavy hitters in the Web industry at the upcoming Voices that Matter: Web Design Conference in San Francisco. It’s just a little over a week until I’ll be presenting a retooled and updated version of my session on Fluid Web Typography. If you want to get the latest on branding your sites through typography, be there.

The post-conference seminar with Tantek Çelik talking about HTML5 is already sold-out, but two days with Jesse James Garrett, Dan Cederholm, Steve Krug, and other luminaries is still yours for the taking.

If you are going to be there, let me know.

LIVE(ish) – Fluid Web Typography at SXSWi 2010

I was poking around the SXSW site, and realized that the recording of my session on Web typography is finally available. I had to pick through the code a bit, but finally found the file I needed to embed. For reference, I’m also embedding the slide share version of the presentation slides. It’ll almost be like being there!


View more presentations from Jason CranfordTeague.


The Evolution of HTML & CSS

I’m hard at work on my new book, CSS3 Visual Quickstart Guide, and I’m looking to get some feedback from you, my viewing audience. As part of chapter 1, I’ll be quickly tracing the evolution of both CSS and HTML, and I put together this timeline to help to show their relative development over the last 20 years (wow, has it really been that long). The bars in this timeline are based partially on the publication of each of the standards, but also on their relative effect on the Web. For example, although CSS1 was published in 1997, it took several years to catch on. Also, obviously, as one version of a standard grew in popularity, it’s predecessor would decline, but not always evenly.

This is not to meant to be an empirically exact chart, but to give viewers a general overview of when each of the standards was in it’s prime.

To help me out, either post a comment below or send me a message and let me know what you might add, subtract, change or improve, and thanks in advance for any help.

The Evolution of HTML & CSS Since 1991

The Evolution of HTML & CSS Since 1991

Heading to Berlin to Speak at Next10

Next10 Conference

Next10 Conference

I’m heading off to Berlin in mid-May to speak at Next10. The event includes over 100 high profile tech insiders speaking and is expected to draw over 1500 participants. The topic this year is “Game Changers,” and I have not one, but two, great game changers to talk about:

Marriott.com 2.0: Building the Next Generation Online Hotel Lobby

In August 2009 I took over as the Interactive Design Manager at Marriott.com. My first assignment was to launch Marriott’s new Web 2.0 face of Marriott; a game changer in the way that hotels present their front door to the world. When I started, the design was already finished and development was well under way. All I had to do was make sure it launched on time in November.  However, what I found was a product that would not work as designed. In this session, I will walk through the issues I encountered and how I worked with the designers and developers to solve them, showing how a few minor design tweaks not only allowed the site to be deployed on time, but also made it faster and more versatile.

2010: The Year of Web Typography

Fresh on the heels of my successful Web typography presentation in March at SXSW, I’m updating and expanding that work to help the thinkers at Next10. In this hour long session, I will not only show how modern Web typography works from a technical standpoint, but emphasize how businesses can use the new capabilities to help differentiate their online brand.

Use my promotional code to get a 20% discount on tickets: SpeakersFriends2010.

DEVO Focus Group Testing the Future at SXSW

I was privileged to participated in the DEVO Live focus group at SXSW this year, where I learned a lot about the rigorous of user research testing. If you look closly, I’m at the edge of the frame when the camera pans all the way to the left, wearing my Yuri’s Night T-shirt and standing next to my buddy Phil Djwa.

They also showed us this little movie explaing what DEVO is up to with it’s re-branding:

via DEVO – Focus Group Testing the Future – #3 .

Shame on You Apple: A Musical Odyssey

Most of my friends think of me as an unabashed Apple fanboy who drools over Steve Jobs’ every word. Truth-to-tell—although I’m a great fan of Apple’s products and design philosophy—many of their policies leave me chilled or outraged.

I was reminded of this recently while I stood watching the band Stricken City at the British Music Embassy that was a part of the SXSW festivities. I was really digging the band, who had shades of Siouxsie and The Banshees and the Yeah, Yeah, Yeahs. As they started into their last song of the set, the lead singer gave out the obligatory URL and told the crowd that they could download this next song for free from their Web site.

You can't download music files directly from a Web site to your iPhone. Why not?

You can't download music files directly from a Web site to your iPhone. Why not?

Great, I’m thinking as I pull out my iPhone and navigate to the correct URL with my
“revolutionary Internet device.” I click the link to download the album, and an alert pops up telling me that due to restrictions by Apple, I cannot download the song with my iPhone. I will need to go to a computer if I want it for free or use the iTunes store to purchase it. I later choose the free option, sending the band a contribution for it’s hard work, but was miffed that I cold not grab the song and go.

There are no good technical, security, or legal reasons why I can’t download this freely available music file to my iPhone. The only possible reason for this “feature” of the iPhone is that Apple wants to be the single gateway for all information in and out of their devices. I can sympathize with this to a certain point. Apple wants to keep a quality and consistent experience for their customers. But not allowing me to download a music file and have it install in iTunes is going too far. This not only stifles competition, it also stifles innovation.

Take one of the most important apps on the iPhone: Mail. Mail has not undergone a significant improvement since it was first released with early model iPhones. It gets the job done, but there are some very basic and obvious features missing, most notably the ability to flag a particular message and view multiple accounts in a single list. Yet Apple obviously will not permit any competing products for this service. Yes, you can get some Web app based mail programs, but that’s not what I need.

I still think my iPhone is the best device I’ve ever owned, bringing me the promise of  40 years of sci-fi tech into my palm. But I would rather Apple not take page from the Microsoft playbook and establish itself as a monopoly.

Come on Apple, open up a little: you can still make the best products, gobs of cash, and keep that whole “Think Different” philosphy alive.

Sketchnotes for FWT

Thanks to Mike Rohde for making these great “sketchnotes” of my lecture at SXSW and the Web Typography dinner afterward at the Athenian Grill . For more of Mike’s great SXSW sketchnotes, visit his SXSW Interactive 2010 Flickr pages.

Sketchnotes from Fluid Web Typography.

Sketchnotes from Fluid Web Typography.

Sketchnotes from Web Typography Dinner

Sketchnotes from Web Typography Dinner

« Previous PageNext Page »