1. HOW TO CONSTRUCT A BASIC WEBPAGE VIA PBWORKS: for IRCs, for Corners, for Spaces, for NGOs, for Entrepreneurs, and other groups Stephen Perry, IRO Accra December 2013

2. The first Step is to go to pbworks.com and click on Education pbworks.com

3. After clicking on Education, you will then click on the link for Librarians, then click on Basic Edition, free for Librarians. This will insure you are choosing the free version.

4. When you click on Basic Edition, it will take you to a page with a link for sign up now. Click on that link and you will see the following. Give your proposed website a name, and complete the rest of the form. Remember your password.

5. Example of basic sign-up below to create a website for ircwhatever

6. You will then receive an email from PB WORKS asking you to confirm your account, as below: log into your email to confirm CLICK LINK TO CONFIRM

7. When you confirm the link, you will see the following below. Make sure you click on ANYONE and confirm that you will abide by PBWORKS TERMS OF SERVICE. Next, click, TAKE ME TO MY WORKSPACE

8. After clicking on TAKE ME TO MY WORKSPACE, you will see the below: click on EDIT to make changes; the first thing you need to do in EDIT Mode is to erase everything to begin your webpage

9. Clicking on EDIT places you in EDIT MODE; make any changes while in Edit Mode. The first step is to click on Edit, and then completely erase what is on the screen to start your page

10. A few basic functions while in EDIT MODE Change colors using this tab Change size of Font using both Font and Size Make sure to save all changes when finished

12.  Before even constructing your web site, have paper and pen in hand and write down all the essential elements you wish to include; especially those your users will be looking for and expecting. The intellectual work of what you wish to include in your web page is the actually the hardest. Think of what you want to include well in advance of creating your web page.

13. To attach a document (a Brochure, Webliography, etc.) click on Edit and then Images and Files at your top right until you see UPLOAD FILES; Click on Upload Files until you locate the needed document, and then click on it to add it to the web page; then click SAVE.

14. An example of uploading a document (in this case a PPT) is below: make sure to label the document in the web page, as in the example below

15.  Let’s say you want a separate page just for ESL RESOURCES: PBWORKS allows you to do this.  The steps are on the next few slides. Creating a separate page in your website for less clutter.

16. Creating a separate page: like all changes you need to make, click on EDIT, then on Pages and then on Insert a link to a new page.

17.  In EDIT MODE, place the cursor on the web site where you would like to create a separate page.  Then, click on the right to Insert a Link to a New Page, as you are in EDIT Mode (remember, all changes must be in EDIT MODE.)  Type the name of the page: ESL in our case  Then, immediately click on SAVE. Instructions on Creating a Separate Page.

18. See below as an example; you now type the page you wish to create in the embedded box and hit ENTER. Then, click SAVE immediately.

19. After you click on Save, click on any browser to return to your webpage, click on the page you just created and you will see this; now click on Create Page

20. You are now able to add anything you wish, attach ESL related documents or brochures, just as you did with your original webpage. Now, anything related to ESL, is on a separate page. Then SAVE any changes.

21.  This is as easy as going to images.google.com and copying images that capture your imagination.images.google.com  At this point, all you have to do is to paste them on your web page.  I suggest placing images between the separate pages you have just created so as to provide a nice visual break for your reader.  As one suggestion, go to images.google.com and search Ernst Haeckel for some amazing, and copyright free, images.Ernst Haeckel  At this point, your page looks pretty bare, you might wish to place some images to make it interesting.

22. Here is an example

23. Another fantastic site for copyright-free images is the Commons in Flickr: http://www.flickr.com/commonshttp://www.flickr.com/commons

24. Click on EXPLORE to see a wide range of copyright- free images: http://www.flickr.com/explore http://www.flickr.com/explore

25.  While in Edit mode, click on Insert, at the very top of the page.  The next slide shows an example of what you do next. The next thing you might want to do is to place a visitors counter on your page to get a sense of how successful your site is, and how many people are using it

26. In EDIT MODE: Click on Insert > then, More Plugins > then, Page Information > then, # of Visitors, then click on INSERT PLUGIN, place the Plugin where you want it on the page, and then click on SAVE

27. You now have a running counter for the number of visitors; note also visitors to your web page can also leave comments or ask questions Visitors can leave comments here

28.  One last thing, to make your web page more professional, please provide hyperlinks to Internet sites noted on the web page. Some Internet addresses are very long, and through linking, you create the ability for your user to go directly to the site. If you include the complete lengthy Internet address, you will quickly clutter your page. Example below.

29.  To do this, while in EDIT MODE, click on LINK towards the top right, and then highlight the phrase you now wish to hyperlink. You will now see a box with the phrase embedded in it.  Carefully erase the phrase, and copy and paste the Internet site instead in this box.  After carefully typing (or pasting) the site in the box, immediately hit Enter -- and then click on Save.  The highlighted phrase is now hyperlinked to the Internet site itself, all your users have to do is to click on the phrase to be immediately redirected to the site itself. To prevent cluttering, you can hyperlink the Internet site to the words IIPDIGITAL ARTICLE ON WOMEN’S EMPOWERMENT; all your user has to do is to click on the word or phrase and they are immediately directed to the Internet site.

30. Example of hyperlinking a phrase to the actual Internet site.

31. Examples of these sites include  www.tinyurl.com/6dfaxn www.tinyurl.com/6dfaxn  http://eslres1.pbworks.com – for ESL http://eslres1.pbworks.com  http://journres1.pbworks.com –for Journalist training http://journres1.pbworks.com  Look at any of these sites for examples of what is possible with pbworks.compbworks.com I have used pbworks to create a number of web sites over the years with no problem whatsoever.

32.  Stephen Perry, IRO  U.S. Embassy Accra, Ghana  PerrySX2@state.gov PerrySX2@state.gov  December 2013 Thanks for your attention!