Sprung zum Inhalt [/] Tastaturkürzel / Accesskeys [0]

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zur Liste der Kategorien | zum Archiv

Wie finde ich den passenden Webhoster für mein Projekt?

Donnerstag, 20. November 2014

Aus gegebenem Anlass — so sagt man wohl — und weil immer wieder danach gefragt wird, darf ich die Frage hier (wieder einmal) beantworten. Nein, nicht mit der Nennung eines bestimmten Webhosters, sondern mit einer Beschreibung über die richtige Herangehensweise.

Einen Webhoster wählt man nicht alle Tage aus. Die Zusammenarbeit soll schließlich über viele Jahre halten. Daher ist eine systematische Vorgehensweise nötig.

Ich habe vor einiger Zeit schon einmal einen Artikel zu diesem Thema geschrieben, und darf die wesentlichen Kriterien bei der Wahl hier noch einmal beispielhaft aufführen:

  • Features
    • Verfügbarer Speicher
    • Traffic
    • Anzahl möglicher E-Mail-Accounts
    • Welche tdl (Top Level Domains) sind verfügbar?
    • FTP-Zugänge
    • Installierte Software
    • Cronjobs
    • SSL-Proxy
    • SSH-Zugriff
    • DNS Einstellungen
    • Viren/Spamfilter
    • … usw. usf.
  • Server-Verfügbarkeit (Historie)
  • Backup: Werden die Daten auf dem Server gesichert, für den Fall eines Hard- oder Softwareschadens?
  • Hotline / Service
    • Telefonisch - 7 Tage / 24 Stunden?
    • per E-Mail - Bearbeitungsdauer?
    • Brauche ich eventuell Support für eigene Scripte? Falls ja: Preis?
    • Wie schnell wird auf Probleme reagiert? Sind Techniker 24/7 verfügbar?

Zum Glück gibt es Portale, die einen objektiven und neutralen Vergleich von Webhostern ermöglichen. Beispielhaft möchte ich hier webhostingvergleich24.com nennen. (Dort gibt es übrigens auch einen umfangreichen Fragenkatalog, der wesentlich mehr Kriterien als die oben genannten umfasst.)
Das Wichtigste jedoch sind detaillierte Tests und Erfahrungsberichte über die einzelnen Hoster.

Verschaffe dir also einen Überblick über den Markt, über die unterschiedlichen angebotenen Leistungen, lese Tests und Kundenbeurteilungen, und suche den für dich passenden Anbieter aus.
Falsch wäre es meines Erachtens, nur ein einziges Kriterium zur Entscheidung heranzuziehen, etwa die im Supportforum gestellte Frage, ob der Betrieb eines Chat erlaubt ist. Deine Anforderungen werden möglicherweise im Laufe der Zeit umfangreicher. Vielleicht kommt später einmal ein Blog dazu, oder sogar eine ausgewachsene Webpräsenz. Auch dann soll dein Webhoster noch zu dir passen.

Zuletzt darf ich mich noch selbst aus meinem Supportforum zitieren:

Wenn du eine Vorauswahl getroffen hast, dann kontaktiere den Hoster deiner Wahl und stelle eine konkrete Frage. Aus der Reaktion auf deine Frage kannst du möglicherweise schon erkennen, ob dieser Hoster für eine langjährige Zusammenarbeit in Frage kommt, ob die “Wellenlänge” stimmt. Kam als Antwort nur eine halbautomatisch aus Textbausteinen zusammengestellte E-Mail? Oder wurde speziell auf dein Anliegen eingegangen?


Microsoft Office kostenlos: Word, Excel, Powerpoint für iPhone & iPad!

Donnerstag, 6. November 2014

Die Microsoft Office Programme gibt es jetzt kostenlos für iOS. Zur Nutzung ist lediglich ein kostenloser Microsoft Account erforderlich.

App Icon Winword Microsoft Word [iTunes Link]

App Icon Excel Microsoft Excel [iTunes Link]


App Icon Powerpoint Microsoft Powerpoint [iTunes Link]



Auf dem iPad fühlen sich Word und Excel richtig gut an. Und auf dem kleinen iPhone Monitor? Microsoft hat sich richtig Mühe gegeben, auch auf der eigentlich viel zu kleinen Arbeitsfläche alles Nötige unterzubringen. Aber mehr als ein Notbehelf kann das nicht sein.

Für mich das Highlight: Die Dropbox-Synchronisation, und damit die Möglichkeit, Dokumente auf verschiedenen Geräten zu bearbeiten.

Die VoiceOver Unterstützung ist perfekt. Eine Einschränkung muss ich machen: Das Editieren von Dokumenten unter iOS / VoiceOver ist generell, um es vorsichtig auszudrücken, schwierig. Nicht anders ist das natürlich mit Word-Dokumenten. Aber um das abschließend zu beurteilen, sind meine Kenntnisse mit VoiceOver nicht ausreichend.


Wozu braucht der Mensch Flash - ein Versuch

Dienstag, 4. November 2014

Flash — das waren doch die coolen Webseiten, wo sich was bewegte. Und Filme im Internet.
Apples Steve Job hat Flash zu Recht vor langer Zeit bereits auf den Index gesetzt. Auf meinen iPhones und -Pads gibt es kein Flash. Und ich hab’s dort bisher noch nicht vermisst. Auf dem MacBook aber ist Flash natürlich noch installiert. Unüberhörbar, wenn der Lüfter hochdreht, und “unüberfühlbar", wenn die Oberschenkel langsam aufgeheizt werden.

Dabei gibt es doch längst HTML5 und das video-Tag.

Was spricht eigentlich dagegen, einmal zu testen, ob die Welt ohne Flash lebenswert ist?

Mein Arbeitspferd für das Web ist Firefox. Dort kann man unter Extras — Add-ons — Plugins Flash ganz einfach deaktivieren. Ich verwende im ersten Schritt die Option “Nachfragen, ob aktiviert werden soll". Ich will (noch) wissen, was mir alles entgeht.

Screenshot
“Adobe Flash aktivieren” wird angezeigt, wenn ein Flash Video aufgerufen wird, aber Flash deaktiviert ist.

Und jetzt?

  • YouTube?
    Kein Problem. Youtube kann HTML5. Unter Umständen ist es einmalig erforderlich, den HTML5-Videoplayer zu aktivieren.
  • Facebook?
    Eingebettete Videos laufen nicht mehr. Vermutlich ist das eher eine Wohltat als ein Problem.
    Jedoch: Facebook weiß sehr wohl, dass man Videos auch ohne Flash schauen kann. Die iOS-App beweist es. Also warum nicht auch auf dem Desktop?
  • Twitter?
    ditto!

Jetzt kommt’s aber dicker:

  • Was ist mit meinen eigenen Seiten, die auf Flash setzen? Z. B. dieses Hausvideo?
  • Oder der geniale Yahoo! - Player, den ich in meinem Blog immer noch als Audio-Player verwende. Z. B. hier, um ein VoiceOver Audio einzubinden.
    — Der Player benötigt kein Flash :-)
  • Oder das in meinem Chat eingebundene Radio?

Ob ich wohl die Konsequenz aufbringe, alle diese Flash-Anwendungen zu eliminieren?
Man wird sehen. ;-)


HTML5 veröffentlicht

Montag, 3. November 2014

HTML5 hat jetzt den Status “Recommendation", und ist damit De-facto-Norm. Am 28.10.2014 hat das World Wide Web Consortium nach mehr als 6 Jahren Entwicklungszeit die Spezifikation der Hypertext Markup Language 5 veröffentlicht.

Das HTML5 Logo
Bild: Wikipedia

HTML, das ist die Sprache des Web, die (Auszeichnungs-)Sprache, in der Webseiten geschrieben (nein, nicht programmiert) werden.
HTML5 erweitert den Vorgänger HTML 4.01 um viele neue Elemente, und ermöglicht eine bessere, sinnfälligere Strukturierung von Webseiten.

HTML5 ist eine Obermenge von HTML 4.01; anders ausgedrückt: Praktisch alle Elemente von HTML 4.01 sind auch in HTML5 enthalten.
Diese scheinbar akademische Feststellung hat ganz praktische Konsequenzen: Der Umstieg auf HTML5 kann “sanft” erfolgen. Es genügt im ersten Schritt, ein vorhandenes HTML 4.01 Dokument mit der Dokumenttypangabe <!DOCTYPE html> zu versehen, und schon hat man ein gültiges HTML5 Dokument.

Anschließend kann man all die schönen und nützlichen neuen Möglichkeiten von HTML5 nutzen, z. B.:

  • Natives audio und video. Auf Sicht werden damit Erweiterungen wie Flash, Silverlight usw. entbehrlich.
    Ein praktisches Beispiel mit dem audio-Tag.
  • Strukturierende Elemente: section, nav, article, aside, header und footer, anstelle “nichtssagender” div-Elemente. Assistive Techniken, z. B. Screen Reader, nutzen diese Elemente heute bereits um die Seitenstruktur zu verdeutlichen, und die Navigation zu erleichtern.
  • Beim input-Element können Entwickler genauere Vorgaben machen, welche Eingabewerte zulässig sind. So sind etwa Datumstypen oder Schieberegler für Zahlen vorgesehen.

Nicht alle Browser unterstützen bereits alle Möglichkeiten von HTML5. Im Einzelfall kann man auf caniuse.com nachschlagen und entscheiden, ob und welche Elemente man nutzen kann / will. So wird z. B. der Input-Typ date von den Schwergewichten IE und Firefox gar nicht unterstützt, das audio-Element hingegen von allen modernen Browsern.

Mein Fazit:

HTML5 ist eine feine Sache, ohne Nachteile. Viele neue Möglichkeiten, Verbesserung der Barrierefreiheit, z. B. Entfall von Flash, Verbesserung der Orientierung auf einer Seite, usw.


Mac OS X 10.10 Yosemite

Dienstag, 28. Oktober 2014

Ein Betriebssystem-Update macht man nicht alle Tage. Neue Windows-Versionen gab es bei mir üblicherweise nur beim Kauf einer neuen Kiste. Die kostet ohnehin nur wenig mehr als Windows.
Anders auf dem Mac. Seit Snow Leopard stellt Apple die Betriebssystem-Updates sogar kostenlos zur Verfügung.

Ich hab’ also auf meinem MacBook Pro jetzt bereits das fünfte Betriebssystem am laufen:

  1. OS X 10.6 (Snow Leopard)
  2. OS X 10.7 (Lion)
  3. OS X 10.8 (Mountain Lion)
  4. OS X 10.9 (Mavericks)
  5. OS X 10.10 (Yosemite)

Man sollte meinen, dass die Hardware dabei entweder nicht mehr mitmacht, oder zumindest die “alte” Kiste mit den steigenden Anforderungen der neuen Software überfordert ist.
Nicht so bei Apple.
Mein MacBook fühlt sich nach dem Update auf Yosemite an wie neu. Es ist schnell, stabil und frei von Fehlern. Erstaunlicherweise haben sich sogar uralte Fehler, an die ich mich längst gewöhnt hatte, in Luft aufgelöst.

Beispiele für Apps, die regelmäßig abstürzten — nicht mehr unter Yosemite.

Das Highlight aber ist der Akku! Wieder über 4 Stunden Akkubetrieb, und das mit einem Akku, der bereits 1200 Ladezyklen auf dem Buckel hat.

Die Mac-Aktivitätsanzeige:
Verbleibende Leistung: 5%
Verbleibende Zeit: 0:12
Zeit im Batteriebetrieb: 4:07

Ich musste allerdings nach dem Update auf Yosemite einmal einen SMC Reset durchführen, um nervige WLAN-Probleme in den Griff zu bekommen.

Und eine Akkupflege hat sicher meinem Akku geholfen.


Telefonieren - Direktwahl aus der Webseite

Mittwoch, 22. Oktober 2014

Telefonnummern finden sich wohl auf jeder Website. Zumindest auf impressumpflichtigen Websites die Telefonnummer des Seitenbetreibers. Dort hoffentlich nicht als Bild, sondern in Textform. Weil ersteres nicht nur sehbehinderte Nutzer ausschließt, sondern auch die formalen Anforderung an ein rechtssicheres Impressum nicht erfüllt, und im schlimmsten Fall zu einer Abmahnung führen kann.

So weit, so gut.

Seit dem Siegeszug von Smartphones und Tablets ist die Nutzung von Telefonnummern auf Webseiten sehr komfortabel. Viele Geräte erkennen selbständig, dass eine Ziffernfoge eine Telefonnummer sein könnte, und machen aus dieser Ziffernfolge automatisch einen Link, der die auf dem Gerät installierte Telefonapp aufruft. Sehr komfortabel.
Man kann es den Geräten auch leichter machen, und gleichzeitig die Darstellung der Telefonnummer frei gestalten, wenn man das URL-Schema “tel” verwendet.

<a href="tel:+491718319084">Tel.: +49 171 - 8319084</a>

Die Spezifikation zum URL-Schema “tel": RFC 3966

Solchermaßen eingebundene Telefonnummern ermöglichen unter Umständen auch das komfortable Telefonieren vom Desktop-Computern aus. Sie rufen, falls vorhanden, eine installierte VOIP-Software auf, oder nutzen auf Macs mit dem aktuellen Betriebssystem Yosemite die Telefonfunktion des iPhone.


Suchen

Donnerstag, 16. Oktober 2014

Was wäre “Neuland” ohne komfortable Suchfunktionen? Voran natürlich die allseits geliebte Tante Google.

Heute möchte ich aber nicht über Google & Co schreiben, sondern über

Seiteninterne Suchfunktionen auf Webseiten und in Apps.

Jeder aktuelle Browser kann komfortabel innerhalb von Webseiten suchen. Mit Strg + F, und dann mit Enter zum jeweils nächsten Treffer springen.
Die neuesten Browserversionen zeigen zusätzlich noch einen Hinweis wie “1 von 5 Übereinstimmungen” (Firefox), “1 von 5″ (Chrome, Opera) oder “5 Treffer” (Safari).

In meinem Suchscript

habe ich versucht, die Sache ähnlich komfortabel zu gestalten. Die Treffer werden auf den Zielseiten farbig unterlegt, und zusätzlich wird die Zielseite bis zum ersten Treffer gescrollt.

Screenshot Firefox
Die Seite mit dem Suchtreffer (in diesem Fall die Startseite von webdesign weisshart) wird bis zum ersten Treffer (Internet) gescrollt.

Interessant wird es mit mobilen Geräten

iOS/Safari hat die seiteninterne Suche etwas versteckt. Eigentlich Schade um diese coole Funktion.

Screenshot iPhone 1
Ins Adressfeld, also dort, wo man normalerweise die Adresse der zu öffnenden Seite eingibt, den Suchbegriff eintippen. Es werden mehrere Vorschläge angeboten, je nach Konfiguration des iOS-Geräts, z. B. die Suche nach dem eingegebenen Begriff bei Google fortzusetzen.
Screenshot iPhone 2
Wenn man ganz nach unten scrollt, kommt als letzter Vorschlag “Auf dieser Seite [Suchbegriff] suchen”
Screenshot iPhone 3
Diesen Vorschlag antippen, und auf der aktuellen Seite werden die Suchtreffer gelb hinterlegt. Mit den Pfeiltasten in der Fußleiste kann man dann bequem von Treffer zu Treffer springen.

Ähnliche Features bieten fast alle für iOS verfügbaren Browser.

iOS-Apps

Meine neue Lieblingsapp auf dem iPhone, NoteBox, versucht, die geschilderte Funktionalität von Safari nachzuahmen. Bei NoteBox gibt es eine sowohl eine seitenübergreifende als auch eine seiteninterne Suche. Die Umsetzung ist noch etwas holprig. Aber die App ist relativ neu, und wird vom Entwickler intensiv gepflegt. Da ist noch Verbesserung zu erwarten.

Sonderfall Screen Reader

Gerade für blinde IT-Nutzer, die ein längeres Dokument nicht mit einem Blick scannen können, ist eine auch mit Screen Reader funktionierende seiteninterne Suche wichtig. Funktionierend heißt: Treffer anspringen (fokussieren), und den Kontext (die Umgebung) automatisch vorlesen.
Die verschiedenen Screen Reader haben diese Funktion implementiert.

Für Interessierte hier beispielsweise die Befehle für den kostenlosen Screen Reader NVDA:

  • NVDA-Taste+STRG+F öffnet ein weiteres Fenster, in dem Sie einen Text eingeben können, der im aktuellen Dokument gesucht werden soll.
  • NVDA-Taste+F3 aucht die nächste Zeichenkette des gesuchten Textes im aktuellen Dokument, welche zuvor eingegeben wurde.
  • NVDA-Taste+Umschalt+F3 sucht die vorherige Zeichenkette des gesuchten Textes im aktuellen Dokument, die zuvor eingegeben wurde.

iOS VoiceOver

Safari unterstützte seit iOS 6 die oben beschriebene seiteninterne Suche mit dem betriebssystemeigenen Screen Reader VoiceOver. Genauer: Wenn VoiceOver aktiv war, wurde der Fokus automatisch in den ersten Treffer gesetzt, und der Kontext vorgelesen. Weitere Treffer konnten auf die gleiche Art angesprungen und vorgelesen werden. In iOS 8 (bis einschließlich Version 8.0.2) ist diese Funktionalität, das automatische Vorlesen, leider kaputt. Aber das ist ja nicht das einzige Problem mit iOS 8. :-(


Responsive Webdesign und Tabellen

Samstag, 11. Oktober 2014

Tabellen — nein, natürlich keine Layouttabellen! sondern Datentabellen — und kleine Monitore: das ist eine echte Herausforderung. Die Standardtechniken des RWD (Responsive Web Design) helfen hier nicht weiter.
Natürlich kann man auf Smartphones pinchen (zoomen). Unterstellt, der Webworker hat das nicht per meta-Tag unterbunden, was ohnehin ganz schlechter Stil ist. Aber die Übersicht über die Tabelle, die Zuordnung der Tabellenzellen zu den jeweiligen Köpfen geht dabei schnell verloren.
Es gibt fertige Lösungen, die zumeist auf JavaScript und CSS basieren. Keine dieser Lösungen passte so richtig auf meinen Fall:

Screenshot Desktop
Die Preisliste einer Pension. In der Desktop-Version der Webseite passen die 4 Spalten gut ins Layout.

Die gewählte Lösung: Nur die Kopfspalte und jeweils eine Datenspalte anzeigen.

Screenshot 2 iPhone
Beim Aufruf der Preisliste mit dem Smartphone wird zuerst einmal abgefragt, für welche von 3 Saisonzeiten die Tabelle angezeigt werden soll.
Screenshot 3 iPhone
Eine Kopfspalte und eine Datenspalte können auf dem kleinen Monitor in normaler Schriftgröße ohne Scrollen angezeigt werden. Zusätzlich wird noch auf die Details zu den einzelnen Tabellenzeilen verzichtet. Die Details sind in den verlinkten Detailseiten nachzulesen.

Die Umsetzung in Stichworten:

  • Media Queries reichen (leider) nicht. Ich frage per PHP den User Agent ab.
  • Falls der User Agennt ein Smartphone ist, wird per PHP das Auswahlmenü ein-, und die Tabelle erst einmal ausgeblendet.
  • Je nach gewählter Option (Saison) wird nach Absenden des Formulars (onChange="this.form.submit()") die Tabelle mit der gewählten Spalte angezeigt, und die beiden anderen Spalten per CSS verborgen.

SecurityNews auf ihrer Website

Freitag, 10. Oktober 2014

Könnte für ein techniklastiges Blog eventuell interessant sein:

Security News als iFrame einbinden:

Screenshot

Hinweis: Die Breite des iFrame kann beliebig gewählt werden, z. B. passend für eine Seitenleiste.


Pastebot kaputt? Command-C springt ein

Sonntag, 5. Oktober 2014

Für viele Jahre hat Pastebot mir gute Dienste geleistet.
Der Entwickler betreut diese nützliche App leider schon seit langem nicht mehr. Und mit iOS 8 scheint jetzt endgültig nichts mehr zu gehen.

Aber Ersatz ist bei der Hand: Command-C tut, was Pastebot leider nicht mehr tut: Die gemeinsame Nutzung der Zwischenablage aka Clipboard auf allen Macs und iOS-Geräten. Also Text, Hyperlinks, Fotos und was sonst noch die Zwischenablage aufnimmt, steht mit zwei Klicks auch auf jedem anderen Gerät zur Verfügung.
Command-C für iOS kostet derzeit 3,59 €, die App für den Mac ist kostenlos.

Screenshot iPhone
Die Oberfläche von Command-C ist sehr spartanisch. Man braucht sie eigentlich nur, wenn man von einem iOS-Gerät etwas senden will. Hier kann man das Ziel wählen.

Command-C funkioniert auf iOS-Geräten auch dann, wenn es im Hintergrund läuft. Die iOS-typische Beschränkung auf 10 Minuten Hintergrundaktivität scheint für die App nicht zu gelten.

Die Installation ist ein wenig tricky, und auch die Bedienung erschließt sich nicht so ohne weiteres. Eine “richtige Dokumentation” hab’ ich auch nicht gefunden.
Gut, ich werde die App mal einige Zeit testen, und dann nochmal berichten.


Ältere Beitäge:

Kategorien:

Creative Commons Lizenzvertrag
Alle Artikel des Blogs Creative Commons CC BY-NC-SA 3.0 DE

Tastaturkürzel