Subtext On Mobile Devices

• Aug 29, 2006
• 9 Comments
• Print

Scott writes about making DasBlog work on Mobile Devices.  The approach he takes is to programmatically detect that the device is a mobile device and then present an optimized TinyHTML (his term) theme.

Ideally though, wouldn’t it be nice to have mobile versions of every theme?  In fact, I thought this could be handled without any code at all via CSS media types.

Unfortunately (or is that fortunately) I don’t own a BlackBerry or any such mobile device with a web browser, so I can’t test this, but in theory, another approach would be to declare a CSS file specifically for mobile devices like so:

<link rel="stylesheet" href="mobile.css" type="text/css" 
    media="handheld" />

The mobile browser should use this CSS to render its screen while a regular browser would ignore this.  Should being the operative word here.  Unfortunately, at least for Scott’s Blackberry, it doesn’t.  He told me he does include a mobile stylesheet declaration and the BlackBerry doesn’t pick it up.  Does anyone know which devices, if any, do support this attribute?

For those devices that do, a skin in subtext can be made mobile ready by specifing the media attribute in the Style element of Skin.config like so (note this feature is available in Subtext 1.5).

<Style href="mobile.css" media="handheld" />

Refer to my recent overview of Subtext skinning to see the media attribute in play for printable views, which does seem to work for IE and Firefox.

What others have said

vern Aug 29, 2006 8:59 PM

# re: Subtext On Mobile Devices

Actually, on subText, it's really as easy as adding this to DTP.aspx;
<link id="MainStyle" type="text/css" rel="stylesheet" media="Screen" runat="Server" />

I realize I could (should?) have put it in some skin config, but I figured it should apply for the entire site.

That worked beautifully for me. I was trying to add a specific stylesheet for handhelds, but adding that made the difference for me on my Verizon XV6700, WM5.

Try viewing my site on your Rasbpberry and tell me how it looks...

I'm trying to pull yours up on my PPC but it ain't workin. When it does I'll let you know how it looks. and it looks ok, but your toolbar (home, archives, etc.) runs off the end. Specifically, Resume and Blogtegrity are the offenders. Oh, and the post about skinning; one of the graphics is a little too wide.

vern Aug 29, 2006 9:01 PM

# re: Subtext On Mobile Devices

I should point out that this doesn't make the skin look better on a handheld, but rather makes the site look better by essentially removing all the skinning elements. Which is not what you were talking about.

I'll shut up now.

vern Aug 29, 2006 9:10 PM

# re: Subtext On Mobile Devices

I suppose I should point out that specifically I added media="Screen" to the <link id="MainStyle" and <link id="SecondaryCss"...

haacked Aug 29, 2006 9:30 PM

# re: Subtext On Mobile Devices

Ah, good point. So by explicitely specifying screen, you remove the style from handhelds. Interesting. I wonder if it works on the Crackberry.

Scott Hanselman Aug 29, 2006 10:44 PM

# re: Subtext On Mobile Devices

Veer's site looks fine on a blackberry, but it's 282k! That makes it dodgey for everyone but Verizon Edge folks on an unlimited data plan.

My point, I think, is that a site really needs tailoring to work well on mobile. Maybe the stylesheet thing will work in a year or so.

vern Aug 29, 2006 11:37 PM

# re: Subtext On Mobile Devices

Yeah, I don't think there's an easy way to address the size of the site being loaded.

How big is yours or Phil's?

I don't know how I would tell on PIE how much data got loaded, so I guess it's irrelevant.

But, something I was thinkin' of; the emulator images for both PPC and SmartPhone are freely available for download.
http://msdn.microsoft.com/mobility/downloads/Emulator/default.aspx

I don't rightly know if they've got images for pre WM5, but who cares about those suckers?!?

Actually, yeah, they do.
http://www.microsoft.com/downloads/details.aspx?FamilyID=57265402-47a8-4ce4-9aa7-5fe85b95de72&DisplayLang=en

You can also get a Slackberry emulator;
https://www.blackberry.com/Downloads/entry.do?code=060AD92489947D410D897474079C1477

But, as Scott stated, the device doesn't recognize the media=handheld spec.

So Scott, when you say mine looks fine, does that mean there's no left/right scrolling needed? It fits in a "single column" so to speak?

One more thing; Minimo (Mozill for handhelds) and/or Opera mobile, and maybe others, might recognize the media=handheld. Something to look into...

Damien Guard Aug 30, 2006 4:55 AM

# re: Subtext On Mobile Devices

There is a full mobile device emulator included with VisualStudio 2005.

Just use Tools > Device Emulator Manager.

Pick something you wan to emulate with, start it. Then configure the networking and you're done.

[)amien

Wyatt Barnett Aug 30, 2006 9:48 AM

# re: Subtext On Mobile Devices

This specific blog is pretty workable on the old blackberry 7290.

That said, I think that developing a stripped down mobile version makes sense for a number of reasons. First, there is the page size thing. Second, and larger imho, is that mobile surfing is far different from normal surfing. You do it in different places, under different time constraints and with different concerns. Furthermore the ui is vastly different. Try navigating pages only using tab and shift-tab and you will get the idea of how navigation on a blackberry can feel. Mobile browsing really is a different application and cannot quite be handled with css alone.

haacked Aug 30, 2006 11:41 AM

# re: Subtext On Mobile Devices

@Scott and @Wyatt, great points. I think a Subtext Mobile skin is in order.

What do you have to say?

Title:

Name:

Email: (never displayed) (will show your gravatar)

Website:

Comment: Allowed tags: blockquote, a, strong, em, p, u, strike, super, sub, code

Please add 7 and 2 and type the answer here: