Design to Code In Class Assignment

During week 7 we had to build a website with an existing mockup. We had to do it in class within 3.5 hours.

I decided to make it responsive manually (not using sections with percentages of their widths). So, instead of having 29.33% for the 1/3 columns, for example, I made it the old fashioned way. I changed positions of each items not using responsiveness of sections. I didn’t want to do it because we recently had a homework from Ben to create 1/3 + 1/3 + 1/3 and 1/3 + 2/3 columns so I didn’t want to copy the code from that exercise tbh 🙂

The desktop version of the site ended up looking like this:


the media query break point of 640px this way:



My first html Website

So, for my composite one assignment I had to create a website using html and css.

When I first heard that we were going to create a website, I immediately  thought of my dad and his business.

My father lives in Russia and has his own company. The company operates in 3 regions (provinces or states) of southern Russia. The company is an official dealer of some of the biggest plants in Russia that produce fertilizers.

Honestly speaking, I was lucky with this assignment, because I thought about the concept of the site for a long time. The mockup existed in my head for at least more than a year.

Agriculture in Russia is a pretty conservative field of business. Even some big companies still don’t have their own website. Some of them have a website but it’s hard to look at it without getting depressed 😀

His targeted audience mostly consists of middle class farmers. They are pretty conservative and use mobile phones only for calling and picking up calls. They never use their phones to surf on the Internet or play games. I think that it is this way because the wireless coverage is practically non-existent outside of big cities in southern part of Russia. One day there will be coverage and they will use their smartphones to surf on the Internet. We just need to wait.

The main challenge was to make things simple. I needed to show the maximum amount of useful information on the home page. As I said, Russian farmers are not computer geeks, and some of them (the percentage is pretty low though) are not familiar with computers. So, their children do searching for them. But then again, they mostly use desktops for searching because of a bad wireless coverage.

The design is very simple, in my opinion. I decided to have a catalogue on the home page. These 9 pictures are the names of different fertilizers. There is also a contact form and ‘About’ page. On the bottom you can see the embedded google map.

Here is the link:

Calendar Assignment

As I said in my ‘About’ page, I am going to share my learning experience in my blog.

So, here is my first assignment. The goal is to create a calendar using html and css only.

I am a very big fan of football (I am sorry, I will never call it soccer :D). I follow football since I was 7-8 old. I started following 2 teams back then, and these 2 teams are still my favorite – Real Madrid and Chelsea. I decided to take this opportunity and instead of a regular calendar create FC Chelsea matches calendar.

The calendar has to have at least one month of the year. I decided to choose December because there are a lot of games in English Premiere League. There is a week called ‘boxing day’, where all the teams have to play 3 games. Three games in seven days.

The calendar must have all of the holidays in the chosen month marked. Since a game is essentially a holiday for me, I decided that match-days are going to be my holidays. There are 6 holidays in December!

I used 2 colours for the calendar itself – green (football field or pitch) and a colour of the home kit of Chelsea. It is their main colour.

Here is my calendar.