Fertiges Design online stellen?

[deku]

Hallo,
ich würde mich gern nach und nach ein Wenig in das Thema Websites einarbeiten und dachte mir es wäre evtl ein guter Anfang eine schlichte Seite versuchen online zu stellen.

Ich habe ein altes Design gefunden (werde auch noch ein neues machen, mit ähnlichem Aufbau):
http://www.imagebanana.com/view/62t8co15/f297850608.png

Meine Frage, wie stellt man solch ein Design am besten online?
Ich habe Grundkenntnisse was HTML, CSS, JAVASRIPT usw angeht.
Mir ist klar, dass ich da nicht durchbrettern kann, mir geht es prinzipiell darum was ich am besten lernen/üben muss um danach vllt ein solch simples Design online zu stellen und funktionieren zu sehen!

Hoffe man kann mir hier helfen (:

Vielen Dank

[mrjerk]

Hallo,

Ich habe Grundkenntnisse was HTML, CSS, JAVASRIPT usw angeht.

Das ist doch schonmal recht ordentlich - darauf lässt sich aufbauen.

Im Moment geht der Trend immer mehr zum Responsive Webdesign, also dass die Seite auf jedem Endgerät (vom Handy bis zum Beamer :) ) gut aussieht und sich vor allem auch bedienen lässt. Oft wird hierzu ein "mobile First" Ansatz gewählt, sprich, es wird zuerst für mobile Geräte entwickelt, und dann erst werden die größeren Medien mit-einbezogen (Hintergrund ist: Eine Webseite, die auf einem Smartphone gut aussieht, bekommt man vergleichsweise einfach hoch-skaliert für größere Geräte. Wenn man die Seite hingegen z.b. für 1280x1024 (oder noch höher) entwickelt, wird es ziemlich fummelig, diese Seite wieder in den beschränkten Viewport eines Telefons zu quettschen).

-> Ich würde mich daher wohl als erstes damit beschäftigen, denn wenn Du Deine Webseite "responsive" gestalten willst, musst Du darauf ggf. auch schon bei der Erstellung des Designs achten.

Ein interessanter Einstieg ist z.b. diese Seite mit Responsive Patterns.

Da ich aber kein "Front-Endler" bin, kann ich Dir auch nicht sehr viel mehr dazu sagen - da wissen andere im Forum sicher mehr.

Hope that helps.

Viele Grüße,
Jörg

[NoTrend]

Es gibt auch andere Meinungen:
http://www.mobile-zeitgeist.com/2013/08/07/warum-responsive-webdesign-schrott-ist/

Genauso halte ich das ganze OOP getöns bei PHP für total überzogen.
Ich selber hatte bis jetzt noch keine einzige Anwendung wo sich der Aufwand gelohnt hätte, und dabei ist auch ein CMS mit zig Modulen.
Hab es mal getestet und Teile davon mit OOP umgesetzt, mit dem Erfolg das sich die Ladezeiten rapide erhöht hatten.

[Matthias Apsel]

Om nah hoo pez nyeetz, NoTrend!

Es gibt auch andere Meinungen:
http://www.mobile-zeitgeist.com/2013/08/07/warum-responsive-webdesign-schrott-ist/

Und auch Reaktionen darauf: http://www.mademyday.de/responsive-webdesign-ist-kein-schrott.html

Genauso halte ich das ganze OOP getöns bei PHP für total überzogen.
Ich selber hatte bis jetzt noch keine einzige Anwendung wo sich der Aufwand gelohnt hätte, und dabei ist auch ein CMS mit zig Modulen.
Hab es mal getestet und Teile davon mit OOP umgesetzt, mit dem Erfolg das sich die Ladezeiten rapide erhöht hatten.

Genauso wie es die eierlegende Wollmilchsau nicht gibt, haben die unterschiedlichen Programmierparadigmen alle ihre Berechtigung. Möglicherweise hast du etwas falsch gemacht, vielleicht warst auch nicht konsequent in der Umsetzung. Es ist aber auch möglich, dass die prozedurale Herangehensweise in deinem Fall einfach besser geeignet ist. OOP um jeden Preis halte ich nicht für gut, zumal durch den höheren Abstraktionsgrad vom Programmierer auch mehr Verständnis gefordert wird.

Matthias

[Detlef G.]

Hallo NoTrend

Es gibt auch andere Meinungen:
http://www.mobile-zeitgeist.com/2013/08/07/warum-responsive-webdesign-schrott-ist/

Du solltest auch seinen eigenen Kommentar zum Artikel lesen:
… herrlich durchleuchtet, dass mein Artikel reine Provokation ist und meine “Argumente” (die natürlich keine sind) ausgehöhlt …

Auf Wiederlesen
Detlef

[Der Martin]

Hallo,

Es gibt auch andere Meinungen:
http://www.mobile-zeitgeist.com/2013/08/07/warum-responsive-webdesign-schrott-ist/
Genauso halte ich das ganze OOP getöns bei PHP für total überzogen.

ja, kaum irgendeine Ideologie ist für sich allein perfekt, sei es in der Technik, in der Politik oder in der Religion.
Wichtig ist zu erkennen, wann welche Methode wofür am besten geeignet ist. Manchmal ist das auch eine Kombination mehrerer Methoden, oder ein Kompromiss zwischen unterschiedlichen Modellen.

Ciao,
 Martin

[Matthias Apsel]

Om nah hoo pez nyeetz, deku!

Für den allerersten Anfang:
  - Texteditor, ich empfehle notepad++
  - freier Webspace, z.B http://www.bplaced.net/

falls deine Frage rein technischer Natur war.

Matthias

[molily]

Hallo,

Meine Frage, wie stellt man solch ein Design am besten online?
Ich habe Grundkenntnisse was HTML, CSS, JAVASRIPT usw angeht.

Worauf zielt diese Frage ab? Was meinst du mit »online stellen«? Was hast du denn schon?

Falls du noch nicht weit bist, so kannst du erst einmal die Ordnerstruktur anlegen (index.html und weitere HTML-Dateien, Verzeichnisse für CSS, Bilder, JavaScript usw.). Dann fängst du an, in einem Texteditor wie Notepad++ das HTML und CSS zu schreiben. Am besten fängst du an, die HTML-Grundstruktur zu schreiben, um sie dann mit CSS zu formatieren. Dabei kannst du natürlich auch Grafiken einbinden und Links zu weiteren HTML-Dateien setzen. Das ganze kann erst einmal auf deiner Festplatte laufen und du öffnest die HTML-Dateien einfach im Browser.

Was die konkrete Umsetzung des Designs angeht, so ist das hauptsächlich eine Frage von CSS. Dazu kannst du dir Tutorials zu http://de.selfhtml.org/css/layouts/@title=CSS-Layout ansehen. Dieses Forum hilft bei konkreten Fragen natürlich auch gerne weiter.

Sofern Grafiken nötig sind, so brauchst du natürlich ein Bearbeitungsprogramm wie z.B. GIMP.

Wenn das Projekt soweit ist, kannst du es ins Web hochladen. Dafür gibt es kostenpflichtige Webspace-Anbieter, aber auch kostenlose, meist mit Beschränkungen oder Werbung. Für den Anfang wird ein kostenloser Webspace ohne Domain reichen.

Grüße,
Mathias