Hello there and welcome to this episode of the website tear downs and today we have a beautiful template which we’re going to be tearing down and that is called grammarly now here it is on the screen for those you that don’t know what Graham Lee is gramley is a tool that you can plug into your browser or even have an app online you can log in and you paste in all of your texts you’ve written for your long articles and things and it really just goes through and helps you clean up all the typos and all the grammar checking things out there it’s a very slick tool and it’s got a lovely little user interface as well and of course as a beautiful landing page and a sales page so I’m going to run down it just now and show you a few things on this page and firstly what I’ll do is I’ll go over the page here then I’ll show our page Arthur’s would have made side by side so here is the grambling page and you can see straight away as I scroll at the top there it pops in add to Chrome nice little button the jumps in there very nice little feature and what I wanted to do is watch this screen on the right hand side here as I scroll on down okay so with this lovely call to action area here very clear writing font as well and a clean page as you can see it’s um obviously for writing you want very minimal distractions it helps people right you can see a preview here so I think their sales page also reflects that as well it’s very clean lots of white space and it’s quite minimal sort of them let’s go down this page anyway as I scroll down you can see what happens on the right is another feature pops up that’s a beautiful touch what they’ve done with them how they’ve code that possibly done with some CSS have not looked into it you could do with CSS changing the images and switching out the graphics there and they keep going each pops up again and it pops up again like that very nice little touches that done here to that page and as we go to the next section it comes up and it just pushes the browser or pushes that laptop up there and you can see we come into this section here and show you some more features that included on this page so lovely little page start with very clean as you can see throughout nice combination of colors keeping their green and their consistency from their logo and at all times that’s sticky now at the top scene to Chrome and testimonials straight in there bit social proof more spacing we drop into the header or this headline here and then to another three sections covering some features are nicely done nice little images here circle images and we go on down another testimonial great shot of lots of users lots of social proof they’re very powerful to see that and proving the heavy community show in their community and then backing out with numbers and these actually linked through to the grammarly page each of these very nicely done and then to this section another call to action add to chrome beautifully done then we drop down into this last footer section where they clearly break up all the different links in that foot to hear so lovely page all over very clean minimal distractions and some lovely little design touches i’m going to show you our page and some things we coded some things we couldn’t code in like this CSS but let’s have a look his our page that we’ve created so we’ve gone for the laptop positioned over on the right-hand side there and we’ve got this large call to action area very similar to how they’ve done theirs on the left hand side and then ours is are showing the overlay optimizer when you click on it pops up but go down so we then go down to the next section which is this sort of area here with these three benefits or sections and the testimonial so go down to ours we included a few more so we put in another six sections and then we’ve put in that testimonial across the top here and this is not just a testimonial element we’ve coded it with the image and text the side you’ll see that in the teardown how we sort of create these kind of testimonials then we drop down into their section again they’ve got this big headline here and then we go into three sections underneath so we created similar with on the big headline across and we’ve done the circle images done with CSS show you that in the teardown as well let me go into section we included six blocks here and then into theirs we included that testimony norther or sorry they’ve got a testimonial then they’ve got their social proof banner going across so we create a similar ethic there as you can see dropping down into our social section or a community section like they’ve done there as well okay so this is a beautiful template and what they’ve done nicely is they’re just laid things out slightly differently to the conventional way you see on some sites you know with landing pages showing you know social icons going horizontal but they’ve just broken things up differently and I’ve putting them down the side here putting the numbers on them and then you can see over on the right sir never their call to action we include that call to action and then they drop down into the footer there so we’ve got our same overall optimizer coming in here and then we drop into our large footer section so that’s it that’s through to the page and if you want to watch the full teardown obvious below this video you can go down and watch the complete teardown which we walk you through building this entire page and it’s all based off the beautiful grammarly page and as always I highly recommend you if you write a lot of blog posts and go and get the ground molly plugin try it out see if you like it and it’s a super tool that’s got very clean interface and the little chrome extension plugin really makes it easy for when you even writing an email out like inside gmail for example and so beautiful a lap go and try it out if you do a lot of writing and it’s definitely worth checking out seeing how they do things you know they you know grammar check how they spell check and things like that and so that’s gramley go try it that’s our teardown go watch it tear it down and show us what you’ve done with your own sites if you use this template in your own businesses and as always thank you for taking the time to watch the tear downs another long hope you enjoy them comments or questions just post them all below and we’ll see you in the next tear down video you
Leave a Reply