The Non-designer's Guide to WordPress (Making Your Site Awesome)
“Design is not just what
 it looks like and feels like.
 Design is how it works.”
                    - Steve jobs
You’re Already On Your Way
•  WordPress works pretty damn well
   “out of the box”
•  Don’t let your theme & widgets
   get in the way of that
•  Good site design should emphasize
   your content, not itself
But…
“Everybody thinks they have
 good taste and a sense of
 humor but they couldn't
 possibly all have good taste.”
               - When Harry Met Sally
Good taste is
 subjective.
Good design:
not so much.
Photo: emiliokuffer on Flickr
Look Around. Get Inspired.
•  Pay attention to what you like about other sites
•  Find & Follow creative curators on the web
   and via social channels (like fastcodesign.com)
•  Listen to recommendations from designers
•  Apply what you learn
Start by making
your site your own.
Photo: LeonMMelissa on Flickr
Color
Color
•  The easiest way to make any site stand out
•  Mix pairs of unusual colors or pick one dominant
   color for emphasis
•  A little goes a long way,
   even monochromatic tones
   can be powerful
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Hex Colors
•  Annotation for the combination of Red, Green, and
   Blue color values (RGB)
•  HEX values are specified as 3 pairs of two-digit
   numbers, starting with a # sign
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Typography
Type Tips
•  Web fonts (@fontface) now allow you to use
   a variety of different fonts
•  Perfect way to add a
   unique touch to any design
•  Don’t use too many
•  Be careful when mixing
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Photos
Show Don’t Just Tell
•  Great photos are another powerful way to make
   your design stand out
•  Create rules for formatting and be
   consistent (rounded corners, specific width, right-
   aligned, etc.)
•  Always credit sources.
   Don’t steal!
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Page Templates
Use Different Page Templates
•  Built into many themes
•  Creates variety,
•  Can enhance different
   types of content
Theme Customizer
•  Introduced in WordPress 3.4
•  Make changes, preview them in realtime,
   before going live
•  More options to as theme
   developers further integrate
   it into updates
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Premium
   Theme
Frameworks
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Plugins
Plugins
•  Choose plugins that add functionality
   but allow control over their style/design
•  Take advantage of those controls to tie into
   your site’s style whenever possible
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
The Non-designer's Guide to WordPress (Making Your Site Awesome)
Sidebar
Triage Your Sidebar Often
•  Only include what you NEED to
•  Avoid too many third-party widgets (Facebook,
   Twitter, Flickr), can slow page load times
•  Limit # & size of ads unless
   you are making lots of money
•  Animated anything = annoying
:(
:)
Default widgets usually need tweaking
Consider consolidation
Other Bits & Pieces
•  Create & usa a favicon
•  Use built-in text formatting for posts & pages
   (H1, H2, blockquote, etc.)
•  Less is ALWAYS better.
   Simplicty is never a bad choice.
“A designer knows he has
achieved perfection not when
there is nothing left to add,
but when there is nothing left
to take away.”
             - Antoine de Saint Exupéry
Photo: Tsahi Levent-Levi on Flickr
Thank you!
      Mykl Roventine
      myklroventine.com
      @myklroventine

                  Headshot: Glimpses of Soul Photography

More Related Content

PDF
The Non-Designers Guide to WordPress (Making Your Site Look Awesome)
PDF
The Non-Designer’s Guide to WordPress (Making Your Site Look Awesome)
PDF
The Non-Designer’s Guide to WordPress (Making Your Site Look Awesome)
PDF
Drag-and-drop WordPress Themes, featuring Themify Builder
PDF
How to ensure a long life span for a website?
PPTX
Wiu talk
PDF
How to ensure a long life span for a website (WPHelsinki 2.11.2016)
PDF
User Focused Rapid Prototyping with small budgets using Drupal
The Non-Designers Guide to WordPress (Making Your Site Look Awesome)
The Non-Designer’s Guide to WordPress (Making Your Site Look Awesome)
The Non-Designer’s Guide to WordPress (Making Your Site Look Awesome)
Drag-and-drop WordPress Themes, featuring Themify Builder
How to ensure a long life span for a website?
Wiu talk
How to ensure a long life span for a website (WPHelsinki 2.11.2016)
User Focused Rapid Prototyping with small budgets using Drupal

What's hot (18)

PDF
What web designers could learn from print designers
KEY
D2WC Keynote
PDF
EIA 2015 Less Is More - Speedy Design
PDF
Jumpstart Your Web App
PPTX
Starting a Blog Checklist
PDF
Spooky WordPress: Disturbingly Brilliant Uses of WP
PDF
Building an Initial Custom Theme
PPTX
Creating Landing Pages That Convert
PPTX
Game Design as Career
PPTX
Good/Bad Web Design
PPT
My project
KEY
Samantha thebridge atlas camp 2012 talk
PPT
PPT
PPTX
Blogging
What web designers could learn from print designers
D2WC Keynote
EIA 2015 Less Is More - Speedy Design
Jumpstart Your Web App
Starting a Blog Checklist
Spooky WordPress: Disturbingly Brilliant Uses of WP
Building an Initial Custom Theme
Creating Landing Pages That Convert
Game Design as Career
Good/Bad Web Design
My project
Samantha thebridge atlas camp 2012 talk
Blogging
Ad

Viewers also liked (7)

PDF
Customers
PDF
Making WordPress Your Own: Theme Customization & Creation
PPTX
How Did Slaves Resist Slavery?
PDF
Tweak Your Resume
PDF
2015 Upload Campaigns Calendar - SlideShare
PPTX
What to Upload to SlideShare
PDF
Getting Started With SlideShare
Customers
Making WordPress Your Own: Theme Customization & Creation
How Did Slaves Resist Slavery?
Tweak Your Resume
2015 Upload Campaigns Calendar - SlideShare
What to Upload to SlideShare
Getting Started With SlideShare
Ad

Similar to The Non-designer's Guide to WordPress (Making Your Site Awesome) (20)

KEY
Stand Out Online and Land an Interview
PPTX
Social media for beginners presentation moreton bay council
PPT
Web site questions before starting own site (1)
PPTX
Content Strategy: WordCamp Buffalo 2012
PDF
Digital Footprint | Brand Yourself
PDF
40 killer content marketing and blogging tools
PDF
Green Hectares Rural Tech Factsheet – Website Design
PDF
Make your website work for you
ZIP
Unless It Was a Digital Dog, No One Ate Your Homework (Diigo)
PPT
Jump to Joomla - Barcamp Nashville 2010
PPT
Jump to Joomla - Barcamp Nashville 2010
PPTX
Digital skills v2
PPTX
Digital skills v2
PPTX
Digital skills
PPTX
How to get a great website
PPTX
What Developers Need Designers to Know about WordPress
PDF
Course Udemy WebDesign Basic
PDF
JONAS' RESOURCES FOR BUILDING BEAUTIFUL WEBSITES WITH HTML, CSS AND JAVASCRIPT
PPTX
Why blogging should be an integral part of your social marketing strategy
PPTX
Lauren Tamm - Becoming A Pinterest Powerhouse
Stand Out Online and Land an Interview
Social media for beginners presentation moreton bay council
Web site questions before starting own site (1)
Content Strategy: WordCamp Buffalo 2012
Digital Footprint | Brand Yourself
40 killer content marketing and blogging tools
Green Hectares Rural Tech Factsheet – Website Design
Make your website work for you
Unless It Was a Digital Dog, No One Ate Your Homework (Diigo)
Jump to Joomla - Barcamp Nashville 2010
Jump to Joomla - Barcamp Nashville 2010
Digital skills v2
Digital skills v2
Digital skills
How to get a great website
What Developers Need Designers to Know about WordPress
Course Udemy WebDesign Basic
JONAS' RESOURCES FOR BUILDING BEAUTIFUL WEBSITES WITH HTML, CSS AND JAVASCRIPT
Why blogging should be an integral part of your social marketing strategy
Lauren Tamm - Becoming A Pinterest Powerhouse

More from Mykl Roventine (20)

PDF
Inclusive Design: Website Accessibility with WordPress
PDF
More Than Words: The Power of Type
PDF
Social Media Strategies for Small Organizations
PDF
More Than Words: The Power of Type
PDF
Design Principles Overview
PDF
Design Principles for Non-Designers
PDF
Visual Storytelling: The State of “Show Me” Social Sharing
PDF
Planning for the Encore: Building An Online Community That Begs For More
PDF
Lets Get Social
PDF
Blogging Basics (for Nonprofits)
PDF
15 Essential WordPress Plugins (and 5 That Will Just Blow Your Mind)
PDF
Word press plugins speed datingWordPress Plugin Speed Dating
PDF
Demystifying WordPress
PDF
15 Essential WordPress Plugins
PDF
Just Your Type: Web Typography & You
KEY
Twitter Tools
PDF
Web Typography: Viva La Revolution!
PDF
You're So Money and You Don’t Even Know It: The Power of Real on the Social Web
KEY
Send/Receive: How to Make Telecommunications part of the social conversation
PDF
Personal Branding Bootcamp
Inclusive Design: Website Accessibility with WordPress
More Than Words: The Power of Type
Social Media Strategies for Small Organizations
More Than Words: The Power of Type
Design Principles Overview
Design Principles for Non-Designers
Visual Storytelling: The State of “Show Me” Social Sharing
Planning for the Encore: Building An Online Community That Begs For More
Lets Get Social
Blogging Basics (for Nonprofits)
15 Essential WordPress Plugins (and 5 That Will Just Blow Your Mind)
Word press plugins speed datingWordPress Plugin Speed Dating
Demystifying WordPress
15 Essential WordPress Plugins
Just Your Type: Web Typography & You
Twitter Tools
Web Typography: Viva La Revolution!
You're So Money and You Don’t Even Know It: The Power of Real on the Social Web
Send/Receive: How to Make Telecommunications part of the social conversation
Personal Branding Bootcamp

Recently uploaded (20)

PDF
jyg7ur7rtb7ur57vr65r7t7b7i6t7r65rb57t76bt
PPTX
History.pptxjsjsiisjjsjsidididididididksk
PDF
xử lý ảnh thu nhận và xử lý trên FPGA ứng dụng
PDF
The Value of Professional Graphic Design
PPTX
Rocket-Launched-PowerPoint-Template.pptx
PPTX
DAVtryruresytsayryeryyryurtuCPS -STEM.pptx
PPTX
immunotherapy.pptx in pregnancy outcome f
PDF
Capture One Pro 16.6.5.17 for MacOS Crack Free Download New Version 2025
PPTX
minorprojectjjslakalalwkendndbhdwklwlsxja.pptx
PDF
Interior_Design_and_Interior_Architectur.pdf
PDF
Humans do not die they live happily without
PDF
Kindly check my updated curriculum Vitae
PPTX
G4Q2W1 PPT SCIENCE (MATATAG) @Sir Ims.pptx
PDF
Humans do not die they live happily without
PPTX
Tempo_UIUX_Case_Study Tempo_UIUX_Case_Study
PPT
Adolescent Emergencies for undergraduate
PDF
Instagram Marketing in 2025 Reels, Stories, and Strategy (14) (2).pdf
PDF
Medical diagnostic centre case study Live
PPT
Wheezing1.ppt powerpoint presentation for
PDF
Pfthuujhgdddtyygghjjiuyggghuiiiijggbbhhh
jyg7ur7rtb7ur57vr65r7t7b7i6t7r65rb57t76bt
History.pptxjsjsiisjjsjsidididididididksk
xử lý ảnh thu nhận và xử lý trên FPGA ứng dụng
The Value of Professional Graphic Design
Rocket-Launched-PowerPoint-Template.pptx
DAVtryruresytsayryeryyryurtuCPS -STEM.pptx
immunotherapy.pptx in pregnancy outcome f
Capture One Pro 16.6.5.17 for MacOS Crack Free Download New Version 2025
minorprojectjjslakalalwkendndbhdwklwlsxja.pptx
Interior_Design_and_Interior_Architectur.pdf
Humans do not die they live happily without
Kindly check my updated curriculum Vitae
G4Q2W1 PPT SCIENCE (MATATAG) @Sir Ims.pptx
Humans do not die they live happily without
Tempo_UIUX_Case_Study Tempo_UIUX_Case_Study
Adolescent Emergencies for undergraduate
Instagram Marketing in 2025 Reels, Stories, and Strategy (14) (2).pdf
Medical diagnostic centre case study Live
Wheezing1.ppt powerpoint presentation for
Pfthuujhgdddtyygghjjiuyggghuiiiijggbbhhh

The Non-designer's Guide to WordPress (Making Your Site Awesome)

  • 2. “Design is not just what it looks like and feels like. Design is how it works.” - Steve jobs
  • 3. You’re Already On Your Way •  WordPress works pretty damn well “out of the box” •  Don’t let your theme & widgets get in the way of that •  Good site design should emphasize your content, not itself
  • 5. “Everybody thinks they have good taste and a sense of humor but they couldn't possibly all have good taste.” - When Harry Met Sally
  • 6. Good taste is subjective. Good design: not so much.
  • 8. Look Around. Get Inspired. •  Pay attention to what you like about other sites •  Find & Follow creative curators on the web and via social channels (like fastcodesign.com) •  Listen to recommendations from designers •  Apply what you learn
  • 9. Start by making your site your own.
  • 11. Color
  • 12. Color •  The easiest way to make any site stand out •  Mix pairs of unusual colors or pick one dominant color for emphasis •  A little goes a long way, even monochromatic tones can be powerful
  • 15. Hex Colors •  Annotation for the combination of Red, Green, and Blue color values (RGB) •  HEX values are specified as 3 pairs of two-digit numbers, starting with a # sign
  • 19. Type Tips •  Web fonts (@fontface) now allow you to use a variety of different fonts •  Perfect way to add a unique touch to any design •  Don’t use too many •  Be careful when mixing
  • 24. Show Don’t Just Tell •  Great photos are another powerful way to make your design stand out •  Create rules for formatting and be consistent (rounded corners, specific width, right- aligned, etc.) •  Always credit sources. Don’t steal!
  • 30. Use Different Page Templates •  Built into many themes •  Creates variety, •  Can enhance different types of content
  • 31. Theme Customizer •  Introduced in WordPress 3.4 •  Make changes, preview them in realtime, before going live •  More options to as theme developers further integrate it into updates
  • 33. Premium Theme Frameworks
  • 37. Plugins •  Choose plugins that add functionality but allow control over their style/design •  Take advantage of those controls to tie into your site’s style whenever possible
  • 43. Triage Your Sidebar Often •  Only include what you NEED to •  Avoid too many third-party widgets (Facebook, Twitter, Flickr), can slow page load times •  Limit # & size of ads unless you are making lots of money •  Animated anything = annoying
  • 44. :(
  • 45. :)
  • 46. Default widgets usually need tweaking
  • 48. Other Bits & Pieces •  Create & usa a favicon •  Use built-in text formatting for posts & pages (H1, H2, blockquote, etc.) •  Less is ALWAYS better. Simplicty is never a bad choice.
  • 49. “A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away.” - Antoine de Saint Exupéry
  • 51. Thank you! Mykl Roventine myklroventine.com @myklroventine Headshot: Glimpses of Soul Photography