Web Development and Design Foundations with HTML5 (8th Edition)
8th Edition
ISBN: 9780134322759
Author: Terry Felke-Morris
Publisher: PEARSON
expand_more
expand_more
format_list_bulleted
Expert Solution & Answer
Chapter 5, Problem 7HOE
Explanation of Solution
Flexible Layout Design:
- In flexible layout design, majority of the components have percentage widths.
- It usually adjusts to the user’s screen resolution.
- The figure given below shows a flexible layout design, where some designers give set widths to certain elements such as margins, so that the view can be adjusted for each user.
(a)
Wireframe page layout for the “Doug Kowalski’s photography business” home page:
“Doug Kowalski” is a freelance photographer who is interested in taking nature photographs and often used to get contact work for textbook and journals. He likes to create a website that shows his talents and provides his contact details.
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solutionStudents have asked these similar questions
Put the images used too.
Design the following layout structure using bootstrap theme of your choice
Logo
Navigation
Header / Banner
Intro Text Area
Воx1
Воx 2
Box 3
Footer
Add the contents in the layout structure, that is logo, set navigation bar with options (home,
about, contact us), set header, add contents to side bar, body area and footer of your choice.
• Final Output of the page must give a professional look like a real website home page
designed.
You are required to prepare a word document report of the assignment.
o Mention the Bootstrap Theme Name and Link Used
o Include each section heading with code and separate output in report
o Include final page output in document
o Document must be properly formatted and clean
Background
Background
2.
Write the HTML, CSS and JS code to design a personalized portfolio website for a sample person X.
Note - You have to include name, introduction, hobbies, qualifications, projects, etc. (All these parameters can be filled as per your own liking, like you can give whatever introduction or qualifications or projects that you like but they must be present in the website)
At the end please include a responsive " Contact Me " form. The page should be creative and must contain pictures (again, pictures as per your liking).
Chapter 5 Solutions
Web Development and Design Foundations with HTML5 (8th Edition)
Ch. 5.6 - Prob. 1CPCh. 5.6 - Prob. 3CPCh. 5.12 - Prob. 1CPCh. 5.12 - Prob. 2CPCh. 5.12 - Prob. 3CPCh. 5 - Prob. 1MCCh. 5 - Prob. 2MCCh. 5 - Prob. 3MCCh. 5 - Prob. 4MCCh. 5 - Prob. 5MC
Ch. 5 - Prob. 6MCCh. 5 - Prob. 7MCCh. 5 - Prob. 8MCCh. 5 - Prob. 9MCCh. 5 - Prob. 10MCCh. 5 - Prob. 11FIBCh. 5 - Prob. 12FIBCh. 5 - Prob. 13FIBCh. 5 - Prob. 14SACh. 5 - Prob. 15SACh. 5 - Prob. 1HOECh. 5 - Prob. 2HOECh. 5 - Prob. 3HOECh. 5 - Prob. 4HOECh. 5 - Prob. 5HOECh. 5 - Prob. 6HOECh. 5 - Prob. 7HOECh. 5 - Prob. 1WRCh. 5 - Prob. 2WRCh. 5 - Prob. 1FWDCh. 5 - Prob. 2FWDCh. 5 - Prob. 3FWD
Knowledge Booster
Similar questions
- This question is a completion for previous question. Create the Restaurant website. Create home, menu, and contact us pages. The three pages should have the same header and footer. The header contains text or image as a logo, navigation bar and if you want to have a background image please choose it to look good. The footer should have a contact information, location and the copyright statement. The home page contains images, carousel and some description about the restaurant. In the home page add Greeting/welcome statement that change dynamically each 10 second. The menu page should contain cards of the meals.The card contains image, description, the price of the meal and button to buy or choose this meal. The contact us page contains the restaurant contact information and a contact form (I expect from you a nice and professional form). Apply these changes using JS when submitted the form: 1- Apply the validation for each input (make sure all inputs are required). 2-…arrow_forwardCreate a mockup of your personal website and your first home page. Your personal website should contain at least three pages (HTML documents). Your mockup should contain mockups of each HTML document. You should follow a similar format as the sample mockup provided here . Your 5-6-page document should include the following: A description of the site's organizational structure. A description of each page that you'd like to add to the site and its specifications, including color schemes, the size of logos and images, and the fonts being used. Create your first home page. Your home page must include the following elements: At least one heading. At least two paragraphs. My interests include small animal rescue and rehoming for Guinea Pigs. Thanks!arrow_forwardComplete the following webpage assignment. Assignment Instructions: Design a webpage to simulate a Blog. The website must have a banner image and a featured image with multiple resolutions to be active at different resolution breakpoints just as discussed in this lesson. Include a jQuery script in your project to further enhance the user experience. Use one of the CDN libraries. The script is up to your discretion though you must be able to justify its use. The blog page must be aesthetically pleasing and follow a traditional blog structure. It may help to look at the many WordPress templates available on the net.arrow_forward
- 10. Sam is trying to determine the best way to design the background of his web page. He would like to add background images and background styles to his design. He needs to understand how browsers load a background image and learn about background style properties. Sam wants to change the position of an image on his web page. He wants to place the background image 30 pixels to the right of an element’s left edge and 30 pixels down from the top edge. Identify the correct style that Sam should use. Group of answer choices background-position: 30px; background-position: 30px 30px; background-position: t_edge, 30px; background-position: 30px vertical;arrow_forwardMatch each description with the suitable CSS position property Element positioned according to the normal flow of the page. A. position: relative; B. position: absolute; Changes the location of an element in relation to where it would appear. C. float:right; Element stays in the same place even if the page is scrolled. D. position:place; E. float:none; Precisely specifies the location of an element in the browser window. F. position: static; Elements that seem to "align" on the right G.position: fixed; side of another element.arrow_forwardi need to make sure for the answerarrow_forward
- i need the answer quicklyarrow_forwardCreate a page for the solar system with a minimum of 4 paragraphs. You can get the content from Wikipedia, Nasa, or any source you like. Include a link to the original source. Include a table listing: planets, their radius or diameter, their distance from the sun, and their mass. Include a caption. Use TH tags where appropriate Include a border Include a picture of the solar system which is an image map. Each planet in the image should link to a page about that planet Create a page for each of your planets. Include a minimum of 4 paragraphs for each page. Include a link to the original source. Include an image of the planet Include a list of any moons the planet may have.arrow_forwardDesign the following webpage using a two-column layout using floating technique as shown below. All the regions should contain appropriate padding. use different background colors to distinguish parts.arrow_forward
- Objective: Build a basic centered web page including proper skeletal and structural elements as well as all aspects of the box model. Insert images and links and style the links. Procedure: 1. Create your root directory (project folder) and open this folder in Brackets. 2. Create a new html document and save it as index.html inside the root directory. 3. Code out a basic html web page using the proper skeletal and structural elements (doctype declaration, html, head, body, header, main, footer). 4. Create a css file for this project, save it as style.css in the root directory and link it to the html document (build the link in the head of the html document). 5. Use appropriate aspects of the box model (width, height, border, margin) to give dimension, style and add space in and between the large structural elements of the web page. 6. Add background colors, gradients, or images to the large structural elements of the web page. 7. Make the width of the body element smaller than it's…arrow_forward8 - Write a css rule that make heading 2 (h2) and table header (th) alignment as centered, and also background color maroon.arrow_forwardMatch each description with the suitable CSS position property Element positioned according to the normal flow of the page. Changes the location of an element in relation to A. position: static; where it would appear. B. position: relative; Element stays C. float:right; in the same D. position: absolute; v place even if the page is scrolled. E. float:none; F. position:place; Precisely specifies the location of an G. position: fixed; element in the browser window. Elements that seem to "align" on the right side of another element.arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
- New Perspectives on HTML5, CSS3, and JavaScriptComputer ScienceISBN:9781305503922Author:Patrick M. CareyPublisher:Cengage Learning
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Cengage Learning