Spelling, Grammar, and Title Casing7:27 with Nick Pettit
It's important that you follow the rules of grammar and spelling when creating apps and websites, because it builds trust with your user. If a user spots a word that's spelled incorrectly, they might start to wonder what else is wrong with your product, and that could impact really important moments in the experience, like a purchase decision.
In the last seconds of this video, we left out the word "a" in the text. It should have read "Have you ever enjoyed a great dinner." Paying close attention to your copy is important!
[MUSIC] 0:00 Hi, I'm Nick. 0:08 Studying the elements and principles of art and design can help you understand how 0:10 to talk about design and analyze the individual components. 0:15 But sometimes application can feel like a conceptual leap. 0:18 In this course we're going to look at an example website layout and 0:24 make improvements to it. 0:29 The first thing we'll work on, cold copy, isn't visual at all, 0:30 copy is all of the text that appears in a design. 0:36 And while you might not be responsible for things like blog posts and other 0:40 core content, designers are often still expected to write for things like labels, 0:45 buttons, form fields, and even sometimes, short marketing blurbs. 0:50 We'll write some copy of our own later on. 0:56 But to get us started, we're going to check the spelling and 0:59 grammar of some existing copy. 1:02 It's important that you follow the rules of grammar and 1:05 spelling when creating apps and websites, because it builds trust with your user. 1:08 If a user spots a world that's spelled incorrectly, 1:13 they might start to wonder what else is wrong with your product. 1:17 And that could impact really important moments in the experience, 1:20 like a purchase decision. 1:24 In this course, I'm going to use Adobe XD, and I encourage you to follow 1:27 along by downloading the example file and making the improvements with me. 1:31 Here's the example website that we'll be working on. 1:37 I have it pulled up in the Preview mode in Adobe XD. 1:40 This is the homepage for a fictional website that collects user reviews for 1:45 restaurants similar to Yelp. 1:50 However, this website focuses exclusively on desserts, or ZERTS. 1:52 There's a lot about this layout that can be improved. 1:59 Some of the improvements might be obvious to you right away, 2:03 but if not, that's okay, because that's exactly what we're here to learn. 2:05 I want to help you develop your aesthetic sensibility so 2:10 that when you see something that looks wrong, 2:14 you can specifically identify what that thing is and how to improve it. 2:16 Let's take a look at what's here now, and quickly review it, 2:22 before we make any of our own changes. 2:26 Along the top is a pretty standard navigation bar. 2:29 There's the name of the website, ZERTS, short for 2:33 dessert, a tag line, it's a piece of cake. 2:37 And there's a search bar, a few restaurants that are new, 2:41 and a recent blog post, and then we have a footer down at the bottom. 2:48 So let's work our way from top to bottom and look for 2:54 improvements we can make to spelling and grammar. 2:58 So to do that, I'm going to pop back over into Adobe XD and 3:04 come out of preview mode. 3:08 The first thing I notice is this link to the forums, 3:18 going to zoom in on that just a bit here. 3:22 Any buttons or links in a navigation bar like this should generally be title case. 3:28 Even though it's not a title, it's also not text that's in a paragraph. 3:35 In title case, all major words are capitalized and minor words, 3:41 like conjunctions and prepositions, are lowercase. 3:46 So the word a, for example, would be 3:50 lowercase if it were in the middle of a tagline, like it's a piece of cake. 3:54 So let's change this link here, and I'll just double click 4:00 on it a couple of times to drill down into the layers there, 4:05 and change this to a capital F for Forums. 4:10 There we go. 4:14 And if we scroll over here, the copy for Log In and Sign Up look good to me, 4:18 although there is other visual issues we'll address later. 4:24 The logo itself, ZERTS*, also looks good to me, but 4:29 this tagline is bothersome for a few reasons. 4:34 First, it's a sentence, its a piece of cake, so 4:38 it should begin with a capital letter and end with a period. 4:42 Secondly, the word its in the possessive form here, 4:48 as if the sentence were trying to say something different. 4:53 It's in this case is actually a contraction of the word it and 4:58 the word is, so it should have an apostrophe before the s. 5:03 And finally, the word piece is spelled wrong. 5:09 So let's fix all of that. 5:13 I'm going to double click this, capitalize it, 5:15 give it an apostrophe, and even XD is saying, hey, this is spelled wrong 5:22 with that red underline, need to swap the i and the e there. 5:28 And then we need a period at the end of this, and 5:34 then to accept those changes I'll just hit Escape. 5:37 So let's zoom back out here. 5:42 Finally, there's one more piece of copy toward the bottom 5:45 right that says the blog. 5:50 And because that's actually a title it should be title case. 5:53 Now, before I said words like prepositions and 5:59 conjunctions shouldn't be capitalized in title case. 6:02 The only time they should be capitalized is if they're at the start of the title. 6:06 So in this case, The Blog, 6:12 where the T and the B should both be capitalized. 6:17 So let's hit Escape to accept those changes. 6:22 I'll zoom back out, and that should be it for spelling and grammar. 6:25 When you're done, save your work. 6:32 And there actually is one more thing here underneath the blog title. 6:35 In this copy, it says have you ever been had a great dinner. 6:43 Let's, Change that to, 6:50 Have you ever, Enjoyed a great dinner, 6:55 only to be disappointed by the lack of dessert options? 7:01 And I'll zoom back out. 7:09 And that should be it for spelling and grammar. 7:12 When you're done, save your work. 7:16 There's a lot more about this layout that needs to be fixed, but 7:21 we're off to a good start. 7:24
You need to sign up for Treehouse in order to download course files.Sign up