How to Design a Website Like a Pro Using Wix

hi everyone this is Kate Bradshaw from web today I’m also the wicks and method of the Sydney and today I’m going to show you some tricks and techniques that I use every time when I’m designing the home page of a website it’s easy to know what to do with WIC but it’s hard to know how to get the book into you’re just right and that’s what I’m going to show you today okay first thing I do is I’m using a wisk editor and our life consultants a
blank template I’m going on select my blank template and I like to start from scratch anything else is a bit too restrictive for what I’m going to show you today okay so now I listen to the creditor we don’t need the help and introductory videos because you’ve got me okay so here we are a totally blank slate and the first thing I like to do new is padded back ground that’s pretty basic right sometimes I don’t quite know what I want my background
to be I don’t know if I’m going to want a white background I don’t know if I’m going to want a picture background but for right now I think I’m going to start with an image and I’m going to try this one here right okay and straight away this is already how I want my website looks and for those of you who are overseas this is my city this is the Sydney Harbour Bridge and the Opera House gorgeous a so the next thing I do and this is where people
who are new to design come unstuck the next thing I do is I use strips and I really recommend that you start designing using strips if you haven’t discovered yet this is what you need to do so I’m going to add and I’m going to add a strip and this is going to be a white one and I’m going to add another strip and this is going to be a black one I just found now I’m not going to lay these it’s like and why it’s just that I don’t want it’s just that
I need to know where my strips start finish okay now I like to duplicate those three so I if you do a noisy there I kept a little minus button I want to duplicate the industry so a little fruit so now I have my page with a few straight lines for the header I’m going to make that an overlay of the image so let’s some of the best now I don’t want to strip here covering up my my background my lovely Harbour Bridge so I’m going to lose that down now
you can see I’m using the large drag arrow to bring it down one of it looks really good is a white plain white strips underneath your colorful background to using a colorful background now sometimes in this position of the background here I might use the slideshow or I might news some kind of script gallery we’ve got options in that area this is going to be a little set of text now and I like to add your Bauhaus or something that gives that the
viewer a summary about what they’re going to see on the side so I’m going to add some text one of the things I also like to do very early in the piece to set up my text silence so this is how I do it okay I go over each type anyway now I can choose how I want these salts to be inside this is the editor text and I’m not going to choose custom analysis decide I’m going to choose please how about open sans condense and I need to save 16 ok so now
whenever I choose cite titles throughout the site the people the open sans condense and now I want my other type styles to match so I do the same process same date that sighs okay and play the same now that small heading is about as small as you can go in open sans condense and in fact what I like to do with that small heading you increase the kerning or the spaces between letters so now where do I go whatever I do inside the headings are going
to be the same file support that I want them to be all through the side and so the paragraph text let them save me a lot of time by not having to change the size that it goes to its patrol position not having to change the font when it goes to its default typeface and size I’m going to put my site plan view I’m going centerís scared of leaving some lovely white space because that’s really helpful now for these paragraphs I think it’s a good news
it looks nicely leads if you do the full justification on your text so let’s make that adjustment now and I think several columns would be good here now you can use which new columns feature which will allow you to go to the center of the screen but you don’t have to do that if you don’t want to you can just simply use two columns I use control-v to duplicate that text link into one group okay and here’s where you add some text layer so the next
site down I usually like to add another set of pictures so um for this trip I’m going to add another gallery and it would be a gallery that pertains to what you’re doing so let’s have a go or it might be so Connor okay so I’m going to pretend that we’re selling some fashion look same and only three categories women men and accessories how about that and recursively free with image library got some fantastic very beautiful images and now I’m going
to change the texture on images box alone now you can see the strip there has adjusted itself to the width of the gallery that’s not quite what I want and I’d like a bit more space between these images as well so now I might come some white text on my black background my undergone Farrakhan do control D to duplicate always go to no shortcuts okay now my title is going to be directed to the people service they shot the book and if there’s like a
call to action this is telling people what I want them to do add a bit more save and under each one on one time description probably learning that that no paren dot that you see coming up there in the text is my grammar checker but we also have its own spellcheck now so it’s not really necessary ok let’s change that color great ok so now I can describe what happens when you click information where you’re going to go okay great you think I’ve
missed you know quite a bit of space between the top of this strips and petting and quite a bit of space here again and I want to leave just a little bit more down the bottom here now in the next strip I quite like to have something like a testimonial so let’s put a testimonial in here now what’s good to do in testimonials just going off-topic tremendous and talking about SEO if the HIPAA keywords because really what people to know that this is
a dress shop in Sydney Sydney ladies fashion or whatever your keywords are and great pieces in testimonials and in text on your site I think a different kind of energy to it might be good too I go by the lake you can move the text map so when you put an image like this with your testimonial it makes it a little bit more salient it puts it in context and also makes it a little bit more believable so there’s our testimonial what comes next well I
think social media feed into the site we’ll come back we’ll get that from the app market I think adding a social media stream is a really good enhancement to a client’s site so it’s worth considering just latest looks now now obviously this isn’t a fashion feed line so social media tool that I particular life its attention you can add it to your site and to get it or you can use it as a full multimedia monitoring and editing tool so it’s really
worth getting tonight then lastly and perhaps in footer will put the contact details and perhaps logo we can talk about the header we’re going to put in here is a load of just around and logo that I just found but imagine your fashion Logan I like to put it over here in tents and it’s the Peter I’m going to fix my header Cree’s it now I’m going to paint my logo image to the screen I can say they’re outside the normal boundaries I also like to
make sure I get the keywords in the header especially if I’m using the logo as an image so what you can see now is that I’ve got the basis for a very nice design so I hear that it sounds a bit in preview okay so when our header expanding off a little way from the background image that looks great my good even has an image in front of its background image as well which would look lovely perform ad in one of the dresses I’ve got a nice little clean
piece of text here I’ve got a call to action what you want me to the person to do next shop women shop men’s accessories and that’s invert allow a draw we’ve got a testimonial we’ve got a social feed so that the buying public knows that this business is awake and we have some contact details and multi-engine put up I think if you use this strict method of design then you can easily achieve a very nice design in your site thanks for watching this
is the in case Rachel on the Wix editor my website is web today combo you and I’m the Wix ambassador for Sydney if you want to have a look at our training courses come along to Wix web design Sydney or like us on Facebook my web today here’s Thea