Child Theme Frameworks
48
Child Theme Frameworks RYAN GREEN @RYNGRN RYANGREEN.INFO #WCNASH12 User Experience through the lens of
description
A look at child themes and frameworks from a UX perspective.
Transcript of Child Theme Frameworks
Child Theme Frameworks
RYAN GREEN @RYNGRN RYANGREEN.INFO #WCNASH12
User Experience through the lens of
Hi, I’m Ryan. Also known as Ryan Green.
I do User Experience. And love every second.
UX… what does it mean? No, it’s not double rainbow intense.
Analytics Design
Interactions
Usability
Hint: it’s someone you know.
Who engages in UX?
You do! Told ya you knew.
Everyone has a unique experience.
Child Themes Who. What. When. How. Etc. WTF.
What are child themes?
Straight from the horse’s mouth:
http://codex.wordpress.org/Child_Themes
“A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme.”
And a theme framework?
More from the codex:
http://codex.wordpress.org/Theme_Frameworks
A stand-alone base/starter theme that is intended either to be forked into another theme, or else be used as a Parent Theme template.
Advantages to using a framework to create your child theme?
Advantage 1:
Start with a bulletproof theme that works out of the box.
Advantage 1:
Start with a bulletproof theme that works out of the box.
Advantage 2: In event of total meltdown…
Just delete it And start over!
Advantage 3:
Roll multiple new themes from a custom theme you already created in no time!
Advantage 4:
Stays up to date with latest WordPress functionality & security.
Advantage 5:
You don’t need to know PHP! The learning curve for developing new theme elements, moving or adding widgetized areas, and major architecture changes is steep.
Advantage 6: Visual design principles can be baked in.
nataliedee.com
Disadvantages to using frameworks?
Disadvantage 1:
Commitment! Picking a schema means you are locked-in to learning it and using it.
Disadvantage 2:
Creativity and visual design may be required in minimalist themes.
Disadvantage 3:
Code bloat. When a theme tries to be everything to all people, it can make for big files!
When to Use a Framework
• When you are unfamiliar with PHP
• When a solid codebase and security is crucial
• When duplicating a current theme
with minor changes.
So what makes a good framework?
How it feels or tastes? Best gradient? Blondest hair?
A Good Theme…
Respects the Grid Uses Modern Code
Easily Remodeled Cares About Usability
Respects the Grid
• Consistent spacing • Utilizes a common grid system • Has a clear visual hierarchy
Uses Modern Code
• HTML5 • CSS3 • jQuery • HTML5shiv / modernizr.js
Easily Remodeled
• Core functionality • Widgetized areas • Navigation areas
• Use the House Hunters approach
Cares About Usability
• Phone. Tablet. Laptop. Desktop.
• IA-friendly
• Those with disabilities in your target audience
Included Frameworks
Twenty-Ten Twenty-Eleven
Genesis
http://www.studiopress.com/themes/genesis
• Many child themes pre-made
• Tried and tested by thousands
• Standard top-nav Layout
Genesis
http://www.studiopress.com/themes/genesis
Standard Layout. Easy to customize.
Genesis
http://www.studiopress.com/themes/genesis
Standard Layout. Easy to customize.
Genesis
http://www.studiopress.com/themes/genesis
Standard Layout. Easy to customize.
Thematic
http://themeshaper.com/thematic/
• Many child themes pre-made
• Also tried and tested by thousands
• Very changeable layout
Thesis
http://diythemes.com/
• Design-forward theme
• Optimized for load-times
• Awesome typography options
Stumblr
http://www.eleventhemes.com/stumblr-theme/
• Tumblr-style theme
• Minimal configuration
• Very content-focused
Barebones / Responsive • Skeleton http://demos.simplethemes.com/skeleton/
• Starkers (Original) https://github.com/viewportindustries/Starkers (1140px version) http://www.thedotmack.com/2011/07/19/1140-fluid-starkers-wordpress-theme/
• Whiteboard http://whiteboardframework.com/
• Roots http://www.rootstheme.com/
• Bones (Mobile-First) http://themble.com/bones/
[Obligatory Cat Picture]
Wrap Up
1. Every user that visits your site has an experience. Make sure it’s a good one.
2. Theme frameworks are your quickest ticket to solid backend code and an updatable (aka: more secure) theme.
3. Know your content. Know your audience. Determine whether a child theme is the route to take.
4. Theme is Grid-minded, Coded modernly, Easily adaptable, Usable.
Thanks! Any Questions?
Ryan Green @ryngrn ryangreen.info #WCNash2012
Awesome Image Credits: • Iconfinder.com • iconarchive.com • softicons.com • flickr.com • wordpress.com
