Development Log

UP886960's development throughout the WebF1 Unit

Week 1

Unit Introduction

Successfully logged into my VM. Password changed and logged out. Read through the coursework documents and noted the deadline dates. Began looking for flawed websites.

Week 2

Security lecture with Nick Savage

Social engineering to gain access to accounts without any need for code.

Social Engineering Techniques:

  • Phishing, impersonation
  • Physical Access
  • Shoulder surfing
  • Dumpster diving
  • Fake software ie. trojans

Week 3

Introduction to writing Literature Reviews

The breakdown of a Literature Review:

  1. Literature (Noun): The writings dealing with a particular subject.
  2. Review (Noun): A formal evaluation of something.
  3. Paper (Noun): A formal written report covering a piece of academic research.

The University provided a PDF explaining how to produce a well written paper: How to Read a Paper

The Do's and Don'ts of Reviewing Literature by Rich Boakes

Week 4

The Key Academic Writing

Academic writing is formal, so slang or 'casual' language should not be used. You should build on the work completed by others. Some level of caution should be taken - avoid using words such as 'should', 'ought' and 'must'. Your writing must be succinct (brief and clearly expressed). And finally, your writing should be impersonal, using the third person.

Week 5

Introduction to Markup

We were introduced to head, body, paragraph and title tags:

<!doctype html>

<title>Darth Vader</title>

<h1>Darth Vader</h1>

<p>Hello Tatooine</p>

Uploaded this to the VM using WinSCP

Week 6

Seperating form and content

  • The star wars live crawl
  • Getting started with CSS
  • CSS (Cascading Style Sheets) files are linked to HTML documents and provide custom styling on top of HTML content. Each HTML element can be customised and manipulated using CSS.
<><link rel="stylesheet" title="My Style" href="style.css">

Week 7

Productivity and Efficiency

An introduction into each of the different available HTML text editors (Brackets, Atom, Eclipse etc..). It is very important to maximise efficiency during development.. Learning shortcuts, using templates for elements etc. Maximising the potential of your text editor is essential to being an efficient developer.

Installing packages such as Beautify will format HTML text into a neat and professional looking format. Installing live preview packages will give instant feedback to small css changes for example.

Week 8


“Design is the application of intent - the opposite of happenstance, and an antidote to accident.” - Robert L. Peters

The Model View Controller ‘design pattern’ provides us with a useful way of analysing a design (noun), or separating the design (verb) process.

Week 9

Using images

Week 10

Addressing the Web

How are different parts of the web addressed..? With URLs.

  • Breakdown of a URL (Uniform Resource Locator)
  • Schemes, Hostnames, DNS, Ports, Query Strings, Anchors etc.
  • There is an excellent page on MDN Web Docs with a graphical URL breakdown.

The HTML Anchor Tag

  • <a> Anchor tags are used to provide a link to another web resource.
  • <a> tags are supported by all modern browsers.
  • The href attribute specifically targets the resource to be linked to.
  • Source: W3schools

Week 11

Website Navigation Bar with CSS

A navigation bar allows easy passage through the pages of a website.

Using an ordered list (<ol>) to create a series of hyperlinks to other pages. Using CSS to remove the bullet points and to pad each list item. A <nav> tag is used to define the navigation element. The ordered list and list items sit within the nav tags. CSS will add button colours, hover colours etc.

.nav { background-color: #595959; color: #ffffff; list-style: none; text-align: center; padding: 20px 0 20px 0; margin: 0;}