BA. (Hons) Graphics Design

Size: px

Start display at page:

Download "BA. (Hons) Graphics Design"

Caitlin Randall
5 years ago
Views:

BA. (Hons) Graphics Design Cohort: BGD/16A/FT Examinations for 2016 / Semester 2 Resit Examinations for BGD/13/FT & BGD/14B/FT MODULE: Web Design MODULE CODE: WAT1106c Duration: 2 Hours Instructions

1 BA. (Hons) Graphics Design Cohort: BGD/16A/FT Examinations for 2016 / Semester 2 Resit Examinations for BGD/13/FT & BGD/14B/FT MODULE: Web Design MODULE CODE: WAT1106c Duration: 2 Hours Instructions to Candidates: 1. Answer all questions. 2. Questions may be answered in any order but your answers must show the question number clearly. 3. Always start a new question on a fresh page. 4. All questions carry equal marks. 5. Total marks 100. This question paper contains 4 questions and 5 pages. Page 1 of 5

2 QUESTION 1: (25 MARKS) ANSWER ALL QUESTIONS The steps behind building a website starts by an interview with the client for requirements gathering. Among the elements required during the interview are: (1) Navigation map (2) Wireframe / mockup and (3) elements to design moodboard. a) Assuming that a website will have 8 pages with link name Home, About us, Features, Courses, Contact and Blog for the main pages and 2 sub pages in Courses named Coding and Design. Draw a navigation map to represent same. b) What is the purpose of a wireframe / mockup and what are the elements included in a wireframe? c) Provide 5 elements worth considering for the moodboard of a website? d) Once the moodboard and wireframe has been validated by client, the next step is the design of the website template. It is recommended to make use of a Grid System to aid in the Design of the website. Explain the term grid system and explain how it impacts on your design workflow in a graphics package. e) Provide 2 graphic design principles you would consider when designing your template. You answer should include how you would apply the principles to improve your design. QUESTION 2: (25 MARKS) Figure 1 represents a layout for a new website. The diagram contains the name of the divisions and their respective dimensions in px unit. A container division regroups all other divisions and is of width and height 800px. Page 2 of 5

3 Below is a fragment of the HTML that makes up the website. <html> <head><title>template page</title></head> <body> <div id= container > <div id= header > </div> </div>  </body> </html> Figure 1: Container with different divisions a) Write down the HTML tags to complete the HTML required to create the layout. Your answer should include the container division. b) The div#left and div#footer will require appropriate use of CSS float and clear for proper alignment. Explain the purpose of clear and float using #left and #footer as example. Page 3 of 5

4 c) The Menu items are designed from an unordered list. Below is website Menu as unordered list. Write HTML tags to reproduce same in web browser. Home About Services d) Write down the html tags with appropriate values to perform the following. i. Insert an image named img.jpg. ii. Create largest heading for text title iii. To set a text bold iv. To insert an address on a page. v. To write H 2 O correctly including the subscript. e) HTML 5 introduced new tags to improve tag readability. List 5 new tags as introduced by HTML5 and explain their purposes. QUESTION 3: (25 MARKS) a) Cascading style Sheet (CSS) can be included in html by 3 different ways namely Inline, Internal and External. i. What are the disadvantages of inline over Internal? ii. What is the advantage of using external over internal? (2 + 3 marks) b) CSS is applied to html tags as Class, ID or tag formatting as depicted below Tag formatting: H2{color:red;} Class formatting:.red{color:red;} ID formatting: #red{color:red;} i. How does tag formatting affect the HTML elements on a web page? ii. What is the difference between Class & ID formatting? (2+ 3 marks) Page 4 of 5

5 c) Below are new additions to the CSS family. With the aid of diagram where necessary, explain the result of using the css below including their parameters. i. Border-radius ii. Box-shadow (2 +3 marks) d) Below are two different color models as used in CSS3. Explain each model and provide minimum and maximum values for same. i. RGBA ii. HSLA (2 x 2.5 marks) e) Typography is an essential element of design. CSS3 introduced Web fonts. What do you understand by web fonts and what are the advantages over previous approach? QUESTION 4: (25 MARKS) a) What is the difference between JavaScript & Jquery? b) List the steps to convert an HTML / CSS website into an android Mobile Application c) Explain the terms Hosting and Domain name. d) You want to upload a website online. What are the steps to perform same? e) What do you understand by Content Management System (CMS)? ***END OF QUESTION PAPER*** Page 5 of 5

BA. (Hons) Graphics Design

BA. (Hons) Graphics Design Cohort: BGD/16A/FT Examinations for 2018 / Semester 1 Resit Examinations for BGD/15B/FT MODULE: Advanced Web Design MODULE CODE: WAT3110C Duration: 2 Hours Instructions to Candidates: