8. Jan, 2011
Das Internet ist voller interessanter Dinge und so kann es beim Surfen schnell passieren, dass die Anzahl der geöffneten Tabs jegliche Vorstellungskraft übersteigt. Um nun einige der Themen als Notiz zu speichern, per Email weiterzuleiten oder als Quellenangabe zu verwenden, macht es Sinn, diese als Linkliste auszugeben.
Für solche Fälle gibt es die Erweiterung CopyAllUrls für Firefox und Chrome, die die Links aller geöffneten Tabs ausgibt und einem so die mühevolle Arbeit erspart, dies einzeln per Hand zu erledigen.
Google Chrome-Erweiterung
Nach der Installation ist die Chrome-Erweiterung als Symbol (Regenschirm) eingebunden.
Mit einem Klick werden die Links aller Tabs des jeweiligen Fensters in die Zwischenablage kopiert, wobei als Formatierungsoptionen sowohl reiner Text, als auch HTML, zur Verfügung stehen.
Mozilla Firefox Add-on
Die Installation verläuft unter Firefox ähnlich wie unter Chrome.
Das Add-on wird über das Kontextmenü (Rechtsklick) aufgerufen, wodurch neben der Möglichkeit zum Kopieren, auch die Möglichkeit zum Einfügen der Links aus der Zwischenablage besteht. Auch hier kann man Formatierungsoptionen festlegen, welche jedoch durch den Einsatz von Variablen wesentlich umfangreicher sind und so ein eigenes Markup-Format ermöglichen.
Die Erweiterung lässt sich vielfältig einsetzen, da sie den Umgang mit Links erleichtert und einem viel Arbeit erspart. Einzig eine Einfügen-Funktion wie beim Firefox Add-on, wäre in der Chrome-Erweiterung noch wünschenswert.
Links
21. Aug, 2010
HTML5 ist im Kommen und mit ihm ein modifiziertes Formularelement, das Suchfelder durch Aussehen und Funktion von einem normalen Textfeld abgrenzen soll. Dafür bedient man sich des Attributs type im Element input, in das man search anstatt von text einfügt, sodass der Browser erkennen kann, dass es sich um ein Suchfeld handelt. Das Attribut placeholder bietet dabei einen Platzhalter im Eingabefeld, den man vorher nur mit JavaScript realisieren konnte.
Vorher
<form method="get" id="searchform" action="#">
<fieldset>
<legend>Suche</legend>
<input type="text" name="s" value="Suchbegriff" onfocus="if(this.value=='Suchbegriff')this.value = '';" onblur="if(this.value=='')this.value='Suchbegriff';" />
<input type="submit" value="Suchen" />
</fieldset>
</form>
Nachher
<form method="get" id="searchform" action="#">
<fieldset>
<legend>Suche</legend>
<input type="search" name="s" pattern=".+" required="required" placeholder="Suchbegriff" />
<input type="submit" value="Suchen" />
</fieldset>
</form>
CSS
Eventuell vorhandenes CSS muss natürlich angepasst werden, wofür man folgende Selektoren benutzen kann.
Type: Text
input[type="text"]
Type: Search
input[type="search"]
Weitere Möglichkeiten
Ergänzend bietet sich die Möglichkeit das Suchfeld mit dem Attribut pattern vor dem Absenden auf einen regulären Ausdruck zu prüfen. Da das Suchfeld mindestens irgendein Zeichen enthalten soll, kann man z.B. pattern=".+" angeben. Zusätzlich sollte man noch required="required" setzen, was quasi das gleiche bewerkstelligt. Opera erlaubt dann das Absenden einer leeren Suchanfrage nicht mehr.
Fazit
Ich denke, dass die neuen Attribute sicher in Zukunft das Webdesign vereinfachen werden. Zwar behandeln alte Browser das Suchfeld wie ein Textfeld zuvor, solange die Browser mit den Informationen aber noch unterschiedlich umzugehen, sollte man wohl noch abwarten. Ich habe den Code deshalb nach einer kurzen Testphase erst einmal wieder deaktiviert. Er ware zudem nicht XHTML 1.1 Valid.
Links
7. Aug, 2010
Nicht immer ist es leicht zu einem kleinen Bild aus dem Internet, eine Version in besserer Auflösung zu finden. TinEye versucht sich daran, dies ein bisschen einfacher zu gestalten.
Neben der Möglichkeit, die Suche direkt von der Webseite aus, mit einem Upload oder Link zu starten, steht TinEye auch als Erweiterung für Firefox, Chrome, Safari, Internet Explorer oder für alle Browser auch als Bookmarklet zur Verfügung.
Google Chrome-Erweiterung
Nach der Installation ist die Chrome-Erweiterung als Symbol eingebunden.
Mit einem Klick werden einem alle Bilder auf der aktuellen Webseite angezeigt und man kann unter ihnen das gewünschte auswählen.
Mozilla Firefox Add-on
Die Installation verläuft unter Firefox ähnlich wie unter Chrome.
Jedoch wird das Add-on nicht als Symbol angezeigt. Stattdessen kann man, mithilfe eines Rechtsklicks auf dem gewünschten Bild, die Suche starten.
Auf der Ergebnisseiten gibt es neben verschiedenen Sortierungsmöglichkeiten eine spezielle Ansicht, um die Qualität des Ursprungsbilds mit der des gefundenen zu vergleichen.
Alles in allem macht einem TinEye die Bildersuche sicher leichter und hilft auch dabei, herauszufinden, wo die eigenen Bilder im Internet sonst noch so verwendet werden.
Links
24. Jul, 2010
Nachdem Apple der Internetnutzung auf Smartphones 2007 mit der Markteinführung des iPhones zum Durchbruch verholfen hat, hat sich auf dem Endgerätemarkt sehr viel getan und immer mehr Menschen verwenden mobile Endgeräte zum Surfen. Neben dem iPhone gibt es mittlerweile Android, webOS und viele mehr, sodass sich die Entwicklung von Applikationen für jedes mobile Betriebssystem viel zu aufwändig wäre. Stattdessen macht es mehr Sinn, speziell auf mobile Geräte optimierte Versionen von Webseiten anzubieten, die die kleine Bildschirmgröße der Smartphones effektiv und sinnvoll nutzen.
Unter Wordpress gibt es hierfür ein Plug-in, doch für andere Webseiten ist es sinnvoll, sich eine Testumgebung für mobile Webseiten einzurichten, die lokal, wie diese iPad-Browser-Simulation, läuft.
Weiterlesen »
