albanyWebsites

Before you begin building

Its well worth spending some time thinking and planning in advance of building a website or webstore. Make a cup of coffee and take some time out or visit your local cafe where you can be away from your everyday life ... with enough head space to get some perspective and bright ideas!

Essentially, a website is a series of ideas or products and services that are connected by links. Each element or product or piece of information on your site sits on a web page. All the web
pages are linked. The linking between pages is called the navigation of your site and this is how your customers can find their way around.

 

 

It is possible to work with lists of items to make a plan for the content on your pages, however lists get tricky when it comes to linking the listed items, and that’s where a mind map comes in handy, because it can be multi dimensional.

 

A mind-map is your first step to building a website. 

It lays out, as a simple drawing of connected bubbles, pictures or words, all your ideas and the requirements for your webstore.

A mind map is a simple way of planning that allows you to be free flowing with your ideas using a basic sketch that incorporates bubbles with connecting lines to represent the ideas for your site. If the page you are working on is filled up, you can simply add another page alongside (staple it on if you like) to expand your map. This way of working is open ended and avoids getting stuck on details such as the look or functionality of your eventual website or webstore. You can get more definite with your ideas later in the process, but for now, its a good idea to allow your mind to wander!

Keep the ideas flowing
Using sticky labels for a mind map is another tried and tested method. The advantage of using sticky labels is that they can be moved around. To build a sticky label mind-map, first write an
idea or requirement on each label. You can also use coloured labels to group ideas. Next, group the labels in various configurations to represent your ideas for linking pages together or to help you to visualize and organise your various trains of thought. Finally, take a photo of the layout for future reference.

There are also numerous free mind mapping applications available online that will allow you to easily build complex webs of connected ideas on your computer screen. 

Try www.xmind.net for starters!
 

 

 

Before you embark upon a building a website, make sure you have all of your content ready, including images, copy and product names. Learn these 10 important pro-tips.

Building a webstore or website is just like building a home, before you begin you need to have a well thought through plan. Whether you build the site yourself or have a web professional build it for you, you should have made decisions about some vital elements of the design and content well in advance. Here is a brief overview and few helpful tips to get you started;

1. What will my homepage say?
Your homepage needs to quickly explain who you are and what you offer. There needs to be easily navigable items that are exciting and interesting and which lead your customer on to find out more. You need to help customers to quickly find what they are looking for so that they can decide if they need what you have to offer.

3. Keep home simple
Its a good idea to offer less, not more in the first instance. The homepage should grab the attention of your customers. Keep your message simple and allow your customer to find more information as they delve deeper into the site (if that is your aim) or get them to the shopping cart quick smart using a Call to Action before they wander off and get lost looking for things.

4. Sketch an outline
Make a sketch of how your homepage will look. The homepage should grab the attention of your customers, so think about what you can say or offer that will hold their attention.

5. Menu Items & more
Your menu should include the basics; Home, Products, Information, Shop, Cart, About & Contact. These items will be visible on all pages so that your customers may easily navigate around. You may have additional menu items, but its important to keep the top menu simple and using recognisable headings.

6. Visual impact
Your homepage is essentially a visual experience for your customers, so it should contain images or other visual elements that give the customer an immediate idea of who you are or what you represent. Your brand/logo needs to be prominent. Words can say some of what you need to say, however images, colours and “feel” will more quickly convince customers to stay.

7. Keep it fresh
A facebook feed or blog may be added to your homepage to keep customers updated about new innovations. You may also have other moving elements on the homepage, like a slideshow featuring information, offers.

8. Call to action
The call to action (CTA) is one of the most important elements of any web- store. Your customers, believe it or not, would like you to tell them what to look at, how much to spend and which colours are recommended etc. If you can make these decisions easy, all the better. Sure, some customers would like to pick and choose, but its important to keep the choices narrow so that the customer can easily make a decision. A CTA should direct your customer to a product or service and make it easy for your customer to SAY YES!.  A typical CTA’s is an image with a caption that is linked to a product. This is an item that can be regularly refreshed and changed to keep your customers’ interest. Check out our ebook on this subject.

9. Your images
Images will need to be converted from their raw large state into low pixel ratios so that they are quick to open and easy to work with. Image quality should not be compromised when reducing pixels. 

10. Product descriptions & writing copy
Your copy should quickly communicate your main message first. ie: What do you want your customer to do, or what can you do for them? Simple statements are best because visitors don’t usually hang around reading details but will quickly glance at your page and make a decision... yes or no.


 

 

So what is wireframing? Its the time honoured method used by designers the world over to map out a preliminary plan for a design using paper and pencil. Essentially, your website is a graphic presentation, and wireframing is the perfect technique for outlining your ideas. Before you start thinking about fonts, colours and pictures for your site, make a wire frame. A wireframe is simply a sketch of your website plan and would flow on from the mind map. You can make as many mistakes as you like on a wireframe because you can simply erase errors and start again, as many times as it takes, until your plan does what you need it to do. Try to give yourself adequate time for this task, say a full day your investment of time will save time in the long run.
 

Here are 5 easy steps.
1. What do I need to begin?
To make a wireframe, you will need a piece of paper, a pencil and an eraser. The paper you use can be either plain or with a grid if you find it easier. Before you begin, you will need to have already planned your content and have an idea of the functional requirements and general areas of information, shopping area, menus etc. of your site. Read the first and second chapters of this ebook to find out what you need to consider in regard to content planning.

2. First sketch the homepage
Even if you don’t consider yourself an artist, you can make a wireframe. Begin by making a rough sketch of your homepage. Your homepage sketch should roughly indicate the position for the logo, banner image or caption, menu bar items, Call to Action buttons or Facebook feed etc.

3. Make it great with templates
There is no need for you to reinvent the wheel! There are many webstore templates available online. You can also look around at other sites in your industry and be inspired. By doing some research online you will quickly determine the most appropriate format for your site. That isn’t to say you should copy other sites, however by looking at other sites you will get an idea of what works and what does not work, as a starting point for your own unique design.

4. Add more pages
Once you are happy with your homepage, begin adding more pages. With each page added, take time to consider the page layout. Try and line up as many of the elements as possible so that the page has unity. Keep each page simple with one main message, product category or activity to a page. Remember to use the same top menu bar on all the pages so that its easy for your customers to navigate to other pages.

5. Navigation
Plan and illustrate navigation either by drawing additional pages alongside existing pages, then adding connecting arrows or alternatively, use an additional sheet of paper for each additional webpage. Lay out all the pages on a table or floor and work on the navigation by moving the pages around. Once the map is working, record the page positions on a single drawing. This will make it easy to refer to during the site build.