10. Skalierung mit % und em
line-height
1.66
body {
font-size: 100%; /* 100% ~ 16px */
line-height: 1.4; /* Web > Print */
/* eingeschlossen
p
*/
}
( p {
font-size: 1.125em; /* 100% ~ 18px */
line-height: 1.5; /* p != body */
} )
h1, h2, h3, h4, h5, h6 {
line-height: 1.2; /* h < p */
}
11. Skalierung mit % und em
line-height
1.08
body {
font-size: 100%; /* 100% ~ 16px */
line-height: 1.4; /* Web > Print */
/* eingeschlossen
p
*/
}
( p {
font-size: 1.125em; /* 100% ~ 18px */
line-height: 1.5; /* p != body */
} )
h1, h2, h3, h4, h5, h6 {
line-height: 1.2; /* h < p */
}
12. Skalierung mit % und em
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
line-height
body {
line-height: 1.4
}
@media screen and (min-width: 48em) {
body {
line-height: 1.5
}
}
@media screen and (min-width: 80em) {
body {
line-height: 1.6
}
}
13. Skalierung mit % und em
Schriftform
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
When we design we generally do so in two dimensions –
length and width. They are the physical constraints of what
our technology is currently capable of. Our dimensional
restraints are then realised on the devices used to experi
body {
font-size: 100%;
line-height: 1.4
}
26. When we design we generally do so in two 32
dimensions — length and width. They are
the physical constraints of what our technology is currently capable of. Our dimensional restraints are then realised on the devices used to 49
experience our design. Beyond the two dimensional screen
exists the third dimension (and many other theorised di45
mensions) — the physical space in which our designs ex-
Zeilenlänge
- 75 Zeichen pro Zeile
ist beyond the canvas. Here, all sorts of physical parameters affect how 61
a person uses our design. Consider the user’s physical space around them
— perhaps they are lying on their side on the sofa or in bed and holding
a mobile device with one hand. Can the design be enjoyed when a user’s
is physically restricted from using two hands? Luke Wroblewski further elaborates on this 77
idea in his Testing One Thumb, One Eyeball article detailing the test procedure for Polar. When we design we generally do so in two dimensions — length and width. They are
the physical constraints of what our technology is currently capable of. Our dimensional
86
restraints are then realised on the devices used to experience our design. Beyond the two dimensional
screen exists the third dimension (and many other theorised dimensions) — the physical space in which
our designs exist beyond the canvas. Here, all sorts of physical parameters affect how a person uses our
design. Consider the user’s physical space around them — perhaps they are lying on their side on the
29. Sans Slab Serif
Alegreya (serif)
Andada (slab)
Bitter (slab)
Droid Sans
Droid Serif
Gentium (serif)
Yanone Kaffeesatz (sans)
Lato (sans)
Open Sans Condensed
Open Sans
PT Sans Narrow
PT Sans
PT Serif
Source Code Pro (slab mono)
Source Sans Pro
Ubuntu Condensed (sans)
Ubuntu (sans)
Vollkorn (serif)
Joomla! Testing
Thanks for helping us to test Joomla!
We're getting ready for the release of Joomla 3.0 and
we appreciate you helping us find and fix problems as we
work.
If you haven't done testing before here are some tips.
• Don't delete the installation folder when you finish installing! While we're working we turn …
Joomla! Testing
Thanks for helping us to test Joomla!
We're getting ready for the release of Joomla 3.0 and
we appreciate you helping us find and fix problems as
we work.
If you haven't done testing before here are some tips.
• Don't delete the installation folder when you finish
installing! While we're working we turn …
30. Sans Slab Serif
Alegreya (serif)
Andada (slab)
Bitter (slab)
Droid Sans
Droid Serif
Gentium (serif)
Yanone Kaffeesatz (sans)
Lato (sans)
Open Sans Condensed
Open Sans
PT Sans Narrow
PT Sans
PT Serif
Source Code Pro (slab mono)
Source Sans Pro
Ubuntu Condensed (sans)
Ubuntu (sans)
Vollkorn (serif)
Joomla! Testing
Thanks for helping us to test Joomla!
We're getting ready for the release of Joomla 3.0
and we appreciate you helping us find and fix problems as we work.
If you haven't done testing before here are some
tips.
• Don't delete the installation folder when you …
Joomla! Testing
Thanks for helping us to test Joomla!
We're getting ready for the release of Joomla 3.0 and
we appreciate you helping us find and fix problems as
we work.
If you haven't done testing before here are some tips.
• Don't delete the installation folder when you finish installing! While we're working we turn …
45. /*! Copyright (c) David Bushell | http://dbushell.com/ */
(function (g, h, c) {
var d = function (m) {
return m.trim ? m.trim() : m.replace(/^s+|s+$/g, "")
};
var e = function (m, n) {
return(" " + m.className + " ").indexOf(" " + n + " ") !== -1
};
var f = function (m, n) {
if (!e(m, n)) {
m.className = (m.className === "") ? n : m.className + " " + n
}
};
var k = function (m, n) {
m.className = d((" " + m.className + " ").replace(" " + n + " ", " "))
};
var l = function (m, n) {
if (m) {
do {
if (m.id === n) {
return true
}
if (m.nodeType === 9) {
break
}
} while ((m = m.parentNode))
}
return false
};
var j = h.documentElement;
var i = g.Modernizr.prefixed("transform"), b = g.Modernizr.prefixed("transition"), a = (function () {
var m = {WebkitTransition: "webkitTransitionEnd", MozTransition: "transitionend", OTransition: "oTransitionEnd otransitionend", msTransition: "MSTransitionEnd", transition: "transitionend"};
return m.hasOwnProperty(b) ? m[b] : false
})();
g.App = (function () {
var p = false, q = {};
var m = h.getElementById("inner-wrapper"), o = false, n = "js-nav";
q.init = function () {
if (p) {
return
}
p = true;
var r = function (s) {
if (s && s.target === m) {
h.removeEventListener(a, r, false)
}
o = false
};
q.closeNav = function () {
if (o) {
var s = (a && b) ? parseFloat(g.getComputedStyle(m, "")[b + "Duration"]) : 0;
if (s > 0) {
h.addEventListener(a, r, false)
} else {
r(null)
}
}
k(j, n)
};
q.openNav = function () {
if (o) {
return
}
f(j, n);
o = true
};
q.toggleNav = function (s) {
if (o && e(j, n)) {
q.closeNav()
} else {
q.openNav()
}
if (s) {
s.preventDefault()
}
};
h.getElementById("nav-open-btn").addEventListener("click", q.toggleNav, false);
h.getElementById("nav-close-btn").addEventListener("click", q.toggleNav, false);
h.addEventListener("click", function (s) {
if (o && !l(s.target, "nav")) {
s.preventDefault();
q.closeNav()
}
}, true);
f(j, "js-ready")
};
return q
})();
if (g.addEventListener) {
g.addEventListener("DOMContentLoaded", g.App.init, false)
}
})(window, window.document);
46. about
1961
geboren in München-Pasing
Akademie der Bildenden Künste München
Prof. Sir Eduardo Paolozzi
Prof. Heribert Sturm
seit 1990
Kunstlehrer am Gymnasium
1996–2003
Deutsche Schule Lima / Peru
www.adhocgrafx.de
@adhocgrafx
47. seit 2009 > Joomla!
e-learning Plattform für den Kunstunterricht
www.kunstimunterricht.de
seit 2013 powered by tec-promotions.de
seit 2011 > responsive web design
JoomSkeleton, JoomFluid und JoomFlex
https://github.com/adhocgraFX
