At /gebrüderheitz we use Git as a version control system as we think this is the best to work together on a level which is easy to learn and work with. Before we used Git we’ve used SVN but this is by far not as flexible as Git. There are enough posts gathering the difference between Git and SVN so I will not cover any of these. When working in a team it’s important to keep your different stages of development in sync and control somehow: There is a front-end development going on which is in deep connection with the
Christian “Schepp” Schaefer shows how to use the new filter-properties for CSS3 and combine them with methods implemented by most modern browsers. This article was first published in German on December 19th 2011.
Some weeks ago I made a pull request for HTML5Boilerplate which should update jQuery to the latest version available on the Google CDN. How ever I copied the old version of minified jQuery because the uncompressed version was available but the minified wasn’t. Stupid thing! That’s why I created Is Mothereffin’ jQuery up? The service checks three major CDNs for the availability of the latest jQuery version. View Is Mothereffin’ jQuery up? How to Check if the File is up I had some difficulties to find the right method how to detect if a file is already available with JavaScript.
There is a big discussion going on at the moment covering the actual point of how to deal with images and media et al. on mobile-phones and other devices as there are some things that don’t work as on a desktop computer: Bandwidth Screen size Performance / Velocity The question is how to deliver responsive images on a mobile website. You maybe use something like img { max-width: 100%; height: auto; } in your responsive design to prevent images from being bigger then the screen of a mobile device. In most of the cases this shrinks images in its displayed
Somehow… <time> Disappeared As you might have heard the <time>-element was removed from the HTML5 specification last saturday by Ian “Hixie” Hickson, the editor of the spec. Hixie decided to remove <time> and replace it by the more general <data>-element. A question that came up: Why got<time> removed and why did nobody stop Hixie? Well: There was a discussion on the bug-tracker about replacing <time> with <data>. But nothing about it on the mailing-list and stuff… and Hixie decided to drop <time> and replace it by the power he has as the editor. Not only <time> was removed from the specification but
Lea Verou publishes some really great stuff. Her latest work is Animatable. A tool to showcase the variety of things you can do with CSS3 animations. And it’s awesome. Some weeks ago I had this article about rotating images like I use in the footer of this page. There is an animation in Lea’s demos that makes use of the same properties. You will find some nice cutting edge CSS3-techniques in the demos so make sure to check out the source-code on GitHub. You can also contribute and check in a pull request if you want to. Edit: And by
We’re doing a project these days where we use an accordion-menu to show some content. I want to share with you how I did this using jQuery and CSS. This is pretty easy and I want to encourage you not to use any plugin or so but to write the code yourself and learn a bit more about how to use CSS and jQuery and save some microseconds on your loading type. The HTML This is kinda straightforward I think. We don’t need a wrapper for the accordion-menu. Check it: <section id="experts" class="accordion-item"> <h1><a href="#experts">Experts</a></h1> <div class="content"></div> </section> This is
The CSS3-spec is full of wonderful things. Sometimes things that are not so desperately needed as others but anyway… good to have them. One of these more or less needed properties might be resize. It is part of the CSS3 Basic User Interface Module. What is really useful with resize is the ability to restrict the resizing of textarea for example. But it is possible to resize every element you’d like to as this demo by Simurai shows. There are four values for resize that are kinda logical: none: no resizing at all horizontal: resizing only horizontal vertical: resizing only…
Sorry for this german post. For more information on this topic please check out the post “Where Are My Rounded Corners?”. Thanks to Daniel and Steffen at /gebrüderheitz. Manchmal sind unsere Kunden verwirrt, wenn sie sich ihre neue Website im Browser anschauen und sie anders aussieht, als das Design, dass sie freigegeben hatten. In diesem Merkblatt erklären wir, warum es viele Vorteile gibt, diese Unterschiede zu akzeptieren und dass diese Vorteile die Nachteile überwiegen. Lange Zeit haben wir die Gestaltung von Websites so gehandhabt, als ob es Printmedien seien. Hier findet nun ein Umdenken statt, denn das Internet unterscheidet sich
Some weeks ago Paul Irish published his article about TAFEE (Tiered, Adaptive Front-end Experiences) and shares Paul Boag’s booklet called “Where are my rounded corners?” which tries to describe why it is better to design for the future and modern browsers and not spending too much time trying to get the website’s design working in older browsers (namely Internet Explorer 7 and 8). The booklet was originally published in Paul Boag’s blog. Paul describes why he did this this: One of the biggest areas of confusion among our clients is progressive enhancement. They wonder why the beautiful design they signed off