Es gibt jetzt eine mobile Version von CSS-Tricks, dank des Services und der netten Leute von Mobify.

Das ist nicht nur eine iPhone-Version, sondern sollte mit den meisten mobilen Geräten gut kompatibel sein. Das Beste daran ist jedoch, dass dies nicht nur eine Möglichkeit ist, Artikel zu lesen, wie es bei früheren mobilen Versionen der Fall war. Dies ist eine voll funktionsfähige mobile Website, was bedeutet, dass alle Archive vollständig verfügbar sind, die Kommentareund die Möglichkeit, zu kommentieren.
Da CSS-Tricks auf WordPress läuft, wollte ich schon immer einen Weg finden, eine mobile Seite unter einer Subdomain oder einem Unterverzeichnis zu haben, die denselben Inhalt liefert, aber ein anderes WP-Theme verwendet. Ich habe nie ganz herausgefunden, wie das geht, aber das spielt jetzt keine Rolle mehr, denn genau das macht Mobify im Wesentlichen.
WordPress-freundlich
Mobify kann im Grunde mit jeder Website funktionieren, aber ich bin angenehm überrascht, wie gut es sich in WordPress integriert hat. Nicht nur das Kommentieren funktioniert einwandfrei, sondern sie bieten auch ein Plugin, das alle mobilen Besucher automatisch und ohne Aufwand für Sie weiterleitet.
Tötet Ihre "vollständige" Website nicht
Normalerweise halte ich nichts von "mobilen Versionen", die speziellen Inhalt für mobile Besucher liefern, ohne dass es eine Möglichkeit gibt, die normale vollständige Website anzuzeigen. Mobify tut das nicht. Es leitet Sie zwar weiter, aber wenn Sie zurück zur Hauptseite möchten, klicken Sie einfach auf den Link "Vollständige Website" unten. Das ist die ideale Methode, wenn Sie mich fragen.
Analytik
Mobify arbeitet mit AdMob zusammen, um Ihnen mobile Analysen zur Verfügung zu stellen. Ich denke, es gibt noch ein paar Kinderkrankheiten zu überwinden, und ehrlich gesagt funktioniert es bei mir noch nicht ganz, aber ich stelle mir vor, dass sie es bald in Ordnung bringen werden.
Machen Sie es selbst
Mobify ist ein Self-Service-System. Sie bauen Ihre eigene mobile Version mit ihrem Design Dashboard auf, was Ihnen die volle Kontrolle und Vorschauen darauf gibt, was Sie auf verschiedenen Geräten erstellen.

Nochmals vielen Dank an Mobify für die Hilfe bei der Erstellung dieses Artikels. Wenn Sie andere Websites sehen möchten, die es verwendet haben, I Love Typography hat eine, A List Apart, ich glaube, Six Revisions bekommt bald eine, Veerle hat eine, die Dieline, lauter tolle Websites.
Ja, ich habe mir Mobify angesehen. Sie scheinen da ein gutes Geschäft zu machen. Nett, mobiles CSS-Tricks sieht auf meinem iPhone gut aus. Es wäre großartig, wenn Ihre Screencasts auch auf diese Weise verfügbar wären, aber wer weiß, wie lange wir warten müssen, bis das iPhone Videos auf Webseiten unterstützt.
Sehr cool!
Ich habe http://briancray.com iPhone- (und mobil-)freundlich gemacht. Dieses Programm hätte es ein wenig einfacher gemacht! Was für eine großartige Umsetzung!
Sehr, sehr cool, das werde ich mir auf jeden Fall ansehen, wenn ich das nächste Mal eine mobile Version einer Website erstelle.
Sieht gut aus – obwohl mir auffällt, dass die Datums- und Kommentarzahlenzeile den Beitragstitel überschreibt (wenn auf einem Blackberry angezeigt).
Schauen Sie sich diesen Nachrichtenartikel in der Washington Post von heute an http://tinyurl.com/pmsay2….. Disney schneidet mit Web besser ab als mit mobilen Apps….. Mobify ist eine Plattform, die eine One-Web-Multi-View-Strategie für Webdesigner günstig und einfach machen kann!
Sieht gut aus! Kommentiere von meinem iPhone aus
Sind Sie im Pro-Plan und bezahlen Sie dafür, oder werfen sie Ihnen einen Knochen zu?
Sie haben mir einen Knochen zugeworfen, was ich hätte klarstellen sollen. Und mit Knochen meine ich, sie haben mir geholfen, die Seite zu erstellen, und ich habe nicht dafür bezahlt. Das ist keine bezahlte Anzeige =)
Wie haben sie Ihnen geholfen? Mussten Sie Teile Ihrer Website umschreiben?
Hey,
Wir haben mobile Inhalte ausgewählt und das Styling basierend auf der vorhandenen Stylesheet angepasst. Es waren keine Änderungen am Quellcode der Website erforderlich…
E-Mailen Sie mir, wenn Sie weitere Fragen haben!
Igor von MOBIFY
Wow, ich habe vor ein paar Stunden nach einem solchen Service gesucht.
CSS TRICKS FTW!
Was ist mit Werbung? Wie werden Sie mit dieser Seite Einnahmen erzielen?
Derzeit habe ich keine Absicht dazu.
Sieht gut aus in Opera Mini auf meinem Windows Mobile-Telefon.
Ich habe gerade bemerkt, dass ich nach dem Posten eines Kommentars sofort auf die vollständige Website weitergeleitet wurde.
Warum nicht einfach ein Plugin wie WordPress Mobile Edition verwenden und das mobile Theme nach Ihren Wünschen anpassen? Dann müssen Sie nicht für deren "Custom Branding" bezahlen. http://wordpress.org/extend/plugins/wordpress-mobile-edition/
Warum sich auf einen Dienst verlassen, der ausfallen könnte, wenn man es selbst machen kann?
Ich arbeite an einer Website, die WordPress eigentlich nur für Nachrichten und Blogs nutzen wird, also habe ich versucht, einen Weg im Header mit JavaScript zur Erkennung und PHP zum Wechseln zur Vollversion und umgekehrt zu finden. Ich glaube, ich habe es geschafft, wenn sie kein JS haben, wird einfach die mobile Version geladen.
Paul,
Plugins sind ein weiterer Ansatz für das Mobilitätsproblem. Unser Ziel ist es, eine Designumgebung zu schaffen, in der jeder Webdesigner seine Websites mobil machen kann, unabhängig vom verwendeten CMS.
Insbesondere MOBIFY bietet eine sehr feingranulare Kontrolle über Designelemente und gebündelte Dienste (Geräteerkennung, Inhalts-Transkodierung, Analysen), die wir entwickelt haben.
Plugins sind auch großartig, aber sie sind nicht sehr flexibel für Designzwecke und Modulunterstützung. Im Allgemeinen hat WordPress noch kein geeignetes mobiles Framework entwickelt, und wir würden gerne Teil davon sein.
Viele Grüße,
Igor von MOBIFY
Die Kommentare werden auf meinem Telefon leider nicht sehr gut angezeigt, insbesondere die verschachtelten Antworten – es ist einfach nicht genug Platz auf dem Bildschirm, nehme ich an. Wenn ich das Telefon im Querformat drehe, sieht es besser aus, aber immer noch nicht perfekt.
(Ich benutze ein Windows Mobile-Telefon mit Opera als Browser)
Hallo Chris, sieht wie immer großartig aus. Ich wollte gerade das Lesezeichen auf meinem iPhone hinzufügen und habe bemerkt, dass Ihre alte iPhone-Seite (css-tricks/i) nicht auf die neue URL weiterleitet.
Gut gemacht
Was ist mit dem Konzept, Benutzern die Möglichkeit zu geben, mobile Inhalte zu nutzen, wenn sie sie benötigen. Ich benutze ein iPhone und die Frustration für mich ist, dass ich jetzt nur die Mobify-Version bekomme und nicht zur vollständigen Version gelangen kann.
Benutzer sollten wählen können.
Das können Sie wählen. Ich habe das im Beitrag ausdrücklich erwähnt, weil ich das auch hasse. Unten gibt es einen deutlichen Link zur "Vollständigen Website".
Haben Sie Ihre Seite in IE8 angesehen? Denn wenn ich versuche, Ihre Seite mit IE8 anzusehen, vergrößert sich die Breite der Seite immer weiter und ist unmöglich anzusehen.
Das ist cool, Chris! Glückwunsch. Ich muss das unbedingt auch selbst angehen!
Funktioniert Jquery darauf?
Hey John,
Obwohl es möglich ist, begrenztes JavaScript zu verwenden (Google Analytics etc.), haben wir uns bisher auf die Optimierung von Inhalten für mobile Geräte konzentriert und weniger auf AJAX. In Zukunft könnten wir hier etwas einführen!
Igor
Wie funktioniert die Weiterleitungsfunktion, damit mobile Benutzer zu http://m.css-tricks.com/ weitergeleitet werden?
Es ist ein WordPress-Plugin, daher funktioniert es quasi magisch im Hintergrund mit PHP. Sie haben auch einen JavaScript-Schnipsel, den Sie für jede Website verwenden können.
Wo finde ich ein gutes PHP- oder JavaScript für die Weiterleitung?
Ja, ich weiß, wie man Google benutzt, aber…
Hallo Abel, unser CTO John hat auf seinem Blog über den Ansatz geschrieben, den wir verwenden – das könnte für Sie nützlich sein.
http://johnboxall.ca/2009/04/01/notes-from-mobile-device-detection/
Außerdem planen wir, den JavaScript-Code zur Geräteerkennung (der Anfragen an unsere Gerätedatenbank stellt) als Premium-Service separat von der MOBIFY-Designumgebung anzubieten. Lassen Sie uns wissen, ob Sie interessiert wären!