サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
Pixel 9
christianheilmann.com
I just released my dice simulator app and in doing so learned about a few things about turning a GitHub Page into a PWA. To make this easier for subsequent projects, I put together a bare-bones template to turn any GitHub page into a PWA. Nothing in there is sophisticated and all it does is provide installability and caching of files offline. As a reminder, you can host HTML, CSS and JavaScript fi
Update: As this is blowing up on Hackernews I added information to each of the tips in which environment they are supported in parenthesis after each heading. When I state “Chromium browsers”, this refers to all browsers that use the Chromium core and also feature all the Developer Tools. This is Chrome, Microsoft Edge, Brave and many more. As a reminder: Microsoft Edge is the browser that comes w
Sharing data between CSS and JavaScript using custom properties One of the big battles we see in the web development world is still CSS vs. JavaScript. Both have their merits, their own syntax and ideas and it can be tough to get your head around them. This is why I love that we have ways to make the two communicate and use each for what it is best at. For one thing, I always found it annoying to
This is part of the web truths series of posts. Every few months there is an article claiming that CSS is not real programming. That CSS is too hard and broken. The language used in these can get creative: People have some ... um ... intense feelings about CSS. pic.twitter.com/dDspAM8i2F — Dave Rupert (@davatron5000) September 18, 2017 There is truth to the fact that working with CSS is not tradit
In addition to this explanation, I also recorded a quick screencast. Feel free to check that one first. When it comes to newer elements to play with there are a few that are slightly odd. Canvas is one of them, as it doesn’t do anything without scripting. It is a placeholder for a canvas painting or animation and can contain fallback content when it is not supported. This ailed purists of semantic
Current advancements in ECMAScript are a great opportunity, but also a challenge for the web. Whilst adding new, important features we’re also running the danger of breaking backwards compatibility. These are my notes for a talk I gave at the MunichJS meetup last week. You can see the slides on Slideshare and watch a screencast on YouTube. There will also be a recording of the talk available once
According to the luminaries of the web design world, the “mobile web” doesn’t exist. Stephen Hay said it, Smashing Magazine said so and Jeremy Keith amongst many others. Except, it does. Not as a technical reality, but as a dream of marketing and overly excited managers who believe in magical powers of their engineers. And it is nothing new. We’ve been there before, and we probably will get there
One of the things I like where I live in London is my doctor. He is this crazy German who lived for 30 years in Australia before coming to England. During my checkup he speaks a mixture of German, Yiddish, Latin and English and has a dark sense of humour. He also does one thing that I have massive respect for: he never treats my symptoms and gives me quick acting remedies. Instead he digs and anal
“The suspense is killing me,” said Arthur testily. Stress and nervous tension are now serious social problems in all parts of the Galaxy, and it is in order that this situation should not in any way be exacerbated that the following facts will now be revealed in advance. Hitchhiker’s Guide to the Galaxy I am not returning to Mozilla in February but go on to bring the great messages of an open web
Four years ago I announced that I will join Mozilla as principal evangelist and I was the happiest person alive. I exclaimed that I want Mozilla to be the “Switzerland of HTML5” and an independent player in the great browser wars around the early days of this new technology revolution. I also announced that I am excited to use my flat more as I can work from home. Now I am here and I have hardly h
I’ve always been a fan of Google IO. It is a huge event, full of great announcements. Google goes all in organising a great show and it is tricky to get tickets. You always walked home with the newest gadgets and were the first to learn about new products coming out. The first years I got invites as an expert. This year I got a VIP ticket which meant I paid for it but didn’t have to wait or be par
Earlier today my colleague Anton Kovalyov who works on the Firefox JavaScript Profiler ran across an interesting problem: if you have a table in the page and you want to colour every odd row differently to make it easier to read (christened as “Zebra Tables” by David F. Miller on Alistapart in 2004) the great thing is that we have support for :nth-child in browsers these days. Without having to re
Opera today announced that they are ditching their own Presto rendering engine for Webkit and V8. More details as to what that means for developers are on the ODIN blog. The reasons are reasons you expect a commercial company to give: To provide a leading browser on Android and iOS, this year Opera will make a gradual transition to the WebKit engine, as well as Chromium, for most of its upcoming v
During the last few weeks we were busy helping developers to convert their HTML5 apps from platforms like WebOS and ChromeOS to FirefoxOS and the target hardware this operation system is right now aiming for. As these are slow mobiles, we found that quite some tweaking had to be done. The reason was in most cases libraries using outdated ways to animate and position things on the screen. These old
When I wrote my JavaScript book in 2005 one of the things my editor called out was that using the term “modern browsers” needs definition. I think it is time to go further and call it a myth. An article of mine coming out soon just came back from the editor. One thing I mention in the article is that a very simple JavaScript test around your code can make sure that you don’t give any of your JavaS
I am always amazed about the lack of support for progressive enhancement on the web. Whenever you mention it, you face a lot of “yeah, but…” and you feel having to defend something that should be ingrained in the DNA of anyone who works on the web. When explaining progressive enhancement in the past Aaron Gustafson and me quoted the American Stand-Up comedian Mitch Hedberg and his escalator insigh
Last week I handed in my notice at Yahoo to leave them for pastures new. I’ve been with the company for almost 5 years (which would have given me a gumball machine) and I have to say that I do not regret a single moment. So yeah, I quit! Anybody for a Hot Piece of Engineer/Evangelist? So yeah, another Yahoo jumps the ship – I can already see people talking about talent bleed and all that. To all t
Detecting and displaying the information of a logged-in twitter user Wouldn’t it be cool (and somehow creepy) to greet your visitors by their twitter name, and maybe ask them to tweet a post? It can be really easily done. Check it out yourself: Hello Twitter Demo Update: this is not working any longer. Twitter have discontinued this functionality because of the phishing opportunities it posed. Thi
Simply add the script to the end of the body and it’ll convert all tables with a class called “tochart”. You can define the size (widthxheight) and the colour as a hexadecimal triplet as shown in this example. If you leave size and colour out, the script will use presets you can alter as variables in the script itself. What about data tables from charts? As Victor of the Yahoo! Accessibility group
This was part of my presentation at the Open Hack Day in India and I just got the time to write it up. Here you’ll learn how to get Flickr photos into your JavaScript solutions without having to resort to using the full API. As this is a hack you will only get the latest 20 photos, if you need more detailed data like restricted to sets or more at once you’ll need to resort to the flickr API. I men
Dude, check this out This does not throw a syntax error. First one to see through my crazy trick can take a cookie from the jar in the kitchen! The cookie goes to Matthew (check the comments). Explanation: You can set labels in JavaScript (as explained in an earlier post) by adding a colon to a name, and all a URL does is create a label with the name ‘http’. As the double slash is following the co
Return of the HTTP overhead delay – this time without a server side component Following my post yesterday about delaying the loading of avatar images to cut down on HTTP requests I was wondering if there is a way to do this without having to resort to a server side solution. In short, there is. Check out the demo page to see the script in action, and download delayHTTPoverhead.js to use in your ow
Thinking lowsrc – how to make sites appear to be available a lot faster *ZOMG Update!*: We put our heads together and came up with a client side solution without a PHP component that does the same as this one explained in detail here. Those of you who’ve been around some years may remember an otherwise forgotten non-standardized HTML attribute called lowsrc. It was supported by Netscape browsers
I’ve just put together a small DOM cheatsheet for some developers here and thought why not share it and CC it in case it can be handy for you, too: Click the screenshot or download the PDF version of the cheat sheet (85KB) here.
Notice: The following is a “best practice document”. You can follow its advice and live happily ever after, but there might be situations where you cannot apply the ideas mentioned within. This is especially the case when you have to maintain an old product or complex web application. You cannot replace everything in those in one go – as you are very lucky indeed if you get the time and budget – b
このページを最初にブックマークしてみませんか?
『Christian Heilmann』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く