Petros Leonidou - easyMarkets Landing Page
Steps
- Sliced the PSD file to images, in .png format
- Created the project file separated in folders (images, stylesheet and javascript)
- Created the HTML, CSS and JS files and placed them in the appropriate folders
- Downloaded and installed Bootstrap and jQuery frameworks
- Linked the CSS, JS and bootstrap files to the HTML file
- Created the structure of the different sections of the landing page (Header, Sections and Footer)
- Coded each section having in mind the responsive layout plan (Where to place breakpoints and column dividers ex. col-sm-6)
I chose the selected PSD file as I personally prefer the procedure of creating a landing page instead of creating an email template. Also, creating a landing page is more challenging as it lets you add scripts that user can interact with them. (ex. Validating and submitting forms)
For the task to be completed it took me 7 hours in total.
- 30 minutes to slice the PSD into .png files
- 15 minutes to set up and tidy the files and folders
- 15 minutes to write the documentation
- 3 hours creating the main layout of the landing page as well as the main styling
- 3 hours to pixel perfect the landing page and develop the responsive version of it