Touch Device Text
h1 Heading | Color Background
The HTML5 container type can be selected from article, aside or section.
The font can be web safe, goole hosted with web safe fallback or a non web safe font with fallback.
Since it is in a container, the heading type is h1 and can be styled for size, color, background color, text align, style, weight and line height to adjust the overall heading area height.
The paragraph text can be styled for font size, color, background color, line height and text align.
Line breaks are created using the HTML <br>
The container can be given a radiused border and/or a box shadow.
The overall container padding can be adjusted.
The widget has options for styling text hyperlinks. These include a control for adding vertical padding when used on a page designed for touch devices to increase the target area for fingertip stabbing. The minimum value for this should be 7 to 8px.
Links for touch devices should use the Touch Link Tab Widget if possible.
How to choose the container type?
The <article> element specifies independent, self-contained content. An article makes sense on its own and it should be possible to distribute it independently from the rest of the web site.
An <aside> is like a sidebar and contains content related, but not essential, to the main page content.
The <section> element is just what it says. It defines a section of a document containing related content. A section can have a header, h1, h2, h3 headings, text content, figure with figcaption and a footer if required.
This widget is included in the Touch widget pack.