Create Websites with CHEETAH
Special websites and techniques (2)
5. WhatFont – Find Font
This tool tells you the name and all attributes of the font you click on a web page with the mouse. If the font is not offered natively by "Cheetah", you can search for it by font name in various font collections, possibly purchase it (if paid), download it and then install it in "Cheetah".
Before we start rebuilding a web page, let's first look at the original. Here we think about how we can best divide it into bands (also in view of later expansion possibilities, maybe make a small sketch). We also consider here whether it makes sense to create the header and footer separately. Next, we will then download all the images of the site and then place them in an appropriate folder in Cloudinary (or the Builderall repository).
Tip: If you also pay attention to SEO, then you should - if necessary - bring the image sizes of the image files approximately to the image size as they are also displayed in the web page. You should also check the naming. Ideally, the name of the image file should contain the keyword intended for the web page.
Now we can start creating the banner structure of the web page in Cheetah. We get the colors from the original page using the color picker and then enter their hex code into the corresponding property field of the banner.
Then we will gradually place the individual elements on the corresponding banners, whose size and positions we will take over from the original website, for example, using the designer tools.
As for the font, in a first step we should determine the fonts of all used Hn fonts on the original website using WhatFont and note them down in a small table. If some of the used fonts are not available in "Cheetah", then you must either select an appropriate alternative font or research appropriate fonts on the net. If you find one, then purchase the font (if it is available for a fee) and then install it in "Cheetah".
The next step is then to adjust all used Hn fonts in "Cheetah" (main menu, "ct-show-font-group"), not forgetting the mobile variant.
Note: Avoid formatting fonts natively in a font container independently of Hn - formatting. Always use - if possible - the explicitly set Hn - fonts while respecting the associated heading hierarchy (SEO!). Of course, you can subsequently change the font attributes directly in the text container, for example, if it is absolutely necessary.
However, you do not copy the text from the original web page, but mark it there with the mouse and then copy it to the clipboard. Since unwanted formatting is also copied, paste the text into the editor (not WordPad) with
It becomes more difficult if the website to be copied contains special scripts (e.g. Java scripts) or database connections (e.g. MySQL) whose associated functionality cannot or can only be reproduced with difficulty using "Cheetah" natively. Here there is either the possibility to do without this special functionality, to code it yourself or to search the page source code to extract the searched code from it. The latter, of course, requires profound knowledge of web programming and must therefore be left out here.