Landing Page Design and Principles | Jestoni Esteban | Skillshare

Playback Speed

  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

22 Lessons (1h 13m)
    • 1. Course Overview

    • 2. What is a landing page?

    • 3. Landing page vs Homepage

    • 4. Lead Generation

    • 5. Click Through

    • 6. What is conversion?

    • 7. The Main Statement

    • 8. The Hero Shots

    • 9. Social Proof

    • 10. Call to Action

    • 11. Above and Below the Fold

    • 12. Best practices for effective call to action button

    • 13. Set-up Wokspace

    • 14. Common Tool - part 1

    • 15. Common Tools - part 2

    • 16. How to open 960gs in photoshop

    • 17. Wireframing of landing page

    • 18. Designing the header and hero shots

    • 19. Promo Section

    • 20. Text Section

    • 21. Testimonial Section

    • 22. Finishing the design

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels
  • Beg/Int level
  • Int/Adv level

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.





About This Class

Newly Released Course!!!

Do you want to design your own landing page website for your business and get thousands of visits and huge conversions everyday? Do you want to make a career as a web designer designing for different companies? This course will help you to achieve those goals.

Creating a landing page is a bit tricky. If you don't get it right there's a chance that your conversions will drop. Conversion means money. Most businesses succeed because of their great landing page. In this course, I will share with you the secrets of a successful landing page.

  • You Can Use either Mac or Windows
  • No Prior Experience
  • No coding or Programming
  • Design a Single Page Website From Scratch in Photoshop
  • No design or Photoshop knowledge necessary because I will teach you that

This course is designed to teach you about landing page and its elements. In this course you will learn not only about doing designs but also how to make a career as freelance web designer. I will teach you how to maximize your talent and build your confidence.

In this wonderful journey I will show the right ways of designing an effective landing page. This course will help you get started in designing and make some real money. I want you to apply all the knowledge you learned in real world projects.

Prepare Yourself for a New Career in Web Designing by Learning New Skills.

  • You Will Learn How to Use Adobe Photoshop in simple ways.
  • Learn the Types of Landing page
  • You Will Learn How to Design Landing page in Photoshop from Scratch.
  • Learn the elements of great landing page

The skills that I'm going to teach you in this course are so valuable that will help you grow as a designer. A talent that will last a lifetime. Talent in designing is not inborn. Everybody can learn how to design.

This course will guide you from basics of web design. You don't need any background in designing because I will show you the right and proper way in designing a kickass web page or landing page.

The project in Adobe Photoshop are so easy. I designed them for absolute beginner because I don't want to confuse you with so many tools. All you need is a basic knowledge of the program so you can design more complex web pages and illustrations in the future.

I started from nothing now I'm a web designer. In this course I will share everything I know in web designing and making money from doing designs. If you're ready see you in the course.

Meet Your Teacher

Teacher Profile Image

Jestoni Esteban

Graphic Designer • Online Instructor


Hi. My name is Jestoni. I'm a graphic designer and online instructor. I've been in the designing industry for seven years.

I make a living by doing graphic designs on the internet and love to communicate with different clients around the globe. I also love to teach and share my knowledge and experience to everybody. Here in Skillshare, I make project-based design classes, meaning you will learn a lot in a single class and able to create your own design after taking it.

With great knowledge and a wide range of experience, I am now equipped with talent and unique style in design that I love to share with my students and aspiring designers.

See full profile

Class Ratings

Expectations Met?
  • Exceeded!
  • Yes
  • Somewhat
  • Not really
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.


1. Course Overview: welcome to landing page design in principles where I'll take you through the entire process off, creating her own landing page from scratch and help you get more convertibles. My name is dishonest urban, and I'm a freelance graphic designer, and this is what I do for a living making Web designs because our goal is to get you up to speed as quickly as possible. They will start knowing the landing peace and types off it. Together. We show you some examples. Also, we covered the most common toads in Fort Shop. And when you have the knowledge of the program way, we're going to start designing our landing page project. This project is simple, so you can follow along. This course is designed for people who want to know about landing page designers or businessman. If you know how to use Adobe Fort shop and want to take your designing skills to the next seven, then this is also a good course for you. Thanks for your interest in the scores. I hope your excitement as I am if you're ready to learn more and sign up for the course, go ahead and that take discourse now or take a test drive by using the free preview feature . See you in the course 2. What is a landing page?: hi and welcome in this video. Let's talk about what is this landing page about? Well, a landing page is a Web page that a visitor can arrive at Orlando one after taking a marketing call to action. For example, on Facebook, the ads and banner you see there, and when you click it, it will direct you to a landing page to get your info or asking you to sign up. That's mainly the purpose of the landing pitch. Another meeting off a landing page is a dedicated page for a specific marketing campaign. So if we have a new product so readies, you might want toe make a new Web page for that to introduce to the world. And the 3rd 1 is a standalone webpage that different from your main website and that has been designed for a single focused objective. Now let's talk about the purpose of our landing page. There are many, but let's talk about the main ones. The 1st 1 is, of course, to get your information or email address. They want to get your contact info so they can send you promotional imminence in the future . The second purpose of a landing page is toe warm, you up showing and telling you the benefits of a brother. So convince you and when you are convinced, they will send you to their mother Website apologies. So a landing page is a good introduction to a product. That's all for this video. See you next time. 3. Landing page vs Homepage: hello and welcome again. So designing a landing page in fourth shop my name is in Estonia. In this video, we will see the difference of a landing page toe a home pinch that start with a home beach . A home pinch is a website for a visit through a direct Web address. Like something we type on a browser, a home, which consists off a lot of images and a lot of takes. Another thing that you will see on a homepage is it has a lot of links that will direct you to other parts off a site or other Web pages. So let's see some examples off a fish. The 1st 1 is triple W that XK glow that come here on navigation bar. When I ascetic one, you will see differently different links that will bring us toe other page. And when we scroll down, we can see the images in more text against these images have links on it. Another example is Triple Devil you that butts planters and more dot com. Also, this website has a lot of links on navigation, burke and big images. Now let's go toe London, bitch. We know a landing page is a result off a flick we did when we saw a marketing at or under a spare visit. We don't often encounter the speech maybe once on, like visiting Facebook or yeah, in a London pinch. And, like competition has a minimal links. You can see five or less because the idea off this page is to educate or convince you to sign up, so having many links will distract you from doing that. Now let's see some examples off a landing beach. The 1st 1 is nothing magical that com This page is a slick limb and stating what it does a link to download the app and below the fold, the sign up form. Nothing fancy. The next piece. Trick one devil. Ooh, that Valero that come against a mainly statement, a few innings and a sign up. Nothing ends, that's all. For this video, I'll be learned something 4. Lead Generation: hi and welcome toe designing a landing page in four shop. In this section, we learn the types off landing page. We will start with lead generation landing pitch, so login page is used. Toe capture user information like a name and email address. The sole purpose of the beach is to collect data from from visitors that will allow you to market toe and connect with the prospect at a some sequent time. A. Such a need actual page with contain a form along with a description off what you'll get in return for some meeting your personal data. There are many uses for Legion Landing Beach and in order to get the email or their data, meaning to give them something to sign up so they can receive E books, coupons, trial toe a program or a registration. The webinar. Let's see an example for Allegiant Llegan Beach Again. It's Valero website. You can see there's he form here who s use a bit your info. You will be able to download the PdF or e book in the next video may be discussing the other type off landing fish. See you there 5. Click Through: hello and welcome to designing a landing page in Fort Shop. In the last video, we talked about the lead generation landing beach, and now, let's say the click through landing page. So a click through page persuade the visitor to click through to another page and also no one up the visitor to the product or service you are trying to sell. Commonly used for Commerz. Click through pages, provide enough information to inform the buyer, making them ready to purchase before pushing them further down the funnel. Probably a shopping cart or check out. Let's see an example for click through fish again. It's nothing magical website, and here it's pretty of use this download icon. So when we click this between direct us down the beach on iTunes, so that's it for this video. Very short and see you next time 6. What is conversion?: hi and welcome back toe designing a landing page in 40 shop. I'm your instructor. Yes, Tony Stedman. Before we proceed to more in depth topic about landing page, let's talk about this conversion marketing. So what is conversion where the conversion is the act off converting sat vistors in tow, paying customers? There are many types of conversions not only making them bank customers, but conversion could be a site Mr Turns into a newsletter subscriber or a voucher user. Conversion is not only focused on saints, and the next one is the point at which a recipient off a marketing message performs. I decided action. In other words, conversion is simply getting someone to respond to your call to action. Getting someone toe open your promotion and email is a conversion. Having done click on the court action link inside the email is another conversion. Going to the landing page and filing out a registration form to read your content is a conversion. And of course, buying your brother is the ultimate conversion. All right, that's all for this conversion and see you in the next section of discourse where we'll discuss the core principles off funding pinch 7. The Main Statement: hi and welcome the discourse. My name is dishonest, Eben, and now we're going to discuss the four core elements off a landing page. We will start with the main statement. It's also called the headline. The main statement is the very first thing that a site visitor we see and read. It's critical that it clearly describes what a visitor will get from the page and that the message much if it's strong enough to show the visitor that they are in the right place. This headline is very abuse in every page, with its big in both decks that really captures the personal attention. Let's see some examples. The 1st 1 is people w that lift that come and in this in the side and this In their main statement, this landing page, he said, Lead generation, the next one is triple double Ooh, that could guard me that this is their main statement, pretty of use. And finally, the Valero website. This is their statement. I like this site simple and perfect for landing page. The next topic we have is the sporting statement. This one is just an option. Sometimes it's good. Some headline many of the sub headline issues toe a persuasive message to support the main statement. Like I said, this is an option. If he had a strong statement, then you don't need this. So that's it for this video. So you next time. 8. The Hero Shots: hi and welcome back to designing landing page in the forties Up now we're done with our first core element off landing pH. Which the main statement. Now let's see other one. The second core element is the hero shots. The hero shots is the visual representation off your offer and can help people to gain a better understanding off what it is or what it looks like. I believe this one is one of the most important part for Landing Beach here in here. Shots. We also explained to them, but they can get when they purchase a product or such subscribe. People are more likely to understand it if you can demonstrate it in action. The elements we use in hero shots are images, videos and sometimes Jeff. So let's see some examples off hero shots in action. The 1st 1 is Club W Landing page. The image of batters are fine, clearly visible next to a form clearly describe what the speeches. The next one is good golf link. The background image shows what up is all about, and for video, we have screener. You can see the video on the right, together with the benefits off using this program on the left side and final example is impact again, another video telling you about them or the services they're selling a great tool in explaining things and convincing people to sign up. So that's all for today. Fuel the next way. 9. Social Proof: Hello and welcome again. My name is dystonia. Today. Let's talk about social proof. Let me ask you first, do you buy a product without reading the testimonials or people who bought it off course? We want to make sure that the product is good and by many people. In short, we trust what people have said about it. Social proof is about trust and assurance to the customers that the brother is good. It's powerful, persuasive concept. Simply put, it's the use of social signals to live toe. Illustrate that other people have bought, consumed, read participated in what you are offering, the concept being that you are more likely to convert if you see that others before you have and we're glad they did. Let's see different types of testimonials the first East triple W that threat us that come that our or that a you. Here we can see their testimony in section clients with feedback, together with their image and also the company name. Next is triple W that trip lingo that come women's. When we scroll down, we can see the reputable websites that featured this up and that convince us toe downloaded next East triple W. That Web profits that come that day. You? Let's scroll down again. Here we see the awards and certificates another great way to trust their service. The final one is joked up that come here there is showcasing the companies who have used their program a good example off assurance assurance that they know it and that they work with that cos that's all. See you next time. 10. Call to Action: Hello and welcome back. We are now down to our last core element off a landing page. Things listen, we're going toe talk about the call to action or city. A Control to action is the most important part off a landing pH. Without it, our conversion rate will definitely low or nothing. The popular type of contraction in the landing page comes in the form off clickable buttons that, when clicked it will perform an action or lead to our Web page with additional information that asks the user to take action. Some text that most likely you'll see are in the bottom are my no, and then more. Your city is very critical toe conversions as it's the target off Europe Aegis conversion goal. It's what you want people to interact with or on your landing. Peach. How you decided where you place it in what it says are all important considerations, and we will talk more about that in the next section off the course. First, let's see some examples off CD A or controlled to action of our first example from James Francis dot com. Here we can clearly see the download now button. It's the biggest Web element on the speech, so you won't miss it Next from inbox dollars that come here the city A is the sign up form . We notice the contrast of sign up button toe, green background and finally we have read us that come in the speech, we can see sign up button in different parts of the biggest off the page. I mean, first on the upper right part and when we scroll down another one here and scroll down again and it's here, the city is clearly visible and even you scroll down. You will see as ah, definitely a good idea putting a sign up. I mean, the bottom in different parts off website that's it for this video soon extends 11. Above and Below the Fold: welcome toe the section off Dockers, and in the section we will talk about the placement off your city A or controlled the auction or call to action and also the best practices for city. We will start with the placement above or below the fold. First, let's talk about what is above the fold. Above the fold is a newspaper term that has been adopted the Web design. It referred to the information that was under front page off a newspaper on the top section in Web design. It's 600 pixels in length, and we'll show you what I mean. But this number is no longer matters and more before off modern screen sizes and also the use of phones in Web browsing above the fold. The most common basement choice for city A. But be careful, placing it above the fold. You need to give the best info and idea to your site. Visitors toe. Convince them to click and not toe close that window. Remember, he's been using the city a Above the fold, a powerful and scripted descriptive headline show your best offer in hero shot outstanding city area. Now let's talk about the below the fold, obviously below the fold. It's an area in a Web beach where you need to scroll down to see the graphics or text in marketing person strategy called Ida, and you have to remember this in using below the fold For City A A is for attention. I is for interest de for desire in a for action, for using the placement off city if they product a simple and the prospect doesn't have to do much thinking in order to make an informed decision. Positioning the city above the fold generally works best if the brother is complex and the prospect as toe suggests a lot of information in order to make an informed decision, Positioning the city over on the page generally works best. All right, so that's interesting video. See you next time. 12. Best practices for effective call to action button: Hello and welcome back. In this video, we will discuss the best practices for effective city. A button this practice is are the thing you need to consider when designing a CD A. Without further ado, I start with size the size off your city. It is very important. The size is relative to its surrounding elements. Indicates its importance. The bigger the bottom is, the more important it is that c one example here from James Francis dot com, we can see the big download now button, and it's very tempting to click. Next is contrast. Contrasting colors are the best way to make your bottom stand out from the rest of the page , just the color that makes it stand out the best. The See an example In the speech, we can see this bottom that really stands out from the background color directional cue but pointing your call to action. It's a great way to make it stand out in God your prospects attention that where you want them to click a good example from Valero website here, the direction of Q is very obvious, the arrow pointing to the legion form and finally we have space or white space. The use off white space or dead space around a call to action Bottom is an effective way off, making it stand out in areas where there are many elements. Let's see you. One example here you can see that there's nothing around this city. A. It really stands out. So are European. Learned something day and please remember this. See you next time. 13. Set-up Wokspace: Hello and welcome to this lesson. My name is the stony, and I'm your instructor and traitor of discards. Today I'm going to show you how to set up your workspace. In this course, I'm going to use Adobe for two shops. Easy. It's OK if you're poor. Tisha is older, like 65 or say six or even older likes a sport. All the actions I'm going to do in this course are pretty busy, and you can do it in any versions. So let's start when you open up your foot shop. This what looks like here on the left side on the tools. We will talk about more of these in the gun. Netizens on the top, our options for selected tools and mental command. Just one click to show the options on the right side. This our control panels perfectly. This double arrow it will hide and show the Bannon's. You can also click the icon one by one. To show it, you can customize your panels by drugging you and combine all the planets we need, like cooler and swatches drug it and snap it on the Motome release. When you see the blue light another important matter and its properties. You can snap it on the bottom or on the side. No pelican drug in the top of the new plan in and put it on the sign when the blue light came out of the sea here we even join them. Or so we would have a bigger working space basically, and drug next, we will make an your document or converse by going toe find on the right side on the shark A tease for the price set. Just Web. The only thing we would like to change here from time to time are with. And I set resolutions for 70 and color mode for RGB hit. Okay, now we have a canvas. In case you don't say the band and you're looking for just goto window and click there. If you don't see your ruler like mine, just hit control are to save our workspace and just this ascension. So like know what space and enter your name. In case you already said the cable Jordan, Lick it and click Enter. That's it for today's lesson. And I hope you learned something. See you in the next letter 14. Common Tool - part 1: Hello and welcome again. And this Tony in this video, we're going to talk about the common tools in Adobe Quarter shop for Web design. For those new in using this program, this is your chance to learn the basics. And for those already using this for quite a while, this is a good refresher photo shop, pics based or restaurant graphics program. If you zoom in more than 100% you can see the pixels in the photograph. Those scores are going pick, since they will talk about the tools Bannon that located here. That was that 80% chance we're going to use in design of a project top in an image. The fastest way is the drug and drop it over here. The other way to open it is to go to file and open or control. Go in the giver. The first thing you need to know about 40 copies about layers. Right now we have one layer where our image sits. For example, if I add the shape in the canvas, it will make another layer, another shape, another layer or anything we put in the canvas. It will make a new layer. In short, about layers. If you put something on top, it will cover the object underneath. Get the motel RV in your keyboard and lock the layer by clicking this icon. Now we can move this image below. Our image is nothing. It's inspiring. Let's make another squares get the most tool again. To move an object in our canvas is to select a layer first, because if you don't say like, even put our point out to the ship, it would not move. So we have to select the layer first and that you can see the control options they reject. This we can move on object now without licking the layer. But for me, I prefer this and check so I can accidentally move on. Object to select. Just hold control in your keyboard. You receive the layer changed. Select multiple layers by holding shift, evidently billeted to make a group. Just click this icon. What it does is to grow the layers that are related. If there's one thing I'd like you to learn, that is to have unorganized layers by using groups, the greater shape just click and drug. The new layer is now inside the folder because the folder is selected. Many shapes will be part of this group when great, because they were inside a pit. When doing it, we can hide the layers in this group, and if I click this I it will hide its appearance. Next is direct, angular market one a technique and hold. You will see the other tools underneath the portal keyboard shortcut, the same to cycle through just controlling and then in the chamber. Marquee tool is also a selection toe. You only see like the small person you create using it. If we say, like the image we can remove these portion. We can add more selection by holding ships when drugging. Just alky in your Gibbard. We can also move this selection. Elliptical market works the same. Just hold Shipped to constrain a perfect circle controlled the toe de select the selection . The next tool is crapped on. You think this tool we can drop our canvas hit? Enter or click this on. Do it several times. Select the ruler here. The stone lets us measure the distance between the objects. This is your painting tools has tried in new layer select type of brush. There are soft and hard. Brush the little layer by dragging it to the brushland. Next, the gradient tool. Make a new layer. We can change the color by clicking this foreground and background. Just double click the foreground and go window will appear. How the gradient works is by click and drug went market told works by just one, and the color will spread in the canvas. Make a new layer and applied. The big brother did that layer mental works by clicking and dragging. You can choose if you want to create the path or shape. Here, you can add or subtract points using the other tools. When you add the point you Canadian. Your shape convert point is to adjust the position of a point or appearance of a ship. It's continuing the laser in the next video. 15. Common Tools - part 2: Let's continue our lesson. Type one. The temperature can is on top. You would see the controls for the student. Just click the drop down arrow to see the other options. There are two ways to use the studio. One is point text. Just clicking. Start typing. The other one is paragraph takes. It will make a box turn. All your checks will be inside of that bounding box. When you use the student, your takes will create another layer. Click this change a corner. Make sure the right lady selected to play the older hold chief and click the layers you want to grow and control G in your keyboard to grow them. Disarm your shapes. The shortcut issue. Just click and drag to draw. This is your ship properties. You can change the garden of a juice off your shape. Let's say 50 points and you can see the corner changed. Technically, this it will, unlike the cornice, meaning we can edit on your one corner. Make it zero. And there we have a corner point. Nice. Also Andhra shaped tool. We have custom ship here on top. You will see the premium chips on your 40 shop don't below. I don't know that this arrows, you may not see it on your foot ship. In case you don't know that, that's when some costume shape. You can know them here, and it's tried this mother flight Bigger, cooler square change in the corner because it was selected. Click and drug in the gun vous when all the ships to constrain the perfect shape. This also next they handle it allows you to move the canvas. If resumed. Click this to get back the foreground and background to its efforts, setting luck and right or just the keyboard. Just x Martin in the program and back on Cooler. Let's see this history pending adoptions. We did record that year so we can get back to it. These are the adjustments. It affects the image, just something to Eddie. We can make our image lighter or darker. We can add several adjustments to our layer. Now the very states there are many of them. You can also down with Stein's. It's tripe on the square. Just click this time to apply it. Wake unaided. They starts by double clicking the layer, not the name. No window will appear. These are the options for these days. Click this arrow toe the styles in making clean layer. That's it for this video. You'll be learned something. See you next time. 16. How to open 960gs in photoshop: Hello and welcome in this video. I'm going to show you how Toe open the template from 1960 grid system. Okay, so go ahead. Toe 9 60 That GS. Now in this page, click this big, all down known button and it will download. Now, let's open that. Here is the fineness extracted. I'm using 70 by struck fines. Let's open that folder and then let's find Template. And here Goto 40 shop folder. And here we have three columns 12 16 and 24 when it between divinity 12 column greed for our landing fish So said like one isn't getting these 12 Golam and open toe our fourth shop and now we have 12 column. So in order to edit the size, you can go to image and canvas size, weaken input. Anything here? No, if you like the anger and that's it. How to open the 9 60 grid system in an orb? A 40. So let's see you in the first video off our designing 17. Wireframing of landing page: hello and welcome toe. Another section off discovers in the section we're going toe to design our own landing page . I have prepared a simple one and issued to follow Victorian for you Toe Get started. Hopefully, after this follow along to Taurean, you will have the feel and confidence to design your own lid or flick through landing. PH. Phil, Frito Post this video if needed. So open door 40 shop and 9 60 grid system and they start. Here's my night 60 Grid system. If you haven't downloaded yet, go ahead and don't know that the first thing we need to do is to make our 10 of us bigger Goto image menu and select canvas size. Extension this for with type who invented and for high 1400 click date up arrow and click OK, we can no delete this red guidelines. Let's put some horizontal gates first is 70 pixel makes its 152 pixels posted the video to follow along. Next is 400 then big cells. Next is 510 pixel, 790 pixels and 11 15 pixels. Zoom in and start putting our wife frame using rectangle toll. This one's for the logo Hold I key and then drug to duplicated. And next this our hero Shit. It's something that we need to include. We can change the world frame. So that's the good thing about where frame we can visualize the elements in our landing beach. Another two don't blow for image and features in the media is testimonial. Now let's group this and name it where frame next. Put the name so we won't forget it. Put the name, logo and this one and just dimly duplicated first. So your wife land should be like this boxes with her names going up. Other designers who are doing Web design for years actually don't make where frame and but others also do this. What we're doing is good. We're framing. You can say that, but we're going toe. Delete it anyway, so it's not ideal to spend a lot of time making this boxes. But first you have tow visualize. Your landing beach is very important to do that unless you're going to send that your client, you really need toe, clean it, clean it and show it you're client and prove it. So yeah, that's that's all for our white frame and I have something like this. See you in the next video where we're going to do the heather. 18. Designing the header and hero shots: hello. In this video, we're going to design the header for our landing page, making your group and name it Heather. Sometimes I call it Folder. Zoom in by holding control and semi colon. Tow it together. Let's make a background for our header is a Saturn color. Have eight F eight F eight drug deal yoga. You can find this logo in the resources section, and I need to over guide. If you find this guitar of us, just hit the post button in the player. So, like our background and let's put a text your on. You goto filter noise at noise type two for the amount. Get the custom shaped hole and setting the phone shape. Hold, shift key and click and drag the constrain a perfect shape. Now let's put any number. Size is 17 and front is open sense. I dropped the caller off the phone and put it in the side off our guide. Now in its arranging that Group three layers and name it logo and going back. Get the title and make a paragraph text. Make sure it covers six columns and base Lauren. If Tex is all caps open open after Bannon and click all cups. Now let's arrange Destexhe Yes, UH, 22 points in size and 27 points in leading. Next double click the layer to show the layer style window. We'll put a drop shadow de blend. Normal capacity is 88% and distances to making a new paragraph takes. This one is longer takes. Foreign size is only 14 for now, and just regular style for color is for beef or beef. Or be make 16 points for foreign sites and 27 points for lying height. Anything your paragraph is taking on at the time, they want to make it look presentable and green for Take your time, arranging all the techs and paragraph off your design in and some out. Next, using our gang, little will make a city a bottom control corruption button. Get these in corner off our logo. Also put a layer style, posted a video and copy D number and say things I have here. So I just big something like this are maybe this one. All right, and then let's put a hex on our bottom Foreign size East, WellPoint's and might color get a goat now, Weinstein is a mobile that drop shadow to our takes to make it up One big sell for distance , zero for size and 90 degrees for uncle. How that see? Bring it to clean up and make sure everything is okay. Make a copy off our bottom by holding. Now make this takes center line. Well, thank learn more on extension together. The color we need for this bottomless before before, before and the drop shadow on a little bit darker center our takes in our bottom that made it. This sticks for a second. I feel like I need to add some leading in size. We'll make it through lines only instead of three. So you need toe, delete some and need some species. Anything different is better before we proceed. Let's clean our layers up. I saw the name them. I support any money. The next day. Video player Open the wire frame, selected square and drunk out. We left the bridge From next time that come is for markup only. You can see there's a watermark on it. You can use your own image. I'll put darling off this image. Also don't have to buy it. Make sleeping must and just diminish. Now, the effect setting the color of really and the black color capacity is 60% click. Our base ship will make it around there. You're seeing their ex selection tool, click diminish. Actually, you click the sheep behind it, since our bishop selected input six pixels and it enter on your keyboard, get the stool and draw a circle. This will be our play, Martin Select nor feel no feel. And what color for stroke me two points only. See the resources me where you can download this free custom ships on just the play in a triangle. But what color for feel and dream of the stroke color and that's it for our header Glinda layers and group them. Save this and see you in the next video. 19. Promo Section: Welcome again in this video, we're going to design a promo image off our landing page, making your group and name it promo alky, and then click this box for image to select it and move it to prom a group. This image is from the time that from again, using dung dung, winner Marketable will delete this side part. They get to our canvas and clipping mask notice. I see. Obviously the images small. So what we're going to do exchange the color off our backs so much the color to our image, Select the rectangle shape and put some layers die Sony Selleck stroke and put this numbers He zero e zero is zero says is too, and position is inside. Next in a shadow, 90 degrees angle capacity is at least 50% distances. Six. Excels and sizes. Depart excels using their executable. Click the box and change its corners to fight Big Sur's Get the lips stool and draw inside the your tendon. Hold ship to make a perfect circle. Zoom in will put a guides on the circle Drug. A guide from top and it was snapped in the media off the circle. Same thing with vertical guide. Now draw a circle by holding alky and shifty together a bit smaller from our big circle. Now get the type tool and take in the circle. Pick an aerial front in type A dash with what color of course, not the dash in a circle minute to resize it. It's almost on the edge. Just control T toe free transform. When done, double click the layer to show the lifestyle 90 degrees for uncle. When pixel for distance, zero for size capacity is at least 33%. Next, lower down the capacity off this layer to 78 percent now. Save it first said, like our be circle will put a stand on it Cilic pattern overly and just a subtle pattern for this great granite. For a blend mode, use multiply and capacity toe. 54% get detectable in type $39 cleaning for three hours. If it happens that you're typing a path, cancel it and outside the circle and then drug, the phone is open. Sense size is 21 points and the style is enabled. You can get this phone from Google Fonts that com It's free 14 points on a regular style. No for three hours. Make it bigger and bold. Next, we'll make a reflection effect using mental. Just follow along with me. Click on the outside of their circle. Select a 10% gray, the 2nd 1 and nowhere down the opacity toe. 8%. Next clip. Must this to our base circle make the capacity to 9% and the fit for from or image, I hope you learn something and for you in the next video. 20. Text Section: Hi. It's continued designing our landing fish. In this video, we'll put some tanks alongside to our image. Great new group name. It takes using title, click and drug to make a paragraph text. Next. Do you really have the time to clean your home? Clean control eight to silicon latex And then yes, and there your home. I liked your home and changing the starting to extra ball and changing the color and the same with our city. Baden. Maybe a little darker and click district. Make another paragraph Text. Just a regular student for insights is 16 points for now and based Lauren Epsom control a circle in character panel. Adjust everything, make it 17 points for size and 29 points for leading. Got the last sentence. Attention The gardener toe 656565 And you still keyboard arrows Get the custom shape tone with the same icon. I egos checked. Take my in a box, really make up this. Let's do it again and then make a copy by Control C and basic with control V Hope down. But you think you bought narrow down we should have for three and then I need now, despite graphics sizes, 14 points for now and based loadem Epsom. Now we need to adjust it too much our bullet least or check mark. Make the leading 27 points in calories for F four F four f, make the first letter capital and remove some words to make our takes a beating. All right, that's it. Next is the best emotional testimony in Section off Our Landing Pinch Samudera. 21. Testimonial Section: Welcome back in this video. We'll do the testimony in Section Off Our Landing page, create a new group and name it testimonials. Let's adjust this guy down using rectangle toe through a background for our testimony. A good quarter for background. This F eight F eight f eight. Get the title and what our customers say you. This will be our title for this section. Make the world say about Italy in the front Styler, make it center and and guess it through a surrogate. This will be our placeholder for the image To get an image for human faces, go to this website random user that me slash photos. This is free for personal use only. I don't know that three images? No. So let's drug that put it in our canvas and grip it then Rhys, I see. Zoom in. We'll put some text some damn. It takes for this testimony. One size is 18 points for now. Then any name you want. I also put a place and make it say mobile. She's from your and se me one. It seems the point site is being let's make it 15 points through another photograph. Tex and make the style regular. So when he's sitting that never down the front size in base load em Epsom fun calories might be five b five B and just delayed into 19 points and the one size is arriving points , this will be the final. Align it to the name and we'll put a quotation mark. We use times New Roman for the point of farmer reputation Marie Se 6 52 points and changed the color, and it takes a little bit. Make everything online. You can enable them by zooming out. Next, using custom ship withdrew a star well, Chief went dragging it and the sticks to color. The colder is F A B C 01 Next, meet for copies of this star by holding out and then drug. Next, Select the toe and on your key, the duplicate and group them control G in there. Now it's a 90. Training me now, clean our layers, the layers that related to each other. Hold shift and clicking the top group and then clicked. Align horizontal centers, then control G group. Put a name on it by double clicking, hold alky and then drug to make a copy let the image of this woman and this close this the windows we don't need first. So this is the image of a man. This make a clipping must and then resize it Control t control t hold the shift key when resizing it changed the name as well Make another copy the same step that we did. Now let's get this image dragged Image when it and close the window. We don't need get to our canvas. I do clipping mask first before reciting the image you can resize first, then clipping must It's up to you. Don't forget to change the name That's it for our testimony a section save it and see you in the final video off our designing our let me be 22. Finishing the design: hi and welcome toe the final part off designing off our landing, which in this video we'll do the photo section, create a new group and name it falter, using rectangle to do a background for our footer. Most porter are you think that cooler? Double click it. Let's put a there's time Select pattern overlay are used, this one. When motus multiply and capacity is 95% get the type two and type capital. The copyright sign is al G +169 so prickly in that come 2015 all rights reserved. Sell a call and then extension to go upto cf cfcf. Find safety 16 points. There's the social media icons that we're going to use. We need this circular Langlands, meaning icons for a Facebook, YouTube and Twitter. Select them and drag it to our canvas. Now aligned them. Make sure you select them all. Make them a little smaller. And that's it for our simple landing pinch. I hope you learned something and enjoy it and see you in the next video. Are you