Meine neue Website
 

Hallo zusammen,

ich habe schon seit ein paar Monaten nichts mehr von mir hören lassen, aber vielleicht erinnert sich der Eine oder Andere noch an mich. Ich habe jetzt eine Website gebastelt, auf der ich meine Geschöpfe präsentiere. Sie ist bewusst etwas verspielt gestaltet, da sie auch auf Kinder ansprechend wirken soll. Viel Spaß beim Betrachten.

www.knuffige-kerle.de

Gruß Alexander

Knuffig, die Bilder und auch die Webseite.

Gefällt mir total gut.

In der Galerie würde ich noch je Kategorie ein kleines (Ausschnitts-) Vorschaubildchen machen.

Vorschaubildchen in der Galerie ist eine gute Idee, danke für den Tip.

Gruß Alexander

so richtig sauber ist dein XHTML auch nicht da heben sich einige Fehlerchen eingeschlichen, was aber zeigt, dass du das wirklich selber geschrieben hast :)

http://validator.w3.org/

hammer, deine tierchen sind einfach hammer :ok::ok:
und so ein ausdruck in der angegebenen größe sieht bestimmt sehr gut aus.

deine seite gefällt mir auch sehr gut.

Okay, das Validieren habe ich vergessen, bin ein bißchen aus der Übung. Die Fehler auszubügeln, ist zum Glück nur Schreibarbeit. Aber was sein muss, muss sein, danke für den Hinweis.

Gruß Alexander

Niedliche Seite
nicht ganz valide, aber wessen Seite ist das schon ;)
Steht da ein CMS dahinter?

Kleiner Tipp:
Das wechseln der Flecken deines Menüs, geht auch ohne javascript nur mit css.

Die Galerie, die ja Zweifelsohne das Herzstück deiner Seite ist, finde ich noch nicht so gelungen. Vorschaubildchen wären ein guter Anfang.
Und unter dem Punkt Technik steht einfach viel zu viel Text ;) das könnte auch ein paar auflockernde Bildchen vertragen.
Erst wollte ich noch das Impressum anmeckern, aber dann hab ichs unter Kontakt gefunden.
Noch ein paar news auf die Startseite um die Seite aktuell aussehen zu lassen...
Ach eins noch... Wenn es gerade keine Ausstellungen gibt, dann musst du nicht darauf hinweisen. lass es einfach weg... schlechtes Feng-Shui ;)

ansonsten super schöne Bilder echt :)

Hallo Alexander

Deine Seite gefällt mir super gut und Deine
kleinen Darsteller noch viel besser. :clap:

Einen kleinen Schreibfehler habe ich noch
gesehen, der ist allerdings nur bei mir im
TAB zu sehen: Eichhärnchen



Hallo zusammen,

Danke für den Hinweis auf den Schreibfehler, solche Fehler findet man selber natürlich nie. Die Site ist jetzt valide, ich habe alles ausgebessert und die Galerie hat Vorschaubildchen bekommen. Wechseln der Bilder geht natürlich auch mit Css, das ist mir bekannt, nur hatte ich gerade mit jquery rumexperimentiert und das dann so gelassen. Einzelne Bereiche der Seite kann man sicherlich noch überarbeiten und das werde ich auch noch tun (Darauf hinzuweisen, dass es keine Ausstellungen gibt, ist in der Tat etwas unsinnig.) Eine Frage noch, was ist ein CMS?

Gruß Alexander

Hallo!

CMS ist die Abkürzung für Content Management System, also sowas wie Wordpress, Joomla, Typo3, o.ä.

Ich finde die Seite auch knuffig, selbst wenn die 800px Breite auf meiner 1920px-Auflösung etwas schmal daherkommt.

Beim aktuellen Firefox (und offenbar NUR dort) gibt es witzigerweise eine 1px-Lücke zwischen #kopfbereich und #wrapper, aber wo diese Lücke her kommt, habe ich auch noch nicht herausgefunden.

Das sieht toll aus mit den Vorschaubildchen. :clap:

JA die Vorschaubildchen werten die Galerie ungemein auf. :ok:

Dann geh ich mal davon aus, dass du auch keines Verwendet hast ;)
Wie Jenny schon sagte steht CMS für Content Management System, das sind Programme, die die Pflege der Website vereinfachen sollen. Wenn das Design einmal steht, braucht man sich "nur noch" um den Inhalt zu kümmern. Ist die Seite einmal am Start können auch Leien Inhalte einpflegen. Eine insgesamt nette Sache, wenn man sich nicht für jede kleine Änderung durch den Quelltext wühlen möchte. :) Allerdings dauert das Einrichten eines CMS (inklusive eigenes Design) mMn auch länger als eine Seite auf herkömmlichem Weg zu gestalten.

Das mit der 1px Lücke ist eigenartig, da ich Firefox Version 16.0.2 habe und ich glaube das ist der Neuste und ich habe diese Lücke nicht. Allerdings hatte ich beim Entwickeln meiner Site eine 3px Lücke, auch im Explorer, die ich mir nicht erklären konnte und die ich dann mit einem negativen margin-bottom; 3px; weggemauschelt habe. Das gefiel mir nicht so gut, aber es funktionierte und ich habe mir dann weiter keine Gedanken gemacht.

Gruß Alexander

Jetzt in der Galerie auch die Bilder noch anklickbar machen und es schaut richtig gut aus ;)

Und das ist umso eigenartiger, da ich auch den FF 16.0.2 habe...



Ich weiß auch nicht, wo der herkommen kann, denn dein XHTML und dein CSS ist sauber soweit ich das beurteilen kann.

Schicke Seite, passt definitiv zum Thema und zur Zielgruppe! :ok:
Bei mir sehe ich aber auch die Pixellücke, ich benutze ebenso Firefox 16.0.2. :nixweiss:

Sehr ansprechende Seite und wirklich schöne Bilder!
Vorschaubildchen finde ich auch gut, dass du diese jetzt eingebaut hast.

Beim Safari 6.0.2, beim Internet Explorer 9.0.blablabla und auch beim Opera 12.10 sehe ich diese Pixellücke nicht. Firefox 16.0.2 zeigt sie mir aber auch an, wie bei Jenny und Tilman.

Richtig!
Das scheint ein reines FF-Problem zu sein, denn ansonsten läuft die Seite ja sogar bis runter zum IE6 absolut sauber! :clap:

Den Streifen sehe ich im aktuellen Opera aber auch,
ebenso im SeaMonkey. Firefox wurde ja schon gesagt.

@Alexander
Verlinke doch bitte mal Deine Seite in Deiner Signatur,
dann findet man den Link schneller. :-)

In Opera sehe ich diesen Streifen nicht!
SeaMonkey dürfte weitestgehend vernachlässigbar sein.

Also ich habe soeben Opera gecheckt, meiner ist aktuell.. Gemäss Update-Verzeichnis ist 12.10 die aktuellste Version und ich habe eben auch noch einmal geschaut, aber ich sehe beim besten Willen keinen Streifen.
Falls du wirklich einen hast, dann läge es doch nicht nur an Firefox. Überprüf' doch noch einmal deine Version. :)
Holger verwendet auch den Opera, ich denke, er hätte sonst auch etwas gesagt.

Die Seite ist ja echt gut gelungen und sieht auch ansprechend aus. Und die Tierchen sind ja sowas von knuffig.... :)

Was den Streifen angeht.. ich hab mal mit Firebug nachgesehen und das hier gemacht:

#kopfbereich {
margin-bottom: -4px;

Dort sind -3px deklariert. Bei -4px verschwindet der Streifen im Firefox.

Doch.. das kann durchaus sein da die Interpretation verschiedener Browser auch leicht verschieden sein kann. Ich erlebe das sehr oft.

Ja klar!
Aber warum sollte hier überhaupt ein negativer margin nötig sein???
Hier liegen zwei DIVs direkt übereinander, per Star-Selector wurden margin und padding auf 0 gesetzt.
Daher begreife ich nicht einmal die Notwendigkeit der -3px???

Danke.
Ich hatte noch 12.02, aber jetzt mit 12.10 sieht das bei mir so aus:



Ganz einfach Jenny. Schau dir mal an wo der Wrapper beginnt. Der beginnt unter dem Headbereich, also im Contentbereich. Eigentlich sollte der Wrapper das alles umschließende DIV sein in dem sich die anderen DIV´s befinden. Dann braucht man auch nicht mit negativen margins zu arbeiten. Ich denke daß hier das Hauptproblem liegt da es hier kein alles umschließendens DIV gibt und da können Browser schonmal Probleme machen.

Sicher, das ist mir auch klar! Und mein Hauptverdächtiger ist auch das "position" im #wrapper, aber dennoch: Warum laufen diese beide DIVs 3-4px auseinander?

An alle: Habt ihr eure Ansicht alle auf 100% (Strg+0 in den meisten Browsern)?

Und genau an diesem Punkt sind Browser sehr empfindlich, das ist jedenfalls meine Erfahrung. Hat man kein umschließendes DIV, so interpretieren die Browser teilweise was sie wollen, nur nicht das was man will. Der eine stellts richtig dar, der andere haut dir einen Abstand rein obwohl keiner deklariert ist.

Ich denke das liegt an den unterschiedlichen Standarts der Browser, es gibt ja, meines Wissens nach, keine "Norm" wie die Darstellung zu erfolgen hat.

Korrekt! Deshalb ist hier ja das +*Hacken auch offiziell erlaubt! :emo_biggr

@goliath:
Also versuch mal, einen Aussenrum-Wrapper zu etablieren.
MMn kannst du die Breite auch auf 980px erhöhen, denn unter 1024px fährt heutzutage kein Mensch mehr!
(Und wer's dennoch tut, der hat eine gewisse Strafe verdient...:bleh:)

Hier mal ein einfaches Beispiel eines zweispaltigen Layouts nach der Faux Columns Regel:

HMTL
CSS:

Ich habe den Abstand jetzt erstmal auf -4px gesetzt, wenn es jetzt funktioniert, wäre das Leck erst mal geflickt. Ansonsten muss ich mal ein bißchen rumprobieren. Bei der Breite, habe ich bewußt 800px gewählt, ich dachte da mehr an Smartphones und Co. Jetzt noch die Breite zu ändern ist eine Schweinearbeit. Nicht wegen des Css, sondern wegen der Grafiken, die alle angepaßt werden müssen. Das ist mal was für ein verregnetes Wochenende. Würde mich jetzt noch mal interessieren, ob es bei euch funktioniert, denn wie gesagt in meinem Firefox sehe ich nichts.

Gruß Alexander

Bei mir ist die Linie nun weg! :ok:

Auch bei mir ist der Streifen im FF (16.0.2) nun nicht mehr zu sehen.

Das kann ich jetzt auch bestätigen.
Firefox 16.0.2
Opera 12.10
SeaMonkey 2.13.1

Nochmals vielen Dank für eure Mithilfe. Obwohl das Problem mit den -4px jetzt augenscheinlich gelöst ist, fehlt ja immer noch die Erklärung für das Phänomen. Um es vorweg zu nehmen, die habe ich auch noch nicht, aber ich weiß, wo das Problem liegt. Titel und wrapper weisen nur scheinbar eine Lücke auf, denn wenn ich meinem Titel img einen background gebe, z. B. die Farbe rot, färbt sich die Lücke rot und grenzt nahtlos an den wrapperbereich, also hat es mit dem Überspannen des wrappers nichts zu tun, was ich auch ausprobiert habe. Die Lösung ist, dem Kopfbereich die Höhe des Bildes zu geben und nicht darauf zu hoffen, dass die höhe des Bild den Kopfbereich definiert, denn das funktioniert ja offensichtlich nicht.

Also:

#kopfbereich {
margin-top: 15px;
width: 800px;
height: 124px;
}

anstelle von

#kopfbereich {
margin-top: 15px;
width: 800px;
margin-bottom: -4px;
}

funktioniert auch und ist auf jeden fall eleganter. Alternativ kann man dem Kopfbereich auch gleich das Titelbild als background geben.

#kopfbereich {
margin-top: 15px;
width: 800px;
height: 124px;
background: url(Bilder/titel.jpg) no-repeat top left;
}

Dann kann man das Titelbild im markup streichen.

Gruß Alexander

Hi Alexander,

erstmal - logisch erinnern wir us, wer würde die niedlichen Kerlchen nicht im Kopf behalten ;)
Deine Seite finde ich absolut passend und schön gemacht. Die technischen Details haben die anderen ja schon mit Dir in Ordnung gebracht, aus dem Grund hab ich da kein Auge drauf geworfen ;)

Was ich sehr schade finde ist, dass die Hintergrundbilder sehr pixelig daherkommen. Ich weiß, dass diese Bilder ja immer ein Kompromiss zwischen Dateigröße und Qualität sind, aber ich denke, dass etwas mehr Qualität Deinen Tierchen gerecht werden würde. Ich hoffe du zeigst noch ein paar Tierchen hier.

Alles Liebe
Heike

hi
schade, dass du kein Tutorial gemacht hast :-)
sehr schön, Fein gemacht :ok::ok:
MfG

Bei Galerie, Übermich und Kontakt wird bei mir irgendwie das Titelbild nicht angezeigt...
Gruß
Heike

Welchen Browser hast du denn?

Gruß Alexander

firefox für mac und es geht bei den seiten auf 2 verschiedenen computern nicht. scheint das bild nicht zu finden. könnte es ein tippfehler beim bildpfad sein?

Ein Tippfehler beim Bildpfad kann es nicht sein, denn dann würde er die Seiten auf anderen Browsern nicht fehlerfrei anzeigen. Ich habe mir meine Seite mittlerweile auf unterschiedlichen Geräten, wie iphone, ipad und verschiedene andere tablets und notebooks, die im Media Markt oder Saturn gerade mal ein Netz hatten, angesehen, außerdem haben schon einige Bekannte von mir einen Blick auf die Seite geworfen, bisher ohne negativen Befund.
Sehr merkwürdig ist auch, warum das Titelbild ausgerechnet auf drei Seiten nicht erscheint. Da das Grundgerüst bei allen Seiten gleich ist und alle von einer CSS Datei formatiert werden, sollte man erwarten, dass bei dir alle Titelbilder nicht angezeigt werden.
Ich stehe vor einem Rätsel.
Eine Frage: Du hattest dich am 19.11.12 schon mal zu meiner Seite geäußert. War der Fehler da auch schon da?

Gruß Alexander