Case: Web Pages Coding with HTML, CSS, JavaScript

Here are cases of HTML, CSS coding Photoshop designs (.PSD files) into fully functional web pages. My customers were different web studios. I was responsible for HTML, CSS, JavaScript only, and they did all other web work: design, programming, marketing.

For example, below are few projects I took part in:

I have been worked as an HTML coder since March 2010 till August 2013.

The HTML CSS Coding Process

I went through such steps in order to code a web page:

1. Cut graphic designs into pieces – components.
2. Coding each component in HTML & CSS individually and making a library of them. After that I added required functionality for each component with JavaScript.
3. Coding page layouts.
4. Compose the main page.
5. Compose other pages by using the main page as a template and by adding or replacing necessary components.
6. Check pages functionality in different browsers and screen sizes.

In order to complete all of that I used such technologies:

• core coding: HTML, CSS, jQuery, JavaScript;
• for page layout: Bootstrap – but I used it not in all cases;
• third-party UI elements: Ligntbox, Fancybox, galleries, scrollers etc.

What is Next?

Today web applications front end is developed differently. Instead of directly coding it with HTML & CSS you create web UI with various frameworks and libraries. One of the most popular tools is React.js. It is a library for building user interfaces. React is easy to use and its ecosystem has tons of ready UI components. As a result you do not need to create everything yourself. Therefore this saves time and money a lot.

Do you like this case? I’ll be interested to read in comments what do you think.

Maybe you want to develop UI for your or your client’s web application? I could help in that case. For that purpose visit this page and contact me from there.