VIBE – The Vista Interactive Blog Experiment

2 June 20207 June 2024

Building a user-focussed website application in TYPO3

A long term customer had been using custom Perl software with their TYPO3-powered website. Several Perl generated HTML pages were embedded in their TYPO3 website to capture input from forms and generate license numbers and provide access to downloads of their nutrition calculation software for dietitians and health professionals.

The Perl software was not easy to maintain and during our investigation of the data we found problems with the data storage and hacking attempts. While this software automated some processes, there was still significant manual processing required by our client’s admin team and they wanted to change some of these processes and workflow.

At the same time, their website was using a old version of TYPO3 which was no longer supported and was also difficult to use. The design was not compatible with modern devices and screen sizes.

Screenshot of the old website from an iPhone

Screenshot of the new website from an iPhone

We worked with the client to upgrade their TYPO3 website to the latest version with a responsive design and develop a new user-focussed system for managing licenses and downloads that was fully integrated in TYPO3 with a custom TYPO3 extension .

Upgrade process

Typically when we upgrade a customer’s TYPO3 website, we duplicate their existing site and then apply the upgrades for each newer version of TYPO3, often stepping from 4.5 to 6.2, 7.6, 8.7, and then arriving at the latest release of 9.5. Each upgrade step requires updates to extensions and sometimes design template changes. On sites with many extensions there are sometimes compatibility issues.

In this case, we did not need the previous design and the website was using very few extensions so we could jump directly from version 4.5 to 9.5 by generating an export of only the content from the original website and importing it into a new TYPO3 9.5 installation. The customer needed to review all of their content anyway and so this was a good opportunity to restructure the website and improve on the placement of the content and navigation.

New features

To make the website more useful to our client’s users, the main feature we added was a personalized section of the website using TYPO3’s built-in front end user features. We added a few extensions. One to manage front end users and let them register their own accounts, another to secure downloads and restrict access to specific user groups and another that allows our client to send direct email newsletters to their users.

Pages with Usergroup Access Rights set in the TYPO3 page tree

Access tab of the Page properties in TYPO3 for the above page

All pages and content in a TYPO3 website can be public or restricted to groups of users and so we were able to customize the content and deliver it to only those who had access. In our case, after registration, new users of the website can download a demo version of the nutrition information system software. If these users then go on to purchase a student or full version of the software then they get access to downloads and content related to that version of the software. Our client can send a custom newsletter to student users inviting them to seminars about using the software or to upgrade to the full version.

Custom extension

To complete the features for the users to manage their licenses and software downloads, we wrote a custom TYPO3 extension to replace the Perl software and integrate with the TYPO3 front end user features.

The Perl software was storing user and license information in a flat file. A relational database is more useful for storing information and offers better structure and retrieval of data. Therefore our solution uses tables in the TYPO3 database for the website, and we extended existing tables and added a new table for licensing data.

The licensing part of the this extension produces a license number for the user calculated from the software version and a key generated by their installation of the nutrition information system software and stores this in the database.

User mini profile and license information. From here, the user can edit their profile or update their license if they are reinstalling the software .

Data import

Our client had over 12000 existing users of their software and so their data needed to be imported into the TYPO3 database. We first examined the data in a spreadsheet and tidied it to prevent errors, removing duplicate information and invalid dates. [The Perl software had been wrongly generating invalid dates when the license expired 3 years after a leap day.] We could then map the data in the spreadsheet columns to the columns in the TYPO3 database and import the records.

Results

The new, easier-to-use design and the user focussed features have made the website more useful for our client’s customers. This is reflected in the analytics which show that there has been an increase in the number of both new users and returning users to the website and the amount of time these users are spending on the website. Past analytics show that there are busy periods for the website at different times of the year and some of this increase in website traffic can be attributed to our client’s marketing push, but there is a marked increase compared with the same time period last year.

Google Analytics comparing users from when the new version of the website went live with the same time period of the previous year.

You can view our client’s new version of their website at https://bebis.com.tr.

If you need a TYPO3 upgrade or a custom TYPO3 extension for your website, please contact us.

5 September 20195 September 2019

Stop making these basic Facebook mistakes

I’ve been using Facebook for more than a decade and I still see people making these basic mistakes that make Facebook less effective for them.

Mistake #1 Using a Profile instead of a Page

When you join Facebook, you should be using your real everyday name so people can find you and become friends. If you did this right, you end up with a number of friends who want to connect with you. They will see what you share in their news feeds. You will see what they share in your news feed.

When you want to add a business venture, or run for office, or promote something that is strongly related to your personal “brand” the best practice is to create a Facebook Page. I have seen numerous people create another Facebook Profile (which is against Facebook’s Community Standards) and then ask their existing friends to friend their new profile.

While a profile is good for communicating with up to 5000 friends, a page can have unlimited likes and followers.

Creating a Facebook page is easy. See “How do I create a Facebook Page?” help at https://www.facebook.com/help/104002523024878 for instructions.

Mistake #2 Not using your real name

I have seen too many people using Facebook with a name they don’t use in real life. Not only does this make it difficult for you to connect with friends, but it is also against Facebook’s policies.

You can add nicknames, maiden names, or professional titles in your About section.

See the “What names are allowed on Facebook?” guidelines at https://www.facebook.com/help/112146705538576

Mistake #3 Using a shared Facebook profile

Closely related to Mistake # 2, I too often see couples or families sharing a single Facebook profile. Posts on Facebook work best when each individual has their own profile.

Create an individual Facebook account.

Log out of Facebook then use the “How do I create a Facebook account?” instructions at https://www.facebook.com/help/570785306433644/?helpref=hc_fnav.

Mistake #4 Posting to the wrong audience

Sometimes I see friends sharing news or information about an event that they want everyone to know about, but they limit the post to only their friends. Then when their friends try to share the post it is further limited to only their mutual friends.

Choose Public for posts that you want everyone to know about and to spread through your friends’ networks.

See “When I post something, how do I choose who can see it?” instructions at https://www.facebook.com/help/120939471321735?helpref=related&ref=related.

Need help with Facebook?

We occasionally post items about using social media here and on our Facebook Page., so “Like” or at least “Follow” our page to see these useful articles.

If you are interested in using Facebook more effectively to promote your business or organization, please contact us for help.

15 August 201915 August 2019

How to create a strong web presence from scratch

If you have a brand new business or one that has never had an online presence before, here are some of the key things you will need to create a strong web presence from scratch.

A website is not magic. It takes a lot of work to get people visiting your site and interacting with you.

Following is a top-level overview of the things you need to work on to get started with a strong web presence.

Branding

You should have most of your branding created before you embark on building your web presence. As soon as you start online, your image and reputation will begin to be established and it should be consistent with your offline presence. You will need scalable versions of your logo and branding images designed for the web.

Domain names

You will need at least one domain name that is meaningful and relevant to your website. Choose a name that is memorable. Avoid abbreviations. Choose the right top-level domains – there are many extensions other than .com which may be appropriate.

Hosting

You will need a server for your email and website. Purchase a hosting package suitable for your needs with room for growth.

Email

Email is still the number one method for internet communication. Choose appropriate email addresses. Create email signatures.

Website

This will be the hub of your online presence. Here you will create and organize your key content.

Website Structure

Use a content management system (CMS) to easily manage your website. A good CMS will separate the content from the design and logic so you can grow and expand your website. There are usually many CMS extensions or plugins for adding new features. Often these are open source so you can also create your own customizations if required.

A CMS will help display repeating information such as your consistent branding and website navigation around your unique content on each “page” of the website.

Website Pages

Each page of your website should focus on a single idea. The content you provide should be easily read by your visitors, so try to create it from their perspective. What information are they looking for? If you are using jargon, is it understood? Each page should have a call-to-action that prompts your visitor to do something.

Photos and Videos

Use genuine photographs of your products and people. Show people using your products. Can you use video to explain your products and services? Attach descriptions and alternative text to describe your media.

Collect Info

Create forms on your website to allow people to contact you. Collect their information with permission and use it to keep in touch with a mailing list. Don’t spam.

Make sure you get a security certificate for your website if you are collecting personal information.

Install visitor tracking so you can collect statistics about the traffic on your website. Analyze where your visitors are coming from and what they are doing on your website. Use this information to optimize your site.

Get known

Search engines will index your website content so you should optimize it for both human visitors and search engine robots.

You may also need to purchase advertising to get traffic to your website.

Promote your website on your offline marketing material.

Social Media

Create appropriate profiles on relevant social media sites. Connect with people and share relevant information. Don’t spam. Re-use the articles and content on your website and link back to it. Show genuine interest when you interact and be helpful. When people are frequently asking the same question, create content to answer that question on your website and direct people there for the answer.

Repeat

You will need to revisit many of these processes as you get feedback from your web presence. As new technologies are developed you will need to upgrade your website to cope. You will also need to keep your website and social media content fresh for your visitors.

Get help

If you don’t have the expertise in some of these areas, get help. We have years of experience in helping people get their web presence started, so contact us for help.

24 May 201924 May 2019

Before/After TYPO3 Upgrade Case Study

A long term customer, Cumhuriyet Anaokulu, a German/Turkish preschool in Izmir had been promoting their school using one of our EkspressWeb TYPO3 starter websites. As technology improved and with more people using mobile devices to view websites, they needed an upgraded design to reach these people as well as an upgraded version of the TYPO3 CMS framework.

Infrastructure

TYPO3 is continuously developed and while EkspressWeb was built on version 4.5, the current version at the time of the upgrade was 8.7. Work is currently being done on TYPO3 version 10 with an expected LTS release in April 2020. See the TYPO3 roadmap for more information.

As we do with most live websites, we duplicated the original website to a development subdomain and applied the TYPO3 core updates (4.5 to 6.2 to 7.6 to 8.7). In addition to the core updates, many of the extensions were also updated to their latest versions.

Content

TYPO3 is good at separating content from design and so with the exception of some custom content elements for layout, the customer was able to reuse all of their existing content.

Design

The original design templates made navigating and reading the content on mobile devices difficult. Google’s Mobile-Friendly Test tool was helpful in highlighting the major problems with the original design. Most of these were solved with the TYPO3 Bootstrap package extension and customizations of this to maintain the style of the original site with a fresh look.