Beiträge von The Scout

So, melde ich mich hier auch mal
Und am Anfang zwei Tipps
1) Zum Forum: Über dem Eingabefeld, zweite Zeile, ganz rechts, viele dunkelgraue Buttons, auf einem steht "CSS". Bitte nutzen
2) Zum Code: Dieser wird wesentlich übersichtlicher, wenn man ordentlich einrückt. Hier mal dein Code, anders eingerückt, im BB Code und mit Kommentaren:

* {
    margin: 0px;
    padding: 0px;
}




#test1 {
    background-color: #FF00FF;
}




header {
    font-size: 20px; /* Relative Angaben, wie % oder em, sind meist besser */
}




nav {
    font-size: 30px;
    float: left;
    font-size: 1.5em; /* Warum zwei Font-sizes? Das hier ist übrigens die gültige. */
    background-color: #000000;
    width: 300px;
}




nav strong {
    background-color: #FF00FF;
    color: white;
}




nav strong, a {
    text-decoration: none;
    border-top: 1px solid black;
    display: block;
    padding: 6px 6px 6px 4px; /* Semikolon fehlte, zwar optional da Ende, aber trotzdem besser */
}




nav a:hover {
    background-color: #0000FF;
    color: white;
}




nav ul {
    border-bottom: 1px solid black; /* Semikolon fehlte */
}




section {
    font-size: 80px; /* Das ist extrem groß... */
    float: left;
    margin-left: 50px;
    background-color: #008000;
}




footer {
    font-size: 3px; /* Wieder, relativ ist besser, außerdem sind 3px ziemlich klein */
    margin-top: 20em;
} /* Schlussklammer eingefügt */

Meine Vermutung: Dein Footer sollte lila sein, dein Header mit Nav weiß, bis auf den aktuellen Link, und deine Section dunkelgrün. Hab ich recht? Oder zumindest die Farbaufteilung sollte so sein, die Farben garantiere ich nicht
Warum vermute ich das? Dein HTML Code ist schichtenweise aufgebaut. Zuunterst hast du deine div Schicht "test1", welche lila BG hat. Dann kommt oben dein Header drüber. Der überschreibt noch nix. Im Header ist aber auf der gesamten Fläche das Nav, welches seinen weißen BG über den lila BG des "test1" drüberlegt. Daher weiß. Das selbe Prinzip bei section und footer, aber da footer keine eigene BG Color hat, sieht man die Color des drunterliegenden Bereichs, in diesem Fall dein "test1".

Ein gute Möglichkeit das zu visualisieren bietet der Firefox: [Umschalt] + [F2] und dann tilt open eingeben und per Enter bestätigen.
Schließen dementsprechend mit tilt close

Win 8? Iiiih, Kacheln

Ich bin auch schon am überlegen, ob ich dann von Win 7 auf die Bergziege schwenke, allerdings ist das dann wieder so ein Aufwand die Spiele zum laufen zu kriegen, LoL halt halt keinen Linux Client Da müsste ich dann erstmal winen ...

Naja, mal sehen. Und glaub mir, bisher nutze ich keine Konsole, da ich kaum JS programmiere, aber ich will nicht wissen, wie es aussehen würde xP

Zitat von LatexLatte

Ja aber das sind BIlder vom Design.. solche Designs werden mit Dreamveawer gemacht

Kurz: nee.
Zuerst wird mit GIMP (oder bei professionellen Auftritten Photoshop) ein Bild erstellt, wie die Seite am Ende aussehen sollte. Dann wird aus diesem Bild alles rauskopiert, was nicht via CSS erstellt werden kann (eigentlich nur Bilder).
Als naechstes kommt dann die Ueberlegung welche Bereiche in dem Bild zusammen gehoeren, das wird dann mit HTML nachgebildet (in Notepad++ zB).
Und zum Schluss wird mit CSS noch das Design mit den Hintergrundbildern druebergelegt (auch NP++ als Bsp).

Und auf einmal gibts keinen Dreamweaver mehr, aber eine funktionierende, schlanke, hoffentlich gut aussehende Seite. Allerdings braucht man fuer das Ganze ein wenig Geduld

Zitat von Basiii

Eine ordentliche Internetpräsenz braucht auch eine ordentliche Sitemap

Ups, stimmt, an die HTML Sitemap habe ich gar nicht gedacht. Hast natuerlich recht, wie mal

Genau, eine HTML Sitemap, auf die auf der Seite verlinkt wird ist (fast) Pflicht, weil sie dem Nutzer eine uebersichtliche Navigationsmoeglichkeit bietet. Die XML Sitemap, die ich oben angesprochen habe ist nur fuer die Suchmaschinen und optional, wird aber empfohlen.

Und wolf: Auch bei CMS und dynamischen Systemen hat am Ende jede Seite eine eindeutige URI (wenn das CMS funktioniert). Und diese kommen schliesslich in die Sitemaps. Wo ist das Problem? Muss man halt ein anderes Skript zum Erstellen coden, ist aber auch moeglich

Seit wann gibt es denn clip-path, und wieso liest man nirgendwo davon.

Es hat mich sowieso schon gewundert, dass CSS3 an alles gedacht hatte, sogar Animationen, aber ein bisschen schraeg rumschnippeln nicht unterstuetzen soll... Coole Sache, wieder was gelernt

Vielleicht ein Workaround mit bind("onscroll") oder wie auch immer das dann heisst.
Halt vorher nochmal das Event explizit binden und nicht davon ausgehen, dass die Browser das nativ machen.

Das ist aber kein HTML 5 , sondern HTML 4.0 Transitional, zumindest dem Doctype nach.

Hier mal ein Einstieg fuer dich:

<!Doctype html>
<html lang="de">
  <head>
    <meta charset="utf-8" />
    <title>Der Seitentitel</title>




    <meta name="description" content="Eine kurze Seitenbeschreibung" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- IE zur Anzeige mit modernsten Mitteln zwingen -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Damit mobile Geraete keine komischen Skalierungen vornehmen -->




    <link rel="stylesheet" href="link-zur.css" /> <!-- Pfad anpassen -->
    <script src="link-zum.js"></script> <!-- Pfad anpassen.
      -- Man kann auch ein async="async" oder ein defer="defer" einfuegen.
      -- Asynchron laden und entweder direkt ausfuehren, oder wenn die Seite auch fertig ist
      -->
  </head>




  <body>
    <!-- Dein Seitencontent, Anlehnung an deine Aufteilung -->




    <header>
      <nav>
      </nav>
    </header>




    <aside>
      <nav>
      </nav>
    </aside>




    <section>
    </section>




    <footer>
    </footer>
  </body>
</html>

Viel Spass!

Nun, das Erstellen kann man meist leicht über ein Skript erledigen, da es nur text (XML) ist, ist die Datei nie wirklich groß, und zumindest dem Ranking schaden kann sie auf keinen Fall. Die meisten SEO Seiten meinen sogar, dass eine gute Sitemap das Ranking pushen kann.
Allerdings ist sie nicht so wichtig wie Backlinks oder ein sauberer Code Schlampig coden und mit Sitemap ausbügeln ist schonmal nicht

Warum also nicht?

Und wieder mal Webbausteine: Sitemap-Generator-Skript

Hier ein erster Versuch meiner Wenigkeit: http://jsfiddle.net/mxK6V/2/
Sie liegen schonmal schräg nebeneinander, nur das Überschneiden krieg ich noch nicht gebacken

Ich hatte die Idee, das per div mit overflow: hidden zu lösen, das Problem: auch bei z-index: 2 bleibt das Zeug versteckt, siehe Schnipsel.
Vielleicht hat ja wer anders ne Idee...

So, ich habe jetzt meine Idee etwas ausgebaut. Da die Browser ein :before und :after direkt bei Bildern nicht unterstützen, (obwohl W3C sogar ein Beispiel dafür bringt ), hier mal mit divs rund ums Bild. Ich hoffe, es ist ok so: http://jsfiddle.net/Rcu3T/1/

Dazu gehörend: http://www.heise.de/newsticker/mel…er-1762654.html
Ein GPU Cluster als BruteForce Center, mit ein paar Zahlen (Hashes/sec):
md5: ca 180.000.000.000 (Milliarden)
sha1: ca 63.000.000.000 (Milliarden)
sha512: ca 364.000 (Tausend)
Bcrypt (was momentan bei password_hash() genutzt wird): ca. 71.000 (Tausend)

Und dann sag nochmal, md5 sei genauso sicher wie password_hash() Ist ja nur ein Hash-Verhältnis von rund 2535211 : 1

Du gehst ehrlich gesagt mMn völlig falsch an das Thema ran: Die Sicherheit eines Algos, und um den geht es grade, sollte in keiner Weise vom zu verschlüsselnden String abhängen. Dann läuft was grundsätzlich falsch.
Und mit der Verschlüsselung soll natürlich erreicht werden, dass der Angreifer nix mit den PWs anfangen kann, wenn er sie erstmal hat. Ich meine, würde ich davon ausgehen, dass er nicht mal in meine Tabelle kommt, wozu dann die Mühe des Verschlüsselns?

Reproduzierbar: ja, aber auch kollisionsresistent. Denn "Kollision" in diesem Fall heißt: zwei verschiedene Strings, der gleiche Hash. Und das ist bei md5 viel wahrscheinlicher, als bei bcrypt, oder sha256, da hast du offenbar "kollisionsresistent" nicht wirklich verstanden, scheint mir.

Durchlaufen des Algos heißt nicht, sie werden immer wieder neu verschlüsselt, sondern es ist wesentlich komplexer, schau mal in die Wikipedia zu sha 256 oder so. Das Resultat jedenfalls ist ein komplexerer Hash, was auch zur Kollisionsresistenz beiträgt.

Rainbowtable natürlich, immer noch beliebtester Angriff, und der Angreifer hat den Hash, siehe Anfang des Posts. Aber dagegen hilft kein Algo der Welt, da diese genutzt werden um die tables zu erstellen, sondern die Zusatzkomponenten Salt und Pepper. Und diese müssen möglichst zufällig sein. Pepper ist kein Problem da sind md5() die PW API gleich, einmal den PW Generator und fertig, aber guter Salt für jedes PW? Möglichst zufällig? Das macht md5() einfach nicht selber, password_hash() dagegen automatisch.
Und ein gleichwertiger Saltgenerator für md5 ist einfach sehr schwer zu proggen. Bzw. wenn, dann wesentlich langsamer als der von der PW API native.

Und ein Durchprobieren direkt am Loginmodul hat nichts mit dem Algo selbst zu tun, das ist ein völlig anderes Thema, nämlich die Formularsicherung gegen Bots. Also, nicht ablenken

Und natürlich ist "abs" als PW nicht sicher, aber dafür gibts nen hübschen Artikel: Warum 123456 als Passwort okay ist. Oder kurz: Wenn sie blöde Passwörter nutzen, ist ihnen der Acc nicht wichtig. Aber auch das hat nichts mit dem Algo dahinter zu tun.
Und nochmal anders: Auf Nutzereingaben sollte man nie vertrauen, Goldene Regel 1) der PHP Programmierung. Das gilt auch für PWs. Deshalb kommen ja Salt zur PW Verlängerung und Pepper gegen Wörterbuchangriffe zum Einstatz. Nutzt man beides wird aus dem String "a" plötzlich ein "afvcdövfdjhö3587pfscbwöeriuztü8o". Und das ist definitiv sicher. Aber auch hier gilt: Ich muss nicht unbedingt diesen obigen String finden, wenn der Algo selbst nicht kollisionsresistent ist.
Und dann nehme man md5(), von welchem bekannt ist, dass es eine hohe Kollisionsrate hat und das unten erwähnte GPU Cluster... der Angriff gilt übrigens in diesem Fall dann für zwei beliebige String Dann doch lieber bcrypt, also password_hash().

Aber ich glaube, diese Diskussion sollte in den Thread zu Passwortgenerierung, da ist sie besser aufgehoben als hier. Wäre das möglich, basii oder lauras? Danke

Hmm, dann baue ich mir eben mal ein ?inc=../../phperrors.log und gucke, ob das geht... vielleicht zerschießt es sogar den zusammengebauten Filepath, wer weiß...
Einfach, falls dein selbstgestückeltes Filesystem durch obigen Angriff platzt, noch eine zusätzlcihe Sicherung einbauen

Um das zu verhindern könnte ich erst einmal die basename Funktion empfehlen.

$server = $_SERVER['SERVER_NAME'];
    $site = $_GET['inc'];
    $site = basename($site); /* Das hier kommt in die Zeile 28 von wolfs Skript */
    if (empty($site)) {$site = $home;}
    $pfad = "$server/$pfad/$site.php";
    if (file_exists($pfad)) {
        $content = file_get_contents($pfad);
    }
    else{
        $pfad = "$server/$pfad/$fail.php";
        if (file_exists($pfad)) {
            $content = file_get_contents($pfad);
        }
    }

hihi, und schon die ersten 5 Sterne eingesammelt.
Sorry, ich verwende Firefox, kann es also nicht testen, aber gute Idee, mal schauen, ob ich was Vergleichbares fuer FF find.

Willst du das Bild mehrfach verwenden? Wenn nein, schneide es dir doch am Anfang per GIMP oÄ zu, dann hast du den netten Nebeneffekt, dass das Bild kleiner ist und dementsprechend schneller geladen.

Ansonsten hilft dir vielleicht transform: skew weiter. Entweder das Bild selbst verzerren, oder vor und hinter das Bild zwei divs setzen und per skew schräg über das Bild legen. Wäre so die Idee, die mir kommen würde...

Oder per Klasse, zb <img class="raute" ...> und dann im CSS

.raute:before:after {
    position:absolute;
    width: 10px; /* width und height musst du rumprobieren, was klappt */
    height: 100%;
    background-color: inherit; /* Sollte die Hintergrundfarbe des Elternelements sein */
    transform: skew(170deg);
}

keine Garantie, dass es klappt!!!

Update: Das W3C selbst gibt einem ein Beispiel, dass :before oder :after Selektoren auch bei Bildern funktionieren SOLLTEN. Allerdings unterstützt dies kein aktueller Browser
Damit ist mein obiger Vorschlag hinfällig. Klasse Aktion, ihr Browser

Vielleicht hilft ein senkrechter Slider, wenn dir das nicht deinen Style zerschiesst ...

Nein, wenn bei kleinen Auflösungen nicht alles gezeigt werden soll, ist das Zauberwort "Responsive Webdesign (RWD)".
Aber das mit den Kacheln meinte ich eher, wie zB. beim Google Play Store: alles schlicht in weiß, mit ein paar Farben als Highlighter, und großen Linkflächen (meist rechteckig, daher mein Begriff "Kacheln"), damit man auch auf kleinen Bildschirmen gut trifft.

Am Besten ist es bei Design wirklich, man setzt sich erst mit einem Grafikbearbeitungsprogramm, zB Photoshop (kostenpflichtig) oder GIMP (kostenlos) hin, und spielt damit rum, bis man ein schönes Design hat. Am Besten auch Rückmeldung von anderen holen.
Wenn das Design gefällt, kann man sich dann überlegen, welche Struktur dem zu Grunde liegt, und dieses in HTML nachbauen.

Hallo,
target="home" braucht man nur bei Framesets, diese sind aber schon vor den Dinosauriern veraltet gewesen, deswegen brauchst du den Code absolut nicht.

Eine Möglichkeit wird auf Webbausteine gezeigt. Du erstellst dir einfach eine Seite "oben-und-links.html" eine weitere "rechtsund-unten.html" und baust dann diese zwei Seiten auf jeder Inhaltsseite entsprechend der verlinkten Anleitung ein.

Naja, aber heutzutage ist das Updaten auch für laien kaum mehr ein Problem.
Die Seite browsehappy schreibt unten, warum updaten wichtig ist und die Updater der Brwoser, zumindest FF, Chrome und Opera weiß ich, sind inzwischen auch selbsterklärend, bzw. so konzipiert, dass ein immer auf "Weiter" klicken reicht.

Und selbst wenn nicht, heutzutage kennt jeder jmd. der sich zumindest halbwegs auskennt, da kann man auch evtl. mal den Enkel anrufen und nachfragen. Also, ich sehe da heutzutage kein wirkliches Problem mehr.

Und außerdem surfen auch solche Leute auf Seiten mit JavaScript und evtl. Fehlern im HTML, weshalb der Rest umso mehr auf die Risiken hinweien sollte.

Zitat von jenesch1

Hallo, vielen Dank für die Tipp`s

Nun eine neue Frage. Bilder die im Firefox ordentlich positioniert wurden liegen im IE komplett wo anders. Kann mir da auch jemand einen Tipp geben?
Vielen Danke.

Ja: nicht unterstützen. Du musst gucken, ab welcher IE Version das auftritt, alles unter 9 ist veraltet und sollte nicht mehr unterstützt werden, um die Nutzer zum aktualisieren zu bewegen. Auch für die Nutzer gut, wegen Sicherheitspatches und Bugfixes.

Wenn es bei einer IE Version 9 oder höher auftritt, poste mal bitte den Abschnitt, von dem du vermutest, dass er Schuld sein könnte.

sehr häufig werden in solchen von wolf gennten Meldungen auch die Seiten http://www.browsehappy.com/?locale=de und http://www.enable-javascript.com/de/ genannt. Die zeigen den Nutzern, welche empfohlenen Browser es gibt und wie sie JavaScript aktivieren.

Hallo und willkommen im Forum!
Wieso sollten wir kritisieren? Das ist schließlich ein Forum für Anfänger! Und glaub mir, meine ersten Versuche sahen nicht so gut aus

Kleiner Tipp: heutzutage sieht man im Internet eher schlichtes Design. Blinkende Gifs, komplette Hintergrundbilder, all das ist out.
Schau die verschiedene bekannte Webseiten an. Kacheln sind in. Scrolldesign, per JavaScript (unterschiedlich schnelle Scrollen, seitliches einscrollen). Heutzutage spielt man eher auf mobile geräte an.

Und ihr als Packdienst, werdet vermutlich häufig Leute haben, die mit dem Smartphone auf die Seite kommen. Die werden durch ewige Ladezeiten für Hintergrundbilder etc einfach verschreckt.
Also, guck dich ein wenig auf bekannten Seiten um, schau dir das Design an und versuche diesen Stil mit den kacheln nachzubauen. Muss ja nicht gleich mit Effekten und allem sein.

Guckst du hier: Mobile Validator Der gibt dir Tipps.

Dann hast du auch kein problem mit dem Überlappen mehr

Ansonsten von der tech. Seite:
HTML: Chapeau, absolut valide, Respekt
CSS: ein paar kleine Fehler haben sich eingeschlichen (zB dritter Befehl: "haeder", antatt "header") Und warum baust du in der NAvigation 6 versch. Gruppen ein, die alle das gleiche machen? Stampf das doch auf eine Gruppe ein!
Und zu deinen Bildern: Vielleicht funktioniert es mit position: absolute; und z-index.