1 #hottemplates WORDCAMP PHOENIX 2016 John Gough @john_gough | Skyhook Interactive YOU CAN MAKE TEMPLATES LOOK GOOD
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
1 #hottemplates
WORDCAMP PHOENIX 2016John Gough @john_gough | Skyhook Interactive
YOU CAN MAKE TEMPLATES LOOK
GOOD
2 #hottemplates
Let’s build a more beautiful, useful, & connected Internet.
img: @NASA
3 #hottemplates
“That looks like a template.”
img: @mcdonalds img: @shoot_the_route
Some things are supposed to be identical. Not websites.
4 #hottemplates
There are a lot of them out there.
50,000 websites
launch every day
822 themes downloaded daily
just from wordpress.org
https://codeinwp.com/blog/wordpress-statistics/
5 #hottemplates
If you think they are, you’re going to build websites that look like templates.
TEMPLATES ARE NOT
WEBSITES
6 #hottemplates
Not this.
This.
img: @sharkdesignstudio
Use templates as tools!
7 #hottemplates
Plan your content.
Know your limits.
Apply appropriate styles.
8 #hottemplates
Plan your content.
Don’t pour your content into someone else’s designs.
9 #hottemplates
Plan your content.
AudienceWho’s going to be looking?
Site mapWhere will they find it?
Content planHow will I explain it?
10 #hottemplates
Plan your content.
A content plan identifies components of a page.
11 #hottemplates
Know your limits.
A template is a tool. Use the right one.
img via Buzzfeed
12 #hottemplates
Know your limits.
Look for demo features that make sense.
13 #hottemplates
Apply appropriate styles.
ColorsPrimary, secondary, tertiary, & greys
TypographyPair two legible Google fonts
Elements that fitMake custom assets
Better than average photos10 minutes in Photoshop
14 #hottemplates
Whitespace
Font size
Color
ramotion.com
15 #hottemplates
Whitespace
Font size
Photography
advancedplasticsurgery.com
16 #hottemplates
Whitespace
Font size
Photography
advancedplasticsurgery.com
17 #hottemplates
Custom assets
Photography
Colors
Dribbble: Creative Mints
18 #hottemplates
Custom assets
Photography
Colors
Dribbble: Creative Mints
19 #hottemplates
Whitespace
Fonts
Custom assets & colors
famous.co
20 #hottemplates
Plan your content.
Know your limits.
Apply appropriate styles.
Make it fit; Audience, Site map, Content plan
Pick the right tool, and features that make sense
Colors, typography, custom assets, photography
21 #hottemplates
THANK YOU!John Gough @john_gough | Skyhook Interactive
NOW GO MAKE THE INTERNET LOOK
GOOD.
Related Documents
