This is my list of things to do. I write it in One Note on Windows 10, so I have it synchronized in all my Pc and smartphone.
Once I have cloned the folder from Git Lab I can start customizing my website.
In the past i build different kind of website; I always use CMS like Wordpress, and I know how write a basic web site in html/css. This way I want learn to modify a Bootstrap Theme.
First I choose a free theme, on this Site where can found many free themes; after i download it on my local pc and I start to custumize it.
I found some information how to write a basic site in Html and Css on W3C Site. W3C (Worl Wide Consortium) is the orgazination who define all Web Standard.
There are other important informations and tutorial for build a web site, on this W3C School site.
The first thing is to choose a text editor that can help me to write in html. I choose ATOM for edit my bootsprap theme.
Atom is a simple Text editor for edit different kind of programming language. In my case, I use it for edit my Index page and my Bootstrap theme.
It is easy to use, because when you digit a command or a tag(if you're writing in html), there are some helps that facilitate the work.
In this example:
If i want to use the "a tag" Atom helps me to write the good code, and anticipates my actions
Atom help me writing the "a" tag
The theme from I start is this:
I start to delete all parts that I don't need:
after I add all parts I need: The About Section Section, The Week Section, The links about FabLab Napoli and all links for contact me.
After modify all sections, I start to custumize the css for change the background colour of each section, and customize icons and fonts' colours
For modify the Css, i prefer to work directly from the browser, in my case I use Mozilla Firefox; but I can use also Google Chrome
In the Css file I change the color of sections' background and the text hover color. I can save the my changes directly from the browser. like in this picture:
For the image I use Adobe Illustrator and Inkscape (Open Source Vector graphic software)(I save a copy of the file in this repository); and i download other
icons in .svg format by Flat Icon site.
This Bootstrap theme is responsive, it mean that can be visible from mobile device and have adaptive visualization.