 Thank you. And it also is my first time presenting to such a good audience, so there with me. I'm really nervous. So we'll get into it because I'll just tell you a little bit about myself. I'm a freelancer. I'm also a mentor. I like to think of myself as an amateur artist. So I really like watercolor and topography and sketching a number of tools that I like doing it. And yes, I'm a nature lover and I just like to draw them up. And she makes it on my own experience a bit later on too. And yeah, I'm a graphic designer, a tone work designer, and I'll tell you a little bit about my journey. So I went to uni to study graphic design, and my plan was to come out of that and design blueberries and different materials, things like that. I had no intention of getting into web at all. And one of my courses at uni was a basic web designer, and I learned some basic HTML, CSS. So I really fell in love with it. I really combined being creative and designing as well as being a big techie and feeling like I can be the housewife as long as I actually know the conditions are really cool. So I really, I got into that and at the time I worked for an architect and convinced him to let me build him my very first paid website. And this is it, yeah. I built it, so I had been photoshopped and then built it in DreamWeekline HTML and you'll notice that I put the logo at the bottom of the page, which I'm not sure why but that was a good idea. I wasn't designing it on time because it's a massive screen so it obviously didn't fit on a big screen but on a laptop these days it would be hidden down the bottom. And also of course I wasn't responsive, none of that. But I was pretty proud of it. And then so it was a few years later that I discovered WordPress and thought, oh, this is pretty awesome, I can build websites in DSN and it's great for my clients because then I can sell it with the content management system and they can edit things themselves and then I could therefore sell it for a high price tag. So I got into WordPress but I didn't develop them in WordPress myself. I was just designing Photoshop and then teamed up with a developer giving to him a new thread after theme forming. So I did that for a few years until I discovered page builders and there's a lot out there now, the one I discovered at the time was Divi and it just opened up my world. It really empowered me as a designer to be able to not only design websites but also build them myself. So it allowed me to cut and it also allowed me to cut out having to design Photoshop and I can just design straight in the browser, which is a huge time saver. So this is where my process is up to now and this is what I'm going to go through today is based on that process. But even if you don't design websites, this is where I'm for a lot of the steps and a lot of things I've thought about this would be better to properly. So let's get into it. I will just mention too that I'm currently playing a teaching this process to people. So I sort of have the nine stages. I have these little metaphors that probably can't be explained but I'm quite happy with a lot of them. So the first stage is the target and this is where we get super clear on your ideal client and your website goals. I really liked this quote I thought it sort of summed up what I'm about to talk about which is the only important thing about design is how it relates to people. So at the start what I like to do is firstly identify the goals of the ideal client. So we can think about the whole target market but as well as just getting specific on the ideal client and I like to actually create just a really basic, not a detail but basically I do the client avatar for that particular website and sort of put in there what their likes and their dislikes are, how old are they, whether they've lived, what's their career, that kind of thing and then I can refer to that any time I'm trying to make a design choice on the website refer what are their goals when they come to the website, what are they there for and what do they want. Next is the brand's goals or the business goals, what are they going out of the website? So this could be obviously to market them, it could be to sell a particular product on there or it also could be to streamline their business a bit or maybe they want to form on there that's going to capture some information that's going to save a lot of admin time or something like that so I didn't mind what those goals are and then lastly did edit some goals. So if you're just going to edit the website what things are they going to want to edit often that you're going to need to make easy for them to access where obviously you don't have to hurry that make it easier for them to be able to edit it on an ongoing basis. So if you have the time, create an idea of client avatar it doesn't have to be very detailed, they can be very detailed if you've seen some of the templates out there I personally don't go into that much effort but just having that there is a really good thing for me as a designer when I'm figuring out what the design and layout of the page is going to be wherever I'm going to put things what are the things people are going to want to put on. So next is the goods. So this is where I gather together the content needed to create the site. So I started out firstly with the site map so essentially that's just an outline of what are the pages going to be and the hierarchy. So I think of it really as your main menu essentially in most websites that's probably just the main menu where things drop down but there might be some other hidden pages on that site there might be certain landing pages or thinking pages you might think to do as well so just sort of laying that out you know, assign that and then thinking of the keywords for the website so it's always you know, I don't get into really full on as your copywriting myself but it's always good to just know so you can think of like good strong page titles and things like that throughout the job and the keywords are always really good to give to a copywriter and even get professional copywriting done do a bit of keyword research first and figure out what the keywords are and then copywriting so whether you're going to do that yourself or outsource to someone so one thing I actually added into my process a few years ago now was including copywriting in my packages because if anyone's worked on a website job you probably know that in your way you're the longest from clients is the copywriting it can be something that delays the job so much so including that in my packages has really sped up the process for me and I don't do it myself I've just partnered with a couple local copywriters who give me a good break and I've just included them and it's all just packaged together for the client and this is a couple of cool tips here regarding the content and things Legal123 if you haven't heard of it is that an Australian website that you can get the terms and conditions and privacy policies and things it is a paid service I think it's the local website package that has some of the three main things to need that display my privacy policy and terms and conditions it's about $170 but say if you refer to a client there you can sign up as an affiliate and then you actually get like 40 bucks back every time someone buys something so that's really cool and then some ways together in content that I found with the use of this who is contents name which is an online tool I think by it is an Aussie going my name is Ethan Brisbane he's created this tool that you can pretty much just send a client there they can enter in all the information that you need for the website and they'll get automatic reminders it's sort of periods of time saying like hey your contents do you want to work you need to submit your content and they're sort of doing all the chasing up for you so that's a really cool tool if you're like me you just hate having to email clients every week and things the way in which they're doing that and then another way of doing that is the Trello board which is one that I'd set up that I just apply it to a Trello board this is an example of my Trello board they keep going there they upload the logo files the style right that have one what they want their website name or tagline all that all those things to be and you can also put a deadline and then you can set this up however you want it and I'll have a look at this at the end too so if you want to carry a copy of my Trello board you might want to look into it cool so the next one is the style so this is where I find the style of the website and this is where my dog gets a camion that's the ring name very stylish so firstly is one of the colours of the website so you can come from the logo or the branding style guide if they already have one or you might be coming up with those yourself if you're having to come up with the colours yourself they're just some really cool tools that I've found for a bit of inspiration coolers.co I think it is and for my gradient so coolers.co is one of just developing colour palettes putting some colours like it has some colour palette suggestions and then you can grab all the colour palettes and add them to your site so that's really good and UI gradients is a similar thing but it's mainly just for gradients really nice gradient combinations and then the fonts one really so giving the fonts to your website and one cool tool I've found for funpair.co which pairs together Google font combinations so it's all Google fonts on there and it just puts them together some interesting combinations and it also leads to seeing them in the wild so you know it leads to websites that actually use those combinations so you can see them in action and then it brings together images as well so there's obviously a lot of stock image websites out there like iStock and Adobe stock but I thought I'd put some free ones up here Unsplash is a really cool free stock image website that I would use every day also it's a really good one Rawpixel is really good too it has free images and paid ones and Otilly is just a little bit different it is a paid membership one but she does get away to free photos a month and they're really kind of girly feminine like late images which I love so I subscribed to her and she's a queen whether or not so I thought I'd put her up there but yeah they gather together all images next I'm up to the canvas so this is where we set up your site Unsolid Foundation so at this point this is where I go grab the domain hosting I usually do that in R1.4 so I personally I'm roasting my websites I use Siteground and I just Bible at the one time otherwise you know if you already had the domain hosting but this is where I do that stuff and then I also install WordPress and yeah this one a little tip here and I'm sure you probably voted a lot today already is not to skimp on hosting there's so many website hosting providers out there and if you're serious about your business you definitely want to do a website post not every business needs or can afford WP engines some of those really good ones so that's why I find Sitegrounds quite good for my small clients it's quite cost effective so next we up to the brush which is to set up the basics of your WordPress website and so this is where I typically install my theme, my child theme most of my plugins and the general settings on the website what I one of the biggest time savers I've found is an app called or a tool called ManagedWP which allows me to clone a staging site when I'm setting up a new website so there's lots of tools out there that can do this and actually in the last presentation I just saw one of the plugins that he was talking about with some migration clone tool and it sounds like it probably does exactly what this does and it's free but essentially what it does is this is a screenshot set up so that's already got my theme installed, my child theme installed it's got a whole bunch of plugins that I regularly use and just some basic settings so all those things when you first set up a website you'll notice you have to be over and over again each time and it's probably it's got the easy work but it probably takes an hour and an hour to do to say that I just have this already set up as a staging site and then I just clone it over to the new hosting or wherever the new destination site's going to be and within 15, 30 seconds it's all done and ready for me to go and I just have to go on and change it so that's a huge time saver and my new WP is it's free to set up and then for that planning ability I think I'll pay back $2 Australian a month so it's really cheap but maybe if you want to pay that check out that the last time I was talking about because I can do it yet but it's pretty cool too oh yeah and the tip here is this is where I typically do a set up a coming soon page basically because and I've shown you this is the coming soon page I have where if you have a website that you're building and it might take a month, three months, six months depending on how long the client takes it'll be up there and Google can be indexing it during that time so rather than not getting any index or anything you can put up a coming soon page like this you can put in the relevant keywords and the relevant page title and description of these and it will actually start indexing the site and doing it that way so this just shows you here I have this basic template and this is the basic one and so you can make sure that it's all indexed and once the website actually goes live it's actually starting to appear on Google already and then we're finally at design time so the first thing I do is create a wireframe and this is generally just for my reference this is my fancy wireframe that I draw for myself this is for a job I only did a month ago so I don't have to show this to the client obviously it's not very impressive but for me it just gives me like when I get all the content and I know it's going to need to go on the home page for example I can then put this in like a bit of a layout in my head before I start building just makes it a lot easier than trying to do it on the go so I have a little sort of method to my band that's here you'll see like all the little circles at the top or obviously the social media links the dashes of the main menu items then if I have a heading I'll just do a straight line if it's body text I'll do like a squiggle so I just know for my reference that's what's going on and that really awesome box with a weird mountain thing in it that's my idea of the image so that's very convenient to go but just doing that for a page just makes it a lot easier for me today once I go into the building to design I know what I'm actually going to do um so I don't know why I frame and then we'll just create all the pages I won't actually add anything to them I'll just create them and set them up as pages and that way I can then add them to the main menu I'll go into my theme options my theme customizer and I'll just set up some basics with that so we might need to set up the color palettes and colors that I've chosen the ones that I'm going to be needing all the time I'll set up the fonts that I've chosen I'll add the logo just all those basic kind of things like the layout of the header stuff like that and once I've got all that set up that's when I go to my visual builder which is I used to be but obviously there's a lot of different page builders out there visual builder elementor they're all fairly similar in what they do I then yeah I'll go to the visual builder and I'll just start designing in there and this is just a quick big sort of this is how dv works and I have used dv to build before it it's quite similar as well and so you're designing and seeing it all come to life similar to Gutenberg on steroids really and so yeah I'll just go in there do all that create my frame page then the next step is once I'm happy with the frame page I then create the library with all moving on to the rest of the site so what I do is create a library of items to reuse throughout the site which saves a lot of time so firstly yeah so if possible you just save sections or modules or whole pages so for instance if you've had a user call the action section or multiple pages of your website save that and you can save that if there is like a global item which will be exactly the same across all the all the pages and the benefit of a global item is that you edit it once in one location and it will change it across all of those locations you don't have to go on to ten different pages you know change your full stock or something like that for other items maybe you just have a bunch of services pages you've got three different services and the layout's going to be exactly the same for each of those pages so for the layout obviously it's not going to be a global one and then replicate that on the other pages and then just swap out the content and then you do the text and things one tip here is I learned this the hard way, test it on mobile some tablets before you save those items because if you're then going to be duplicated many times and then you test it later and go oh that's terrible on mobile you don't want to have to be changing it over and over again so I like to test these before I actually go and start duplicated and then we're into the fit out which is filling all the other pages of your website so now you've got all your library items all set up then you can just start running and creating all those pages and yeah and then I just test and get it proven obviously before we're ready to go live a tip here is to avoid shining objects in drama can be really tempting when you've got these page builder things and there's so many different options and animations and there's gradients and there's parallax and all this cool stuff going on and you just want to do everything really going back to the idea of who's that ideal client what's the goal of the website what's the best way of getting them to sort of funnel through and get to the end goal and you don't want to have all these different things going on and distracting them so maybe you do want a bit of a flashy thing happening and it's going to get their attention so just keeping that in mind and I thought this was a great tip less is not necessarily more just enough is more so make it yet look awesome and all that but just keep in mind what the goals are for the website and what's going to be the best method of getting people to do what you want them to do and lastly I really don't like this metaphor but it's all I can come up with is the housekeeper so clean it up, make it fast and get your website ready to open its doors so at the end of every job just before I go live I just like to tidy everything up probably that very city person in me I just want to make sure that everything is nice and clean and tidy so basically cleaning it up is getting rid of all those extra images that you probably uploaded that you're not using on the site anymore removing any plugins you don't actually need anymore deleting any pages you don't need that you may have just made up draft pages or draft posts or something like that that you're not actually going to use just cleaning it all up which is really important too if you're building websites for clients make it nice and clean before you give it to them otherwise they might just get confused about all these extra pages and things like that I also like to add text to all the images as well and obviously I do this after I've deleted all the images I don't need otherwise you're just going to be wasting time adding all text images you're going to end up deleting anyway there's a lot of images so compress them so before I upload them I've already resized them roughly roughly to what they should be I'm going to optimize them a bit but then adding like a plugin like WP's which is what I use just to compress the images which is even further to make your website load a lot faster adding a security plugin as well if you need it, some posting providers you don't necessarily need it I know I use WordFence on all my siteground websites but on my WP engine one so I won't let me use WordFence because there's security being in place for that in there but not security anyway but ensuring that there is some form of security in your websites is important adding a caching plugin as well so something that caching and caching so adding a caching plugin to speed up your website a lot but I might not use WP Rocket which is a K1 but there are some free ones out there and then also adding Google Analytics and Search Console so saving that up and connecting that to your website even if you or if you're doing it for a client if you don't feel like you need it it's a good thing to have just for down the track if for some reason you're down a year or two time you want to start doing something or with your website, you want to start marketing it it's good to have those statistics and everything in place already and just a tip here is to have a pre-flight checklist so I have a checklist of about 30 or 40 points on it that I just wrote here at the end of every job and take them off and make sure that they're done and it's really easy to deal with the end too and now if you just read through all this and get to the bottom so having some kind of checklist and I just have that set up on my trolley board and go through that each time and then launch it then you're ready to go so that's it and then I just wanted to there's a link here to if all those things I was talking about if you want to go to that URL there I've got links to all that and I also have an ideal client that you can download there too and link to my trolley board thank you