Senin, 08 Mei 2017

web design software tutorial

web design software tutorial
web design software tutorial

how to design the perfect web page. that's coming up. [sound] hey, rock stars! welcome back to the videospot.net. my name is owen hemsath. today i'm gonna talk about how to design the perfect. ...website page or silo page. now, if you've seen someof my other videos,

you know that i'm a bigadvocate of creating silos. and, and although silos, you know, youhave to do a little bit more these days. like, a silo alone is not goingto get you where you want. it's going to be, it's certainly goingto put you ahead of your competition. but a big part of thatis designing a web page. now a, a big problem that isee with business owners and like clients that hire me and,and other web designers is for every page, they're designing like,a new page. you know, it's like well,we need to add a new page to our website.

it's like, oh great,i gotta design a whole nother page. now it doesn't work that way,you need to be creating templates and a lot of website, website themes todaysupport a template based system. so what we do is we createa series of templates that you can now export tothe rest of your pages. but it's still importantthat those templates. are created properly. so, let's go in close and take a look athow we have designed a, a webpage that's designed to be kind of like,like a top of the silo type of scenario.

okay? so you landed on the homepage, andthen you clicked on one of the tabs. and it led you to a pagethat looks like this. let's take a look at someof the basic structure. first of all, and of course,you know, like you're, you're always, this could be your socialmedia links up here. this could be like your phone number,or an email button. you know, having those,always able to contact me, buttons, i think is a good idea.

up here you've got your navigation tabs. now, when i first started in this, it was kind of like the thinking thatyou should have seven navigation tabs. i don't agree with that anymore. i, i, think that you need to havelike four or five, tops, and they need to be very simple. every single one of them should bedirected at converting a viewer to sale. so you don't need one of thesenavigation tabs to say home. right?cuz typically your logo will

lead you home. you, you need it to say something like,about us. what we offer. how to work with us. and our blog. something like that. i don't even have a contact pagebecause it's just, it's just filled up every morning with people thatare trying to sell me seo service. [inaudible] so i don't even havea contact page anymore, but

i do have a work with us form. it's, it's a client brief where i'm ableto see, you know, a client can fill it out and tell me they wanna work with me andgimme some information about who they are. so keep that very simple andkeep it directed towards what you do. products, services, work with us. right, keep it really simple. on your page, your page should be,you know, 300 to 400 words, maybe 500. 500 words is more like an article,but that's the thing is, chalk it full of stuff man.

you know, like,you've gotta have content on your page. 400 words is like a minimum. and, you wanna saturate that,that page with maybe like 2% of seo andinclude some of that in your h1 headers. and i know, you know, some ofthe nerds out there will be like oh, your h1s don't really matter. they don't really matter, but it go,for, for the search engines, but it goes to viewer intent, right. a lot of people skim websites.

so make the headers. right?and that's that big bold h1 tag that's in there, make it soit says the keyword. so that way they know whenthey're scrolling, oh, i'm, i, i know i'm on the right site,this is what i was looking for. so, we've got that, the, the navigation. we have a sidebar. the side bar i believe in side bars. some people are doing like thiswhole page design, that's okay.

that's fine. if that's the, the intent of your site. i like side bars because it enable me to, to engage with the viewerin different ways. so for example. this is gonna be a content page, buti've got in my sidebar space to put an ad. and that ad could be an offer,like a free offer. right?to my ebook, or to my series, or to whatever the case might be.

and then, you know, you can designthat page to go to your landing page. where now you're convertingweb viewers into a lead ok. underneath that maybe you have a directoryto your silo right, you have all related pages, or maybe you have like, yourevisit your, your navigation tab here. these are called,if you have any links over here, these are gonna be called site wide links. okay?so they're gonna appear on about every single pagewhere this sidebar is. so you don't wanna make these liketerribly like spammy or, or purposeful.

but it's just to help the viewerget where it is they're going. i like to use related links. because if they're on a pageabout video marketing. it might be helpful to have youtube. you know, youtube marketing. landing page videos. video production. video bumpers. you know?

maybe even a tag that says,what are you looking for? and then underneath that ihave a little circle there. which i typically use torepresent a testimonial. so maybe you've got. a testimonial widget right in there,where it's, every time it's refreshed,a new testimonial pops up, right. so you're engaging withthe viewer that way. you might even have likesocial media links on, experimenting with an instagram box.

we'll see how that turns out. let's go to your, i'll come up tothe main page last, go to your footer. your footer here is a huge resource. i like to have a three or four boxfooter that maybe has, like, you know, a summary about us,maybe our social links and then, maybe, like, a schedule, like schedulewith me, or a work with me, right. and this could be an image. maybe it looks like a contact box, butit's an image, and when you click it. it will go back to that work with us page,see.

and then maybe in here you've gotsomething you like your blog roll. right? so your, your latest and greatest blogs. or maybe it's like your mostpopular blogs which you know, you can,you can work that out with some plug ins. in your main page here,your main body, let's go back to that. okay, we said about 400 words. but look at how i have it structured. i have an image up at the top andthen i have some text right next to it.

now underneath that i have more text. underneath that i have some bullet points. so basically what you havehere is you've got, you know, everything you really needto convert that viewer. right up here, right up there. and then you're gonna say something likelet's dig into that a little bit more because you don't want them necessarilymoving off of your page, right? you do want them to scroll, but if they don't, then at least they gotthe point of, of the page across and

the reason you want them to scroll isbecause it increases your scroll rate. right, and this is part of what they calluxl, right, user experienced optimization, it's, it's still seo but we're all goingto be using that term very shortly so be in tuned to that. so, take a look at that, andthen i've got some bullet points here, it just breaks it up, that's it. i'm just breaking up the text intosome bullet points, so that my eyes, the viewer eyes kind of like it. and then of course i've gota closing summary with another

high impact image here. you do wanna have at least let's saytwo links, you know, on the page. one is fine, they should be natural. two links to other sources. right?we become, we become experts by quoting experts. so, links out to two other sources. maybe you got a lin-, you know formore about that, read, read this. or, you know,jim bob does a great article on that here.

and then in your images,your images should have alt tags. so, i like to use at least twoimages per page, plus alt tags. right?and then, you, you're like totally optimizing if you're using wordpress,yo's plug-in, you'll get shining colors. and everything is good to go. so i've got a, a slide file,a cheat sheet that you can use where i have all of my wireframe,my best performing wireframe templates. and if you want to check that out you canclick the link in the description box below and i'll get you all my, you canlook at all my design templates and

you can steal them, you can use them,you can do whatever you want with them. but i have an image like this in there. and you can have like an actual,you know, icon like image with all this kind of stuff on it, and youknow, i hope that it helps you with your. with your website design andyou guys get some great results. let me know where else you're strugglingtoo [sound] if there's any other videos that you think that need to be made orif you have any questions or comments on what i just covered here,if you need some clarity, go ahead and answer you know, put something in thecomments below and i'll engage with you.

if it's your first time on the channel,i definitely want you to subscribe. we are engaging and we want to engagewith you and have a great time with you. so i hope that you'll take the timeto subscribe to the channel. and check out some of ourother videos as well. thank you for joining us on the video spotdot net, and we'll see you next time. [music]

web design software tutorial 12 Damn Cool Free Fonts for Designers

Tidak ada komentar:

Posting Komentar