Week 5B

In Class

Reading

Frameworks for Web Design

A framework is a standardized set of concepts, practices, and criteria for dealing with a common type of problem. Although in the design aspect a framework is defined as a package made up of a structure of files and folders of standardized code. Some of theses code languages are html, css and javascript document. Theses languages are used to support the development of websites as a starting guide to create your website. The goal of a framework is to provide a common structure so developers don't have to start from scratch and are able to reuse the code provided. No need to reinvent the wheel.

There are two different frameworks. The first being the back-end and the second being the front-end or better known as the presentation layer. The front-end is a user interface and the common languages used for the front-end are HTML, CSS and Javascript. Frameworks that are commonly used for front-end interfaces are Bootstrap, Foundation 3, Grid Systems, etc. The back-end is the logic and operation of the website. The languages that are used in the back-end are PHP, PYTHON, RUBY, JAVA etc. and they use frameworks such as Symfony, Django, Ruby On Rails etc. The concept of a framework can be applied to different processes carried out on the web. This is a way the programmer can connect with the database of the sites content and ultimately have it viewed on a browser.

There are several frameworks you can select and use as inspiration. In the article it lists over 10 simple frameworks like Responsive Grid System, Titan and the Golden Grid system. It also lists more complex frameworks like skeleton, foundation 3, and bootstrap.

Class Exercise

During class we were prompted to create a basic responsive page structure. In small groups we worked together to write down the code. We copied everything we were told to into our html and css page but unfortunately once we got to step 9 it didn't turn out the way we wanted to. We added our own content to the webpage and everything moves as what we think is responsive but were not quite sure. In step 9 we were suppose to create columns using row clear fix but it became fairly confusing and didn't work out.

After we email our professor with questions about how to create the columns we noticed he made a lot of changes in the css section. This still was not clear to me because I wasn't sure where he got the percentages or how the columns started to become responsive.