Was sagst Du dazu. Ist von der Art zwar etwas anders, aber die Farzusammenstellung, Kontrast und Farbverlauf etc. sehen schon recht professionell aus. Ist sogar ein kostenloses Template.
::] http://www.webdesign-tuning.com/templates/template3.zip
Beiträge von Beatz
-
-
Hallo Andi,
ich liste Dir mal einige Verbesserungspunkte bzw. Fehler auf:
- Kein Link aus dem Menü funktioniert, es tut sich gar nichts.
Ich verwende zwar den Opera, aber das tuen mittlerweile zunehmend mehr Leute. - Du verwendest unheimlich viele völlig verschiedene Farben, das strengt das Auge an. Versuche Dich auf weniger zu beschränken, bzw. wähle Farben, die zusammen harmonischer wirken.
- hellblaue Schrift auf schwarzem HG ist ebenfalls sehr stechend in den Augen
- Times New Roman oder ähnliche Schriften hinterlassen bei mir immer einen Eindruck, als ob die Seite nur mal eben zwischen Tür und Angel erstellt wurde.
- Der allererste Satz ist grammatikalisch nicht richtig ... das verstärkt den bisherigen Eindruck, dass die Seite lieblos "hingeklatscht" wurde.
Inhaltlich kann ich leider nicht mehr dazu sagen, weil ich nichts sehen kann. Aber es ist in jedem Fall eine gute Idee.Entschuldige bitte, dass ich mich meist auf die negativen Eindrücke beschränke. Das bedeutet absolut nicht, dass die Seite schlecht ist, ich bin nur sehr zielorientiert und lernen tut man am besten aus Fehlern.
P.S. Gehört eigentlich nicht in diesen Thread, aber ich erwähne es mal kurz. Mich würde interessieren, was Du zu den Spielen MOHAA, Call of Duty, Empires - Die Neuzeit, Battlefield Vietnam sagst???
- Kein Link aus dem Menü funktioniert, es tut sich gar nichts.
-
Also, wenn ich Deine Frage richtig verstanden habe, ist folgender Quelltext eine saubere Lösung (ich habe es auch gerade getestet):
HTML
Alles anzeigen<html> <head> <title>Test</title> </head> <body bgcolor="#000000" text="#FFFFFF"> <table border="0" width="93%" cellspacing="1" cellpadding="0" style="border-collapse:collapse;margin-top:0px;" bgcolor="#2A2A90"> <tr> <td width="85%" bgcolor="#000000"> <p align="center"> <div align="left">[img]Start-Dateien/BildLinks.bmp[/img]</div> <div align="right">[img]Start-Dateien/BildRechts.bmp[/img]</div> <div align="center">[img]Start-Dateien/BildMitte.bmp[/img]</div> [img]Start-Dateien/Lückenfüller.bmp[/img] </p></td> </tr> </table> </body> </html>
-
Oben in den Styles habe ich übrigens auch schon die Farbe bei MouseOver berichtigt, die gefehlt hat.
Für Deine Pfeile an den Links, kannst Du folgenden Quellcode verwenden.
Code[url='#']>'+this.innerText+'<<'" onmouseout="javascript:this.innerText=this.innerText.substr(2,this.innerText.length-4)">Linktext[/url]
Wenn der Text zentriert ist, wird er sich nicht verschieben, ansonsten müsste man das ganze innerhalb einer Tabelle lösen, was deutlich komplizierter.
-
-
Folgenden JavaScript-Code musst Du einbinden:
Codefunction MM_preloadImages() {//v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} }
Wenn Du Fragen hast, wie man den einbindet, frag!
Anschließend fügst Du bei body den EventHandler onLoad ein. Siehe Beispiel:
-
Hmmm ... ich habe gerade noch einmal ins erste Posting geschaut. Habe ich das überhaupt richtig verstanden, dass Du eine Tabelle haben willst, die sich der Fensterbreite anpasst, mindestens aber 788 Pixel breit ist. ???
Ich gebe zu, dass ich den Quelltext noch nicht getestet habe. Werde mich morgen mal in Ruhe hinsetzen, und das ganze mal ausprobieren. Poste dann den sauberen Quelltext.
-
Absolut korrekt
Nur noch eine Bitte: Keine BMP-Grafiken im Web verwenden. Weder auf Testseiten, noch sonstwo. Sie haben im Web nichts zu suchen. JPG, GIF und evtl. PNG heißen die Zauberworte.
-
Hmmm ... also das mit den Pfeilen auf beiden Seiten muss ich mir morgen mal in Ruhe anschauen, ich bin nicht so wirklich der Javascript-Freak.
Nein, die Style Sheets haben nichts mit der fade.js zu tun, soweit Du Deine Einstellungen so beibehälst.
Die Style-Angaben sind soweit okay, allerdings solltest Du der Richtigkeit halber alle Angaben mit einem Semikolon abschließen. Also so:
Code
Alles anzeigen<STYLE type=text/css> TD { FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial; } BODY { FONT-SIZE: 10pt; FONT-FAMILY: Verdana, Arial; } A { TEXT-DECORATION: none; } v:link { TEXT-DECORATION: none; } A:hover { TEXT-DECORATION: underline overline; COLOR: #00FF00; } .small { FONT-SIZE: 10px; FONT-FAMILY: Verdana, Arial; } </STYLE>
Was Du allerdings machen solltest, ist in den StyleSheets die Farbe bei hover angeben, da einige Browser kein faden unterstützen. Dann hast Du zwar nicht den Effekt, aber wenigstens die Farbe.
http://www.hoppel-sz.de ist nicht direkt von mir. Die Seite ist von meinem Onkel (hier als lucky angemeldet). Allerdings habe ich das Layout entworfen und bin an den Inhalten mit beteiligt.
-
Hmmm ... also ich kenne SwishMax nicht. Wenn man damit eine fla erzeugen kann, kann ich Dir ein GIF draus machen. Aber ich wette im Netz findet man auch Tools, um aus einem SWF ein GIF zu machen.
Ich kann mir jedoch sehr gut vorstellen, dass die Qualität eines Flashfilms deutlich besser ist (Farbtiefe), als ein animiertes GIF. Und die Dateigröße wird auch eher kleiner sein, da keine Einzelbilder gespeichert werden.
-
Hmmm ... also wenn schon über Sterne oder dergleichen als Veranschaulichung der Homepagebewertung diskutiert wird, dann sollte doch im Vorfeld erst einmal die Basis geklärt werden. Eine Pauschale Bewertung hat sowieso absolut keine Aussagekraft für denjenigen, der die Homepage erstellt hat und sie verbessern möchte. Das wäre eher als eine Art Aushängeschild geeignet und ich glaube nicht, dass das in dem Sinne ist.
Vielleicht könnte man sich bei der Homepagebewertung auf eine Art Kriterienkatalog einigen. Nach welchen Kriterien wird eine HP bewertet.
- Ladezeit
- Inhaltlicher Umfang und Sinn
- Inhaltliche Korrektheit
- Bedienung
- Alleinstellungsmerkmale
- (angemessene) Gestaltung
- ...
Man könnte tausende wichtige Faktoren abgrenzen. Für jedes müsste man klar definieren, wann eine HP wieviel Sterne bekommt. Und das wäre eine Menge Arbeit, die sich aufgrund der geringen Qualität der meisten HP's, meiner Meinung nach absolut nicht lohnt.
Ich denke, es ist schon ein recht guter und offener Weg gefunden worden, die HP's zu bewerten.
P.S. Wimamp Icons als Sterne zu verwenden halte ich für etwas unpassend. Wir bewerten doch keine Musik
-
So, nun zu zweitens. Ich bilde mich ja auch noch fort
Folgender Quettext bewirkt, dass vor dem Linktext nun ">>" erscheint:Code[url='#']>'+this.innerText" onmouseout="javascript:this.innerText=this.innerText.substr(2)">Linktext[/url]
Wichtig dabei sind die Parameter onMouseOver und onMouseOut.
Wenn Du etwas anderes haben willst, schreibe nochmal.
-
Google hilft immer: Nach zwei Minuten Suchen, ein wunderschönes Tutorial gefunden. Verwendet wird das Programm SwishMax, dass derzeit um die 99 Euro kostet. Evtl. gibt es ja 'ne 30-Tage-Trial-Version o.ä. davon.
::] http://www.horstkgrafix.de/test/maxtut5.html -
Tja, leider, leider ist der Iexplorer sehr Fehlertolerant. Mit anderem Browsern wirst Du mit dem Quelltext Probleme bekommen. Du machst zweimal body und html zu. Du hast eine Grafik dort, wo sie nicht hingehört und und und. Ziemlich durcheinander.
HTML
Alles anzeigen<html> <head> <title>Test</title> </head> <body bgcolor="#000000" text="#FFFFFF"> <table border="0" width="93%" cellspacing="1" cellpadding="0" style="border-collapse:collapse;margin-top:0px;" bgcolor="#2A2A90"> <tr> <td width="85%" bgcolor="#000000"> <p align="center"> [img]Start-Dateien/BildLinks.bmp[/img] [img]Start-Dateien/BildRechts.bmp[/img] [img]Start-Dateien/BildMitte.bmp[/img] [img]Start-Dateien/Lückenfüller.bmp[/img] </p></td> </tr> </table> </body> </html>
Transparentes GIF
Hatte ich vorhin fast vergessen. Wie Du das Transparenz machst??? Entweder erstellst Du mit einem vernünftigen Grafikprogramm eine Grafik 1x1 Pixel, Hintergrund transparent und speicherst diese als GIF mit dem Optionen, bestehende Transparenz verwenden oder Du lädst Dir eine von den hunderten im Netz verfügbaren runter.
::] http://www.hoppel-sz.de/images/fill.gif (Rechtsklick => Ziel Speichern unter ...) -
-
Kann ich Dir nachher fertig machen, geht eigentlich sehr schnell ... habe aber jetzt sofort keine Zeit. Kommt im Laufe des Tages!
-
Liegt das fade.js denn im Verzeichnis scripts ???
-
Hi,
ja, manche Browser machen dann zwar einen ein Pixel breiten Rahmen, aber fügen noch eine 3D-Hervorhebung (beispielsweise zusätzliche 6 Pixel hinzu) usw. Am besten löst man das, indem Du der Tabelle eine Hintergrundfarbe zuweist und den einzelnen Zellen auch noch. Cellspacing setzt Du dann beispielsweise auf 1.
Beispiel: 2 Zeilen, 2 Spalten, Rahmenfarbe rot, Zellfarbe weiß
-
Hi Skyfire,
ach so, daran habe ich natürlich nicht gedacht, Du verwendest ja border="1". Mal ganz abgesehen davon, dass man das sowieso nicht macht, weil die verschiedenen Browser beim Border die unterschiedlichsten Sachen draus machen, geht das natürlich auch ohne zweite "Zeile" *GG* (keine Spalte). Versuchs mal so:
HTML
Alles anzeigen<html> <head> <title>Test Seite</title> </head> <body bgcolor="#000000" text="#FFFFFF"> <table border="1" width="95%" bordercolor="#2A2A90" cellspacing="0" cellpadding="0"> <tr> <td width="89%" align="center"> <span align="left">[img]1-StartDateien/Bild2.bmp[/img]</span> <span align="right">[img]1-StartDateien/Bild3.bmp[/img]</span> <span align="center">[img]1-StartDateien/Bild1.bmp[/img]</span> [img]1-StartDateien/Lückenfüller.bmp[/img] </td> </tr> </table> </body> </html>
Hmmm ... ganz nachvollziehen kann ich immer noch nicht, warum Du erst bmp verwendest. Du musst im Nachhinein ja auch noch sämtlichen Quelltext andern. Mit Dateiübergreifendem Suchen und ersetzen geht das zwar einigermaßen gut, aber es könnte auch eine Fehlerquelle werden, die man vermeiden kann, wenn man es von vorne herein richtig macht.Als kleiner Tipp zum Grafikprogramm. Wenn Du nicht unbedingt Geld für ein vernünftiges Programm ausgeben möchtest, empfehle ich Dir GIMP. Das Programm ist Freeware und reicht für Deine Zwecke sicherlich mehr als aus.
-
Ich bin sowieso kein Freund von "Kitsch" auf den Webseiten. Oft macht sich eine gut gewählte Farbstruktur und abgrenzung von Menü und Inhalt wesentlich professioneller. Ein leichter Farbverlauf ist auch ein sehr netter Effekt.