Beiträge von rantanplan2000

Sorry, aber deine Frage ist mich mich zumindest komisch formuliert.

Du willst eine gleiche Höhe, egal auf welcher Seite, aber dass ganze ohne fixe Höhenangabe?
Oder meinst du die Position des Footers? Also dass er am "Boden klebt"? Sticky Footer?

Naja, jag die Demoseite durch paar Links und schau, welches bessere Ergebnisse erzieht ...
Bilder optimierung ect. kannst du natürlich nicht so eng sehen, da du die ja änderst und bei Demos meistens eh nicht optimiert werden.

https://jigsaw.w3.org/css-validator/ CSS Test
https://gtmetrix.com/remove-unused-css.html Unbenutztes CSS
https://validator.w3.org/ HTML Test
https://www.webpagetest.org/ Performance
https://developers.google.com/speed/pagespeed/insights/?hl=de Performance

Dann Teste die Seite in verschiedenen Browsern und guck, ob du wenigstens bei allen aktuellen Versionen gescheit aussieht bzw. überleg, wie weit nach hinten dur Browser-Support haben willst. Bietet man z.B. Produkte für eine "Schreinerei" an, kann man davon ausgehen, dass dort viele alte Kisten rumstehen, die eventell noch alte Browser haben. Hat man einen Technikladen, reichen wohl alle aktuellen Browser-Versionen aus.
[h=2][/h]

Zitat von AmFearLiath

genauer erklärt wäre es wohl so:

Ein "Bild" ist ein Element im HTML Gerüst welches durch ein <img src="http://forum.wpde.org/bild.jpg" /> eingebunden wird
Ein "Hintergrundbild" ist durch CSS einem Element wie eine Farbe als Hintergrund zugewiesen.

das sieht man doch im beispielcode ... wenn er das nicht raussieht, wird ihm html und css auch nichts sagen

Zitat von maksimilian

@ratanplan2000
Mit Logo meine ich einfach eine jpg-Datei. Wodurch erhält sie die Eigenschaft "Hintergrundbild" ? Und: wie schaue ich mir "breite und den margin des containers" an ? Welches containers ? Wie bereits erwähnt, ich bin newbi.
maksimilian

jpg ist ja nur ein bildformat. du kannst es als hintergrund (tapete an der wand) oder eben direkt (bild auf der wand) einbinden. die eigenschaft hintergrund erhält es durch css.

Ich habe dir ein Beispiel gemacht. geh mal mit der maus über das bild, dann siehst du es deutlicher.

[size=14]https://jsfiddle.net/rantanplan2000/xgfcrq1d/2/[/SIZE]

Der Adler ist ein "normales" Bild und der Rest ist ein Hintergrundbild.

p.s. bitte lad nicht für jeden "misst" (sorry) ein plugin. wenn du so anfängst, wirst kein freund mit google.

Zitat von maksimilian

Hallo Ihr,
Mein Versuch mit einer Property background-position scheitert. Wie muss ich es richtig anstellen ?
maksimilian

Ich gehe davon aus, dass dein Logo kein Hintergrundbild ist, daher wird es auch nicht funktionieren.
Wie schon gesagt, könnte float helfen. sonst schau dir mal breite und den margin des containers an, in dem das bild steht.

Das canonical ist schon dafür gedacht, aber das geht nur einmal pro seite. er müsste mit der methode jedes zitat bzw textabschnitt auf einer eigenen seite schreiben. das einzige wäre vielleicht, mit einem iframe die seiten einzeln laden, wobei ich dann nicht sicher bin, wie das canonical reagiert und iframes sollte man vermeiden.

auf nummer sicher könntest du eventuell mit einem popup-fenster gehen, welches dann eine neue seite mit canonical läd. vielleicht hübsch mit lightbox. hätte auch den vorteil, dass besucher etwas "beschäftigt" werden und nicht alles vor die nase gesetzt bekommen und dann gleich wieder gehen.

Diese ganzen Plugins machen auch nicht mehr, als deiner Seite einen Code hinzuzufügen. Du machst es eben manuel, was den Vorteil hat, dass meist viel weniger bzw. kein unnötiger Code geladen werden muss. Dir allerdings mal eben zu erklären wie man auf die herkämmliche Art Seiten verändert bzw baut, geht leider nicht mit 2-3 Sätzen.

Du nimmst den Code und baust ihn eben auf der jeweiligen Seite ein. Ich kann mal grob verallgemeinern, es gibt:

HTML - Das ist der Inhalt: Was gibt es alles. Der Code kommt in den Body der gewünschten Seite z.B. Index.html. Herachie von oben nach unten.
CSS - Wie ist der Inhalt: Ist für das aussehen und mittlerweile auch funktionen zuständig. Den Code lagert man am besten in ein stylesheet aus, welches man im head der gewünschten seite verknüpft. z.b. <link rel="stylesheet" type="text/css" href="css/style.css" /> .
Javascript (js/jquery) Was macht es so ... kann css mittlerweile zwar auch einiges, aber im prinziep regelt das verhalten js/jquery. Bindest man am besten auch ein: <script type="text/javascript" src="js/funktionen.js"></script>.

Wenn du also ein Tutorial anschaust, weist du, wo was hinmuss. Mehr musst du zum "Snippet-Kopieren" und einfügen erstmal nicht wissen. Du kopierst dir also den Code und setzt den auf die gewünschte Seite ein.

Dafür brauchst du eben ein editor. ich persönlich finde brackets von adobe sehr gut, (kostenlos) ist natürlich geschmackssache.

schau dir mal ein tutorial an:
https://www.youtube.com/watch?v=c7sbJjasSec

dann verstehst du es sicher am besten.

Mit Javascript geht das recht einfach schätze ich mal. Hab den Link nur überflogen, aber die finale version da sollte passen:
http://www.html-seminar.de/html-css-php-f…nd-automatisch/

Zitat von ABachi

Video2Brain empfehlen. Gruß

dort kann man glaube ich nach wie vor 10 oder 14 tage kostenlos testen. das reicht für einen css grundkurs locker aus.

vh ist halt doof für den IE und der ist halt top 3 browser und grade ältere sind da oft genutzt.
http://caniuse.com/#search=vh

doofe 15 minuten zeitspanne.

hier das gleiche background-img mit cover und contain:

<style type="text/css">
html, body { height: 100%; }
img { 
  width: 100% ; 
  height: 100%; 
  overflow: hidden;
}
  * {  margin: 0;
  padding: 0;
  border: 0;}
  
  
  .ab {
    background: red;
    padding: 30px 50px;
  }
  .one {
    background-image: url('https://images.gutefrage.net/media/fragen/bilder/teacup-schweinchen-gesucht/0_original.jpg?v=1312734130000');
    height: 100%;
    background-size: contain;
  }
  
    .two {
    background-image: url('http://www.kirasoftware.com/images/Fotolia_19136022_XS.jpg');
    height: 100%;
    background-size:cover;
  }
  
</style>




<div class="one">
asdasddasasddsaasd
</div>


<div class="ab">
  <h1>Hallo Welt</h1>
  <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus porro totam magnam consequatur maiores sit eaque quam, sed ratione possimus doloremque aperiam explicabo officiis voluptatibus autem perspiciatis sequi cum tenetur.ipsum dolor sit amet, consectetur adipisicing elit. Quasi tenetur itaque voluptates, obcaecati facilis temporibus aspernatur, at saepe, modi perferendis, et debitis non iste! Explicabo sed mollitia reiciendis asperiores, tenetur!</p>
</div>




<div class="two">
asdasddasasddsaasd
</div>

Wie du siehst, so würde es nicht gehen.

<style type="text/css">
html, body { height: 100%; }
img { 
  width: 100%; 
  height: 100%; 
}
  * {  margin: 0;
  padding: 0;
  border: 0;}
  
  
  .ab {
    background: red;
    padding: 30px 50px;
  }
</style>


<img src="https://images.gutefrage.net/media/fragen/bilder/teacup-schweinchen-gesucht/0_original.jpg?v=1312734130000" />




<div class="ab">
  <h1>Hallo Welt</h1>
  <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus porro totam magnam consequatur maiores sit eaque quam, sed ratione possimus doloremque aperiam explicabo officiis voluptatibus autem perspiciatis sequi cum tenetur.ipsum dolor sit amet, consectetur adipisicing elit. Quasi tenetur itaque voluptates, obcaecati facilis temporibus aspernatur, at saepe, modi perferendis, et debitis non iste! Explicabo sed mollitia reiciendis asperiores, tenetur!</p>
</div>




<img src="http://www.kirasoftware.com/images/Fotolia_19136022_XS.jpg" />

bzw. warte, du kannst mit overflow: hidden arbeiten! wird zwar was abgeschnitten vom bild, aber die proportion bleibt! das problem mit der anpassung bleibt ohne js aber. die höhe wird eben nur beim ersten laden angepasst und bleibt dann.

oder wie vorposter gesagt hat mit backgroundimage:

<style type="text/css">
html, body { height: 100%; }
img { 
  width: 100% ; 
  height: 100%; 
  overflow: hidden;
}
  * {  margin: 0;
  padding: 0;
  border: 0;}
  
  
  .ab {
    background: red;
    padding: 30px 50px;
  }
  .one {
    background-image: url('https://images.gutefrage.net/media/fragen/bilder/teacup-schweinchen-gesucht/0_original.jpg?v=1312734130000');
    height: 100%;
    background-size: contain;
  }
</style>




<div class="one">
asdasddasasddsaasd
</div>


<div class="ab">
  <h1>Hallo Welt</h1>
  <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ducimus porro totam magnam consequatur maiores sit eaque quam, sed ratione possimus doloremque aperiam explicabo officiis voluptatibus autem perspiciatis sequi cum tenetur.ipsum dolor sit amet, consectetur adipisicing elit. Quasi tenetur itaque voluptates, obcaecati facilis temporibus aspernatur, at saepe, modi perferendis, et debitis non iste! Explicabo sed mollitia reiciendis asperiores, tenetur!</p>
</div>




<img src="http://www.kirasoftware.com/images/Fotolia_19136022_XS.jpg" />

Du willst also, beim ersten Ladevorgang der Seite, dass das Bild 100% Höhe hat, beim Scrollen aber sich diese Höhe merkt und dann nach oben verschwindet, wenn man runter scrollt? Javascript-Fall würde ich sagen. Müsstest es eben dauerlaufen lassen das Script .... oder mit 2-3 Sekunden Pausen. Wenn sich die Ansicht ändert z.B. auf einem Smartphone von Hochkant zu Landscape, würde es sonst die Änderung nicht anpassen.

wenn du html, body auf 100% höhe und breite setzt und das bild außerhalb vom container hast, gehts auch nur ... nur past es sich dann eben nicht richtig an, wenn sich was am screen ändert. es gibt auch 16:9, 16:10 usw. das würde so nicht gehen. du müsstest das format auslesen und dann ein passendes bild laden, oder wirds einfarbig?. also doch js.

Du machst ein Rechtsklick auf die Navigation und dann Untersuchen. Dein Hamburger hat eine Breite von 35px und einen r. Padding von 15, also zusammen 50px. Mit calc kannst du eben von 100% einen festen Wert abziehen.

Was heißt zerschossen? Zerschießen kann man viel! Was genau stimmt nicht? Hast du eventuell den CSS-Code Fehlerhaft eingebaut, z.B: eine Endung (}) unterbrochen bzw. zwischen rein gesetzt? Such doch einfach mit strg f die klasse: "site-branding" und ersetze die 100% breite mit calc(100% - 50px);. Durch Abzug sollte sich eigentlich deine Desktop-Navi nicht verändern. Sonst setz es so:

/* Breakpoint eben auf den Wert einstellen, wo es den alten Fehler gegeben hat bzw. die mob- Nav einsetzt */
@media only screen and (max-width: 480px) {
.site-branding {
    width: calc(100% - 50px);
}
}

http://www.w3schools.com/css/css_rwd_mediaqueries.asp

Zitat von JABA-Hosting

Ist der Server überbucht, kann es passieren das nicht ausreichend freier Arbeitsspeicher zur Verfügung steht. Sieht man immer wieder bei den großen Hostern, wenn die Seite sehr langsam wird oder grundlos ein Error 500 (besonders bei Strato) kommt.

Also ich habe 3 Kunden bei Strato und keinerlei Probleme. Man bekommt dort aktuell glaube ich sogar SSL kostenlos dazu.

Für eine Webpräsenz kannst du eigentlich jeden aktuellen anbieter benutzen. Onlineshops sollten da schon etwas mehr Power dahinter haben. Das beste Preisleistungsverhältnis wäre wohl ein eigener Server.

Ich persönlich würde keinen noname anbieter buchen. erreichbarkeit auf dauer, service und support sind bei den großen in der regel besser. viele kleinanbieter sind im lauf der jahre auch gerne mal pleite gegangen oder haben beschlossen was anderes zu machen ...

http://lmgtfy.com/?q=css+schriftfarbe+%C3%A4ndern

ich bin kein anwalt, aber der satz wär mir zu heiß gewesen :-). du weist ja, abmahnmafia ist überall.

Zitat von Benzli

Kein Gymnasiast (bei euch würde das Pendant wohl Abi heissen) würde sich daher für meine Website interessieren. Das Email kam von einer ehemaligen Lehrerin und ich bin Fahrlehrer. Wenn das also stimmt, dann habe ich damit etwa 60% meiner möglichen Kundschaft vergrault.

Naja, bei einer Fahrschule ist es nicht ganz so schlimm, wie z.B. bei Nachhilfeunterricht. 60% ist auch etwas übertrieben. Viele denken sich halt ihren Teil und fertig. Abschrecken tut, so sehe ich dass, nur Sätze wie: "was du wolle hier". Abgesehen davon, auch viele Gymnasiasten verkacken in der 100% Rechtschreibung :-?. Fehler gibts auch bei Büchern und Zeitungen, trotz Lektor, zumindest in den ersten Ausgaben.

mach einfach eine robots.txt ins hauptverzeichnis, mit dem inhalt:

User-agent: *
Disallow: /

und lade die seite hoch. dann werden suchmaschinen die seite nicht Indexieren und du hast die seite trotzdem online. wenn du fertig bist, stellst du es um auf:

User-agent: *
Disallow:

und die Seitewird Indexiert, natürlich mit etwas Delay. Am besten am Ende direkt bei google zum anmelden.

Ansonsten probier es mit den entwicklertools (in der regel f12) im browser und schau was sache ist bzw. probier dort mal etwas rum.