This page is a ritual to guide artists to building a web page hosting their own images, text and links. With a bit of independent learning it is perfectly possible to work with the many wonders of the modern web including 3D things, playable games and interactive experiences.

To begin we will be starting small, no knowledge of any kind of programming is necessary. We will be building a website from nothing where we can host images as a personal gallery.

To see some of what can be done with a little coding knowledge, check out my website here of which you can read the entirety of the code running it here.

The web has a high barrier for entry, there is a lot of money in keeping the internet expensive, mysterious and inaccessible, and part of that is in the language we use to describe it.

In this ritual, We will be simulatenously be leaning web development 101, and using a mental framework to approach web development from an unusual perspective- using witchcraft to manifest a link for ourselves in the online web.

The entire exercise is free, and will end with us having a web page, which we can customise to the limits of how much code/spellcasting we are willing to learn. This is not squarespace or livejournal- everything will run on our own code, and there are no constraints to what we can do, other than what is currently possible on the internet, and 2GB of storage space (loads!).

I will encourage you to learn some of the 'tech' language to be able to speak in the internet's tongue, but also think of creating a website in an unconventional way.

github is a space on the internet you may have heard of- it is largely an organisational space for a tool called 'git'. Its extremely useful, but we won't be using it in a great amount of detail here.

Each github account provides you with a free web domain, where we can 'host' our code, and manifest the spell we are casting- to command a space on the web, where anyone can visit and experience the web page which we have manifested.

We need to create a unique name for our account, which will also be the 'address' url which will be used to find our link.

For deciding on your url- try thinking about what it is you are hoping to manifest. Will it be a place to showcase your art? Somewhere to experiment and make work with the medium of code? A place to write down your thoughts?

you could think about:

• the web as an invisible entangled connection between thousands of individuals, similar to a fungal blanket connecting trees in an ancient forest.


• the web as a word associated with spiders, capturing and entrapping data and hours of time of people, encircling the whole world.


• the web as a social project, the effort of thousands, all contributing to an enormous collaboration. The organising of enormous amounts of complex work in a way which is trying to constantly grow and innovate, without breaking the millions of web projects which have been built since 1989.


• the act of writing code (which we will think of in this workshop as 'spell writing'), the tapestry weaving of connecting logic, the feminine history of developing programming- Ada Lovelace, Grace Hopper, the women of Bletchley Park.

We now, in order to proceed, need to confirm our email address. It is best not to take this decision lightly- github is owned by Microsoft.

The hierarchical accumulation of data is an important concern. Now is a good moment to try and visualise this accumulation of data, information, currency, power, concentrated in locuses like Amazon, Apple, Microsoft, Google.

Remember our goal- what are we manifesting? A space in this interconnected web for ourselves, free and accessible to us and to those we share it with. Is data harvesting a price worth paying for access to this powerful online space? Perhaps think on collective responsibility, grass roots power. Perhaps you want to do a little research into this yourself.

We now, in the words of github, create a 'repository'. We can think of this as a host to hold our spell, a location in the web, in github's information storage and (if we want) a file location on our computer simulataneously.

What makes it a 'repository' is the linking of these things, which makes our spell (aka our code) consistent in all of these different forms. That is essentially all that 'git' is.

In order for this repository to be treated as a website, it must use the free domain that you get associated with your github account as the name. For me, it is manifestation-spell.github.io. For you, it will be USERNAME-YOU-CHOSE.github.io

Click on 'creating a new file'

Name your new file index.html, with the contents



Then, click on 'Commit new file'.

An index.html is a universally understood gateway to a website. It will be understood by an 'internet browser' (firefox, chrome, edge, safari) to be the place where a website begins. This has worked since the early days of the web and will do into the future of the internet!

You can now navigate to the host of your spell. This will be USERNAME-YOU-CHOSE.github.io. You can look at mine here: manifestation-spell.github.io

We now have everything set up to host a web page! We can write any HTML in this file and it will function as a web page for us to use however we like, and share with anyone! Very exciting, you are on your fist step as a software developer, tech witch, and web artist! Bear with if you get a 404 error at first- github pages sometimes takes a while to update. If you have a blank page, your code has an error (and read on to learn how to 'debug' with inspect), if you have a 404, github pages is just taking a moment to update.

But wait, what is HTML? W3Schools is a brilliant place to start.

The most important lesson in learning to be an internet witch is that you can learn how to do anything, if you are patient and dedicated enough. The thing that is difficult is getting started. Once you can learn how to learn, You can build a piece of the internet yourself- we've already begun.

Within the W3Schools link, you can scroll to find the information on including images in HTML. We wanted to make a gallery of our art, so to include images, this is the form which our spell must take.

To adapt the code to manifest a painting of mine instead of a w3schools logo, I must change key elements of the line of code. W3Schools uses



and I use



we can save this line of code in index.html to replace



But I have saved this code in a new file, artwork-portal.html. It can be accessed at manifestation-spell.github.io/artwork-portal.html However, something unexpected has happened- instead of any image, there is just my alt text, 'a painting by Megan Bates of a computer generated rippling water pool with mushrooms'.

This begins to show us why it is always important to use alt text when including images on our website- if the image can't by found, we get context explaining what should be there. This is incredibly important for blind users of the internet- often images are essential for basic web navigation, and so you must provide a clear explanation of what each of the images on your website are, and what their function is (if they have one). Accessibility is an essential part of internet spellcasting- our disabled siblings, sisters and brothers must be included in the web which we build.

We need to find out where our image is- to find out what is going on, we will use the 'inspect' tool.

This is slightly different depending on which browser you use, but all are similar. I will be using firefox's inspect, which can be opened using a right-click > Inspect element or CTRL+SHIFT+C on Windows or CMD+SHIFT+C on Mac.

Within the inspector- we can see we have 2 errors. One is for a jpg image- it can't be found, and the other is for something called a favicon. What is that? If we think about it- this makes perfect sense. What image indeed? We haven't put an image on to github for our site to access yet. Let's do that now.

(for the curious, look here for an explanation on favicons. There's no rush to include one right away, they aren't necessary for our website to work.)

To add our image, we just add it to our github repository as shown:

In order for our html page to find this image, it needs to be named correctly. We will remember that the code we used was



so we should make sure that the src=" " quotes contents is correct. src is a link source, which locates a url location on the internet to find the image. Now we have uploaded it, the failsafe source of the image is https://manifestation-spell.github.io/ripple.jpg HTML is clever enough to be able to find an image locally however. Using



will work fine.

To create this linked page, I will create yet another html page, manifestation-spell.github.io/linked-artwork-portal.html which hosts the single line of code above, with the correct name of the image in the src=" " quotes. Now is a good moment to experiment and test what does and doesn't work- what if we use the full url addresss of the image, 'https://manifestation-spell.github.io/ripple.jpg' in the src=" " quotes instead? What happens if we rename the image itself? What do I do once I've got 100 images? Or 100 html pages? Won't it get a bit messy having them all here? Can I have text and an image? Does it still work if I name this spell index.html?