Bildschirmfotos mit dem Firefox

Mit dem Firefox lassen sich schnell Bildschirmfotos von Webseiten erstellen. Die Konsole des Firefox bietet eine sehr praktische Funktion, mit der schnell und einfach Bildschirmfotos von kompletten Webseiten erstellt werden können.

Bildschirmfoto mit dem FirefoxMit der Option --chrome wird die aktuelle Browseransicht festgehalten

Über die Tastenkombination Shift+F2 lässt sich die Konsole einblenden. Gibt man dort Folgendes ein und bestätigt die Eingabe, wird ein Bildschirmfoto mit dem Namen ›test-foto.png‹ der kompletten Webseite erstellt:

screenshot test-foto --fullpage

Über help screenshot kann ein Hilfemenü aufgerufen werden, dass die unterschiedlichen Möglichkeiten erläutert.

Diese Funktion ist aus meiner Sicht dann sehr hilfreich, wenn Bildschirmfotos einer kompletten Webseite und nicht nur des dargestellten Ausschnitts in einer bestimmten Fensterbreite benötigt werden.

Archiv erstellen und verschlüsseln

zip-Archiv

Immer wieder möchte ich einer Kundin oder einem Kunden ein Archiv mit Dateien zu einem Projekt zur Verfügung stellen. Meist handelt es sich dabei um Dateien die sich nicht frei im Internet herumtreiben sollten. Aus diesem Grund bevorzuge ich es – immer mehr – Archive zu erstellen die durch ein Passwort geschützt sind. Dies kann einerseits mit Programmen wie »Rucksack« erreicht werden. Doch wer einmal auf den Geschmack gekommen ist das Terminal seines Rechners zu benutzen, kann einen solchen Vorgang sehr einfach ohne ein weiteres Programm durchführen.

Folgender Befehl erstellt ein Archiv aus den Dateien eines Ordners und schützt es mit einem Passwort:

$ zip -erj Pfad-zum-zip-Archiv Pfad-des-Ordners-der-gepackt-werden-soll
  • e steht für encrypt – das Archiv wird verschlüsselt, und kann nur durch Eingabe des Passworts entpackt werden
  • r steht für recurse-paths – alle Dateien des Ordners sollen zu einem Archiv hinzugefügt werden
  • j steht für junk-paths – der Pfad zum Ordner wird nicht gespeichert

Im Terminal sieht der gesamte Vorgang so aus:
Zip-Archiv im Terminal erstellen

-erj ~/Desktop/ordner.zip ~/Desktop/ordner

Der Befehl meines Beispiels enthält die eben beschriebenen Variablen und erstellen auf dem Schreibtisch ein Archiv das alle Dateien des Ordners »ordner« enthält der sich ebenfalls auf dem Schreibtisch befindet.

Das Passwort mit dem das Archiv geschützt werden soll muss zweimal eingegeben werden, und wird im Terminal nicht sichtbar wiedergegeben.

Meistens stelle ich einen Ordner von Dateien zusammen bevor ich ein Archiv erzeuge, dies ist jedoch nicht obligatorisch, es lassen sich auch verschiedene Dateien zu einem Archiv zusammenfügen. Standardmäßig bleibt der Pfad des Ordners im Archiv erhalten, was ich jedoch nicht möchte, weshalb es mir wichtig war mit j den Pfad nicht mit zu speichern und lediglich den Inhalt des Ordners in meinem Archiv zu behalten.

Klickt die Empfängerin schließlich auf das Archiv wird sie aufgefordert das Passwort einzugeben um am die Daten zu gelangen.

Das Passwort eingeben

Nach Eingabe des Passworts entpackt sich das Archiv wie gewohnt und die Daten stehen der Person zur Verfügung, die über das Passwort verfügt.

-
Eine ausführliche Beschreibung der Funktionen finden sich auf den Seiten des Mac OS X Handbuchs.

E-Mails verschlüsseln

Irgendwo habe ich kürzlich gehört, dass die Kommunikation über E-Mail ungefähr so privat ist wie eine Unterhaltung in einem vollbesetzten Bus. E-Mails fühlen sich – oder sollte man hier besser in der Vergangenheitsform schreiben – fühlten sich so sicher an wie ein Brief, während sie unverschlüsselt eher einer Postkarte glichen. Die aktuellen Vorkommnisse und die bisher sture Haltung unserer Regierenden etwas Klarheit in die gezielte Bespitzelung zu bringen, motivierten mich dazu im Urlaub etwas mehr über verschlüsselte Kommunikation nachzudenken. Ein Ergebnis dieses Nachdenkens ist die Kommunikation mit verschlüsselten E-Mails.

Kommunizieren zwei Personen über verschlüsselte E-Mails miteinander, findet die Verschlüsselung und das Entschlüsseln mit den jeweils eigenen Schlüsseln der Personen auf deren Gerät, also nicht auf irgendeinem Server, statt. Um so miteinander kommunizieren zu können bedarf es eines Schlüssels. Es gibt zwei gängige Schlüssel OpenPGP und S/MIME.

Beiden Methoden habe ich nun getestet, und mich dann dafür entschieden hauptsächlich S/MIME zu verwenden, da diese Verschlüsselungsmethode etwas einfacher im Zusammenspiel von Mac-Mail und der Mail-App auf den iOS-Geräten zu verwenden ist. Hat man einmal die Zertifikate installiert und aktiviert, lassen sich die Nachrichten bequem im jeweiligen Programm lesen, schreiben, verschlüsseln und entziffern. Und da ich gerne sowohl auf dem Rechner als auch auf den mobilen Geräten in der Lage sein will verschlüsselt zu kommunizieren erscheint mir S/MIME momentan als passendere Möglichkeit.

Wie geht das eigentlich?

Wie man an einen Schlüssel kommt und das Ganze dann auf den Geräten mit dem Apfel einrichtet erfährst Du in diesem guten Artikel von Sebastian Düvel auf t3n.de, er beschreibt darin detailliert wo ein S/MIME-Schlüssel zu bekommen ist, und wie die Mail-Programme auf dem Mac und den iOS-Geräten einzurichten sind um verschlüsselte Nachrichten empfangen und versenden zu können.

Kleiner Tipp

Mit den GPGtools ist es möglich die Standard-Methode zur Verschlüsselung/Signierung auszuwählen. Soll in Mac-Mail standardmäßig nicht mit OpenPGP sondern S/MIME verschlüsselt werden, kann dies über folgende Zeile im Terminal eingestellt werden:

defaults write org.gpgtools.gpgmail DefaultSecurityMethod -int 2

Quelle: GPGMail 2 hidden settings

Verschlüsselt mit mir kommunizieren

Über meine übliche Adresse daniel@depone.de kann verschlüsselt kommuniziert werden. Gerne kannst Du mich entweder mit einer S/MIME oder OpenPGP signierten E-Mail anschreiben, dann können wir die Schlüssel austauschen und fortan verschlüsselt kommunizieren. Meinen öffentlichen OpenPGP-Schlüssel findest Du hier.

Vertrauen und Grundrechte

In seiner Kolumne auf SPON verdeutlicht Sascha Lobo eindrücklich, dass es bei #PRISM und Ähnlichem um weit mehr geht als die bewusste "Abhörung" der Bevölkerung. Es geht um die Grundrechte.

Es geht bei diesem Grundrechte-Skandal nicht um konservative oder progressive Einstellungen und auch nicht mehr um die Abwägung zwischen Sicherheit und Freiheit. Die ausufernde Spionagemaschinerie ist keine Krise des Internets, sondern eine Krise der Demokratie, die sich am Internet entzündet hat.

Sascha Lobo, Wer lesen kann, kann auch schreiben.

Wie der Titel schon deutlich macht ist der Weg von Lesen zum Schreiben, also vom "Abhören" zur Manipulation der Daten nicht weit. Zieht man die technischen Möglichkeiten alle Bewegungen im Wohnraum per WLAN aufzuzeichnen, was an WiSee deutlich wird, mit ein, verstummt wahrscheinlich auch das Letzte "ich habe nichts zu verbergen".

Ich wünsche mir eine Verwandlung des Misstrauens der Mächtigen, in ein vertrauensvolles Miteinander. Dafür aber brauchen wir wohl eine andere Gesellschaft, und auf dem Weg dorthin klarere Reglementierungen und Transparenz dessen was Regierungen und ihre (Geheim-)Dienste dürfen.

Hinter den Kulissen

Für die meisten Nutzerinnen und Nutzer von Webseiten arbeiten die ›Rendering Engines‹ der Browser unbemerkt. Sie kümmern sich hinter den Kulissen darum, dass die Webseite im Browser der Wahl sauber angezeigt wird und ordentlich benutzt werden kann.

Im Februar sorgte eine Information aus der CSS-Arbeitsgruppe des W3C für einige Aufmerksamkeit. Daniel Glazmann führte in seinem bekannten Blogeintrag aus, dass einige Browserentwickler überlegten das -webkit-Prefix einzuführen, da es eine (zu) große Anzahl von Webseiten gab, die sich nicht um die Prefixe anderer Browser scherten und lediglich für -webkit- entwickelten. Mit der Ankündigung von Opera zukünftig auch auf WebKit zu setzen schien dieser Trend noch weiter unterstützt zu werden.

Gestern veröffentlichte allerdings das Entwickler-Team von Chrome, dem hauseigenen Browser von Google, einen Blogeintrag, in dem sie darüber sprachen, in Zukunft eine neue Rendering-Engine einzusetzen. Diese Engine hört auf den Namen ›Blink‹ und verfolgt folgende Mission: »To improve the open web through technical innovation and good citizenship«.

Bei Blink handelt es sich um einen WebKit-Fork, weshalb in naher Zukunft nicht mit großen Abweichungen von WebKit zu rechnen sein wird, was sich im Laufe der Zeit jedoch ändern könnte.

Im eben erwähnten Blogeintrag des Chrome-Entwicklerteams heißt es:

»… we believe that having multiple rendering engines—similar to having multiple browsers—will spur innovation and over time improve the health of the entire open web ecosystem.«

Quelle: The Chromium Blog – Blink: A rendering engine for the Chromium project

The Verge bringt noch folgenden Aspekt ins Spiel:

»Most interesting of all is what this could mean for Google — it currently is trying to gain traction with Chrome OS, which of course is based almost entirely on the Chrome browser. A more powerful rendering engine could mean more powerful and useful apps within Chrome OS.«

Quelle: The Verge, Google forks WebKit with new Blink rendering engine for Chrome

Auch wenn sich zunächst „gefühlt“ nicht viel ändern wird, könnte diese Entscheidung dazu führen, dass die befürchtete Konzentration auf -webkit- nicht weitergehen wird, und somit Webseiten bewusst plattform- und browserübergreifend entwickelt werden.

Favicon

Jonathan T. Neal geht in seinem Blog der Frage nach wie eine Webseite am Besten mit einem Favicon versorgt wird. Hier geht’s zu seinem Artikel ›Understanding the Favicon‹.

Bevor wir uns den technischen Fragen nähern, hier eine kurze Definition des Begriffes ›favicon‹ aus der Wikipedia:

Ein Favicon (kurz für favorite icon, engl. für Favoriten-Symbol) ist ein kleines, 16×16 oder 32×32 Pixel großes Icon, Symbol oder Logo, das unter anderem in der Adresszeile eines Browsers links von der URL angezeigt wird und meist dazu dient, die zugehörige Website auf wiedererkennbare Weise zu kennzeichnen.

Quelle: Wikipedia: Favicon

Ursprünglich war das Favicon für die Ausgabe in Browsern vorgesehen, mittlerweile kommt es jedoch auch auf den Startbildschirmen von Smartphones und unter Windows 8 häufig vor, was die Frage nach Größe und Möglichkeiten der Einbindung aufwirft.

Es bietet sich daher an, ein Favicon in unterschiedlichen Größen anzubieten. Mittlerweile halte ich die Verwendung von „klassischen” Favicons in 32×32 Pixeln und für den Einsatz auf Startbildschirmen 144×144 Pixel oder 241×241 Pixel für sinnvoll. Das wären dann 4 Dateien:

  • 32×32 Pixel – png und ico (klassische Favicons)
  • 144×144 Pixel – png (transparenter Hintergrund, für Windows 8)
  • 241×241 Pixel – png (Apple-Touch-Icon)

Diese Icons sollten laut des eingangs erwähnten Artikels folgendermaßen eingebunden werden:


<link rel="apple-touch-icon" href="path/to/touchicon.png">
<link rel="icon" href="path/to/favicon.png">
<!--[if IE]><link rel="shortcut icon" href="path/to/favicon.ico"><![endif]-->
<!-- or, set /favicon.ico for IE10 win -->
<meta name="msapplication-TileColor" content="#D83434">
<meta name="msapplication-TileImage" content="path/to/tileicon.png">
    

Da der IE10 keine Conditional Comments mehr annimmt, sollte zusätzlich zu diesen Angaben ein favicon.ico im Root-Verzeichnis der Webseite liegen. Auf den Startbildschirmen der iOS-Geräte gibt es die Möglichkeit die Icons entweder mit Überlagerungen darstellen zu lassen, oder durch den Zusatz -precomposed unverändert.

Weitere Artikel zum Thema:

Tools

Demonstration im Internet

Seit etwas mehr als einer Woche finden sich auf Twitter Nachrichten, die mit dem Hashtag #aufschrei versehen wurde. Mit diesem Hashtag sollen der alltägliche Sexismus und Übergriffe gegen Frauen auf unterschiedlichsten Ebenen sichtbar gemacht werden. In seiner Kolumne »Mensch-Maschine« hat Sascha Lobo etwas zur Bedeutung von Hashtags auf die öffentliche Meinungsbildung geschrieben, und sie mit der Bedeutung von Demonstrationen verglichen:

Die sozialen Medien sind die digitale Straße, und dort können Hashtags zu Internetdemonstrationen werden. Wie bei ihren nicht-digitalen Vorbildern wird durch die schiere Größe der digitalen Versammlung sichtbar, was den Leuten wichtig ist, aber unterpubliziert erscheint.

Quelle: Sascha Lobo – Die Mensch-Maschine: #digitaleöffentlichkeit – S.P.O.N.

Die öffentliche Sichtbarkeit dieses Filtermechanismus spricht aus meiner Sicht für das Medium Twitter, gerade im Vergleich mit Facebook oder Google+. Twitter scheint mir für eine solche Art der Kommunikation weitaus besser geeignet zu sein, als die auf Pinnwände und Ähnliches konzentrierte Netzwerke.

Mit diesem Eintrag möchte ich nur kurz auf die technische Seite dieses Hashtags hinweisen, inhaltlich habe ich mich hier kurz darauf bezogen.

Netzgemüse

In ihrem Buch »Netzgemüse, Aufzucht und Pflege der Generation Internet« schreiben Tanja und Johnny Haeusler unaufgeregt, sachlich und mit einer angenehmen Prise Witz über das Leben mit Heranwachsenden und dem Internet.

Netzgemüse

Tanja und Johnny, die unter anderem durch ihr Blog spreeblick.com bekannt sind, wenden sich mit diesem Buch vor allem an Eltern und andere, die mit der Erziehung von Kindern und Jugendlichen betraut sind. Die beiden sind selbst Eltern zweier Söhne, und sowohl technik- als auch internetaffin. Hier schreiben also zwei Personen, die sowohl das Internet aus ihrer Sicht, aber auch aus dem alltäglichen Umgang ihrer Heranwachsenden damit kennen. Diesen Erfahrungsschatz stellen sie in diesem Buch den geneigten Leserinnen und Lesern zur Verfügung. Anhand einiger Stichworte möchte ich hier kurz darüber schreiben.

Vertrauensvoll

Tanja und Johnny schreiben aus einer vertrauensvollen Perspektive. Sie vertrauen ihren Söhnen, auch im Umgang mit Computer und Internet, und das spürt man an unzähligen Stellen im Buch. Diese vertrauensvolle Perspektive steckt an, und lädt dazu ein, einen partnerschaftlichen Umgang der Eltern mit ihren Kindern, auch im Umgang mit Computer und Internet, zu pflegen.

Keine Panik!

Aus diesem Vertrauen, und dem eigenen Wissen um das Internet, seiner schönen und hässlichen Seiten, resultiert eine Haltung, die nicht von Panik, aber dennoch mit bedacht vorgeht. Am Anfang des Buches vergleichen sie das Internet mit Bielefeld, und sprechen darüber, wie wichtig es ist sich in einer Stadt auszukennen, um unbehelligt darin leben zu können.

Selbstverständlichkeit

Das Internet ist eine Selbstverständlichkeit. Unsere Kinder zweifeln an der Funktionsfähigkeit eines Computers, wenn dessen Verbindung zum Internet gestört ist. Für sie ist der Zugriff auf das Internet so selbstverständlich wie für uns das Wasser aus dem Wasserhahn. Unsere Kinder wachsen selbstverständlich mit dem Internet auf. Wir erinnern uns noch an unsere ersten E-Mail-Adressen (zu Beginn des Studiums), für unsere Kinder gab es keine Zeit ohne Internet.

Verspielt

Wir machten unsere ersten Schritte im Internet als wir bereits Autofahren konnten – so alt sind wir schon – unsere Kinder machen ihre ersten Schritte auf dem Boden der Tatsachen und im Internet, beinahe Gleichzeitig. Daher begegnen sie dem Internet verspielt. Sie sehen sich Videos auf YouTube an, die wir für reine Zeitverschwendung halten, lernen dabei aber die unglaublichsten Dinge. Sie bedienen das Adressfeld des Browsers oder das Suchfenster von Google mit einer Leichtigkeit und auf gut Glück, dabei finden sie Perlen und Steine.

Natürlichkeit

Tanja und Johnny berichten von der Versiertheit ihrer Söhne im Umgang mit den unterschiedlichen Geräten, Webseiten und Spielen. Sie berichten davon, dass wir von unseren Kindern jede Menge Kniffe lernen können, die sie sich nebenbei erwerben, und die für sie selbstverständlich sind. Unser Kinder sind flink, sie lernen schnell mit dem Medium Internet umzugehen, intuitiv wissen sie, dass die Antwort auf das Internet das Internet selbst ist. Bei einer Herausforderung beginne sie nach der Lösung im Internet zu suchen, und entwickeln schnell einen Riecher für die richtige Fährte.

Sozialkompetenz und Lebenserfahrung

Unsere Kinder gehen versierter mit den technischen Neuerungen um als ihre älteren Begleiter, wir jedoch haben mehr Lebenserfahrung und dadurch hoffentlich auch etwas mehr Sozialkompetenz. Unsere Aufgabe und Verantwortung ist es, nach Tanja und Johnny daher, unsere Kinder auch im Internet in diesen Punkten zu unterstützen.

Positiver Realismus

Die beiden Autoren schreiben hier mit einem positiven Realismus. Sie beschönigen weder die hässlichen Ecken des Internets und den Umgang damit, noch malen sie den Teufel an die Wand und sehen überall nur Gefahren. Aus meiner Sicht finden sie in dem Buch eine sehr gute Balance, die auf ermutigende Weise einlädt mit den anvertrauten Kindern einen guten Umgang mit dem Internet zu erlernen. Sie geben sowohl praktische Tipps, sei es im Umgang mit YouTube und Facebook, als auch Hinweise zur Einstellung des Routers. Zwischen diesen hilfreichen Tipps erzählen sie augenzwinkernd eigene Erlebnisse und lassen ihre Haltung den Heranwachsenden und dem Internet gegenüber durchscheinen.

Das Buch »Netzgemüse, Aufzucht und Pflege der Generation Internet« ist ein sehr gelungenes Handbuch, dass uns Eltern dazu einlädt das Internet gemeinsam mit unseren Kindern (neu) zu entdecken, und in einer vertrauensvollen Haltung mit unseren Kindern gemeinsam die richtigen Schritte zu gehen. Aus diesem Grund empfehle ich die Lektüre allen, die mit der Erziehung von Heranwachsenden betraut sind.

Auf netzgemüse.de finden sich weitere Informationen zum Buch, und hier kann ein Auszug aus einem Kapitel des Buches gelesen werden.

Welche Inhalte veröffentlichen?

Bei einem Gespräch über die Content-Strategie einer Webseite streiften wir kürzlich die Frage welche Inhalte das Licht der Öffentlichkeit erblicken sollten, und welche nicht.

Entscheidungen darüber, welche Inhalte ohne Rücksprache mit Personen die darin vorkommen, veröffentlicht werden können, folgen meiner Ansicht nach am Besten der Abwägung in welchem Rahmen sie stattgefunden haben. Hatte die erwähnte Begebenheit einen öffentlichen Charakter, ändert sich der Rahmen durch die Veröffentlichung nicht. Liegt jedoch eine Begebenheit zu Grunde, die in privaterem Rahmen stattfand, empfiehlt sich eine Rücksprache mit den betreffenden Personen.

In einem Artikel zu Straßenfotografie las ich vor einiger Zeit, dass der betreffende Fotograf, dessen Namen mir momentan leider entfallen ist, darauf achtet, dass Menschen von denen er Fotos veröffentlicht darauf nicht unvorteilhaft aussehen. Ich finde das zusätzlich zu oben gesagtem eine gute Faustregel für die Veröffentlichung von Inhalten.

Welchen Faustregeln folgt ihr?

Suchfelder im mobilen Safari

Heute hatte ich das Vergnügen ein Suchfeld zu optimieren. Nachdem die Firefox-Klippe umschifft war machte ich mich an die Darstellungsgrenzen des Suchfeldes im mobilen Safari. Bisher nahm ich immer (kleine) Hintergrundbilder zu Hilfe um die Schattierungen des Suchfeldes und Farbverläufe des Suchbuttons zu überwinden.

Hintergrundbilder werden durch die Verwendung der appearance-Eigenschaft jedoch obsolet. Die Eigenschaft wird in zwei Fällen eingesetzt:

  • um plattformspezifisches Aussehen zuzuweisen
  • um plattformspezifisches Aussehen zu entfernen

Bei den Suchfeldern wollen wir das Aussehen, welches ihnen von Seiten der iOS-Entwickler zugedacht wurde, entfernen. Dazu kann folgende Zeile verwendet werden:


-webkit-appearance:none;

Sollen nur die inneren Schatten des Eingabefeldes entfernt werden, hilft folgende Zeile:


-webkit-appearance:caret;

Sollen darüber hinaus noch die Rundungen der Ecken zurückgesetzt werden, kann ergänzend zu oben genannten Zeilen der border-radius auf 0 gesetzt werden.

Hier noch zwei Links zu den Artikeln auf die ich mich hier beziehe, und die darüber hinaus auch die appearance-Eigenschaft der Mozilla-Browser behandeln: