How to improve the appearance of your WordPress Website

I gave this presentation on December 12, 2017 for the WordPress KC Meetup which I’m an co-organizer for.

NOTE: All links in the slideshow are clickable.

Video Replay

 

 

Resource Links

Customizing Themes

• www.wpbeginner.com/category/wp-themes
• www.css-tricks.com/snippets/css/simple-and-nice-blockquote-styling

Designing Graphics and Editing Photos

• https://www.canva.com
• https://croppola.com

Colors

• “Pixie” to find hex code for colors using eyedropper.
• Find colors by using a color palette generators like
  • colorpalettes.net
  • paletton.com
  • coolors.co
  • colourlovers.com
  • color-hex.com
• Learn about Color Psychology on colorpsychology.org and blog.kissmetrics.com/psychology-of-color-and-conversions.

How to use Chrome Inspector

• www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site
• www.nutsandboltsmedia.com/how-to-customize-your-genesis-child-theme-with-chromes-inspector

Fonts

• www.fonts.google.com
• www.fontpair.co
• Example of Typography: http://kissaskreations.com/typography/

Photos

Story of Green Pepper Photo:
“The $7,500 Blogging Mistake That Every Blogger Needs to Avoid!”
Read on: www.livingfornaptime.com/starting-a-blog/blogging-mistakes-to-avoid

Stock Photos – Paid Sites

• www.istockphoto.com
• www.shutterstock.com
• www.bigstockphoto.com

Stock Photos – Free Sites

• www.unsplash.com
• www.visualhunt.com
• www.pixabay.com
• www.pexels.com
• www.css-tricks.com/sites-with-high-quality-photos-you-can-use-for-free – Index
• www.allthefreestock.com – Index of LOTs of free photo sites

Textures and Patterns

• www.transparenttextures.com
• www.thepatternlibrary.com
• https://vector.me

Navigation

• www.mashable.com/2011/12/08/design-navigation-bar

Layout

• www.canva.com/learn/web-layouts

Mobile Responsive

• See if your site is Mobile Responsive on https://search.google.com/test/mobile-friendly.
• www.soulfulhustle.com/mobile-first-vs-responsive
• www.godaddy.com/garage/design-mobile-first-use-responsive-web-design

Examples of Website Makeovers

• http://kissaskreations.com/portfolio/website-makeovers/

Plugins

• My favorite plugins: http://meetkarissa.com/plugins
• WPKC Organizer’s from Past Meetup: https://docs.google.com/presentation/d/1fLz5IWGpYD1x5UQpqorElgIig7ck7EmSqpvQVcip0KE/edit?usp=sharing

Additional Resources

• Beginner’s Guide for WordPress – www.wpbeginner.com

Psychology of web design:

• www.thenextweb.com/dd/2017/11/08/psychology-web-design
• www.webdesignerdepot.com/2010/05/the-psychology-of-web-design
• www.3.7designs.co/blog/2012/08/10-psychological-principles-to-design-with
• www.blog.kissmetrics.com/psychological-principles-converting-website

Logo Design:

• www.howdesign.com/featured/how-to-design-a-logo
• www.mashable.com/2010/08/23/business-logo-design
• www.blog.scottsmarketplace.com/logo-design-tips

Learn CSS

• www.csstutorial.net
• www.learnlayout.com
• www.lynda.com/CSS-training-tutorials

 

Need help with anything?

I invite you to schedule a 15-minute help session.

Do you have something bothering you about your site? I will help you with one task, for free. If this sounds like a deal, just use my online scheduler below.
Looking forward to talking!