Lab 7 Reflection
Lab 7 was one of the more complex labs. In this lab we created a web page that has links to all previous labs we have done, essentially a home page for the labs. First off the directory of the folders needed to be fixed. On our computer is the DD folder, or root. This contains all files that we upload to the server. In the root are two folders, labs on projects. Up to now all work has been done in the Labs folder and in this lab we continue to work in this folder. In our Labs folder is a folder for each lab containing files relating to that lab. In Lab 7, however, we needed to duplicate all the other lab folders and put them into the lab 7 folder. The reason we did this was so that we can link to these files within the Lab 7 directory. Although we can use the links that already exist for our labs on the server to link from lab 7 to other labs this way of making a directory doesn't ensure that the links will continue to work since external links are more prone to changing. Making an internal directory ensures that the files are always avaliable.
Once all the lab folders were duplicated and transferred into the lab 7 folder we needed to make the index.html file that would be the home page for lab 7. This index.html file did not have it's own folder since it would no longer act as a hub, it would be another file part of the directory. The main thing we did in our index.html file, besides inserting a banner and nameplate like in the previous lab, was making images link to our lab. The images that would link to our lab were pre made in PhotoShop. The way we made the images clickable links was the same as lab 3, putting the image tags between the anchor tags makes it a link. The thing that was different was the href attribute of the anchor tag. Previously in lab 3 the href was equal to a url. However, in this lab we needed to make the href equal to a relative path and not a url since we want to navigate within the internal directory of the lab 7 folder. The way we did this was by following the format 'folder name/file name' to set the href equal to. So if I wanted an image to link to lab 1 within the directory the href would be Lab 1/Lab1_JawadRahman_DD.html, folder name being Lab 1 and file name Lab1_JawadRahman_DD.html. This was done to 6 images that each linked to one of our 6 labs.
These skills are important for a web designer since these skills enable you to navigable internal directories which play a role in making bigger things such as homepages. A website is a bunch of pages and a good website has the files organized. It is important all pages of a website work and one of the best ways to do it is by making an internal directory. This way the location and accesibility of the files are not impacted by external factors, such an external link becoming broken. This way a website retains its usability while also being navigable. In this lab specifically we made a home page/hub. While not like the ones found on professional websites our home page demonstrates the purpose of a homepage, to provide a place that the user can easily find other files or locations of a website. This lab helps ensure we make the user experince easy.
Once all the lab folders were duplicated and transferred into the lab 7 folder we needed to make the index.html file that would be the home page for lab 7. This index.html file did not have it's own folder since it would no longer act as a hub, it would be another file part of the directory. The main thing we did in our index.html file, besides inserting a banner and nameplate like in the previous lab, was making images link to our lab. The images that would link to our lab were pre made in PhotoShop. The way we made the images clickable links was the same as lab 3, putting the image tags between the anchor tags makes it a link. The thing that was different was the href attribute of the anchor tag. Previously in lab 3 the href was equal to a url. However, in this lab we needed to make the href equal to a relative path and not a url since we want to navigate within the internal directory of the lab 7 folder. The way we did this was by following the format 'folder name/file name' to set the href equal to. So if I wanted an image to link to lab 1 within the directory the href would be Lab 1/Lab1_JawadRahman_DD.html, folder name being Lab 1 and file name Lab1_JawadRahman_DD.html. This was done to 6 images that each linked to one of our 6 labs.
These skills are important for a web designer since these skills enable you to navigable internal directories which play a role in making bigger things such as homepages. A website is a bunch of pages and a good website has the files organized. It is important all pages of a website work and one of the best ways to do it is by making an internal directory. This way the location and accesibility of the files are not impacted by external factors, such an external link becoming broken. This way a website retains its usability while also being navigable. In this lab specifically we made a home page/hub. While not like the ones found on professional websites our home page demonstrates the purpose of a homepage, to provide a place that the user can easily find other files or locations of a website. This lab helps ensure we make the user experince easy.
Comments
Post a Comment