it-swarm.com.de

Sollten <br /> und <hr /> im Webdesign unbedingt vermieden werden?

Ich finde ständig Stellen, an denen ich das <br /> -Tag verwenden muss, weil CSS nicht das kann, was ich brauche. Wird der <br /> nicht als Teil des "Designs" und nicht als Teil der Dokumentstruktur betrachtet? Was ist die akzeptable Verwendung dafür? Sollten die gleichen Regeln auch für den <hr /> gelten?

Hier ist ein Beispiel dafür, wo ich gezwungen bin, das <br /> -Tag zu verwenden:

Ich möchte dies anzeigen:

<address>1234 south east Main St. Somewhere, Id 54555</address>

so was:

 1234 South East Main Street 
 Irgendwo, Id 54555 
39
Micah

Es ist nichts falsch mit <br /> oder <hr />. Keines von ihnen sind veraltete Tags, auch nicht in der neuen HTML 5-Entwurfsspezifikation (relevante spec info ). Tatsächlich ist es schwierig, die korrekte Verwendung des <br /> -Tags besser als das W3C selbst anzugeben:

Im folgenden Beispiel wird das br-Element korrekt verwendet:

<p> P. Sherman <br>
42 Wallaby Way <br>
Sydney </ p>

br-Elemente dürfen nicht zum Trennen thematischer Gruppen in einem Absatz verwendet werden.

Die folgenden Beispiele sind nicht konform, da sie das Element br missbrauchen:

<p> <a ...> 34 Kommentare. </a> <br>
<a ...> Kommentar hinzufügen. <a> </ p>

<p> Name: <input name = "name"> <br>
Adresse: <eingabe name = "address"> </ p>

Hier gibt es Alternativen zu den oben genannten, die korrekt sind:

<p> <a ...> 34 Kommentare. </a> </ p>
<p> <a ...> Kommentar hinzufügen <a> </ p>

<p> Name: <input name = "name"> </ p>
<p> Adresse: <eingabe name = "address"> </ p>

<hr /> kann durchaus auch Teil des Inhalts sein und nicht nur ein Anzeigeelement. Verwenden Sie ein gutes Urteilsvermögen, wenn es um den Inhalt geht und was nicht, und Sie wissen, wann Sie diese Elemente verwenden. Sie sind beide gültige, nützliche Elemente in den aktuellen W3C-Spezifikationen. Aber mit großer Kraft geht eine große Verantwortung einher, also benutze sie richtig.

Edit 1:

Ein anderer Gedanke, den ich hatte, nachdem ich zum ersten Mal auf "post" geklickt hatte - in den letzten Jahren gab es unter den Web-Entwicklern eine Menge Anti-Table-Stimmung, und das aus gutem Grund. Die Leute missbrauchten das <table> -Tag und verwendeten es für das Site-Layout und die Formatierung. Das ist nicht das, wofür es gedacht ist, also sollte man es nicht so verwenden. Bedeutet das aber, dass Sie never das <table> -Tag verwenden sollten? Was ist, wenn Sie tatsächlich eine Ehrlichkeitstabelle in Ihrem Code haben, zum Beispiel, wenn Sie einen wissenschaftlichen Artikel schreiben und das Periodensystem der Elemente einfügen möchten? In diesem Fall ist die Verwendung von <table> völlig berechtigt, es wird eine semantische Markierung statt einer Formatierung. Es ist die gleiche Situation mit <br />. Wenn es Teil Ihres Inhalts ist (dh Text, der an diesen Stellen beschädigt werden sollte, um korrektes Englisch zu sein), verwenden Sie ihn! Wenn Sie es nur aus Formatierungsgründen tun, versuchen Sie es auf andere Weise.

65
Joshua Carmody

Solange Sie nicht <br/> verwenden, um Absätze zu bilden, sind Sie wahrscheinlich in meinem Buch in Ordnung;) Ich hasse es zu sehen:

<p>
  ...lengthy first paragraph...
  <br/>
  <br/>
  ...lengthy second paragraph...
  <br/>
  <br/>
  ...lengthy third paragraph...
</p>

Eine Adresse würde ich so machen:

<address class="address">
  <span class="street">1100 N. Wullabee Lane</span><br/>
  <span class="city">Pensacola</span>, <span class="state">Florida</span> 
  <span class="Zip">32503</span>
</address>

Aber das liegt wahrscheinlich daran, dass ich jQuery liebe und jederzeit auf einen dieser Teile zugreifen möchte :)

15
Sampson

Ich persönlich denke, es gibt viel schlimmere Dinge, als Sie diese beiden Tags verwenden könnten. Sich übermäßig zu sorgen, ist Zeitverschwendung.

8
alex

<hr /> und <br /> können, genau wie alles andere, für Designzwecke missbraucht werden, wenn dies nicht der Fall sein sollte. <hr /> soll verwendet werden, um Textabschnitte visuell zu unterteilen, jedoch in einem lokalisierten Sinne. <br /> soll dasselbe tun, jedoch ohne die horizontale Linie.

Es wäre ein Designfehler, <hr /> über eine Website hinweg als Design zu verwenden. In diesem Beitrag wäre es zum Beispiel richtig, <br /> und <hr /> zu verwenden, da dieser Textabschnitt immer noch ein Textabschnitt sein muss. Auch wenn sich das Site-Layout geändert hat.

7
George Stocker

<hr/> und <br/> sind Darstellungselemente, die für das Dokument keinen semantischen Wert haben. Aus puristischer Sicht sollten sie also vermieden werden.

Stellen Sie sich HTML nicht als Präsentationswerkzeug vor, sondern als Dokument, das sich selbst beschreiben muss. <hr/> und <br/> fügen keinen semantischen Wert hinzu, sondern repräsentieren eine sehr spezifische Darstellung im Browser.

Seien Sie in Ihrer Herangehensweise pragmatisch. Versuchen Sie, sie um jeden Preis zu vermeiden, aber wenn Sie die Wände und die Decke überdecken, um sie zu vermeiden, ist es besser, sie einfach zu verwenden. Semantik ist wichtig, aber Randfälle wie diese sind nicht der Ort, an dem sie am wichtigsten sind.

4
Andrew Hare

Ich glaube absolut vermeiden Die Verwendung einer allgemein akzeptierten Lösung (selbst wenn sie veraltet ist) ist dasselbe wie das Entwerfen einer Tabelle mit <div>-Tags anstelle von <table>-Tags, nur damit Sie <div> verwenden können.

Bei der Gestaltung Ihrer Website werden Sie wahrscheinlich nicht die Verwendung von <br />-Tags verwenden, aber ich kann mir immer noch vorstellen, dass sie nützlich sind, wenn zum Beispiel Benutzereingaben erforderlich sind.

Ich sehe nichts falsch mit <br />, bin aber nicht auf viele Situationen gestoßen, in denen ich benötigt benutze. In den meisten Fällen gibt es wahrscheinlich elegantere (und schönere) Lösungen als die Verwendung von <br />-Tags, wenn dies für die vertikale Trennung von Inhalten erforderlich ist.

4
Aron Rotteveel

Nein, warum? Sie sind nützliche Konstrukte.


Hinzufügung dieses Nachtrags (mit begleitender HR), falls meine kurze Antwort als unzureichend betrachtet wird. ;) 

Es kann und ist oft eine unglaubliche Zeitverschwendung - Zeit, für die ein anderer normalerweise zahlt - versucht, mit browserübergreifenden, CSS-limitierten Lösungen für Benutzeroberflächenprobleme zu beginnen, die BR- und HR-Tags und ihre Vorlieben können in zwei Sekunden lösen. Warum manche UI-Leute so viel Zeit damit verschwenden, nach "reinen" Wegen zu suchen, um bewährte HTML-Konstrukte wie Zeilenumbrüche und horizontale Regeln zu verwenden, ist für mich ein Rätsel. Beide Tags sind unter vielen anderen völlig legitim und stehen Ihnen tatsächlich zur Verfügung. "Rein" ist in diesem Sinne Quatsch. 

Ein Designer, mit dem ich zusammenarbeitete, konnte sich einfach nicht dazu durchringen. Er verschwendete Stunden, manchmal Tage, versuchte "herumzucodieren" und hatte immer noch etwas vor, was in Opera nicht funktionierte. Ich fand das total verwirrend. Alter, füge BR hinzu, fertig. Absolut legal, funktioniert wie ein Zauber und alle sind glücklich.

Ich bin alles für die Abstraktion von Präsentationen, versteh mich nicht falsch. Wir sind alle für die beste Arbeit, die wir können. Aber sei vernünftig. Wenn Sie fünf Stunden versucht haben, einen Weg zu finden, um in der Schrift etwas zu erreichen, das BR Ihnen gerade jetzt gibt, und die Götter nicht regnen, weil Sie es tun, dann tun Sie es und machen Sie weiter. Wenn das so problematisch ist, könnte die Lösung ohnehin nicht stimmen.

3

Ich füge einen <hr style="display:none"> zwischen den Abschnitten ein. Zum Beispiel zwischen Spalten in einem mehrspaltigen Layout. In Browsern ohne CSS-Unterstützung ist die Trennung dennoch klar.

3
user35612

Ich persönlich bin der Meinung, dass <br /> und <hr /> im Interesse einer echten Trennung von Inhalt und Stil vermieden werden sollten. 

Soweit ich <br />-Tags in meinem eigenen Markup abschaffe, verwende ich <div> in Verbindung mit der Eigenschaft css margin für alle Zeilen, die einen Zeilenumbruch erfordern, und einen <span> für alles, was Inline wäre, aber mit einer anderen "Inhaltsklasse" (Sie unterscheiden sie offensichtlich mit dem Attribut class).

Um ein <hr />-Tag durch css zu ersetzen, erstelle ich einfach einen <div> mit der border-top-style css-Eigenschaft, die auf solid gesetzt ist, und die anderen drei Seiten auf none. Die margin- und die padding-Eigenschaft des <div> übernehmen dann die tatsächliche Platzierung/Positionierung der horizontalen Linie.

Wie ich schon sagte, ich bin kein Experte, meine Erfahrung im Webdesign ist hauptsächlich ein Nebeneffekt meiner Arbeit mit JSP-Seiten (ich bin ein Java-Programmierer), aber ich kam während einer Recherche auf diese Frage und wollte meine zwei Cents einbringen ...

1
BMB

Interessante Frage. Ich habe <br/> immer als Wagenrücklauf (und damit wirklich als Teil des Inhalts) verwendet. Ich bin mir nicht sicher, ob das der richtige Weg ist, aber es hat mir gut getan.

<hr/> andererseits ...

1
Vaibhav

Ich würde nicht sagen um jeden Preis aber wenn Sie puristisch sein wollen, haben diese Tags nichts mit Struktur und allem Layout zu tun, aber HTML soll Inhalt von Präsentation trennen. <hr /> kann durch die Verwendung von otehr-Tags wie <br/> durch CSS und <p> erfolgen.

Wenn du kein Purist sein willst, benutze sie :)

1
Keltia

Ich denke, Sie sollten das BR-Tag selten in Ihren Vorlagen benötigen. Zuweilen kann jedoch inhaltlich, benutzergeneriert und systemgeneriert abgerufen werden. Zum Beispiel, wenn Sie einen Text im Absatz behalten möchten, vor dem Sie jedoch eine neue Zeile benötigen.

Bei welchen Anlässen müssen Sie BR-Tags verwenden?

1
PEZ

<br> ist die HTML-Methode, um einen Zeilenumbruch auszudrücken, da es keine andere Möglichkeit gibt.

Physische Zeilenumbrüche im Quellcode werden zu Recht ignoriert (richtiger als ein einziges Leerzeichen behandelt), daher benötigen Sie einen Markup-Weg, um sie auszudrücken. 

Nicht jeder Zeilenumbruch ist der Anfang eines neuen Absatzes, und das Einbetten von Text in <div>s (zum Beispiel), nur um <br>s zu vermeiden, erscheint mir zu paranoid. Warum stören sie dich?

1
Tomalak

BR ist in Ordnung, da ein harter Zeilenumbruch Teil des Inhalts sein könnte, zum Beispiel in Code-Blöcken (obwohl Sie wahrscheinlich das PRE-Element dafür verwenden würden) oder den Text.

HR dagegen ist rein präsentativ: eine horizontale Regel, eine horizontale Linie. Verwenden Sie stattdessen border-top/bottom für benachbarte Elemente. 

1
Arve Systad

stellen Sie sicher, dass Sie eine DTD mit einschließen, die XHTML angibt.

Wenn Ihre DTD fehlt oder HTML4 angibt, würde totes Fleisch als korrekter HTML4-Code oder darunter das Dokument mit spitzen Klammern verschmutzen.

0
Joshua

Sie können <br> verwenden, aber nicht <hr>.

<BR> - LINE BREAK
- Dies sind Anzeigeinformationen. Noch in Gebräuchlicher Gebrauch, aber mit Zurückhaltung.

<HR> - HORIZONTALE REGEL
- Informationen ohne semantischen Wert anzeigen - Niemals verwenden. „Horizontal“ ist per Definition ein visuelles Attribut.

Quelle: Anleitung zur richtigen Verwendung für HTML-Tags

0
Geoffrey Hale

Die Personalabteilung hat im Moment einige hysterische Anwendungen, um zu verhindern, dass die Algorithmen der Font-Inflation von mobilen Browsern wirksam werden.

Wenn Sie über viele kleine Inhalte verfügen, die durch HRs getrennt sind, wird der Googlebot derzeit als "N separate Einträge" angezeigt, was für Sie nützlich sein kann.

BRs sollten eigentlich nur als Zeilenumbruch innerhalb eines Absatzes verwendet werden, was eine recht seltene typografische Verwendung ist (außer vielleicht innerhalb einer Tabellenzelle), und ich weiß nicht, dass es einen hackigen Grund gibt, sie zu verwenden.

0
Jake