In this weeks challenge, i was asked to create a portfolio, in the form of a website. I will be able to add to this as i go on through the course.
I started by creating my HTML file. I ensured that the HTML was semantic by avoiding div elements and making use of semantic elements such as article, main etc and also using ARIA labels and alt attributes for images. Ensuring that those who use assistive technology would also be able to navigate the website. I started off, by having my navigation bar at the top of the page. Below this was an emoji of me and a small paragraph introducing me. I then had a screenshot of my first project, which was the horiseon project. This project involved me refractoring code. I then added an article with 6 sections. I used this sections as placeholders for future projects. I added a link to the text, which currently goes to google, however in future it will link to my projects.
In the CSS i styled my website to my liking.I began by using the universal selector to set the margin, padding etc to 0. Then I placed the navigation bar at the top of the page. I made the navigation links central and i used CSS styling to make them capital and remove the underline. I then used CSS pseudoselectors to style the links, so that they change colour, when clicked, hovered over and when visited.
I ensured that the website had the display function flex, and felx-wrap throughout, to ensure that when the page is smaller, the items adjust accordingly. In the footer section, i made used of the href:mailto function within the a element.
If you have any queries regarding the code please contact me @ iman.jama891@gmail.com