My Landing page (basic directory to other sites)

Final devlog-

Updates since last devlog

• Added a link from my landing page through to my portfolio
• Added a live scrollable view of my portfolio
  -Moved header components across slightly

I started off by adding the link from my landing page through to my proffessional looking portfolio which i built with wix and has many more of my social links and about on it. I did this by adding it as a text link which redirected to the home page of my wix website. I then also added a live view of my portfolio website as well which works well for people who do not want to clcik on the link however it makes it a lot more noticable and also fills up some of the space on the landing page. Finally, i moved the portfolio text link from the left next to the instagram logo over to the right by itself so that it doesn’t look like my instagram is the portfolio and that the portfolio is a seperate link.

This project was very fun to work on and it taught me some fun skills on how to do html. Thanks to w3 schools for all the helpful guides on how to code html too.

Devlog 3-
Since the last devlog i have made a few imrpovements including:

• Adding instagram link
• Shortening urls to make code more visually pleasing
• Moved header closer to logo by adjusting margin
• Changed header and subtitle sizes to match logo size
• Changed instagram link size to match logo and header size

I started off by adding in my instagram link and then i added an image icon of the instagram logo i found so that the user can click on the logo and be taken straight to my instagram page. When i copied the instagram url and the icon url i noticed they were very long so i used tinyurl to generate me some shorter urls which means my code editor does not need a horizontal scrolbar. I also removed the margin between the heading and subtitle and the logo so that it is coser together and feelsmore proffessional and less like it is spreading out everywhere making the look appear neater and more proffessional. I also made the Heading and sub heading sizes slightly smaller so that they match with the size of the logo and so that the subheading is clearly a subheading. As well as this i made sure that the instagram logo was a simiair size to the logo but still slightly smaller so it doesn’t take attention away from the logo.

Devlog 2-

Since the last devlog i have made several updates including;

• Customising text sizes
  -Adding a logo
  -Experimenting with padding
  -Aligned logo in line with header and subtitle
  -Removing nests which caused code not to work

To customise the text sizees i simply used font-size: 50px; and font-size: 20px; to make it easy for the user to easily distinguish between the title and subtitle. To add the logo i took the image adress of my portfolio website and added the url in. I created a padding around the edges of 150 pixels to allow for text to be more centred but not waste loads of space on the edges, i however later removed this because it was getting in the way of aligning my image. I spent most of the time working on trying to get my logo in line with the title and subtitle at the top of the page as well as moving the text to the side so that the logo can sit in the corner. I removed some nests as well which were making the code hard to function.

Skills learnt from w3 schools website

My very first devlog for this project…

In this devlog i worked on creating a title called MM Designs and i also added a heading of MM Designs and a subtitle of “This is my personal site”, i created the subheading as a paragraph and the heading using … i also used some very basic css to customise the look by making the background black and the text white to fit in more with the coding/ dark mode aesthetic. I also had to work out how to centre my text so tat it looks proffessional however i may change this later.

I am using w3 schools website as a guide to creating this