A grid based design is a flexible way to design a webpage using a 12-colomn grid. Each row of the page is divided into equal sized, 12 columns in order to maximise the stylistic options. 12 is the number used because it means that you can divide the page easily in half using 2 x 6 columns, or into 3 using 3 x 4 columns, or 4 using 4 x 3 columns. A higher number isn't used because a page divided more than 4 times is bad design and 2,3, and 4 all divide evenly into 12.
Responsive webpages are really important now with all the different devies people are visiting the internet on. Due to the different size and shape of the different devices screens, it's important to have webpages that load properly and adjust to whatever device the page is visited on.
Semantic structure is refering to writing out the HTML file in such a way that the information is reinforced and portrayed as it is intended. For example, using the h1, h2, h3.. and so on in a sensible fashion, with h1 being your most important header followed by h2 etc.