Website Development Study Sheets - HTML

Self-checks and answer keys for planning, creating, and testing websites

Self-Check Sheet 1: Plan a Website

  1. What is the first step in identifying website purposes and intended audience?
    a) Conducting competitor analysis
    b) Defining target audience demographics
    c) Gathering client input
    d) Conducting user surveys
  2. Which of the following is NOT a part of the ‘Research and Analysis’ step?
    a) User personas
    b) Competitor analysis
    c) Surveys or interviews
    d) Identifying secondary objectives
  3. In the Step of “Establishing Website Purposes and Objectives”, what is the purpose of identifying secondary objectives?
    a) To align with the client's goals
    b) To prioritize website features
    c) To define the target audience
    d) To support the primary purpose
  4. What is the main purpose of the Step “Documenting the Findings”?
    a) To compile the client's objectives
    b) To share the website brief with the audience
    c) To gain insights into the target audience
    d) To serve as a reference point throughout the development
  5. Which step is crucial in the website design process to ensure a successful outcome?
    a) Understanding Project Objectives
    b) Analyzing User Needs
    c) Considering Functional Requirements
    d) Recognizing Constraints and Limitations
  6. What is the purpose of the Step “Create a design brief” in developing a conceptual design?
    a) To gather insights from competitor websites
    b) To create a cohesive visual design
    c) To define the site's structure and navigation
    d) To understand the project goals and objectives
  7. What is the primary focus of “Define Website Structure and Navigation?”
    a) Wireframing and layout design
    b) Creating user pathways
    c) Gathering design requirements
    d) Establishing the site's hierarchy
  8. Which design software is commonly used for creating user interfaces and interactive prototypes?
    a) Photoshop
    b) Figma
    c) Adobe XD
    d) Google Workspace
  9. What is the key feature of Adobe XD?
    a) Image editing
    b) Vector-based design
    c) Content-aware tools
    d) Creating pixel-perfect designs
  10. In the Step “Document and Communicate the Conceptual Design”, what is the purpose of iterative refinement?
    a) To incorporate branding elements
    b) To ensure a seamless browsing experience
    c) To address client feedback and suggestions
    d) To create high-fidelity mockups
  11. Which software for word processing, spreadsheet management, and presentation tools is used?
    a) Adobe Creative Cloud
    b) Google Workspace
    c) Microsoft 365
    d) Photoshop
  12. Which step is crucial in identifying technical constraints that may impact the design process?
    a) Office Application Software
    b) Design-Related Software
    c) Considering Functional Requirements
    d) Recognizing Constraints and Limitations
  13. What is the purpose of content-aware tools in Photoshop?
    a) To create high-fidelity mockups
    b) To manipulate photos and images
    c) To integrate with Adobe Creative Cloud
    d) To enhance user experience on the website
  14. What is the primary focus of Step 1 in installing necessary software?
    a) To understand the specific software requirements
    b) To activate the software using the provided license
    c) To create pixel-perfect designs
    d) To sign in with your Adobe ID
  15. Which software is specifically tailored for creating user interfaces and interactive prototypes?
    a) Adobe XD
    b) Figma
    c) Microsoft 365
    d) Photoshop

Answer Key 2: Create the Website Using HTML

  1. What does HTML stand for?
    HTML stands for Hypertext Markup Language.
  2. What is the purpose of HTML?
    HTML is used to structure and present content on the web.
  3. What is the root element of an HTML document?
    The root element is <html>.
  4. What are the key considerations when selecting a PSD web layout?
    Compatibility, Collaboration, Exporting.
  5. Name three advantages of using PDF as a web layout format.
    Accessibility, Compatibility, Design Preservation.
  6. What are the main benefits of using Figma for web layout design?
    Collaboration, Interactive Prototyping, Developer Handoff.
  7. What are the notable features of XD (Adobe XD) that support web layout selection?
    Vector-based Design, Prototyping, and Design System Integration.
  8. What are the five steps in selecting and collecting a web layout based on client requirements?
    Understand Client Needs, Evaluate Design Tools, Collaborate with Designers, Obtain Client Approval, Document and Share.
  9. What is the purpose of the "Head" section in an HTML document?
    Contains meta information: page title, character encoding, linked stylesheets, scripts.
  10. Give three examples of structural elements in HTML.
    Headings, paragraphs, lists.
  11. How do semantic elements in HTML benefit search engines and assistive technologies?
    They provide meaning and structure to content, helping search engines and assistive tech understand the page.
  12. Name two commonly used tags in DHTML for creating containers and styling content.
    <div> and <span>.
  13. What are entities used for in HTML, and provide an example?
    Entities represent special characters. Example: &lt; for "<".

Self-Check Sheet 3: Test the Website

  1. Which type of testing focuses on verifying that all functions and features of a website are working as intended?
    a) Compatibility testing
    b) Functionality testing
    c) Load testing
    d) Usability testing
  2. Which type of testing ensures that a website functions correctly across different browsers, devices, and operating systems?
    a) Functionality testing
    b) Usability testing
    c) Compatibility testing
    d) Load testing
  3. What does load testing assess?
    a) Website Accessibility
    b) Website readability
    c) Website performance under user loads
    d) Website navigation
  4. What is the purpose of usability testing?
    a) To check website accessibility
    b) To evaluate website performance
    c) To assess website user-friendliness
    d) To verify website compatibility
  5. What is the first step in the standard operating procedure for testing and correcting websites?
    a) Define testing goals
    b) Identify test scenarios
    c) Select testing tools
    d) Execute tests
  6. Which testing tool can be used for automated testing?
    a) Selenium
    b) Usability testing
    c) Load testing
    d) Compatibility testing
  7. What should be done after identifying issues or bugs during testing?
    a) Prioritize and fix issues
    b) Define testing goals
    c) Identify test scenarios
    d) Select testing tools
  8. What should be done after bug fixes have been implemented?
    a) Define testing goals
    b) Identify test scenarios
    c) Execute tests
    d) Conduct retesting
  9. What does website accessibility refer to?
    a) The ease of reading website content
    b) The practice of designing websites for individuals with disabilities
    c) The compatibility of a website with different browsers
    d) The performance of a website under user loads
  10. What should be checked to assess website accessibility?
    a) Font sizes and styles
    b) Contrast between text and background
    c) Screen reader compatibility
    d) Website responsiveness
  11. What does readability focus on?
    a) Font choices and sizes
    b) Interaction with website forms
    c) Performance under user loads
    d) Website navigation
  12. Which factor relates to the clarity and visibility of website text?
    a) Readability
    b) Usability
    c) Compatibility
    d) Legibility
  13. What should be checked to assess website legibility?
    a) Navigation and layout
    b) Line spacing and paragraph spacing
    c) Contrast between text and background
    d) Website responsiveness
  14. What does browser compatibility testing aim to ensure?
    a) Proper functioning of website forms
    b) Performance under user loads
    c) Consistent presentation across different browsers
    d) Accessible content for users with disabilities
  15. Which step should be taken to assess website presentation across common browsers?
    a) Check font sizes and styles
    b) Verify proper line spacing and paragraph spacing
    c) Open the website in different browsers and compare the layout and styling
    d) Use screen readers to navigate the website