Web Programming: HTML, CSS and JavaScript

Want your own homepage, but without using Wordpress or similar? Then the time for HTML, CSS and JavaScript has come.

Basics

For HTML, start with SelfHTML [de] to get a basic feeling for tags, contents and so on. Some early notes:

Styling should be done exclusively with CSS [de] [wtf], e.g. inspired by CSS Zen Garden. Though less than intuitive, it is still the most elegant way towards a well-behaved page. Again, some early notes:

Images can be SVG (good in any resolution), or pixels in AV1, WEBP, or JPG (resource as PNG) formats.

Your website does not need dynamic behaviour, but you will not believe that, so take a look at JavaScript elements in a HTML page, the so-called DOM (document object model).

Layouts

If you have a header, sidebar and main content, you will probably want to use div, aside et al. instead of tables for layout. Particularly if you want a vanishing sidebar below a certain width (nice for mobile devices).

Layout variations include:

For mobile screens, you might still want to consider conditional CSS with media queries like @media screen and (max-width: 700px) { ... } to get the results you want.

Integration

Search engines will crawl your site automatically, but there is still the question of hosting and indexing on a smaller scale.

Have fun and do not over-do it!

EOF (Jan:2023)