I rebuilt this website! I published the last version of it at the end of 2022. Since then I have learned so many things, gained new insights and so many new CSS possibilities have been added that at some point I was no longer happy with the code here. Now I have finally found the time, so I took my Eleventy Starter and rebuilt the website. It still looks the same in many parts, because I quite…
Subgrids use the grid tracks of an ancestor grid to align their grid items. For example, you can create a number of columns on the <body> element and pass them “down”, no matter how deep. The gist here: the grid system that will be passed down must be on an ancestor. Subgrid searches up the DOM tree for the nearest element that defines a column or row template ( grid-template columns or…
For me, subgrid is the missing piece for my mental model to fully embrace grid. With CSS grid , row and column tracks created in a parent grid can only be used to position direct children of the grid container. Subgrid allows sharing all that with nested grids. Instead of defining the line names and track sizing functions explicitly, we use the keyword subgrid as the value for…
Who remembers the times when music or other nasty sounds randomly started playing as soon as you visited a website? I remember making sure to turn the speakers down before I went online (yes, I also remember consciously switching the internet on and off. That was expensive). For a long time it was frowned upon to play any unsolicited sounds. The user rightfully should be in control to consciously…
I have created a few demo branches for Eleventy Excellent . Sometimes I get requests via the issues to add tags, or something similar. This makes sense, of course, but after many years of struggling with premium themes of other tools (yes, WordPress…) that wanted to cover every conceivable use case and were thus overly complex and slow, it is very important to me to maintain a clean and simple…
I’m from Germany, now living and working in Spain. My daily life is trilingual, as English is the language in which much of my professional activity takes place. When I rebuilt my personal website (that’s where you are right now!) a few months ago, I came up with the idea of making all the content available in all three languages. If you think about it, it is really a contribution to…
On January 25, I’ll be participating in TheJam.dev 2023 . When I see the other speakers in the lineup I can clearly feel the imposter syndrome kicking in… 😬 Anyway, I’m preparing something on internationalization with Eleventy, which I’ll pack into a ten-minute lightning talk, and additionally publish an in-depth article on the blog. I’m very excited about the opportunity Brian Rinaldi has…
Based on Andy Bell’s “be the browser’s mentor” workflow for buildexcellentwebsit.es , I recently published a starter project for Eleventy . Stephen Anfield, graduate student at the University of Michigan School of Social Work, came across it and asked me to customize the template for him. That’s how his new personal website on stephenanfield.com came to be. Rarely have I enjoyed a project so much!…
Eleventy comes with basic defaults already set up for you. That means you don’t have to do anything to start working: the output folder defaults to _site , and Eleventy looks for your source files in the root directory. This is okay for very small projects. However, most of my projects get quite large, and they need customizations and dependencies. I also have personal preferences, and Eleventy is…
A funny thing happened today. The very first website I made as a freelancer, in late 2008, caught up with me again. I haven’t seen or heard from it in 14 years, and now it’s back. The reason it came back into my life was, of course, that there was an error. A “forced” update to PHP 8.1 on the server caused the website to fail, so they thought of me, the creator, to fix it. This picture is familiar…
Twitter is a bit weird right now. It was the only social platform I was actively using (mostly on the on the consuming side). I am now on Mastodon . I’m mainly interested in a rich dev-related timeline, so I applied the server front-end.social. On Linkedin I still have a profile, but I chose to not link to it anymore. I don’t really use the platform, and to be honest, I don’t understand it.
Today I found Ulf Schneider’s mention of my website . Many thanks for that! Ulf especially liked the font I use here. I came across ‘Outfit’ in Oliver Schöndorfer’s newsletter Font Friday .
Back in 2007, I was looking for a CMS that I could understand so I could use it to create my own websites. After trying Joomla and TYPO3 (and hating it), I discovered WordPress . It was a revelation. I still think that it’s a great solution for complex custom websites. It’s extremely powerful and customizable, and I don’t feel too limited as a developer as to create whatever I have in mind. Some…
I have created a very small Eleventy page where I go more into detail about my technical knowledge and interests. I needed it for a couple of jobs and realized that it is handy to have, should I be asked spontaneously about my skills and tendencies. I have also added a few book and course tips, because why not. Now I have to make sure I keep it up to date with everything I’m learning all the time.…
A fast and secure website - and a look and feel that reflects that! - is crucial for a shop. albertoballesteros.com is a static website based on the Jamstack method. If everything is done right, Jamstack pages are inherently very secure, reliable, flexible and, above all, fast. Table of contents How can a store be integrated into a Jamstack website? Technical integration of Snipcart with Eleventy…
Web performance is about everyone being able to access a website quickly, no matter what the internet conditions are or what device is being used. When a customer goes to eat at a restaurant, slow service often leads to bad reviews and, consequently, fewer future customers. Similarly, a slow website speed can lead to poor Google rankings and less traffic to the website. The “user experience” also…
It is undoubtedly one of the most important features that a web page must have. A nice design is of little use if the visitor does not understand anything and leaves the page frustrated and vowing not to come back. It has happened to all of us: You are looking for information about the services of a renovation company that someone has recommended and you can’t understand what they do or don’t do.…
I have added to the projects section one of the pages I made last fall. Inelia Gestión is a tax, labor and commercial consultancy in Madrid. The objective was to reflect Inelia’s image and work philosophy in their new website. They are an agency with a very close relationship and a very direct and clear communication policy with the client. It was great to have Gabriel Monsalve’s photos available!…
Planning and design Every project starts with planning. This way I can get a more concrete feel for the project. I study websites from the same industry and look for inspiration. I start thinking about typography and color scheme and create a project folder where the client’s material is stored. The next step is to create a menu and I sketch out the design and elements of the website. My sketches…