The goal was clear, we had to prepare the project from design to Back-End implementation, based on previous version of the website. The main idea was to implement something exceptional in the website layout and improve first impression by using dedicated animations.
Our services included:
- Adobe InDesign project preparation
- PSD to HTML conversion
- WordPress Custom Theme development
- Cross browser & device testing
Step 3 HTML coding
Front-End phase always starts with building Website structure in HTML. We emphasise creating HTML components to be as much reusable as possible. In order to make clean and clear code, we use BEM Methodology to maintain order in project.
BEM (Block, Element, Modifier) is an open source technology for developing websites that need to be created quickly and maintained over many years. BEM is used in the front-end development of all Pagepro services.
Step 4 (S)CSS coding
In Pagepro we are using SCCS to writing styles code, as it allows us to achieve great efficiency and reduces risk of future issues on different browsers.
Nowadays, features like mixins or variables for colors, sizes and breakpoints are a “must have” standard in Front-End Development. It makes code reusable and easier to understand for other developers.
Step 6 First Q&A Stage
We always conduct comprehensive Q&A phase after delivering complete Front-End code. Most of all, we are making sure that particular website is working properly on different devices and on all modern browsers, including Chrome, FireFox, Safari and Internet Explorer.
As a tool, we use BrowserStack for checking compatibility on multiple desktop and mobile browsers. Moreover, we are using real devices to check website functionalities. At least two devices with iOS, two with Android system and two with Windows Operating System.
Step 8 WORDPRESS DEVELOPMENT
As initial action that our WP Developer took, was to prepare Underscores WordPress Starter for theme development. He had also used ACF Pro plugin in order to make Custom Fields and make almost everything on the website customizable.
We put emphasis on preparing settings for content management to be intuitive and clear, especially for non-technical user.
Step 9 FINAL Q&A AND UAT
When everything was successfully implemented, we went through the settings with the client and explained how to manage the content. We made sure that everything is clear and meets the client’s needs. Before live deployment we give client at least one week for checking if the whole content is applied properly.
The whole process of creating the website described above was being made on development environment. Once client is happy with the results and we get his approval, we migrate everything from development environment to production.