Presented by: Scott DeLoach
Moving from a very traditional medium (print) to a very popular one (mobile) these days is surprisingly easier if you are creating content from scratch than converting existing content, according to Scott DeLoach.
Mobile is already more popular than desktop and there are around 1800 million global mobile users. One of the more interesting facts coming out of this survey is that a lot of users search for information on a mobile, bookmark it and then access it via desktop or vice versa, which provides a vital clue on how we need to design information for our users.
What are some of the options for mobile content?
b. Webhelp mobile
c. EPUB and Mobi
As Scott pointed out, it’s not only the content, but everything needs to respond to screen size:
Some best practices, according to Scott
- Use media queries for phones, tablets, desktops and mobile. Media queries are the heart of responsive design and make it easy to change styles based on the device displaying the content, including the display type, width, height, orientation and resolution.
- Fluid images – You can use the code in a master page and apply it to all pages with images on them.
- For Responsive Web design – Don’t use points, inches, cms etc. Try rems (relative measurements). This feature is not available in Flare yet.
- Use <srcset> for images. With srcset, the browser does the work of figuring out which image can be best displayed on a medium.
In his presentation, Scott provided an exhaustive list of resources that can be used to effectively turn content into a mobile friendly format.
The discussed then featured a very important issue for writers.
How going mobile changes content?
a. Mobile first (write content for mobile and then go to higher devices) vs going mobile (content exists but you are converting it to mobile)
b. Writing style – style differs for different medium. Mobile content is very minimalistic
So, how does one prepare going mobile with Flare? You probably need some or all of these features to ensure you get the best mobile experience
a. Condition Tags
d. Skins – Use skins to make outputs look different (desktop, mobile, tablet)
e. Page Layouts
f. Master pages
g. CSS – Use styleclass to differentiate conditional text based on desktop/mobile. ex. “Click” on desktop, vs “Tap” on mobile
This was a very informative session, especially for those who were starting out on making their content mobile.