Frage Soll ich "text-align: justify" vermeiden?


Gibt es einen Grund, den Gebrauch zu vermeiden? text-align: justify;?

Verringert dies die Lesbarkeit oder verursacht Probleme?


75
2017-11-24 23:16


Ursprung


Antworten:


Dies ist erstens ein rein designbezogenes Problem und eine Lösung. Das Design Ihres Rasters gibt an, ob Text gerechtfertigt ist. Ich denke, justice align alone hat keinen wesentlichen Einfluss auf die Usability. Eine schlechte Typografie, die Text unleserlich macht, verringert die Benutzerfreundlichkeit. Das heißt, stellen Sie sicher, dass Sie solide Kontraste und eine gute Balance der Abstände in Ihrem Typ haben. Schriftgröße ist auch wichtig.

Diese Seite ist ein erfolgreicher Versuch, Text online zu rechtfertigen. Da Sie die Abstände zwischen Buchstaben und Wörtern nicht so sehr mit CSS steuern können wie mit InDesign, ist es viel schwieriger, Text zu rechtfertigen und keine "Flüsse" von Leerzeichen in Ihren Zeilen zu haben, was bei Leerzeichen zwischen Wörtern geschieht überschreitet die Abstände zwischen den Zeilen. Dinge, die die Rechtfertigung von Texten erschweren: lange Wörter, Zeilenbreiten, die nicht genügend Wörter enthalten, und zu viel Kontrast zwischen Text und Hintergrundfarben; Sie lassen die Flüsse breiter und deutlicher erscheinen.

Das typografische Ideal ist, einen geraden Textblock zu haben, in dem, wenn Sie den Textblock schielen, ein einheitlicher fester Schatten wird. Also, wenn Sie Text auf etwa 10px und 60% grau auf weißem Hintergrund halten und Zeilen haben, die etwa 20 Wörter passen, sollte justify align nicht hässlich aussehen. Bedenken Sie jedoch, dass dies die Benutzerfreundlichkeit nicht verbessert. Kleiner, relativ leichter Text stört viele Leute, besonders die älteren Leser.

Ich sollte das mit bemerken ­ (weiche Silbentrennung) korrekt trennen lange lästige Wörter wie SuperSome können Sie richtigen Satz (z. B. InDesign) nachahmen. Es gibt eine Menge Sachen da draußen, die dir dabei helfen können. Ich würde die Logik zum Verbergen, Manipulieren und Anzeigen des Textes, der auf der Client-Seite zu erledigen ist, vielleicht mit Dies.

Bearbeiten: Wie andere unten erwähnen, css Bindestriche sind jetzt möglich, außer nicht machbar (nicht in Chrome). Plus, css4 bietet noch mehr Kontrolle.


59
2018-03-18 09:25



text-align: justify sollte nicht verwendet werden in Browsern im Moment. Sie sind nicht gut im Umgang mit den winzigen Details innerhalb und die Ausgabe endet mit vielen Flüssen und es gibt keine Unterstützung für Silbentrennung (außer weichen Bindestrichen).

Hinweis oben wurde vor 4,5 Jahren geschrieben. Die Dinge ändern sich langsam ... http://caniuse.com/#feat=css-hyphens

Bearbeiten: Bindestrich wurde in den Kommentaren dieser Antwort auf mich aufmerksam gemacht. Es sieht so aus, als ob es die Verwendung von text-align rechtfertigen würde, schau dir die Seiten an, die es benutzen. Vielleicht möchten Sie Javascript verwenden, um Text-Align-Justieren vor der Verwendung dieses Skripts anzuwenden, so dass diejenigen ohne Javascript nicht erwischt werden.

Bearbeiten 2: CSS erlaubt jetzt Silbentrennung mit dem hyphens Eigentum [Browser-Unterstützung]. PPK sagt jetzt zu Fügen Sie es Ihren Stylesheets hinzu, während Eric Meyer sagt fügen Sie es einfach für das Handy hinzu.

Bearbeiten 3: Ein guter kleiner Überblick Dinge, die uns jetzt zur Verfügung stehen, mit einigen SASS.


25
2017-11-24 23:30



Die von anderen aufgeworfenen Probleme, die Ausrichtung zu rechtfertigen, sind häufiger bei engen Spalten. Wenn Ihre Spalten im Verhältnis zur Schriftgröße und anderen Parametern groß genug sind, ist es in Ordnung, den Text zu rechtfertigen. Nehmen wir an, Sie möchten durchschnittlich mindestens 12 bis 15 Wörter pro Zeile. Mehr ist besser.


12
2017-11-24 23:47



Es gibt keinen technischen Grund, es nicht zu tun - es ist eine reine Designentscheidung. Viele Leute finden, dass es gerechtfertigt ist, Text mit Recht zu lesen, aber ich schätze, das hängt von Ihrer Situation ab. Obwohl es für den Druck gut funktioniert, geben Webbrowser im Allgemeinen nicht genug Kontrolle über die eventuelle Ausgabe von Text, um zu garantieren, dass das, was Sie liefern, auf manchen Leuten nicht wie Müll aussieht.

Ihre beste Option ist es, eine Rechtfertigung zu vermeiden.


6
2017-11-24 23:21



Ich kann mir keinen zwingenden Grund vorstellen, warum man Text nicht rechtfertigen sollte - zu einem bestimmten Zeitpunkt verlangen Inhalt und Umfang des Inhalts fast, dass er gerechtfertigt ist. Natürlich wirst du Probleme mit Inhalten bekommen, die aus bestimmten Wortkombinationen bestehen, aber in meinen Augen, wenn du Flüsse und ungewöhnlich große Zwischenräume zwischen Wörtern siehst, hast du ein ganz anderes Problem - eins mit Lesbarkeit und Klarheit.

Was ich um jeden Preis vermeiden würde, ist zentrierter Körpertext. Ich glaube nicht, dass es eine größere rote Fahne des ammaierischen Webdesigns gibt.


3
2017-11-25 09:15



Ich bevorzuge linksbündige Ausrichtung (text-align: left), weil es im Allgemeinen besser lesbar ist. Es ist auch schneller, Wörter mit gleichen Abständen zu lesen, also höre ich. Sofern Sie nicht einen stilistischen Grund für die Verwendung von justify haben, halten Sie es links, rechts oder in der Mitte. Speziell für Body Text, benutze links. (Eigentlich möchten Sie etwas wie "vorwärts" für Text in der anderen Richtung (z. B. Hebräisch) ...)


1
2017-11-24 23:21



Wie bei jeder Webdesign-Frage ... kommt es darauf an. Wie bereits angedeutet, sieht ein begründeter Text in engen Spalten normalerweise nicht gut aus. Ich würde in Sidebars generell als Regel empfehlen, da Sidebars normalerweise schmal sind.

Mit Körperkopie bei den oft empfohlenen 10 Wörtern pro Zeile (oder mit jedem darüber liegenden Betrag) werden Sie wahrscheinlich mit gerechtfertigtem Text davonkommen und ihn die meiste Zeit einigermaßen gut aussehen lassen, es sei denn, Sie verwenden viel wirklich lange Wörter und / oder Zeichenfolgen.

Ich denke, ich habe diese Seite vorher auf StackOverflow gepimpt, aber Jon Tan verwendet in seiner Körperkopie (innerhalb von Artikeln) begründeten Text und sieht in 99,99% der Fälle gut aus.


1
2017-11-25 00:29



Begründung sollte nicht ohne Silbentrennung verwendet werden. Hier ist ein PHP-basierte Silbentrennungsbibliothekund ein Port dieser Bibliothek zu einem WordPress-Plugin: wp-Typografie.


1
2017-07-18 16:05



Ich denke, es ist vollkommen in Ordnung auf Druck, aber es ist klobig auf den meisten Web-Browsern, durch die fehlende feine Kontrolle der Abstände und Silbentrennung. Typografen können in manchen Fällen sogar etwas auf Buchstabenabstand oder Schriftkontraktion spielen, da Seiten / Spalten (zumindest in Magazinen) fein abgestimmt werden können.


0
2017-11-24 23:25



Erh ... Nein ...!

[ernst] WordPress verwendet rechtfertigen, und ich denke, das ist eine ziemlich starke Aussage in Bezug darauf, ob es die Lesbarkeit verringert oder nicht ...


0
2017-11-25 00:32