[Audio] Welcome to my final, and power point presentation of project four for CMST 295..
[Audio] Section one Grid systems. I chose grid systems because of my interest in web design. Grid systems are used to create alignment and order, they are commonly used during web design and graphic design. There are six types of grid systems used, they provide a visible structure..
[Audio] Section two. What is a Grid system in web design? They serve different purposes, here are the most commonly used types of grid systems. Baseline grid, column grid, modular grid, manuscript grid, pixel grid, and hierarchical grid. All of these serve a role in web design and development..
[Audio] Section two continued . The history of grid systems is nothing new, they have been used in manuscripts for centuries. Some examples are the Gutenberg bible, the dead sea scrolls, the canon of proportion. Now a days we used them in web design, as before they were used in book and manuscripts..
[Audio] Section two continued. Grid systems have different classes for different size screens, some examples are used in responsive web design. Mobile phone use 768 pixels while desktop uses 992 pixels and above. They serve as invisible lines to allocate content..
[Audio] Section three. In example one Some examples of how grid systems are applied in web design, are like those of M A P. In this design they used a 12 column grid design with three main 333 pixels areas. Streamlined and efficient I would say..
[Audio] Section Three continued. Another example is UNHEAP dot com, they used a 16 column grid system design and were able to pack more content on the webpage..
[Audio] Section three continued. In this third example, 5by5 studios uses a 12 grid column design. Most likely 24 pixels on the gutter and margins. The standard code in HTML for 960 pixels is .col-lg..
[Audio] Section three continued. In this fourth and final example, we can see that pixel dreams uses a 16 column grid design. This design most likely incorporates rows..
[Audio] Ok the summary of grid systems is that, grid systems have different elements. Columns are invisible vertical blocks, gutters are the space between the columns, and finally margins are a buffer from the edge to content. I hope we all learned something and I hope you enjoyed the presentation. Thank you for watching..
[Audio] The Floor is now open, any questions?. Questions?.
References. Smith, N. (n.d.). 960 grid system. 960 Grid System. Retrieved July 11, 2022, from https://960.gs/ Web layout history. (n.d.). Retrieved July 11, 2022, from http://grid-layout.com/history.html Designlab , T. (2018, July 22). Importance of Grid Systems in graphic design: Blog. Designlab . Retrieved July 11, 2022, from https://designlab.com/blog/grids-ui-ux-graphic-design-quick-history-5-amazing-tips/ 10 good examples of grid-based web design. Designer Daily: graphic and web design blog. (2021, November 19). Retrieved July 11, 2022, from https://www.designer-daily.com/10-good-examples-of-grid-based-web-design-53442.
References. 5. How to use a grid in web design. Flux Academy - Learn How To Become a Web Designer. (n.d.). Retrieved July 11, 2022, from https://www.flux-academy.com/blog/how-to-use-a-grid-in-web-design 6. He counts advertising, Babich , N., Morales, J., Lyonnais, S., & Johannesdottir , F. (2020, April 16). Benefits of using CSS grid layout in web design: Adobe XD ideas. Ideas. Retrieved July 11, 2022, from https://xd.adobe.com/ideas/principles/web-design/benefits-css-grid-layout-web-design/ 7. Flickr (n.d.). Retrieved July 11, 2022, from https://www.flickr.com/creativecommons/.