The footer contains pertinent copyright details and provides a concluding call-to-action, encouraging visitors to connect through its social media links.
Position the main footer at the bottom of most pages within the portfolio. Ensure that social media links, with the inclusion of "target="_blank" open profiles in a new tab. The logomark should serve as a link back to the home page, and the name and copyright information must remain consistently visible.
<footer class="container-fluid">
<div class="d-flex flex-wrap justify-content-between align-items-center">
<div class="col-md-4 mb-0">
<img class="mx-3" src="" width="60" height="60" alt="photo of logo"></div>
<div class="col-md-4 d-flex align-items-center justify-content-center mb-3 mb-md-0 me-md-auto">
<ul class="nav">
<li class="nav-item"><a href="#" class="nav-link px-2">Work</a></li>
<li class="nav-item"><a href="#" class="nav-link px-2">About</a></li>
</ul>
</div>
<div class="nav col-md-4 justify-content-start">
<a href="" target="_blank"><i class="fa fa-linkedin"></i</a>
</div>
</div>
<div class="text-center py-2">
<p class="" style="color:white;">© 2024 Devin Brown</p>
</div>
Icon and graphic links should incorporate suitable ARIA tags, while the logomark should not include a descriptive ALT tag. Text and background color pairings are defined to meet the accessibility levels outlined in the Web Content Accessibility Guidelines (WCAG). Refer to the Brand Colors Standards for Type section for more details on color contrast accessibility within the design system.