Vollständige Version anzeigen : Web-Design Auflösung eines Website Layouts
Hallo,
ersteinmal wünsche ich euch ein erfolgreiches und gutes Jahr 2010 :drunk:
Ich bin leider noch Anfänger auf dem Gebiet der Webgestaltung,deshalb werde ich euch in der Zukunft mit ein paar Fragen belästigen :emo_biggr
Ich bin im Moment am gestalten eines Website Layout in Photoshop,ich benutzt die gängige Auflösung von 1024x768. Wenn ich mir meine Arbeit im Webbroweser Firefox anschaue finde ich das die Website immer sehr "klobig" und groß erscheint.
Welche Auflösung wird denn empfohlen und kann man diese nachträglich noch in Photoshop ändern?
Meine 2. Frage wär,was man nachträglich noch mit einem HTML-Editor an dem Photoshop Layout ändern kann?
Also man kann ja Texte und Bilder auch sehr gut mit Photoshop einbinden.
Wo genau liegt der Vorteil,der nachträglichen Bearbeitung mit HTML.
Vielen Dank schonmal und ich hoffe ihr konntet ein wenig meine Fragen verstehen :emo_biggr
Schönen 1.Januar im neuem Jahr
drehstuhl
wenn Du mit einer Breite von 1004 px arbeitest und diese zentrierst, machst Du eigentlich nichts falsch, dann sieht das auch noch auf großen Monitoren mit einer größeren Auflösung gut aus. Wenn Deine Homepage klobig wirkst, liegt das an Deinem Design. Da passen z. B. die Farben nicht zueinander, das können viele Punkte sein, die da mitspielen.
Zum 2. Punkt
Man kann alles nachträglich ändern, Willst Du Bildbearbeitung machen oder willst Du ne Website bauen oder wie kommst Du drauf, dass Du Texte mit Photoshop machen kannst?
Google kann diese Bilder dann nicht lesen und das bringt Dir relativ wenig, wenn Du Texte als Bilder reinstellst.
Am besten wäre es, Du, würdest es uns mal zeigen, dann kann man bessere Ansätze machen, anstatt herumzuraten, ohne zu wissen über was man spricht.
Mit Photoshop bereitest Du vor, damit Du Dir einen besseren Eindruck verschaffen kannst, wie Deine Website nachher fertig aussieht, mit html setzt Du das Ganze um, was Du in Photoshop designed hast.
Olaf
dorftrottel
01.01.10, 19:21
Mit Photoshop gestaltest du nur das Design.
Den Content machst du nur mit einem Editor.
Zum 2. Punkt
Man kann alles nachträglich ändern, Willst Du Bildbearbeitung machen oder willst Du ne Website bauen oder wie kommst Du drauf, dass Du Texte mit Photoshop machen kannst?
Google kann diese Bilder dann nicht lesen und das bringt Dir relativ wenig, wenn Du Texte als Bilder reinstellst.
Am besten wäre es, Du, würdest es uns mal zeigen, dann kann man bessere Ansätze machen, anstatt herumzuraten, ohne zu wissen über was man spricht.
Mit Photoshop bereitest Du vor, damit Du Dir einen besseren Eindruck verschaffen kannst, wie Deine Website nachher fertig aussieht, mit html setzt Du das Ganze um, was Du in Photoshop designed hast.
Olaf
Hi also ich wollte eigentlich mit Photoshop und ImageReady eine Website erstellen.
Ich dachte mit ImageReady lass ich mir mein Website Layout als HTML generieren und verfeiner den Code mit HTML und CSS.
Hier mal nen Beispiel
http://paid4guthaben.de/Hannes/Hannes-Website.html#
Was genau bedeutet Content(Inhalt?)?
Vielen Dank für eure Auflklärung
Hallo drehstuhl,
ist doch gar nicht mal so schlecht für den Anfang. Du hast allerdings Rec ht, dass einen das Ding erschlägt. Nun gut es sind alles recht dunke Farben, ich würde an Deiner Stelle mal versuchen die Fläche in der Mitte mit ner anderen Farbe zu gestalten, ein leichter Pastellton, der nicht so wuchtig wirkt schafft hier schon Abhilfe.
Gefällt Dir die Schriftart für die Navigation wirklich? Die solltest Du heutzutage mit Hilfe von css gestalten und diese Schriftart hat nicht jedermann auf seiner Festplatte. Da nimmt man idialerweise ne trebuchet oder verdana oder ähnliches.
Wenn Du mich jetzt frägst was das mit dem css ist, da empfehle ich Dir folgendes Training, dass auch für Anfänger, die sich nicht mit html auskennen, sehr gut ist:
Little Boxes Teil 1 als Videotraining mit Buch (http://www.amazon.de/Little-Boxes-Teil-Webseiten-Grundlagen/dp/3827244749)
Wow!
Es gibt schon eine ganze Menge an deutschsprachigen CSS-Büchern, aber das ist hier ist das beste für den/die Ein- und Umsteiger/in!
Es ist kurz und knapp gehalten (knapp 160 Seiten Inhalt), lässt aber nichts Wichtiges aus.
Es ist leicht verständlich geschrieben und vor allem macht es Spaß, es zu lesen!
Wer CSS lernen will und das beste Buch dazu sucht:
Dies ist es!
Bevor Du anfängst ist dieses Buch hervorragend:
Little Boxes Teil 0: Was Sie wissen sollten, bevor Sie eine Website bauen (http://www.amazon.de/Little-Boxes-Teil-sollten-Website/dp/3827244285/)
Der Autor erklärt in verständlichen Sätzen, welche Gedanken man sich machen sollte, bevor man sich an die eigene Website traut. Vieles liegt eigentlich nah, bekommt aber durch die gute Einführung ein System. Man erkennt auch als Anfänger plötzlich Zusammenhänge und es wird bewusst, wie systematisch und strukturiert man eine Website aufbauen könnte, wenn man Peter Müllers Tipps befolgt. Und wie man Fehler vermeidet. Das größte Lob jedoch für den Mut, Begriffe und Abkürzungen zu erklären, die man sich kaum zu fragen traut, weil viele dies als selbstverständlich voraussetzen.
Olaf
dorftrottel
01.01.10, 23:25
Ich denke auch, dass du die Mitte mit einer anderen Farbe gestalten solltest.
Ich denke da an einen Creme Ton. So zB. #f9e389.
Er passt jetzt vielleicht nicht perfekt, aber ich finde ihn besser. :)
@panazoom: hast du auch ein gutes Buch für einen Anfänger in html? :)
@panazoom: hast du auch ein gutes Buch für einen Anfänger in html?
Die gleichen Bücher wie oben genannt. Die Verbindung heutzutage von css mit html ist enorm wichtig, rein mit html ohne css wirst Du nicht glücklich,
SELFHTML 8.1.2 - Die bekannte Dokumentation zu HTML, JavaScript und CGI/Perl - Tutorial und Referenz, mit etlichen Zusatztips zu Design, Grafik, ... selfhtml (http://de.selfhtml.org/).
Unbedingt zu empfehlen, dazu kostenlos, wenn man nicht weiterweiss, hier mal reinschauen. Mit dieser Seite habe ich damals mein Handwerk gelernt.
Olaf
dorftrottel
01.01.10, 23:40
Okay, dann schau ich mal die Bücher an :)
Danke!
Hallo ersteinmal Danke für eure Rückmeldung ich werde auf jeden Fall mal das Layout überarbeiten.
Nochmal zurück zu meiner Frage
Ich habe mit ImageReady das Layout als HTML Datei abgespeichert.
Könnte ich jetzt nicht die HTML Datei in einem Editor wie Nvu öffnen und mit HTML und CSS noch daran feilen bzw. die Seite mit Inhalt füllen?
Gefällt Dir die Schriftart für die Navigation wirklich? Die solltest Du heutzutage mit Hilfe von css gestalten und diese Schriftart hat nicht jedermann auf seiner Festplatte
Heißt das,dass Leute,welche die Schriftart nicht haben,die Schrift nicht lesen können?
Vielen Dank für den Buchtipp,ich bin gerne bereit mir Lektüre anzuschaffen,hab lieber ein Buch vor mir als den Bildschirm :D
Vielen Dank
Hallo,
wenn Fragen bez. CSS auftauchen kann ich auch noch einen Link beisteuern.
http://www.css4you.de/
Meiner Meinung nach sehr verständlich.
Heiko
dorftrottel
02.01.10, 00:02
Gefällt Dir die Schriftart für die Navigation wirklich? Die solltest Du heutzutage mit Hilfe von css gestalten und diese Schriftart hat nicht jedermann auf seiner Festplatte.
Aber wenn er die Navi bereits in Photoshop gemacht hat, wird sie ja als jpg abgespeichert, kann sie dann nicht jeder anschauen? :fragen: :frieden:
Aber wenn er die Navi bereits in Photoshop gemacht hat, wird sie ja als jpg abgespeichert, kann sie dann nicht jeder anschauen? :fragen: :frieden:
Hi also ich habe meinen Freund jetzt testen lassen er hat die Schrift nicht auf dem Pc und kann den Tex sehen,also ich denke das wird kein Problem sein.
Könnt ihr vielleicht nochmal auf meine Fragen in meinem letztem Post eingehen?
Danke schööön
dorftrottel
02.01.10, 00:20
Ja sicher :) Du kannst die html Datei in NVU öffnen.
Das musst du ja sogar, sonst hast du ja gar keinen Text auf der Page.
Du musst den Content(Inhalt)bereich festlegen und dann das so coden in NVU.
Wie das geht, weiss ich nicht, aber es gibt viele Tutorials, die genau das zeigen. Die einen mehr die andern weniger ausführlich ^^
Ah ok danke schön jetzt ist wieder einiger mehr klarer.
Aber theoretisch kann man ja auch mit dem Text Tool in Photoshop Texte verfassen,sonst könnte man ja auch nicht die Navigation erkennen :D
Noch einen guten Abend
dorftrottel
02.01.10, 00:35
Aber wenn du dann etwas abändern möchtest..
viel Spass.
.psd hervor kramen, dann den Text verbessern, wieder richtig ablegen, wieder auf den Server laden. So öffnest du es in NVU änderst den Text ab, speicherst es wieder fertig. :)
Glaube ich zumindest.. :whistling
Ja das Stimmt das wär für mich auch ein Grund,der schnellere Zugriff auf den Content und deren Veränderung.
Hi also ich habe meinen Freund jetzt testen lassen er hat die Schrift nicht auf dem Pc und kann den Tex sehen,also ich denke das wird kein Problem sein.
Klar sieht er die Schrift richtig, da es ja als Bild hinterlegt ist. Sinn und Zweck von css mit html ist aber, dass man Bilder vermeidet, sie nur als sich wiederholdenden Inhalt anlegt, so dass die Bilder recht klein sind und keine großen Ladezeiten haben. Google kann die Bilder auch nicht wie einen Mensch sehen und somit wenig damit anfangen, besser wäre es, wenn hier ein Text steht, der muss aber eine Schriftart haben, die jeder auf der Festplatte hat, sonst sieht die Schrift auf jedem Rechner anders aus, je nachdem, welche Schriftarten sich auf Platte befinden.
Könnte ich jetzt nicht die HTML Datei in einem Editor wie Nvu öffnen und mit HTML und CSS noch daran feilen bzw. die Seite mit Inhalt füllen?
Die Frage ist schon längst beantwortet, allerdings zäumst Du das Pferd von hinten auf. Zuerst mal sollte das Grundgerüst stehen, wenn das fertig ist, kannst Du Dich um den Inhalt kümmern.
Wie gesagt, ich würde mir erst mal die Little Boxes Bücher antun, damit hast Du einen Grundstock und weist, was Du tust. Webdesign lernt man nicht von heute auf morgen, dazu ist es zu umfangreich und mit schnell, schnell fällt Mann schnell auf die Nase.
Ein Beispiel. Meine erste Website (http://www.ffetzer.de) hat ca. 400 Stunden in Anspruch genommen. Sie ist heute nicht mehr aktuell, andere Leute empfinden sie teilweise als langweilig, aber das ist mir egal.
Gelernt habe ich damals mit selfhtml (Link weiter oben) und damit habe ich mir die Basis geschaffen, um die Auftragsarbeiten heute erledigen zu können.
Olaf
Hallo,
Meine Absicht war gar nicht von heute auf morgen Webdesign zu lernen,ich wusste bloß nicht welchen Schritt ich nach dem Entwurf des Layouts machen sollte.
Ich habe mich gerade im Internet informiert um es die Little Boxes Bücher in der Bücherei gibt,und zufälliger Weise gibt es sie auch dort und deshalb werde ich morgen losgehen und sie mir ausleihen bevor ich mir das Buch kaufe =)
Vielen Dank nochmal für deine Tipp :)
Zur Seite,habe nur ich diesen Anzeigefehler,dass alles verschoben ist?
Gute Nacht
dorftrottel
02.01.10, 10:48
ich glaube das muss so sein.. :whistling
Meinst du, wenn man auf die Seite kommt, dass dann links ein F weiter oben als rechts Fetzer steht?
1024x768 stammt aus Urzeiten, als 15" im 4:3 Format Standard waren. Heutzutage gelten 20" im 16:9 oder 16:10 Format als Standard. Und Mobile Endgeräte, TV´s und Netbooks tummeln sich auch noch. Optimaler Weise gestaltet man eine Webseite also erstens nicht 4:3 und zweitens dynamisch. Das funktioniert sowohl in der Breite, als auch in der Höhe. Natürlich kann man auch feste Grössen verbauen, dann muss man sich aber über die Zielgruppe klar sein und es so designen, das es bei den meisten gut aussieht. Wie es auf dem eigenen Monitor ausschaut ist eigentlich völlig egal, man stellt eine Webseite immer für andere ins Netz, nicht für sich selber ;)
Ob klobig und gross, hängt immer von der Auflösung ab. Auf einem 24" oder 30" wirken 1024x768 klein und filigran.
Nachträglich liesse sich ein Webdesign schon in der Grösse anpassen in PS, allerdings hat eine Skalierung immer einen Verlust von Schärfe zur Folge. Besser gleich direkt in der gewünschten Grösse arbeiten. Oder man setzt konsequent auf Vektorformen.
Also man kann ja Texte und Bilder auch sehr gut mit Photoshop einbinden.
Wo genau liegt der Vorteil,der nachträglichen Bearbeitung mit HTML.
Photoshop ist ein Layout Programm, damit macht man keine Webseiten. Man füllt den Content immer via HTML ein, Content gehört nicht in die PSD.
@phoenix, ob 1024x768 aus Urzeiten stammt, ist garnicht so sicher.
Lt. Statistik (http://www.webhits.de/deutsch/index.shtml?webstats.html) benutzen 38,6% der Internetuser diese Auflösung.
Ich selbst auch auf einem 19" Röhren-Monitor.
Das war aber nicht mein Anliegen.
Ich erstelle gerade eine Webseite mit einer festen Breite und einem Hintergrundbild.
Diese dynamisch zu gestalten ist doch garnicht möglich, oder?
Danke für jeden Tipp.
Thomas
http://www.1a-mediacenter.de/
PS: Ich bin kein gelernter Grafiker oder Programmierer
du müsstest noch ein wenig umbauen, um sie dynamisch gestalten zu können. Unmöglich ist es aber nicht.
@perfecto: heutzutage musst Du schon wirklich suchen wenn Du noch Monitore im 4:3 Verhältnis beim Händler finden möchtest. Urzeit ist aber selbstverständlich ein dehnbarer Begriff ;)
@phoenix, Du hast Recht.
Ich glaube aber der u.g. Statistik und denke, dass Millionen Haushalte nicht plötzlich und nur mal so auf 16:9 oder andere Formate wechseln werden.
Mich ärgert es nur immer, wenn mein Junior im Netz mit 1920 x 1200 unterwegs ist und die Seiten von eBay, Google & Co irgendwo kaum lesbar mittig oder links oben in der Ecke zu sehen sind.
Die meisten Webseiten sind eben für 1024 Breite optimiert und werden es auch noch eine Zeit lang bleiben (Nehme ich an)
Interessant: http://www.uwebart.de/monitor/monitorgroessen.html
vBulletin® v3.8.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd.