Archiv für die Kategorie „Programmierung“
Heute möchte ich euch ein kleines JavaScript geben, welches aus einem vorgegebenen <div>-Container alles Links extrahiert und sie als Linkliste am Ende des Containers anhängt. Hier gibt es das Demo.
Warum macht es Sinn eine solche Linkliste zu erstellen? Nun fast jeder der sich mit benutzerfreundlichen Websites auseinandersetzt weiß, dass Links innerhalb von Fließtext den Lesefluss stören. Außerdem kann es möglich sein Leser zu verlieren, wenn sie den Links innerhalb des Textes folgen und nicht wieder zurück kommen. Es ist besser erst am Ende des Textes alle im Text empfohlenen Links aufzulisten.
Diesen Beitrag weiterlesen »
Dieses Thema hatte ich schon lange im Kopf, hatte aber leider noch nie Zeit gefunden darüber einmal detaillierter zu schreiben. Nun aber, dadurch das mich heut fast alle Browser mit den Thema CSS 3 im Stich gelassen haben, habe ich die Zeit und den Platz gefunden darüber zu berichte.
Ein Website kann noch so gut geplant sein, im Laufe der Zeit werden sich immer wieder die Strukturen und damit die URIs von Ressourcen ändern. Das ist ganz normal. Normal ist auch, dass solche Ressourcen Spuren im Web hinterlassen haben. Zum einen natürlich in Suchmaschinen, die diese indexiert haben. Zusätzlich habe vielleicht aber auch Besucher diese Adressen in ihren sozialen Netzwerken wie del.icio.us, Mister Wong, Yigg oder Google Bookmarks oder aber ganz normal als Favorit abgespeichert. Wenn sich nun die Adressierung ändert, sollten natürlich Besucher die noch zur alten Adressen wollen weitergeleitet werden. Und genau da kommt die Apache Direktive redirect ins Spiel.
Durch die Benutzung von Klassen und IDs kann man sehr effektiv auf die Strukturen von HTML-Seiten zugreifen. Doch leider wird dadurch auch der Quellcode der Seite vergrößert. In vielen Fällen ist das aber unnötig, denn oft werden Klassen aus Bequemlichkeit eingesetzt um schnell auf das Richtige zu zugreifen. CSS bietet über Selektoren mehr als nur den Zugriff auf Tags, Klassen und IDs.
Immer wieder werden ähnlich bzw. gleiche Layouts beim Webdesign gebraucht. Ich habe einmal versucht eine relative einfaches Framework zur schnellen Erzeugung von verschiedenen Layouts zu erstellen.
Um die Verwaltung des Framework einfach zu halten, habe ich mich dazu entschlossen die CSS-Dateien aufzuteilen. In der HTML-Datei existieren zwar nur 3 relative Verlinkungen zu den jeweiligen Ausgabedesigns, aber für jedes Design sind dann weitere 3 Dateien zuständig. Um die Designs flexibel administrieren zu können, benutze ich eine Layout-Datei für die Positionierung der Boxen, eine Color-Datei für die Farbgebung und eine Typographie-Datei für die Texteinstellung.
Die Zeiten in denen sich Verlinkungen einfach nur unterstrichen präsentierten ist schon längst vorbei. Das Kennzeichnen der unterschiedlichsten Arten von Verlinkungen gibt es schon eine ganze Weile. Spätesten seit der Einführung der Attribut-Selektoren in CSS 2.1 stand der Verwendung von Icons für spezielle Verlinkungen nichts mehr im Wege.
Ja, ja, ich weiß das die nicht alle Browser dieses Feature unterstützen. Besonders der heutzutage noch oft verwendete Internet Explorer 6 macht dem Ganzen einen großen Strich durch die Rechnung. Aber warum müssen deswegen die Benutzer von neueren Browsern darauf verzichten? OK Schluss mit mit dem leidigen Thema der verschiedenen Browser-Versionen. Auf zu der Formatierung von schönen, manchmal auch bunten Verlinkung.
Websites sollten sich immer dem Benutzer anpassen, so zumindest steht es in vielen Dokumentationen über Benutzerfreundlichkeiten. Aber was ist damit eigentlich gemeint? Welche Anpassung braucht der Benutzer bzw. will er überhaupt haben? Welche ist die Richtige?
Die einfachste Lösung ein Layout für die Website zu erstellen ist mit festen Größenangaben zu arbeiten. Sie ist aber auch am Unflexibelsten, denn das Layout kann sich dann nicht den Bedürfnissen des Betrachters anpassen. Viele heutige Design haben als Maßeinheit für ihr Layout Pixel. Der große Vorteil liegt in der genauen Platzierung von Elementen, wie z.B. Spalten oder aber auch Designelemente wie Hintergrundbilder. Der große Nachteil liegt aber auch gerade in diesen festen Größenangaben. Und hier setzen die flexiblen Design an.
Fast jeder kennt wohl das Problem nichts mehr zu finden wenn es nicht richtig beschriftet wurde. Auch ich suche immer wieder nach den verschiedensten Dinge und das nicht nur im Web oder auf meinen Schreibtisch, sondern auch im gesamten Büro. Aber darum soll es in diesem Artikel nicht gehen. Viel mehr möchte ich mal kurz meine Gedanken über die sinnvolle Benennung von Containern beim Layouten los werden.
Eine sinnvolle und immer wiederkehrende Beschriftung von Container man natürlich nicht nur beim Arbeiten in einem Team, sondern bringt auch für einen selbst mehr Sicherheit. Dabei sollte immer darauf geachtet werden den HTML-Code nicht unnötig aufzublähen. Gerade im mobilen Web sind kline Datenmengen Gold wert.
Letzte Woche hatte ich ein Seminar zum Thema CSS und eins über Dreamweaver gehalten. Es waren Teilnehmer sowohl von Roche Diagnostics als auch von Landessport Bund dabei, die mittels CMS die Inhalte ihrer Website betreuen. In diesen Seminaren kam die Frage nach einen flexiblen System zum Erzeugen eines CSS gesteuerten Layouts auf.
Nach ein paar Überlegungen kamen wir dann auf die Teilung des CSS-Designs in 4 Dateien:
- basic.css
- 2column.css
- 3column.css
- content.css
Heute war ich in Köln um meine alten Kontakt zu erneuern. Wie ich von Thorsten erfahren habe, gibt es einen kleinen Auftrag für eine Installation eines Joomla!-Systems und die dazu passenden Anpassungen. Auch soll in dieses System ein Shop integriert werden, welches gerade im sicherheitstechnischen Bereich eine knifflige Aufgabe wird. Aber nicht nur diese Herausforderung wird spannen, sondern auch die Einbindung eine Videos welches auf YouTube gehostet wird. Im schlimmsten Fall würde ich ein neues Modul für Joomla! schreiben. Aber vielleicht finde ich ja auch noch was passendes. Ich werde euch auf jeden Fall auf dem Laufenden halten.
Zusätzlich habe ich kurz mit Schorsch gesprochen, der mit cakePHP und JQuery eine sehr vielversprechende Rechnungssoftware schreibt. Wir werden und nächste Woche nochmals treffen, um mich auf den neusten Stand der Entwicklung zu bringen. Auch dieses Projekt stelle ich mir absolut spannend vor, da ich sehr selten die Möglichkeit gehabt habe, frei eine Webapplication zu schreiben.