Schreibweise? CSS richtig verlinken

Toro · #1 (**permalink**) 27.06.2014, 19:58

Hallo,

ich habe ein neuen Unterordner mit HTML-Seiten erstellt. Mein 'normales CSS’' soll auch auf diesen Seiten angebracht werden.
Wenn ich im head schreibe:

Code:

<head>
    <title>blah blah</title>
    <link href="../img/favicon.ico" rel="shortcut icon" type="image/x-icon">
    <link href="../css/erstes.css" rel="stylesheet" type="text/css">
    <link href="../css/zweites.css" rel="stylesheet" type="text/css">
</head>

... funktioniert alles richtig.

Meine Frage ist, sollte ich lieber schreiben:

Code:

<head>
    <title>blah blah</title>
    <link href="http://mein-domain.de/img/favicon.ico" rel="shortcut icon" type="image/x-icon">
    <link href="http://mein-domain.de/css/erstes.css" rel="stylesheet" type="text/css">
    <link href="http://mein-domain.de/css/zweites.css" rel="stylesheet" type="text/css">
</head>

Welche Vor/Nachteile gibt es da? Wird das eine vielleicht schneller gehen als das andere?
(es ist eine HTML-5 Website)

gabischatz · #2 (**permalink**) 27.06.2014, 20:56

Hi, ich denke das macht kaum einen unterschied , und wenn dann ur im millisekundenBereich . Ich würden würde den Base tag verwenden Edit fiddle - JSFiddle

Browserwerk · #3 (**permalink**) 29.06.2014, 05:14

Es macht definitiv einen Unterschied! Stell dir vor du ziehst irgendwann mal mit der Seite um und hast alle Links absolut (also mit http://www.domain.de/blabla) verlinkt. Dann musst du alle Links per Hand suchen und hoffen, dass du auch wirklich alles findest. Also immer relativ (deine 1. Variante) verlinken, das ist die sauberste Lösung...

Toro · #4 (**permalink**) 29.06.2014, 14:05

Danke für euren Feedback.

Ich habe wohl auch vergessen zu schreiben das es sich um ein static Website handelt, also kein CMS. Wie "Browserwerk" sagt, müsste ich dann auf jeder Seite jeden Link bearbeiten. Damit hab ich kein Problem das zu tun, es sind bisher nur etwa 25 Seiten - wenn das Ergebnis das sicherste ist das alles immer richtig geladen wird.
Einen base-tag zu setzen scheint auch eine gute Lösung zu sein, aber dann müsste ich auch alle links ändern, denn wie man in der fiddle (oben von gabischatz) sieht, funktioniert meine jetzige Version dann mit dem base-tag nicht mehr.
Wie ich verstehe, wird der erste Teil des links href="../ordner/file-name.css" interpretiert als "einen level höher" und es scheint ja zu funktionieren von meiner Perspektive, also wenn ich die Webseiten klicke. Aber ist das eine akzeptable Form die links so zu schreiben. Ich will das bloß richtig haben, sodass es keine Konflikte geben kann und die Seite (oder das CSS) wird nicht geladen.

cloned · #5 (**permalink**) 30.06.2014, 08:01

Es ist beides valide, also bleib bei deinen relativen Links. Einen Geschwindigkeitsunterschied wird es nicht geben (und wenn, dann nur im nicht bemerkbaren Millisekundenbereich, wie gabischatz bereits schrieb)
Aber wenn du schon betonst, dass es eine HTML5 Seite ist, warum lässt du dann nicht die type-Attribute für die Stylesheets weg, der default ist nämlich schon text/css.

olwazt · #6 (**permalink**) 02.07.2014, 09:58

Einfacher wäre es natürlich, wenn du dir eine bswp. style.css einbindest du da drin die einzelnen CSS Dateien per @import holst. Hätte den Vorteil, dass du weniger Request hättest und Google mag deine Seite wieder ein wenig mehr

explanator · #7 (**permalink**) 02.07.2014, 10:10

@import ist eine schlechte Variante, da dann die CSS-Dateien nacheinander geladen werden, anstatt parallel.
Siehe auch How to avoid CSS @ import

Mehr als eine CSS-Datei sollte es sowie nicht geben.

olwazt · #8 (**permalink**) 02.07.2014, 11:25

Alternativ wäre die Verwendung von Compass in verb. mit SASS/SCSS Files und Rake. Einfach mal googlen...

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
CSS Navigation funktioniert nicht richtig :( Hilfe!	12morefacts	CSS	6	05.01.2014 17:42
Wege zum guten CSS - Ausgewählte Links	Sp33dy G0nz4l3s	Ressourcen	1	27.05.2008 11:09
CSS Seite verlinken	\|SONY\|	CSS	2	05.11.2006 17:13
CSS Buchtipp Eric A. Meyer	vistahr	Ressourcen	2	01.11.2006 18:53
Frage zur Schreibweise in CSS	Anonymous	CSS	20	31.08.2004 23:10