EOWG F2F November 2016/Tutorial Discussion

Carousels

• In general good feedback
• Slight controversy over the introduction of a styling page
  • Editor (Eric) leans pro introducing, Kris Anne +1, Shadi -½
  • What does the group think?
  • Highlight accessibility aspects of the CSS.
• Introduce a wireframe illustration of the carousel?
• Use SVG to allow people to import into their tools.
  • Maybe different page.
• Split Example to -> Working Example, Example Code and maybe Wireframe

Page Structure

• Overall good (mainly wording) comments.
• Started as “Fundamentals”, basic building blocks, and now has amassed everything that is needed in other tutorials.
  • Eric + Shadi in favor of splitting it up, to make the purpose of the individual sections more clear and not conflate the meaning too much.

Proposal from Shadi (for lively! discussion)

The following two tutorials would replace the current Page Structure tutorial:

• Page Structure
  • Page Regions: header, main, footer, other page regions
  • Page Headings: h1, sensible order, consistent use, ...
  • Page Components: markup lists, tables, widgets, etc.

• In-Page Navigation
  • Page Anchors: add IDs and display them (reference Page Structure)
  • Skip Links: describe in a bit more detail than we do right now

Some sections from Page Structure would go into those new tutorials:

• Site Navigation
  • Navigation Bars: specific tips on navigation bars (reference Menus)
  • Site Search: specific tips on site search (reference Forms)
  • Multiple Ways: Sitemap, Breadcrumbs, other?

• Text and Layout
  • Default Properties: size, color, font-type, line-spacing, etc.
  • Text Flow: recommended minimum & maximum width, margins, reflow, ...
  • Other?
  • Work with LVTF, CorgnitiveTF?

Menus

(space for notes if we touch on menus)

Beyond

List of possible future topics (on GitHub)

Meeting Outcomes

• Page Structure
  • Page Regions
    • Wireframe for this?
    • Interactive Demo?
    • Page source code example?
  • Labeling Regions
  • ++Search – new page
  • Headings
  • Content Structure
  • -- Styling – move to Design
  • -- Multiple Ways – move to Site Navigation
• Site Navigation
  • ++Skip Links – new page
  • Multiple Ways
  • … (others?)
• Design
  • Text Styling
  • Layout
  • Mobile First
  • … (others?)