The 147 CSS3 Color Module color keywordsMonday, 14. Apr 2014
I use CodePen a lot for testing little things or getting to the bottom of a problem. Often I just need to color some divs or the like and I always fall back to using
green or simple hex codes like
Recently I couldn’t take it anymore. Even though these are often only temporary pens I want them to please my eye at least a little bit. I remembered that there were some more predefined color names that one could use. What I found out was that there are actually 147 color keywords defined in the CSS3 Color Module. Pretty impressive.
I created a CodePen showing them off so I can go there and grab a nice color next time I need one.
See the Pen 147 CSS3 Color Module color keywords by Martin Wolf (@martinwolf) on CodePen.
Somehow I managed to not show you the photos I took last year while Tatjana and I were in the Harz Mountains. We went there on vacation in autumn.
So over the next couple of days I will post the photos in journal style. Always one day at a time. Enjoy!(more…)
Geschichten aus Ghana TrailerSunday, 13. Apr 2014
Ich poste hier ja nicht mehr all zu viel fremden Inhalt, aber für den Trailer zum Film “Geschichten aus Ghana” muss ich da mal eine Ausnahme machen. Bereits die wenigen Szenen haben mich irgendwie berührt und ich freue mich auf Mai, wenn sowohl das Buch Logbuch Ghana von Steffen erscheinen wird wie auch der begleitende Film von Dokumentarfilmer Valentin Schüle.
Weekly RecapSunday, 13. Apr 2014
It’s already sunday again, so here I am bringing you a bunch of hot links gathered over the past week. It’s a nice mix of technical posts and articles about meta topics concerning developers.
Your Home Town Needs You
Maybe Silicon Valley or Brooklyn doesn’t need another you. Maybe you even like your home town.
Scroll performance / behavior in Atom Editor
If you are, like me, having trouble with the very fast scrolling in Atom Editor this hack can temporarily fix this for you. I hope they’ll implement some kind of option or just make it behave like all the other apps.
Mark Otto explains why Frameworks are not to blame for the problems of modern designers and developers.
Having trouble debugging your CSS layout? This little tool could help you.
How To Be A Great Developer
Very good advice.
Fox fox’s sake!
Christian Heilmann about what it’s like to work at Mozilla. Sounds like an awesome place to be.
If you are doing a lot of work with touch events, this small jQuery plugin might save your day.
Rethinking What We Mean by ‘Mobile Web’
Whether you use a browser or an app. It’s all the web. Very good article by John Gruber.
Ethan Marcotte on how responsive web design came about
A conversation with Ethan Marcotte about responsive design and his career.
Unleash the force of html5 apps – or why html5 apps aren’t that bad.
Good article summarizing the differences between HTML5 and native apps. I have to agree but I don’t think that is example app at the end is particularly good. Or at least it has a lot of little nuances that I think are distracting and don’t have to be there – or shouldn’t be there.
Twitter rolls out new facebook-like profiles
Here, have a few examples of Twitter's new web profiles: https://t.co/awV2NLZrsM https://t.co/fYkexzCp2c https://t.co/DsUZ4jr1FL— Marcel Wichmann (@UARRR) April 8, 2014
Open new iTerm2 tab in current directoryThursday, 10. Apr 2014
While I work on a project I usually need two iTerm tabs. One to start and monitor my grunt tasks and one for doing git. So every time I start working I have to navigate to a folder two times.
So I searched for a way to open a new tab with the current directory but didn’t find anything. (Yes, for most projects I have an alias, but it’s still more “work”.)
But what I did find instead was an option to always open a new tab with the current directory. And that’s all I need.
Preferences -> Profiles -> General and under
Working Directory choose
Reuse previous session's directory.
Using and clearing the Browser AppcacheMonday, 07. Apr 2014
I’m currently experimenting with the HTML 5 App Cache. It’s important to know that the HTML5 appcache is different from the normal browser cache. Basically you link a manifest appcache file in your html which has instructions on which files the browser should cache and which it should always load new.
<html manifest="cache.appcache"> Your site goes here. </html>
Example contents of a cache manifest:
CACHE MANIFEST # These files will be explicitly cached CACHE: index.html css/styles.min.css js/scripts.min.js img/logo.svg # All other files require the user to be online NETWORK: *
In my recent experience the cache works very well, sometimes even too well. It will delete and cache all files new which are otherwise explicitly cached if you change anything in the cache manifest file. You could for example add a timestamp. But this seems to not always work or be at least a little dogged. So if you want to delete the appcache of Chrome for example manually you can do this by going to
and just delete what you don’t need anymore. It’s also just interesting to have a look at what you already gathered while surfing around the web.
In Safari it’s not that easy, but you can find an explanation on stackoverflow.
To have a look at your caches in Firefox you can go to
But you don’t have the option to delete them there. For that you have can go to Preferences -> Advanced -> Network. Here you find “Offline Web Content and User Data”.
Go ahead and experiment with the HTML5 app cache. It’s pretty cool especially for mobile web apps.
Weekly RecapSunday, 06. Apr 2014
Hello lovely readers. This week was a busy one for me so I didn’t manage to read a lot and thus the list is a little shorter than in the past. But there are still very good articles in here. Have fun!
Bringing Responsive Images to Browsers
We did it, we as a community funded the implementation of
pictureinto blink and webkit.
How Gmail Happened: The Inside Story of Its Launch 10 Years Ago
Very good and interesting long form article on how Gmail came to be.
List of Pseudo-Elements to Style Form Controls
The kind of article that one should bookmark and be happy about when the time comes.
The Values of the Web
An ode to the web community by Brad Frost.
CSS performance revisited: selectors, bloat and expensive styles
A lot of insights into modern CSS performance.
visibility: visible undoes visibility: hidden
Interesting find by Jake Archibald.
Brendan Eich Steps Down as Mozilla CEO
Shortly after becoming CEO, Brendan Eich steps down due to all the things surrounding him supporting an anti-gay marriage campaign financially in the past.
Atom Editor Package: Mobile Preview
This package shows a mobile preview right inside of Atom. I had trouble making the refresh work properly, but it’s a great addition to Atom if it works.