Standards Certification Education & Training Publishing Conferences & Exhibits Easy Web Design ISA Toronto – Jan 2013

Starting out… To get started, you will need: –A domain name (example.com) –A hosting company (Host Gator, GoDaddy, etc.) –An idea as to what you would like to accomplish. –A basic understanding of word processing programs –(optional) basic understanding of HTML –(optional) basic understanding of Graphic Design programs –Content –…and a “can do” attitude!

Step 1 Domain Name Figure out a domain name (example.com), and check to see if it is available. Whois.net is a good tool for this, plug in the name and it will tell you if it’s taken. Have someone read the domain name to make sure it sounds ok. See au/bad-domain- names.html for examples. au/bad-domain- names.html

Step 2 Find a Hosting Company The hosting company is who will be hosting your data on their servers. Therefore, reliability and security are important. We use hostgator.com, but there are many out there. Eg. GoDaddy, iPage, Hub, etc.

Step 3 Install the software First, what do you want to do? If it is just a simple blog, then something like WordPress would be good. Something a little more complicated could make use of a CMS (Content Management Software) such as Concrete5. Second, like all software, it must be installed, except in this case it will be installed on a remote server rather than your local machine. Some software requires you to install secondary packages such as mySQL, myPHP, PHPadmin, etc. and set everything up. Some hosting companies will require you to get everything up and running manually. Others have “one-click” installation programs which can handle everything.

Step 4 Initial Setup Create all of your user names and passwords. –There will be a lot of these. CREATE A WORD DOCUMENT!!! –Type in EVERYTHING, and save this document in multiple locations. –By everything we mean: –User Names –Passwords –Site addresses (config sites will have long URLs) –Colour Schemes in Hex (ISA Blue = #00477F) –Sizes of everything: text, boxes, pages, etc. –Who has access to what

Step 5 Building with Concrete5 – Site Layout Just like the file system on your computer, your website will have a “tree” type system. While you can arrange the pages any way you want, it is easier if there is some reasoning behind it.

Step 6 Choose Your Theme The theme dictates colours, type sizes, fonts, layouts…basically everything concerning the look and feel of the site. Also can limit what you can customize. So…no pressure. –Not to worry, it can be changed.

Step 7 Your First Page 1.Pick your page type a)Mostly set out by the theme. b)Dictates layout. 2.Fill in the properties a)URL Slug is the name that browsers will look for. b)Description is what is shown on search engines. 3.Hit add, and away you go!

Step 8 Drop in some Blocks Blocks are really the building blocks of the site. Drop them in where you want! While there are a list of blocks that come with each installation, more can be added. Some are free, some aren’t.

Step 9 Rinse and Repeat Add in a few more blocks, and congratulations, you’ve just created your very own website! Once you have the basic site up, start toying around with some other features: Stacks: Made up of one or more blocks that act like a custom block that you can use anywhere on the site. Useful for repetitive tasks. File Manager: Allocates locations for all files to be stored on the website under the Concrete5 program. Auto-Nav: Creates automatic navigation menus depending on site layout Form: Custom forms where all completions can be sent to an address.

Helpful Sites and Programs –A free graphic design program that started life out as MS Paint 2.0. Donate if you like it. htmlhttp:// html –Whether it’s a legal version or not is up to you, but it’s a free version of Creative Suite without having to torrent. –A handy little colour picker for those of us that can’t tell if Dusty Sunset goes with Lakeside Blue. –Google’s traffic analysis suite.

Helpful Sites and Programs cont’d –Google Calendar. Easily integrated into c5. –Tools that show how your site is viewed by the Google search engine. –Ditto Bing and Yahoo! –Mail Chimp mass distribution site. Free for <2,000 addresses and <12,000 s per month. –Free courses on Java, HTML, Python, APIs, and much more.