Sunday, December 7, 2014

Dec 7 - Making 'About Us' page

After discussing with my client about the about us page and the interior/exterior webpages, we decided to keep these pages as simple as possible by directly showing all the information that is put on the site clearly. For the 'About Us'  webpage, I decided the most effective method would be to add a text box next to some pictures, since this would give a clear understanding to my client's clients on what the company is, and their focus. For the interior and exterior webpages, We believed that an image gallery with links to images would be an extremely good method to store and view pictures on.

I started and finished making the about us page for me and my client's website today. The webpage looks like this:
For the website, I decided to adopt a simple approach and use one side of the webpage as a textbox, and the other side as a display for picture(s). This allows an easier understanding of the company by their clients. Again, this code was creating by scratch using information I learned from http://www.codecademy.com and http://www.w3schools.com. Here is the HTML code of the textbox and picture sections of the webpage:

Using a <h2> inside the green textbox, I added a title, and <p> to be able to add margins which won't interfere with other texts in the page. This also helps me to set the font size. This was all done in the CSS section of this webpage's code:


The padding for the text is set as 10px for each side, with the text aligned as center for <h2>. The top margin for the <p> inside ".text" makes sure the paragraphs won't be jumbled up together, and can be easily differentiated. I am also considering adding a scrolling function to this text box, which I will decide with my client. For the <img>, I set it to have a 50px top margin and a 40px left margin so that it will have space to separate itself from the textbox.

Now that I have finished making my website, I am now able to upload it for testing.









One thing I also changed about the footer, is the text. I now use the sentence "© 2014 Ultimate Construction Engineering Ltd." for my footer.

No comments:

Post a Comment