Pic. 1. home page of the WordPress website

Project name : Project STRENGTH

Website type : Non-profit

Service type : Redesign and migration (concept to launch)

Development period

: July - Sept. 2010

Maintenance support

: Up to July 2012

Web address : http://project-strength.com

Status : Offline*

Pic. 2. home page of the old website

Project STRENGTH is to raise awareness about the

poverty issues that the children of Philippines are

facing every day.

Client requirements

Redesign a professional-looking, easy-navigating,search engine-friendly, content-managed websitewith site management and maintenance facilities.

Stuffs provided

• Old website URL and cPanel access info • A wire-frame layout (Pic. 10) and sample

websites

• Blog files in word format

• Youtube URL to download video files

• 66 high-resolution images

Digital Systems liked the objective of this non-registered non-profit organization, anddecided to support them developing their website on a voluntary basis. We re- designedand developed the entire website including graphics using credit-free open source tools.

Note

Old website refer to the site, hosted at Angelfire (sponsored Ads) at http://strength-movie.angelfire.comfor free. Old cPanel refer to Angelfire cPanel.

WordPress website refer to newly redesigned website by us hosted at JustHost. Site was hostedcommercially for two years and currently offline. New cPanel refer to JustHost cPanel.

Old website analysis

Old website is non-structured and static, maintain non-standard navigation menu bar, color scheme, typography, template, etc. No user interactivity or engagement site wide. Most of the menu items loads externally hosted pages. Excessive sponsored Ads (Pic. 3).

Old cPanel analysis

Old cPanel is most backdated. Moreover, due to free account, all features are inaccessible (Pic. 4).

Pic. 3. sponsored Ads

Pic. 4. Old cPanel

Old website page-by-page analysis

'Home' page

Very simple design. A large-squire size image loadsin the Home page. Navigation menus are not organized. No CSS file(s) to control HTML pages.

Pic. 5. 'About Project-STRENGTH' page

'About Project-STRENGTH' page

Menu item directly linked with an externally hosted video page and it opened in the same window. Visitor mayinfluenced and go away. It is recommendable to open the external link in a new window.Other way, it can be solved bycreating an internal page and embed the code. It is always better to host all contents internally because page loads faster.

Pic. 5. 'STRENGTH trailer' page

'STRENGTH trailer' page

Same problem. Menu item directly linked to YouTube page and it open in the same window.

No user-friendly navigation. Need to click browser 'back' button to return to the 'Project STRENGTH' site.

Visitor may want to stay with YouTube channel.

Pic. 6. 'About SOTH' page

'About SOTH' page

Menu item directly linked the external site and it open in the same window. Possibility to lose visitor.

Since, Project STRENGTH refer the external site, it is OKto link the external site directly, however, it was betterto link it to be opened in a new window.

Pic. 7. 'Photo Album' page (partially)

'Photo Album' page

page is not optimized for slowor low bandwidth audience and it hardly loaded 14 larger images. 'STRENGTH trailer' and 'About SOTH' menu itemsdisappeared. 'Contact Us' menu text moved to the next line due to fixed width specified. Photo title text is not readable.

Pic. 8. 'Meet The Team' page (partially)

'Meet The Team' page

• No navigation menu bar

• Incomplete page• Watermark color, font

size and text of the six images do not maintain a constant ratio

• Photo titles hardly readable

• All images are linked externally with same size images

Pic. 9. 'Contact Us' page

'Contact Us' page

Repetitive information. No physical address. No user interactivity.

Old website assessment report using automated tool

Key points

• Website does not use any analytics software

• Most images do not specify alternative text

• Many pages have no defined headings, compromising SEO

• All pages were found to use page titles appropriately

Page titles. All pages were found to use page titles appropriately

Inoffensive content. None of the pages tested will be blocked by filtering systems

URL format

• The majority (75.0%) of web addresses (URLs) are less than ideal

• 75.0% of URLs include a file extension

Links

• A large amount of links in this site could be defined better

• 5 links use duplicate text to point to different pages

Alternative text. The majority (71.0%) of images do not have alternative text

Images

• No images have defined sizes

• Non web-format images

• Non explicitly sized images

Headings. A large number (50.0%) of pages do not use defined headings

Semantic HTML

• Non-semantic HTML tags found

• website were found to use presentational HTML elements

• Pages uses tables layout content

Popularity. This website has experienced a slight decrease in popularity

Twitter sharing. No tweets about this website were found on Twitter

W3C compliance. No pages are W3C compliant. A total of 105 errors and 29 warnings

Printability. None of this website appears to be optimized for printing (using CSS)

Facebook page. This website do not have public Facebook pages

Facebook sharing. None of the pages have been shared on Facebook

Incoming links. No other pages were found linking to this website

Analytics. None of this website is using any analytics software

Meta tags

• No pages include any metadata

• Pages with no meta description

Feeds. No feeds were found on the 4 pages tested

Shared web hosting recommendations

Based on Client requirements, we found that WordPress would be the best solution for them. We

discussed with the Client and they agreed with us. We also informed them that Angelfire free hosting

plan do not support database facility which is mandatory for WordPress. As requested, we provide them

the information about two shared hosting service providers listed below.

Features Just Host AngelFire (NEON)

Domain name 1 yr FREE .com $12.95/yr

Subscription fee $4.95/mo for 2 yrs $4.95/mo

Setup fee none $10

Disk space unlimited 1 GB

Monthly bandwidth unlimited 100 GB

Email space and accounts unlimited none

WordPress 1-click install yes blog builder tool

information as of August 2010

Table 1: comparison features and price

Client decided to go with JustHost shared hosting service for two years.

Pic. 10. sample wire-frame layout

Drawback history

Job was posted at Craigslist website in July 6,

2010. It was full-time Webmaster role and

unpaid Internship. First Client meeting was in

July 14, 2010.

Portfolio work for this project

Graphics Design

Created content-specific six headers from the high-resolutions (3264x2448) images

Pic. 11. header image for 'home' page

Pic. 12. header image for 'About STRENGTH' page

Pic. 13. header image for 'About SOTH' page

Pic. 14. header image for 'Images of Hope' page

Pic. 15. header image for 'Meet the Team' page

Pic. 16. header image for 'Friends of STRENGTH' page

Pic. 17. unused header image

Created two variants of logos

Pic. 18. logo designPic. 19. logo design

Created a graphic for video splash image

Pic. 20. graphics design for the video-splash image

Created a graphic for splash-intro page

Pic. 21. graphics design for splash-intro page

Re-sized and optimized high-resolution images for thumbnails and larger view

Pic. 22. image manipulation

Pic. 23. image manipulation

Re-sized and optimized 66 watermark images and created & optimized two flash animation files

Pic. 24. Flash photo gallery (2.58MB) Pic. 25. Flash photo gallery (2.17MB)

WordPress installation and integration

Installed WordPress and developed the site locally with following features:

Features integrated Work performed

Pic. 26. top navigation menu bar

• Created custom menus

Pic. 27. default header image

• Enhanced facility to load content-specific header images dynamically

Pic. 28. brand slogan

• Incorporated the tagline

Pic. 29. 'About STRENGTH' page

• Downloaded video files from YouTube account

• Converted, optimized andintegrated them in 'AboutSTRENGTH' page

Pic. 30. 'Images of Hope' page

Created, optimized and integrated flash photo album in to 'Images of Hope' page

Pic. 31. light-box image effect

• Re-sized and optimized two sets of images for thumbnails and larger view

• Enhanced the function to open larger view image in pop-up window

Pic. 32. interactive online contact form

• Conducted coordinator toknow the email address to be used in 'Contact Us' page

• Tested the form function thoroughly

Pic. 33. new cPanel

• Hosted the site at JustHost

• Performed cross-browsers compatibility test in major browsers

Client reviewed the site and requested to make some minor changes. Time to time, we provided websitemaintenance support. As per Client request, we also provided training and access to coordinator to post blogs.

Communications with Client

We maintained effective communications frequently via email and over the phone.

Tools used

We used Wordpress and other free tools to design, develop and maintain entire site.

Pic. 34. WordPress website theme

Pic. 35. module positions

Functionalities of the site

Core features

• Pages allows to manage non-blog content easily

• Allows to create, maintain, and update anynumber of links

• Theme features• Cross-browsers compatible, valid

xhtml and css, 5 widget-ready areas, 2-column layout, widget-ready footer and sidebar

• Drop-down categories menu• Gravatars enabled in comments• Threaded comments support

• Allows visitors to leave comments

• User registration system allows people to register and maintain profiles, and leave authenticated comments

• Allows password-protected posts

• Allows to convert plain ASCII into typographically correct XHTML entities and intelligent text formatting

• Highly advanced user system allows up to 10 levels of users privileges with regard topublishing, editing, etc.

Extended features

• Allows a custom header image or flash fileto be displayed site wide, randomly or on apage and post

• Allows to embed 2D animation• Anti-spam enabled contact form allows

visitors to send email message• Allows to open larger-size image in a pop-

up window

TroubleshootingSite was hacked in November 2011. As per Client request, we cured virus and restored entireWordPress website following the guidelines of Just Host support team.

Pic. 36. Virus detection

Summaries of the work provided

• complete website and cPanel analysis & report

• redesign/redevelopment of WordPress website and integration

• cleanup redundant and excessive HTML tags and inline CSS manually

• Tweaked/modified HTML/CSS codes for WordPress theme and plugins

• content migration from the old site to WordPress site

• conversion/integration of word documents to WordPress site

• on-site search engines optimization

• logo and header design

• image retouch, manipulation and optimization

• photo gallery creation and integration

• multimedia support service

• cross-browsers compatibility test

• website maintenance and support

• training and access the staff to post blogs

Service renewal & recommendations

Although, Client should receive auto email notification, we did conduct the site owner (over the phone

July 12, 2012) to inform about the Web Hosting renewal notice. We also provided reduce hosting price

quote via email. We did ask her to pay for the domain name and we will host the site in our server.

Client permitted us to host the site online for portfolio demonstration purpose only.

Appreciations

As per our request, Client provided us performance-based online testimonial, farewell cards and recommendation letter (digital version available upon request). We can provide Client reference as well.

Our newly rebuilt website with improved look of the HOME page:

* For demonstration purpose, we can host the newly redeveloped and their old website.