While web design and website creation do not play a large role in the day to day life of most library staff, understanding how to create even a basic web page from scratch can be an extremely useful skill. As new technology and platforms that allow patrons to create and design their own websites emerge, staff must understand some of the fundamentals of graphic design, as well as some basic coding language. While most clerks will never be asked to design the new Halifax Public Libraries website, there is a chance that someone may ask for assistance in building their personal cooking blog on Blogger or Google Sites.
In this portion of the course, we learned the basics of Hypertext Markup Language and how to create a basic web page from scratch, later expanding on this idea with Cascading Style Sheets and creating a functioning website similar to the one this portfolio is being hosted on. While there was not as heavy a focus on making the web pages look perfect in design and execution, there was focus put into the formatting of the HTML and CSS documents to ensure that the coding language could be easily read and interpreted in the case of errors.
This skill itself applies heavily to libraries, as the organization and methods used in institutions of all kinds are important for properly sorting and distributing the materials from the collection, and allows for processes to put in place in the case of missing or misplaced materials. Additionally, the ability to stylize a web page crosses over into libraries as well, using an individual's creativity to design displays and sections within the library, often promoting new books or a particular author or genre.
The first project in this coding unit focused on applying the fundamentals and basic tags of HTML coding and building a basic web page based on a topic of our choosing. In this assignment, it was required for us to use the headings and subheadings often found on a web page to break up the content in addition to the paragraph and list tags to create something that could be easily read and organized.
For my web page, I chose to research and portray the burial practices of the ancient Egyptians, as their religious and political beliefs back during the three Kingdoms of Egypt have always intrigued me as an aspiring librarian. In building my web page, I took care to find information that could be broken down and organized under the associated heading tags, and used relevant images that were usable in personal and educational projects such as this one, and made links to outside sources that contained information I did not include in my research.
When coding the web page itself, I was careful to ensure that the indentation of the coding matched with the practices of nesting particular coded lines under another, such as for a paragraph under a particular heading. Additionally, I used HTML-based style tags to ensure that the copyright and crediting information would be below the associated image, even if it was moved around the page, showing my dedication to a practical and informative web page.
While the assignment restricted us from having any background colour or other CSS stylizations in our coding, I did my best to follow the basics of design in laying out my web page in a way that it would naturally flow and move from left to right in reading format.
Following on from the creation of a basic web page, this assignment would focus on turning the single page design into a working website with navigation tabs. The large majority of this project would be focused around adding in the semantic tags of the header and footer and creating a navigational tag to allow the tabs to work properly. Additionally, the styling of these semantic tags and some of the other basic tags from the previous section would play a large role in the creation of the end product.
By using the CSS tags that had previously been restricted, I was able to change the background colour of my website from white to a more fitting sandy brown and gave the images that provided context to my information a rounded border. Furthermore, I used the implementation of the navigation tags to create a better-organized format, adding in a “Continue Reading” button to help maintain the flow of the research I had gathered and written.
Like the precursor to this website project, I paid close attention to small details in the actual coding, ensuring the indentation was done correctly and consistently throughout each of the four HTML pages and used comments where applicable to better organize my ideas. In designing this website, I used my own creativity and knowledge in addition to the research I conducted to paint a picture of the topic I had chosen to represent. While it took a lot of time, and in no way would this process be used for larger libraries, especially considering the technology and platforms available, I am proud to say that I was able to create this from scratch and build further on my skills of coding and design.