Your site gets online!
FTP – File transfer protocol
In order to get our files accessible around the world – yes, online, in the web, the internet 🙂 – we need a hosting (a server that delivers the files). Remember the lesson #1 when we discussed how the internet works? That’s it!
Each of you will have your own subdomain (yourname.hackingheroes.org) – try it!
First, we need a good app to allow us to connect to the server. We suggest Filezilla.
Then, with the account details provided you will be able to see the files hosted:
Here you can upload your files (HTML, CSS and images), give it a try and see your site online. Remember, when you access you site name.hackingheroes.org your browser will look for your index.html
CSS – Display property
Let’s talk about one of the most important CSS properties: display! There are a few valid display values, the most important ones are:
- none – hides the element
- block – displays the element as a block (like <p> or <div>)
- inline – the element stays inline with the content (like <a>)
- inline-block – displays an inline block
See some examples:
A nice example to see the same element with different display values.
Fonts play a very important role on site designs. Different fonts give us different emotions and help us to better interact with websites.
After we select a font from the long google fonts list, we can add it to our site:
Let’s take Bungee font as example, we need to add the following to the <head>:
<link href="https://fonts.googleapis.com/css?family=Bungee" rel="stylesheet">
And then use the given font-family wherever we want in our CSS: