Ready to race right off the starting block into building your website? We love the enthusiasm. But before even reaching the starting line, you need to get in some warm-ups and conditioning to establish a solid foundation. Every good website begins with a thoughtful plan. Open a fresh new digital doc (or grab a pen and paper if you’d prefer to go old school) and complete the following exercises.
!function(n,t){function r(e,n){return Object.prototype.hasOwnProperty.call(e,n)}function i(e){return void 0===e}if(n){var o={},s=n.TraceKit,a=[].slice,l="?";o.noConflict=function(){return n.TraceKit=s,o},o.wrap=function(e){function n(){try{return e.apply(this,arguments)}catch(e){throw o.report(e),e}}return n},o.report=function(){function e(e){l(),h.push(e)}function t(e){for(var n=h.length-1;n>=0;--n)h[n]===e&&h.splice(n,1)}function i(e,n){var t=null;if(!n||o.collectWindowErrors){for(var i in h)if(r(h,i))try{h[i].apply(null,[e].concat(a.call(arguments,2)))}catch(e){t=e}if(t)throw t}}function s(e,n,t,r,s){var a=null;if(w)o.computeStackTrace.augmentStackTraceWithInitialElement(w,n,t,e),u();else if(s)a=o.computeStackTrace(s),i(a,!0);else{var l={url:n,line:t,column:r};l.func=o.computeStackTrace.guessFunctionName(l.url,l.line),l.context=o.computeStackTrace.gatherContext(l.url,l.line),a={mode:"onerror",message:e,stack:[l]},i(a,!0)}return!!f&&f.apply(this,arguments)}function l(){!0!==d&&(f=n.onerror,n.onerror=s,d=!0)}function u(){var e=w,n=p;p=null,w=null,m=null,i.apply(null,[e,!1].concat(n))}function c(e){if(w){if(m===e)return;u()}var t=o.computeStackTrace(e);throw w=t,m=e,p=a.call(arguments,1),n.setTimeout(function(){m===e&&u()},t.incomplete?2e3:0),e}var f,d,h=[],p=null,m=null,w=null;return c.subscribe=e,c.unsubscribe=t,c}(),o.computeStackTrace=function(){function e(e){if(!o.remoteFetching)return"";try{var t=function(){try{return new n.XMLHttpRequest}catch(e){return new n.ActiveXObject("Microsoft.XMLHTTP")}},r=t();return r.open("GET",e,!1),r.send(""),r.responseText}catch(e){return""}}function t(t){if("string"!=typeof t)return[];if(!r(j,t)){var i="",o="";try{o=n.document.domain}catch(e){}var s=/(.*)\:\/\/([^:\/]+)([:\d]*)\/{0,1}([\s\S]*)/.exec(t);s&&s[2]===o&&(i=e(t)),j[t]=i?i.split("\n"):[]}return j[t]}function s(e,n){var r,o=/function ([^(]*)\(([^)]*)\)/,s=/['"]?([0-9A-Za-z$_]+)['"]?\s*[:=]\s*(function|eval|new Function)/,a="",u=10,c=t(e);if(!c.length)return l;for(var f=0;f0?s:null}function u(e){return e.replace(/[\-\[\]{}()*+?.,\\\^$|#]/g,"\\$&")}function c(e){return u(e).replace("<","(?:<|<)").replace(">","(?:>|>)").replace("&","(?:&|&)").replace('"','(?:"|")').replace(/\s+/g,"\\s+")}function f(e,n){for(var r,i,o=0,s=n.length;or&&(i=s.exec(o[r]))?i.index:null}function h(e){if(!i(n&&n.document)){for(var t,r,o,s,a=[n.location.href],l=n.document.getElementsByTagName("script"),d=""+e,h=/^function(?:\s+([\w$]+))?\s*\(([\w\s,]*)\)\s*\{\s*(\S[\s\S]*\S)\s*\}\s*$/,p=/^function on([\w$]+)\s*\(event\)\s*\{\s*(\S[\s\S]*\S)\s*\}\s*$/,m=0;m]+)>|([^\)]+))\((.*)\))? in (.*):\s*$/i,o=n.split("\n"),l=[],u=0;u=0&&(g.line=v+x.substring(0,j).split("\n").length)}}}else if(o=d.exec(i[y])){var _=n.location.href.replace(/#.*$/,""),T=new RegExp(c(i[y+1])),E=f(T,[_]);g={url:_,func:"",args:[],line:E?E.line:o[1],column:null}}if(g){g.func||(g.func=s(g.url,g.line));var k=a(g.url,g.line),A=k?k[Math.floor(k.length/2)]:null;k&&A.replace(/^\s*/,"")===i[y+1].replace(/^\s*/,"")?g.context=k:g.context=[i[y+1]],h.push(g)}}return h.length?{mode:"multiline",name:e.name,message:i[0],stack:h}:null}function y(e,n,t,r){var i={url:n,line:t};if(i.url&&i.line){e.incomplete=!1,i.func||(i.func=s(i.url,i.line)),i.context||(i.context=a(i.url,i.line));var o=/ '([^']+)' /.exec(r);if(o&&(i.column=d(o[1],i.url,i.line)),e.stack.length>0&&e.stack[0].url===i.url){if(e.stack[0].line===i.line)return!1;if(!e.stack[0].line&&e.stack[0].func===i.func)return e.stack[0].line=i.line,e.stack[0].context=i.context,!1}return e.stack.unshift(i),e.partial=!0,!0}return e.incomplete=!0,!1}function g(e,n){for(var t,r,i,a=/function\s+([_$a-zA-Z\xA0-\uFFFF][_$a-zA-Z0-9\xA0-\uFFFF]*)?\s*\(/i,u=[],c={},f=!1,p=g.caller;p&&!f;p=p.caller)if(p!==v&&p!==o.report){if(r={url:null,func:l,args:[],line:null,column:null},p.name?r.func=p.name:(t=a.exec(p.toString()))&&(r.func=t[1]),"undefined"==typeof r.func)try{r.func=t.input.substring(0,t.input.indexOf("{"))}catch(e){}if(i=h(p)){r.url=i.url,r.line=i.line,r.func===l&&(r.func=s(r.url,r.line));var m=/ '([^']+)' /.exec(e.message||e.description);m&&(r.column=d(m[1],i.url,i.line))}c[""+p]?f=!0:c[""+p]=!0,u.push(r)}n&&u.splice(0,n);var w={mode:"callers",name:e.name,message:e.message,stack:u};return y(w,e.sourceURL||e.fileName,e.line||e.lineNumber,e.message||e.description),w}function v(e,n){var t=null;n=null==n?0:+n;try{if(t=m(e))return t}catch(e){if(x)throw e}try{if(t=p(e))return t}catch(e){if(x)throw e}try{if(t=w(e))return t}catch(e){if(x)throw e}try{if(t=g(e,n+1))return t}catch(e){if(x)throw e}return{mode:"failed"}}function b(e){e=1+(null==e?0:+e);try{throw new Error}catch(n){return v(n,e+1)}}var x=!1,j={};return v.augmentStackTraceWithInitialElement=y,v.guessFunctionName=s,v.gatherContext=a,v.ofCaller=b,v.getSource=t,v}(),o.extendToAsynchronousCallbacks=function(){var e=function(e){var t=n[e];n[e]=function(){var e=a.call(arguments),n=e[0];return"function"==typeof n&&(e[0]=o.wrap(n)),t.apply?t.apply(this,e):t(e[0],e[1])}};e("setTimeout"),e("setInterval")},o.remoteFetching||(o.remoteFetching=!0),o.collectWindowErrors||(o.collectWindowErrors=!0),(!o.linesOfContext||o.linesOfContext<1)&&(o.linesOfContext=11),void 0!==e&&e.exports&&n.module!==e?e.exports=o:"function"==typeof define&&define.amd?define("TraceKit",[],o):n.TraceKit=o}}("undefined"!=typeof window?window:global)},"./webpack-loaders/expose-loader/index.js?require!./shared/require-global.js":function(e,n,t){(function(n){e.exports=n.require=t("./shared/require-global.js")}).call(n,t("../../../lib/node_modules/webpack/buildin/global.js"))}});
Hi A S, Picking and purchasing a domain name and start building your website go hand in hand. What usually happens is that you test out a few different website builders to see which one you enjoy working with and has the tools that you are looking for. During that time, you can also start your search for your domain name. This is usually your business' name or brand name. We have a domain name guide here. Once you settle with a website builder and decide to upgrade to a paid plan, you can then connect your domain name to the website. Each website builder will have tutorials on how to do that. Hope this helps! Jeremy

Hello Danny, I definitely agree with your thoughts on Weebly, it really is a very easy-to-use platform if you're new to website building. Weebly have made a great effort to ensure the platform (and especially their editor) are as user friendly as possible, which really does make it easier to build a great-looking site without any technical skills! If you feel like your technical skills are up to the challenge then WordPress is definitely worth trying out. Give it a test and see how you get on. Thanks for reading, - Tom

Full Disclaimer: If you choose to use the domain and hosting option I recommend in this tutorial and click my links to get to it, I’ll earn a commission (though there is no extra cost to you – it will actually be quite a bit cheaper since I’m able to offer a coupon code). I want to be very clear that there are definitely other good choices for your domain and hosting out there. This is simply the one I’ve been using since the beginning, and I’m very satisfied. If you do choose to use my link, thank you! 
In my feature comparison table I show which website builders you let design a website from scratch— and there are a handful. Of those I would recommend Wix. Wix is an excellent, highly customizable website builder. It can be a bit overwhelming with the amount of options it provides— but that's exactly what you want if you're designing a theme from scratch.
For most users, free themes are the best place to start. When you install a new theme, it doesn’t change the content on your site, only the layout. This means you can download and install a number of different themes to see which theme suits you best. If you feel like you need something more advanced than a free theme, you can always install a paid theme at a later date.
In this guide, we are going to help you with these decisions by showing your choices and explaining how specific options will fit your unique needs. We’ll cover everything from understanding what type of website you need and choosing a domain name, to the finishing touches that will help you launch your website successfully, no matter what your goals are.
JavaScript : JavaScript lets you add a ton more functionality to your websites. You can even create a lot of basic web applications using HTML, CSS, and JS. On the most basic level, JS lets you add a lot of interactive elements to your websites. You will be able to make your website more user interactive. Further, you need to know about JavaScript frameworks. JS frameworks give a ready-made structure to your JavaScript code. JS frameworks include AngularJS, BackboneJS, EmberJS and ReactJS.
Hello Danny, I definitely agree with your thoughts on Weebly, it really is a very easy-to-use platform if you're new to website building. Weebly have made a great effort to ensure the platform (and especially their editor) are as user friendly as possible, which really does make it easier to build a great-looking site without any technical skills! If you feel like your technical skills are up to the challenge then WordPress is definitely worth trying out. Give it a test and see how you get on. Thanks for reading, - Tom
Absolutely awesome! I recommend this course to anyone who feels like learning to code is too hard to start off with, because it really isn't. I thought it was too hard, but Ryan makes it look really easy with his step for step increase in difficulty. I built my own website within a week after starting this course, and it looks really great. Keep it up, Ryan! -- Robert de Kok
Disclaimer: We spend hours researching and writing our articles and strive to provide accurate, up-to-date content. However, our research is meant to aid your own, and we are not acting as licensed professionals. We recommend that you consult with your own lawyer, accountant, or other licensed professional for relevant business decisions. Click here to see our full disclaimer.

Hi Chris, We actually used WordPress to build this website. Our website is focused on blogging and so we used the best, most flexible platform for this purchase. Having said that, we've heavily customized this websites since we're now proficient with coding. If it was 6 years ago, we wouldn't be able to do what we are doing now. We started making websites in 6 - 7 years ago and didn't know anything about coding. It took us a few years to become more proficient with coding, with a lot of practice. So during the first few years, we relied on code-free, drag and drop website builders for all of our projects. They were great since we didn't need to be technical at all, and we were able to build businesses. So if you want to build something similar to our website, I'd suggest you learn how to code and practice a lot. Eventually you'll get there! Hope this explains things a bit! Jeremy
JavaScript : JavaScript lets you add a ton more functionality to your websites. You can even create a lot of basic web applications using HTML, CSS, and JS. On the most basic level, JS lets you add a lot of interactive elements to your websites. You will be able to make your website more user interactive. Further, you need to know about JavaScript frameworks. JS frameworks give a ready-made structure to your JavaScript code. JS frameworks include AngularJS, BackboneJS, EmberJS and ReactJS.
Learn fast - its not made from old outdated teaching methods where you learn everything up front and then start building. No that's boring, frustrating, overwhelming and just plain unecessary. In this course you're going to start building your first site from the beginning. The result, you'll stay engaged and enjoy the interactive nature of this new type of learning.
Hi Jeremy! Thank you for giving me a very straightforward and transparent approach to making your own website. My daughter is a visual artist, and she will be applying to art schools in the next year. A website is necessary for her to show her work (all still paintings) to prospective art school admissions councilors and staff. What would be a good builder to use to "bring to life" her paintings and present them in a simple, tasteful and uncluttered way? And at this time, she is not going to use this site to sell her work, just present it to schools.
Thanks so much for this awesome article :) I had literally no experience in building a website when I started using Weebly and I was surprised at how easy it was to make! I'm interested in looking into other platforms now that I'm up and running, particularly Wordpress? But I'll probably be sticking with Weebly for a long time until I'm ready, it really was super easy to use. Thanks again :)

Blogs are swell, but sometimes you need a simple place to park your persona on the internet for branding purposes. In this case, you can just get a nameplate site, or as we prefer to think of them, a personal webpage (rather than a multipage site). Instead of linking internally to your store or other pages of note as you would with a more traditional web page, a personal site usually has links that go elsewhere—to your social networks, wish lists, playlists, or whatever else is linkable.
Hi Jeremy, This is the most informative article on web design that I have come across. And I have read quite a number! I had a question though. I don't know anything about html/css or any code for web design, and I need to include a searchable database in a website I'm to create. Any ideas/tips on doing this on a WYSIWYG website builder? Thank you very much
Once you get a handle on HTML and CSS, you can make what is called a static website. It’s simply one .HTML file represents one page on your site. Static sites are relatively the fastest to load and typically allows designers the most freedom without compromises that have to be made due to limitations of many CMS/Frameworks. (Wordpress in particular is infamous for this, although it has improved).
Once you have an overview of your website plan/sitemap, you can drill down to the specifics of the content you need to create for a website launch. It will be important to create evergreen content (content that will not be changing much and will appear on the static pages) and also important to have fresh content appearing on your website on a regular basis.
Use 99Designs.com: 99Designs.com runs contests where multiple designers compete for your logo and other design business. This is a great option because you get to see many different professional and creative designs (It’s how we found our logo at Fit Small Business!), yet only pay for the one you wind up choosing. The price on 99designs ranges from $299 to $799 depending on how many designers you want competing and the quality of those designers.
Get advanced capabilities with all the design features of the Wix Editor. Build custom web applications and robust websites. It’s serverless, hassle-free coding. You can set up your own database collections, build content rich websites, add custom forms and change site behavior with our APIs. Plus, anything you create is SEO compatible. With our website builder, you can create anything you want.
You can take photos on your own or find stock photography websites that sell professional photos at a reasonable price. Some websites charge a fee for their images, and other provide them for free. If you decide to use images found online, make sure they are from royalty-free sources. Many images have copyrights and you need permission to use them on your website.
Weebly is not the best website builder. Yes, it’s convenient and has intuitive interface but their web templates aren’t good. Compare them with free templates from Wix or with paid ones from Squarespace – they are really worthy and beautiful web templates. Weebly doesn’t have such. I think that many believe that Weebly is the best website builder because everybody talk about it and not just because it’s the best. It’s like about IKEA furniture – many like it but I wouldn’t say that it’s the best. You could better try to work with another platform.
Of course the design of your website should be visually appealing, you don’t want people to leave your site screaming in horror, but it’s not everything. On top of having a website that’s easy on the eyes, it needs to convey the message you’re trying to present, such as your business objective, plan of action for visitors and the quality content that you’ve been busy creating.

JavaScript : JavaScript lets you add a ton more functionality to your websites. You can even create a lot of basic web applications using HTML, CSS, and JS. On the most basic level, JS lets you add a lot of interactive elements to your websites. You will be able to make your website more user interactive. Further, you need to know about JavaScript frameworks. JS frameworks give a ready-made structure to your JavaScript code. JS frameworks include AngularJS, BackboneJS, EmberJS and ReactJS.


Personally, I find the free Simple theme to be enough for my needs. If you need additional features and even more flexibility, though, Ultra is my top recommendation. Note: Since Simple and Ultra are made by the same people and use the same foundation, you can start out with Simple and transfer everything you’ve created to Ultra if you end up needing it.
Blogs are swell, but sometimes you need a simple place to park your persona on the internet for branding purposes. In this case, you can just get a nameplate site, or as we prefer to think of them, a personal webpage (rather than a multipage site). Instead of linking internally to your store or other pages of note as you would with a more traditional web page, a personal site usually has links that go elsewhere—to your social networks, wish lists, playlists, or whatever else is linkable.
When things start to become more complex and you start needing to store user information, collect form input, automatically send emails etc. you’re going to need to learn a server-side language. PHP is the most common and has been around a long time. Others include Python, Perl, Java and Ruby to name a few. You can now also choose to use JavaScript as a server side language with Node.js. You will also need to learn how to write SQL commands to interact directly with a database. (Some types of databases don’t use SQL but the most common ones do.)

My name is Steve Benjamins and I’ve designed and coded websites for the last 20 years (since I was 10 years old). My websites have been featured in Wired, The Next Web, Smashing Magazine, The Huffington Post and Forbes. I am the sole developer, designer and reviewer at Site Builder Report— you can read more about my story in my interview with IndieHackers.
In general, as far as I know, all commercial web hosts let you install SSL certificates for your site. The price varies, though, from company to company. Some give you a certificate for free. Others will install a free certificate for a one time charge. Some require you to buy a commercial certificate (which has a recurring charge). And there are those that not only require you to buy a certificate, but also impose a monthly fee for using it on your website (on top of the recurring charge for that certificate). A discussion on how to get SSL certificates (including the free ones) can be found in that article mentioned earlier.
A web host is basically a company that has many computers connected to the Internet. When you place your web pages on their computers, everyone in the world will be able to connect to it and view them. You will need to sign up for an account with a web host so that your website has a home. If getting a domain name is analogous to getting a business name in the brick-and-mortar world, getting a web hosting account is comparable to renting office or shop premises for your business.
Another advantage of CSS (of separating the content from the layout and look) is that it is easier to make changes in the future. Without CSS, coming back from a 3 month vacation can be a nightmare. Navigating through content mixed together with layout HTML can be more vexing then deciphering hieroglyphics, more tangled then last years Christmas tree lights. But with CSS, content is separated from layout, it is much easier to make changes to your website even if your cruise vacation is unexpectedly extended a couple years due to Somali pirates.
let’s use the example of a customer trying to purchase a plane ticket using a website. Everything that the customer sees on the webpage is the front-end, as we have explained programming languages name before, but once that customer enters all of his or her information, such as their name, billing address, destination, etc, the web application stores the information in a database that was created previously on the server in which the website is calling for information.
I personally don’t think site builders will ever replace web designers/developers completely. Most site builders are targeted at small businesses and could never meet the demands required for larger businesses with all their complex requirements. I think Shopify plus is the only product trying to take on the larger CMS platforms right now (e.g. Magenta, Demandware) in the eCommerce space
Investigate e-commerce solutions — How are you planning to sell and accept payment on your website? You’ll need to get that squared away before promoting your website. If you’re using WordPress, we recommend Woocommerce (so much so, that we’ve even got hosting just for Woocommerce users). Study up on the world of e-commerce and pick an online payment gateway.
Good article - but to make my choice easier, i must say this web site is awesome. What website builder did you build this site on Jeremy? Because all other website templates from the builders that i see operate nowhere near as good as this site. This site looks great in all devices, it runs quick - looks really professional and has so many features that i see. It just works well. The others look good on the surface but when you realy start to see how they look (changing browser window) and how they run and load this web site is light years ahead. So which website builder did you use for this site? This would be my choice for sure.
Hey Theo, Generally speaking, Weebly is a solid website building platform. You don't need how to code, their probably one of the most user-friendly web builders, and their support is good. Best way to decide is to sign up for a free account and start testing their tools. You're not obligated to subscribe to a premium paid plan at all. You can upgrade whenever you want to, and only if you find them being to provide the tools and services that you need. Jeremy
Great Article and the only one that gives a step by step guide. This might be a silly question but I keep reading about buying a hosting space on the internet and you haven't mentioned that at all. Is that same as buying a domain? Does it mean that if i get one of the website builder plans with the domain included, then I dont need to go anywhere else?
×