build a website using yola by accion usa

31
Lending. Supporting. Inspiring. Yola Step-by Step Tutorial

Upload: guest90a34d7

Post on 20-Jan-2015

1.005 views

Category:

Self Improvement


0 download

DESCRIPTION

Created by Microlender ACCION USA, this presentation shows the step by step process to create a website for free using Yola.com.

TRANSCRIPT

Page 1: Build a website using Yola by ACCION USA

Lending. Supporting. Inspiring.

Yola Step-by Step Tutorial

Page 2: Build a website using Yola by ACCION USA

2www.accionusa.org

Before Beginning

Some prerequisites:

• Email Account

• Marketing Plan

• Site-specific content

• Pictures

• Product Descriptions

• Contact Information

Page 3: Build a website using Yola by ACCION USA

3www.accionusa.org

Step 1. Site Goals

• Before you even start thinking about building a website, you have to do some soul searching

– Why do you want to make a website?

– What is the purpose of your website?

– Who will visit your website?

– What will they gain?

– What is in it for you?

• Writing the answers down will help focus you through this journey

Page 4: Build a website using Yola by ACCION USA

4www.accionusa.org

Step 1. Story

Sample story:

• Thomas and Jan are two hometown friends that opened a small local bakery about a year ago

• Their breads are made from a secret recipe passed down from Jan’s grandmother and are hailed by locals as the best kept secret in the area

• Still, their customer base (and profits) have stayed steady for months and they are looking for ways to expand without adding more branches

Page 5: Build a website using Yola by ACCION USA

5www.accionusa.org

Step 1. Site Goals

• Start in ‘expansion’ mode

– Brainstorm – spend some quality time thinking about your goals

– No idea is ‘too-big’ or ‘too-hard’ yet

– Write down everything

• End in ‘strategic’ mode

– What will help me attract clients? Increase revenue?

– What are the resources I have? How long will it take to carry out my goals?

Page 6: Build a website using Yola by ACCION USA

6www.accionusa.org

Step 1. Page by Page Site Plan

• Draw out a page by page design of your site

– What pages do you want to show? Site name?

– How will links work? Where will text and pictures go? Where do we incorporate widgets?

Page 7: Build a website using Yola by ACCION USA

7www.accionusa.org

Step 2. Create Your Account

• Using your preferred email address, go to Yola.com and create an account

• Choose the ‘Yola free’ option

Page 8: Build a website using Yola by ACCION USA

8www.accionusa.org

Step 2. Choose a Style

• With so many options, it is easy to get lost here

• Choose a free style to best represents the image you want to convey. Additionally, you can purchase Premium styles

Once you have picked out the right

style for you, click the preview

button to view sample content

Page 9: Build a website using Yola by ACCION USA

9www.accionusa.org

Step 2. Confirm your style

• Click to confirm your style

• You will need to choose a name for your site. Let’s “Build Our Site” now, we’ll come back to the site name.

Page 10: Build a website using Yola by ACCION USA

10www.accionusa.org

Step 3. Build Your Site

• Since we spent time on our site plan, building the website with Yola can be fun and easy!

• We’ll build one page at a time, utilizing some different tools.

• Afterwards we will incorporate our widgets and publish our site

Page 11: Build a website using Yola by ACCION USA

11www.accionusa.org

Step 3. Main Page

• Most important page in your site

• Customers will come to a decision about whether to stay based on how your site looks.

• Its important to look to your marketing plan for guidance on your strengths. Emphasize them here.

Page 12: Build a website using Yola by ACCION USA

12www.accionusa.org

Step 3. Drag and Drop

• Drag and drop a text box from your content sidebar

• Place it in the center of the page

Page 13: Build a website using Yola by ACCION USA

13www.accionusa.org

Step 3. Adding Text

• Put in your mission statement. This is a the main message you want your users to read. It should entice the user to stay.

• You can format this text to give emphasis to certain words

Page 14: Build a website using Yola by ACCION USA

14www.accionusa.org

Step 3. Adding Pictures

• Drag and drop the ‘Picture’ widget

• Upload pictures from your computer to the website

• You get 1GB of space for images and content.

Page 15: Build a website using Yola by ACCION USA

15www.accionusa.org

Step 3. Combining Content Widgets

• You’ll begin to see how we can build an enticing site piece by piece, easily.

Page 16: Build a website using Yola by ACCION USA

16www.accionusa.org

Step 3. About Us

• For the sample site, we will emphasize our business image by describing our history and our values

• Let’s drag another text widget below the picture widget we just added.

Page 17: Build a website using Yola by ACCION USA

17www.accionusa.org

Step 3. Additional Content

• This text is less pronounced than our mission statement. However, we highlight keywords.

Page 18: Build a website using Yola by ACCION USA

18www.accionusa.org

Step 3. Adding Pages

• Following our site plan, we can add some new pages to guide the user to different types of information about our business

• Add a new web pageand name it

Page 19: Build a website using Yola by ACCION USA

19www.accionusa.org

Step 3. Columns

• One useful way to organize your site is by using columns.

• This will separate content into two sections on your site.

• Here we will put product pictures on one side and descriptions on the other.

Page 20: Build a website using Yola by ACCION USA

20www.accionusa.org

Step 3. Content in Columns

• Drag and drop the column divider into the site

• Then, use the text and picture components to populate the columns with data

• You can put columns inside columns, and stack them for effect

Page 21: Build a website using Yola by ACCION USA

21www.accionusa.org

Step 3. Utilizing Columns

Page 22: Build a website using Yola by ACCION USA

22www.accionusa.org

Step 3. Adding Widgets

• Our site plan calls for putting a map on our contact page.

• The way to do this is to incorporate widgets into our website

• A widget takes up minimal space on your website and allows you to customize a popular tool, such as Google Maps or PayPal, to your business

• For our map, we will be using Google Maps

Page 23: Build a website using Yola by ACCION USA

23www.accionusa.org

Step 3. Adding Widgets

• Common widgets can be found in the content sidebar

• Each needs different inputs

• Many require you to sign-up on partner sites to utilize them

Page 24: Build a website using Yola by ACCION USA

24www.accionusa.org

Step 3. Adding Widgets

• Add an address and search to focus the map to your location

• Helps customers find you

Page 25: Build a website using Yola by ACCION USA

25www.accionusa.org

Step 3. Adding Widgets

• Some widgets provide specialized services that can help you

enhance the user experience

• For our sample site, we’ll use

Social Media Badge – Spread the word through different outlets

Google Translator – Accommodate different users

PayPal – Increase revenue

Easy Comments – Allow users to comment on your site

Page 26: Build a website using Yola by ACCION USA

26www.accionusa.org

Step 3. Adding Widgets

• Some widgets can be added with minimal additional info required

Page 27: Build a website using Yola by ACCION USA

27www.accionusa.org

Step 3. Adding Widgets

• Some widgets, like PayPal, require you to have accounts created on the parent site

• PayPal is a useful and secure server that you should consider to enable online purchases

Page 28: Build a website using Yola by ACCION USA

28www.accionusa.org

Step 3. Adding Widgets

• Some widgets, like Easy Comments, will look sparse when you add them in the site editor

• Users will add content to these widgets when you go live with your site

Page 29: Build a website using Yola by ACCION USA

29www.accionusa.org

Review our Progress

• Let’s review our progress

• Publish your site by hitting “Update my Site”

• We’ll switch over to a Yola-created website: http://brooklynsamplebakery.yolasite.com/

Page 30: Build a website using Yola by ACCION USA

30www.accionusa.org

Advanced Topics

• Check out the Yola website for information on more advanced topics

http://www.yola.com/support.html

- Some topics worth checking out:

- Getting your own domain name

- Analytics and Optimization

- Picture Galleries

- Linking to PayPal and other merchant tools

Page 31: Build a website using Yola by ACCION USA

31www.accionusa.org

Questions?