Friday, July 20, 2012

Responses to Questions From My "Four Paths to Mobile With Flare" Presentation

Thomas Z

Q: If I make a medium for another output is the second medium styles saved in the existing CSS style sheet?
A: Yes, they’re saved in the CSS under a section header that looks like @media... For example, all the custom settings that I made for my mobile medium are saved in the CSS under the heading @media mobile. That section and its first style entry look like this:

@media mobile
{
            h1
            {
                        font-size: 12pt;
                        color: #1e90ff;
            }

…plus any additional settings.

Craig P

Q: Do you do any kind of CSS reset for your projects?
A: I haven’t had the need to but it’s one of those things that’s on the horizon. (If you’re not sure what a reset is, try this article - http://sixrevisions.com/css/css-tips/css-tip-1-resetting-your-styles-with-css-reset/.)

Q: Mediums know mobile versus print, etc. How might screen size be handled?
A: The next step after mediums, officially called “media types” by the W3C, is “media queries”, also from the W3C, where you can actually set properties like screen size and related actions – e.g. “if screen size > 300 and < 600, do X…” kind of thing. If media queries aren’t near the top of the priority list for Flare 9, I’ll be shocked.

Q: What's the name of the first CSS book you mentioned? Authors?
A: “Cascading Style Sheets:Designing for the Web (3rd Edition) by Lie and Bos. It’s not fully up to date as it was published in 2005 but, IMO, is the clearest book you’ll find on the subject and the best way to get the basics. Then plan to go online to read up on CSS3 and media queries and all the newer stuff.

Heather J

Q: It looks like you couldn't really display help along with the application. Do you see downsides to that?
A: There’s obviously a downside but that that’s only true if a given device won’t multi-task, in which case the help may have to be embedded in the application. Depending on what you’re writing help for, you may also be able to use Flare to create a WebHelp Mobile output and tie it “context-sensitively” to an app. I did this using a native app authoring tool called ViziApps, the one I mentioned, and Flare, and wrote a white paper about the process for MadCap last summer. I can send you a copy if you’d like. Let me know.

Sue A

Q: Could you have two mediums for mobile - phone and tablet? How do you add a medium?
A: You can have as many mediums as you want. (But remember that mediums let you set style properties but not adapt the content to the device size. For that, you want to get up to speed on media queries – see above.) To add a medium, open the Stylesheet Editor, click the Options pulldown on the right end of the Stylesheet Editor toolbar, select Add Medium, and name the thing. Select the desired medium using the Medium pulldown on the Stylesheet Editor toolbar. You can’t delete a medium via Flare’s interface. You have to open the CSS file and find and delete everything under the "@media mediumname" heading. It’s not a major problem but is inconsistent. I expect this to be corrected in Flare 9.

David W

Q: What do you recommend doing with tables in phone form factor and does CSS handle it?
A: That’s a tough one. First, I’d try to simplify my tables way down and conditionalize them for mobile output. Second, I’d grudgingly accept the fact that some tables are wide and have to be scrolled, just as I accept the fact that I sometimes find a landscape-formatted page in a printed book and have to turn the book sideways to read it. CSS does handle tables but it depends heavily on how well the device standard itself handles tables. For example, ePub doesn’t do a particularly good job, in my experience, with any table more complex than simple rows and columns. But check the particular standard you’re using.
Stephanie L

Q: how do I add a back button to my web mobile output?
A: Take a look at the Back and Forward “buttons” at the bottom of the canvas on the WebHelp Mobile emulator. Those act like the equivalent buttons on a browser toolbar. Let me know if you had something else in mind.

1 comment:

M Sunny said...

Professional SMS
Our professional messaging service offers a multifarious and flexible product to business customers that we can customize after their individual needs.