Redesign der Homepage?
Was haltet ihr vom grundsätzlichen Design? Das Bild oben muss natürlich von einem Profi gemacht werden.
Die Idee ist, dass man in der oberen Navigation die wichtigsten Fragen sofort beantworten kann:
- Wo bin ich?
- Warum EWS?
- Wo kann ich es downloaden?
- Was gibts Neues?
?
Das 1w6-System ist ein schlankes, frei lizensiertes, universell einsetzbares Rollenspielregelwerk,
das es Weltenbastlern und Spielleitern erleichtern soll,
ihre Welt oder Kampagne als Rollenspiel zu veröffentlichen.
Alle Inhalte sind unter freien Lizenzen verfügbar.
Das Urheberrecht liegt bei Autorin oder Autor des jeweiligen Inhaltes.
Bevor Du selbst etwas schreibst, lies bitte die Lizenzbedingungen.
Diese Seite nutzt für ihr Funktionieren notwendige Cookies (und nur die). Und Bilder. Manchmal auch Text. Eins davon müssen wir erwähnen…
Der Header sieht spannend
Der Header sieht spannend aus, nimmt meinem Gefühl nach allerdings zu viel Platz ein, gerade wenn Leute mit dem Handy o.ä. auf die Seite kommen.
Die klarer sichtbaren Schnell-Links finde ich allerdings toll! (die haben bisher glaube ich die meisten Leute übersehen)
Würden die auch ohne den großen Header funktionieren - z.B. einfach mit der Seitenleiste verbunden?
Natürlich, nur dass die
Natürlich, nur dass die Gewohnheit sagt: Oben ist die grobe Navigation.
Man könnte aber den Header für Mobilgeräte ausblenden. Wobei ich mobil-Seiten total nervig finde und wenn möglich immer abschalte, was mich an der jetzigen Seite sehr stört, wo plötzlich die Seitenleiste weg ist und ich muss erst durch den Begrüßungstext und irgendwo die Kurzlinks suchen... :)
Die mobilgeräte können
Die mobilgeräte können leider oft kein hover… ich denke schon länger drüber nach, links oben einen CSS-Knopf mit “Seitenleiste in den Vordergrund” einzubinden.
Für mobile Geräte auszublenden finde ich auch nicht ideal, weil ich häufig mit kleinem Browserfenster unterwegs bin (<⅓ Bildschirm).
Grundlegend sollte meiner Ansicht nach bei einer Unterseite der Inhalt der wichtigste Punkt sein: Wer auf einen Link klickt,will desses Inhalt sehen (wobei das nicht für die Startseite gilt). Besucher sollten sich durch die Seite wie durch ein Buch klicken können. Gleichzeitig sehe ich schon, dass der Schritt von „toller Artikel“ zu „wo bin ich hier“ zur Zeit zu schwer ist. Und Leute, die von jemandem einen Link auf 1w6.org kriegen haben es auch noch zu schwer (für die Startseite habe ich auch nach 5 Jahren Schrauben am Begrüßungstext noch kein Konzept, mit dem ich wirklich zufrieden bin).
Könnte man oben auch einfach eine dünne Leiste einbauen, die die Symbole beim hovern zeigt? Oder irgendwas ähnliches, das nicht so viel Platz auf jeder einzelnen Seite verbraucht?
Über den Inhalt der
Über den Inhalt der Startseite sollten wir mal einzeln diskutieren, meiner Meinung nach versucht die aktuelle zu viel auf einmal und ist deshalb etwas überlasstet und ein "Scroll-Monster".
Man sollte sich jedes Element einzeln betrachten und sich fragen: Brauche ich das?
Beispiel: Flattr? Toll, aber wieviel Euro haste so schon verdient?
Der Kaufen-Button (der als solcher nicht zu erkennen ist)?
Die Navigation um den EWS-Würfel?
Prosa? ? ? ?
Die Startseite können wir
Die Startseite können wir sehr gerne durchgehen. Ich bin da nämlich irgendwann an die Grenzen des Kürzens gekommen, das ich ohne Konzeptuelle Überarbeitung machen konnte…
Zur Navi:
Flattr: Bisher 17 Flattr hier, über alle Seiten auf dem gleichen Server hinweg 1-2€ pro Monat, also 1/4 der Serverkosten. Es ist allerdings zum Gutteil aus idealistischen Gründen da. Noch besser fände ich eine Pay-Wahl wie bei der Taz - mit Flattr integriert.
Kaufen: langfristig brauchen wir einen (aber wohl einen passenderen). Klicken Leute auf solche Knöpfe oder eher bei Produkten?
Navi um Würfel: die hat bei den Leuten, die ich dazu gefragt habe, sehr gut geklappt (und ich finde sie auch gut). Ein Vorteil ist, dass sie den Würfel als Alleinstellungsmerkmal nutzt und sich nicht zu sehr aufdrängt. Und sie zeichnet ein Bild aus Text.
Prosa: Leider nicht mehr aktuell: Ich habe früher einen monatlichen Prosa-Text geschrieben. Den Link könnte ich also aus der Seitenleiste rausnehmen.
Siehe unten zur Konzeption
Siehe unten zur Konzeption einer einfachen Startseite.
Auf der PC-/Tablet-Variante wäre dann halt der Header größer und man könnte mit der Sidebar arbeiten.
Aus jahrelanger Erfahrung
Aus jahrelanger Erfahrung habe ich eins gelernt: Perfektion ist die maximal mögliche Innovationsbremse! :)
Aber eins nach dem anderen. Bei Kunden löse ich so ein Problem immer in dem ich mal einen Blick auf die Mitbewerbe werfe.
Brainstormen wir mal 10 artverwandte Seiten, auf denen ich in letzter Zeit so war und ob die eine mobil angepasste Seite haben:
Teilzeithelden NEIN
Rollenspielalmanach NEIN
Fate2Go NEIN
Dungeonslayers NEIN
Forsaken Colony Ja, Wordpress-Funktion
Fate NEIN
PiHalbe NEIN
Michtim Ja, Wordpress-Funktion
Uhrwerk Verlag NEIN
Contact Rollenspiel NEIN
Hmm, und gibt es einen Aufschrei in den Communitys? Vermutlich nicht.
Es gibt keinen Aufschrei,
Es gibt keinen Aufschrei, aber ich habe bereits sehr positive Rückmeldung zu 1w6.org auf Handies bekommen. Im Stil von „hey, das funktioniert ja einfach und lässt sich sehr gut lesen“.
Einziges Problem: Es funktioniert halt bisher nur für die Artikel-Inhalte, aber nicht für die Navigation.
Und die Frage ist ja nicht, ob wir eine Mobilseite einrichten wollen, sondern ob wir die aktuell existierende Mobil-Unterstützung aufgeben wollen.
PiHalbe mag keine Mobil-Seite haben, aber das Layout funktioniert für kleine Geräte sehr gut (weil dabei die Navigation rechts ausgeblendet wird).
Okay, anderer Ansatz: Wie
Okay, anderer Ansatz:
Wie sollte die Mobile Seite aussehen?
Klar Wiedererkennung: Kleiner Header (nur EWS-Würfel und "Das EinWürfelSystem...")
Dann Top-Navigation (schlicht, ohne Tüddelü)
Dann kurzer Einleitungstext
Dann vielleicht die aktuellen 5 Beiträge angerissen.
Alles andere sollte man dann über die Navigation ansteuern können.
Man müsste sich dann eher Gedanken über die Inhaltsstruktur machen. ergo: Wo kommen die ganzen Inhalte unter.
Das klingt irgendwie schon
Das klingt irgendwie schon sehr nah an dem, was die normale Seite auch machen sollte :)
Kennst du die Struktur der Inhalte schon?
→ Alles deutsche beginnt hier: Deutsch
Ich würde die Prioritität
Ich würde die Prioritität auf das normale Design legen. Wenn ich schön und gut an Infos kommen will sitze ich immer noch am PC oder Notebook. Bin ich hier schon zu sehr old scool, wird heute so viel auf Tabletts betrachtet? Wenn Tabletts einen großen Anteil ausmachen sollte man auch an die dortigen max. 10" denken.
Auf Handys finde ich eine Möglichkeit zur reinen Textanzeige gut (am besten nicht per weiche gezwungen sondern wählbar). Denn wenn ich dort was brauche dann schnell und jetzt sonst ruf ich es nicht auf dem Handy auf.
Die reine Textanzeige haben
Die reine Textanzeige haben wir schon, nur nicht leicht genug zu finden: http://1w6.org/print/632
Ich weiß allerdings noch nicht, wie wir das sauber in Links integrieren können. @Deep_Impact: Gibt es da gute und einfache Techniken?
Okay, dann sollten wir uns
Okay, dann sollten wir uns erstmal auf Prip die PC-Version legen, die nutzen Tablets in der Regel auf, wenn man nicht gerade auf "Responsive Design" steht.
Also wo fangen wir an?
Header und Navi bauen?
Herausforderungen beim Design der Seite
Vielleicht sollten wir erst klären, welche Herausforderungen ein Design für 1w6.org bietet. Dein Header sieht nämlich lebendig aus, und ich liebe das, aber er passt durch seine Große nicht zum Konzept von 1w6.org.
Ein zentraler Unterschied zwischen 1w6.org und den Seiten der meisten anderen Rollenspiele ist, dass wir nicht in erster Linie PDFs erzeugen, sondern dass unsere Inhalte erst auf 1w6.org kommen und dann zu PDFs weiterentwickelt werden (um noch weitere Zielgruppen zu erreichen). Das heißt, 1w6.org ist nicht nur unsere Neuigkeiten-Seite, sondern auch unser Inhalt (wo das möglich ist: Bei den Grundregeln hat es sich leider als unwartbar erwiesen, weil die sehr viel Feinschliff brauchten und die Syntax im Netz leider sehr unterschiedlich von der Syntax im Heft ist).
Ein Design der Seite darf also nicht beim Lesen stören - es sollte eher die Wirkung von Randdekorationen in Büchern haben als die Wirkung von Werbeseiten. Mehr von Wikipedia als von Starcraft 2. Inhalt vor Form. Und gleichzeitig lebendig (anders als das Design, bevor du dazugekommen bist… das geht auf meine Kappe: Ich mag Minimalismus, aber ich schaffe es leider noch nicht, konsistent die Qualität zu liefern, die Minimalismus braucht, um zu funktionieren).
Daher: Wie wäre es, erstmal zu schauen, ob wir die Navi sauberer und lebendiger kriegen, ohne alles umzuwerfen?
Ich weiss, das macht die
Ich weiss, das macht die Zugang aber auch besonders schwer. Ich glaube das viele die Regeln lesen, sogar gut finden und dann nie wiederkommen, weil es keine runterladbaren Regeln oder Settings gibt.
Ich weiss das ist das Grundkonzept, aber macht es schwierig.
Als Gegenbeispiel: Ich habe seit ich EWS gefunden habe fast 300 Seiten PDF veröffentlicht, das geht weil ich es festlege und nicht detailiert erkläre, diskutiere oder offen halte.
Natürlich gibt es immer wieder Revisionen, Erweiterungen und Errata.
Effekt: Die Leute glauben, nicht dass ich am Anfang zu wenig getestet habe, sondern dass ich ständig am Ball bleiben.
Wobei ersteres vermutlich eher der Wahrheit entspricht...
Ich denke wir sollten die Navi oben draufsetzen, wie angedeutet, dann schmeissen wir nichts um, sondern fügen nur ein paar direktere Einstiegsmöglichkeiten hinzu.
Das Konzept ist weniger
Das Konzept ist weniger „keine PDFs“, sondern eher „PDFs für fertiges“. Wir arbeiten inzwischen seit etwa 5 Jahren an Technophob, und die Struktur Stück für Stück zu veröffentlichen ermöglicht es uns (bzw. inside und mir), unseren inneren Schweinehund zu überwinden und wirklich jeden Abschnitt nochmal zu überarbeiten und so wirklich fertig zu machen (und das ganze in der Zeit, die wir realistisch gesehen zur Verfügung haben). Sobald das alles im Netz ist (ETA 15-20 Wochen, je nachdem, wie gut wir die Welten-Abschnitte aufteilen können), soll es als nächsten Schritt Bilder bekommen, dann zu PDFs und zu gedruckten Werken werden.
An bisher herunterladbaren Regeln haben wir die Grundregeln, die Flyerbücher und Ante Portas. Sollten wir die noch prominenter plazieren?
Als Größe für einen Header würde ich intuitiv etwa 3-5 Zeilen nutzen: 3 Zeilen Header + 2 Zeilen Abstand.
Ja defintiv besser
Ja defintiv besser herausstellen.
Deine Größenangabe für den Header verstehe ich leider nicht. Eine Zeile sind hier etwa 25px.
Nur Text? Doch kein Bild?
Welche Größe sollte der
Welche Größe sollte der Header denn haben?
Ich habe die Seitenleiste
Ich habe die Seitenleiste erstmal vereinfacht: Prosa und Kaufen raus, Flattr kleiner. Ich hoffe, sie lässt sich so einfacher verbessern…
Gut! Das beste Symbol für
Gut! Das beste Symbol für "Kaufen" ist immer noch eine "Einkaufswagen".
Übrigens diese Verlinkung "einfach saubere Regeln"
versteht glaube kein Mensch.
Das 1W6 oben über den Würfel kann man ruhig etwas größer machen, oder?
Kennst du ein freies
Kennst du ein freies (GPL-kompatibles) und stilistisch passendes Einkaufswagen-Symbol?
Bei der verlinkung von einfach saubere Regeln hast du vermutlich recht… vielleicht sollte das nur ein Link sein.
Das 1w6 kann etwas größer sein, ja. Vielleicht gleich „über 1w6“?
Tja, diese vertrackte
Tja, diese vertrackte GPL!
Damit kenne ich mich nicht aus, ich weiss nur, dass die gewöhnlich weder für Dokumente noch für Grafiken verwendet wird und damit ist kaum was zu finden.
Ergo, man müsste alles selber machen, was ich nicht kann.
Das Problem kenne ich auch
Das Problem kenne ich auch :)
Deswegen habe ich ja auf die Geldbörse zurückgegriffen: Die ist aus den Oxygen-Icons von KDE, und die Oxygen-Icons sind GPL-kompatibel.
Wobei es auch freie shop-Lösungen gibt, die ihre eigenen freien Symbole haben könnten.
Allerdings können wir die Frage noch ein paar Wochen/Monate nach hinten schieben - bzw. so lange, bis wir wirklich was haben, dass wir einfach verkaufen können. Die Flyer sind für Drive-Through vielleicht doch etwas zu klein, oder?
Hier gibt es noch mehr
Hier gibt es noch mehr Bilder, die wir nutzen können: ftp://subversiva.org/uploads/
Habe gerade heute die Infos zu den dafür nötigen Namen der Autoren bekommen :)
Hast du eine Idee, wie wir
Hast du eine Idee, wie wir den Intro-Text auf der Startseite verbessern könnten?
(wie gesagt: An dem schraube ich schon lange, bin aber nicht wirklich zufrieden: Er ist immernoch viel zu lang…)
Ich mach mir mal Gedanken.
Ich mach mir mal Gedanken.
Danke!
Danke!
Kein Ursache!Siehe
Kein Ursache!
Siehe hier: Brainstorming
EDIT (drak): Habe deinen Link angepasst, damit er genommen wird.
Ich habe mal versucht, deine
Ich habe mal versucht, deine Konzepte Minimalinvasiv umzusetzen. Wie findest du den neuen Header der Seitenleiste?
schaffst du es, das „über
schaffst du es, das „über 1w6“ in der Seitenleiste immer im Vordergrund zu halten? Ich habe es gerade versucht, und der Browser hält sich nicht an die z-index Definition…
Ich habe jetzt einen
Ich habe jetzt einen Usability-Test gemacht1 und das Ergebnis war: Meine Änderungen in der Navi sind nicht sichtbar. Dein Header sieht cool aus. Daher würde ich die nächste Zeit versuchen, ein Theme mit deinem Header zu basteln, auf das wir hier dann erstmal selektiv umschalten können (pro Seite), bis es poliert ist.
Experimentelle Ergebnisse gewinnen… :)
Anders gesagt: Ich habe meine Frau gefragt, was sie sieht ;) ↩
Frau fragen ist ne Superidee
Frau fragen ist ne Superidee :)
Wir könnten auch einen A/B-Test machen oder einfach mal verschiedene Versionen zur Abstimmung stellen.
Für einen A/B test
Für einen A/B test bräuchten wir erst eine komplexere Auswertung der Server-Statistiken: Noch kann ich nicht automatisch sagen, welche Seite wie viele Leute auf die Download-Seite gebracht hat. Daher würde ich eher einfach die beiden Themes testen, sie verschiedenen Leuten zeigen und uns danach etwas Zeit lassen, dass sich beide Layouts setzen können. Sonst ist ein halbwegs objektiver Blick schwer zu erreichen (zumindest für mich…).
Was für ein Tracking hast
Was für ein Tracking hast du denn?
Wo kann man sich eigentlich auf der mobilen Seite einloggen???
Bisher haben wir für
Bisher haben wir für Tracking nur das hier: 1w6.org usage.
Die Pseude-Mobile Seite (einfach schmal) hat den Login nur in der Seitenleiste - also click-to-hover, dann login.
Blöderweise schaffe ich es gerade nicht mehr, „Über 1w6“ immer sichtbar zu halten (also vor dem Inhalt). Ein Knopf „Seitenleiste zeigen“ wäre ideal, aber dazu bin ich noch nicht gekommen…
Hast du schon mal über
Hast du schon mal über Google Analytics nachgedacht? Damit wäre sogar ein A/B-Test einfach.
Habe ich, aber ich bekomme
Habe ich, aber ich bekomme Magenschmerzen beim Gedanken daran, jedem unvorsichtigen Benutzer der Seite Google-Skripte aufzudrücken, die jede seiner Handlungen aufzeichnen. Das ist auch der Grund, warum das aktuelle Theme keine aktiven Flattr-Knöpfe mehr hat: Ich will kein Live-Tracking aller Nutzer durch eine dritte Partei, weil die Daten sonst sehr schnell verknüpft werden und echte Personenprofile bilden.
Du musst in Deutschland doch
Du musst in Deutschland doch eh den anonymisierten Code einsetzen.
Übrigens echte Personendaten produzierst du eh schon lange im Netz :)
Meine eigenen schon, aber
Meine eigenen schon, aber nicht die unserer Besucher…
Nachdem ich in einer Handystudie gesehen habe, wie wenige Daten schon genügen, um eine Person eindeutig zu identifizieren, bin ich da lieber vorsichtig (und ich bin mir sicher, dass Google die Daten weiternutzt - warum sonst würden sie Google Analytics anbieten?).
Wir können allerdings einen poor-mans A/B test machen, indem wir einfach einen Monat lang das neue Design nutzen und die Download-Zahlen vergleichen. Das ganze können wir über die Zugriffe auf neue Artikel und die Startseite normieren, um zu sehen, wie sich der Zugriff auf die Downloads verändert.
Ich sehe dabei 4 Erfolgsmetriken (3 davon sinnvoll):
Ideal wäre es natürlich, Seiten-Interne Referrer zu nutzen: Von wo aus sind Leute auf die Download-Seite gekommen? Damit könnten wir dann das Design auch einfach auf Unterseiten umstellen. Aber das haben wir noch nicht…
Die langfristig am häufigsten besuchten Unterseiten sind übrigens Interessante Charaktere darstellen Teil 2.5: Was brauchen NSCs mindestens? und Rollenspiel, persönliche Entwicklung und die SL (wobei letztere die letzten zwei Monate weniger stark besucht wurde. Vielleicht weil jemand ein ganzes Buch zu dem Thema veröffentlicht hat…). Dazu in den letzten Monaten noch Freies Rollenspiel (RPG) und die Lizenzbestimmungen.
Durch eine Anpassung des Designs auf den 4 Seiten könnten wir also einen Test machen, wie sich mit dem Design die Metriken bei zufälligen Besuchern ändern.
Wie deinen eigenen schon.
Wie deinen eigenen schon. Man anonymisiert doch die Code hier auf der Seite, damit kein IP übertragen wird.
Vielleicht einfach mal vier Designvarianten vorstellen und dann sollen die Besucher ihren Senf dazugeben.
Das heißt, es wird jedem
Das heißt, es wird jedem Besucher eine Zufallszahl zugewiesen, die übertragen wird - und die nicht über Neubesuche erhalten bleibt? (Falls sie erhalten bleibt, ist die Anonymität durch Korellationen mit Besuchen auf anderen Seiten schnell hinfällig)
4 Varianten vorstellen klingt gut. Die einzige Begrenzung, die es dafür gibt, ist dass wir dafür erstmal 4 halbwegs polierte Varianten brauchen :) (Die Änderungen der Seitenleiste dauerten nur 30 Minuten oder so - während meine Tochter auf meinem Arm hing :) - das ist auch der Grund, warum meine echte Kreativzeit relativ knapp bemessen ist: Um wirklich neues zu entwickeln, brauche ich ungestörte Zeit. Kleineren technischen Feinschliff kriege ich auch mit Kind auf dem Arm hin :) )
Ja, so in
Ja, so in etwa:
_anonymizeIp()
https://developers.google.com/analytics/devguides/collection/gajs/methods/gaJSApi_gat?hl=de
Es geht ja erstmal um die Idee und nicht darum die Crowd über das entgültige Design abstimmen zu lassen.
Habe kurz nachgeschaut: Es
Habe kurz nachgeschaut: Es wird einfach der individuelle Teil der IP weggelassen (effektiv werden nur Provider + Subnetz gespeichert).
Ansonsten ja: Nächster Schritt: Themes für verschiedene Ideen (wenn du es machen willst: Das Template sieht bis zum sichtbaren Titel der Seite fast genau wie der Code hier aus (bis
<div …=content>), ich kann also Änderungen an der Struktur hier fast 1-zu-1 als Alternativ-Theme verwenden.Das ist auch einer der Gründe, warum der Code hier so unsauber aussieht: Ich habe von Hand verschiedene templates und CSS-Dateien zusammengefasst, um leichter basteln zu können…Ich kann dir auch einfach mal das Template schicken (allerdings frühestens heute Abend).
Hast du eigentlich die
Hast du eigentlich die Konzepte für EWS 3.0 gesehen?
Das muss ich mir mal in Ruhe
Das muss ich mir mal in Ruhe durchlesen.
Kommentar hinzufügen