justmarkup.com justmarkup.com

Loading and replacing HTML parts with HTML

In the last weeks there has been another round of approaches about loading HTML and server-rendered components. We had the option to only load and replace some parts of an HTML page for over 20 years with JavaScript, and even longer by using framesets. The idea is always the same, replace only some parts of HTML instead of loading everything again. There has been many approaches to load and replace parts of a document and there will be...

justmarkup.com justmarkup.com

Read out loud - Text to speech with the Web Speech API.

I recently added Text to speech for Writerie and here is what I learned about using the Web Speech API. Check for support # Before using it we have to check if the browser supports the Web Speech API. We can do this by using a feature test. if ('speechSynthesis' in window) { // Great, browser supports the Web Speech API - let's use it} Voices # With that in place, we can now start using it. First, let's see how to get all available...

justmarkup.com justmarkup.com

100 days - 100 CSS properties in a tweet

At the beginning of the year I thought it may be fun to tweet about a CSS property for 100 days in a row. Before I started I wasn't really sure if there are even so many different CSS properties, but I soon realized there are much more, especially if you count all the long-hand properties as separate properties. Or did you know that there are 61 properties starting with border? I have to say I learned quite a lot about CSS the last 100...

justmarkup.com justmarkup.com

The beauty of the Unknown

Building for the frontend on the web comes with the challenge of many unknowns. Many seem to dislike this and want to build only for one environment. I really like the challenge and you should too if you are a Front-end developer. All the browser and devices # At the moment there are about 63.000 browser-platform-device combinations. That's a lot. And there will be even more in the future. It is impossible to test your site in all...

justmarkup.com justmarkup.com

Teaser with multiple links

Cards, teaser, preview blocks – there are many different ways to name them – one thing they all have in common is that they usually consist of a headline, an image, some text and a read more link. The other similarity is that all these elements should link to the same goal. In theory, writing the HTML for this pattern seems pretty straightforward, but there are some accessibility concerns which may not be obvious at a first...

justmarkup.com justmarkup.com

Eight years

It's been eight years since I launched this site with my first article. Since then I published 130 more articles and notes and one even explains why this site is named justmarkup. Last year I wrote that I plan to switch from WordPress to a Static Site generator. This is done now, and this site is now using 11ty and I am more than happy with it. If you are curious, the code behind this very site can be found on Github. I haven't written...