Tables

Tables can be made through HTML and CSS, they basically allow you to organise a bunch of data by making it more structured in a grid like table, here is an example:

<table> <caption>Foundries that offer versions of Baskerville:</caption> <tr> <th>Hot Type</th> <th>Cold Type</th> <th>Digital Type</th> </tr>

The above example is a very basic example of a table, the “<table>” is just acknowledging that everything to come is relevant information regarding the table. The “<caption>” is the title of the table.

You have three main tags that are used within a table, “<tr>” stands for table row. “<th>” stands for table header and “<td>” stands for table cells. This allows you to input data in exactly the right cells and rows when trying to create a table displaying data.

Images

Images can also be put into a website using HTML. It is dependant on the file path used as all images are going to need to be found easily. So any and all images used for a website should all be located in one folder within your repository.

An example of images being used in HTML is as follows:

<section> <div class="gridimage"> <img src="img/baskerville_l.jpg" alt="A example of the original baskerville typeface"/> <img src="img/baskerville_r.jpg" alt="A example of the original baskerville typeface"/> </div>

Anytime that you are using an image in HTML regardless of what part of the website it is being used, you need to reference the images you have saved in the repository. In the example above the “img src=” is calling for the source of the image and where it is located in the repository. The image in this case “baskerville_l.jpg” states at the beginning “img/” that it is in a folder within the repository called “img”.

You can use this same principle at any point throughout the website and use CSS as well to help style the image by adjusting how big it is or where exactly it is positioned.