Myspace umdesignen

[WalkingDisaster]

Guten Tag lieber AT gemeinde,
Da ich jetzt Ferien hab und somit mehr Zeit, wollte ich mal meine Myspace Seite überarbeiten.
Jetzt habe ich einige Designs gesehen, die sich von den "Standart-Designs" maßgeblich unterscheiden. (Von der Anordnung etc. - Also einfach freier designt sind.)
Ich habe mich damit noch nicht wirklich auseinandergesetzt, daher wollte ich mal fragen ob jemand von euch da schon Erfahrungen hat. Ich habe Kentnisse in HTML sowie CSS, ich denke das sollte reichen.
Hier mal ein paar Beispiele wie ich mir das ganze vorstelle:
Beispiel 1
Beispiel 2
Ich hoffe mal es ist so ungefähr klar, worauf ich hinaus will. (heutzutage sieht ja fast jede zweite Band - Myspace - Seite so aus.) Ansonsten einfach nachfragen!

Ich hoffe mir kann jemand helfen!

WalkingDisaster //_^

EDIT: Ich habe grade gemerkt, dass ich im völlig falschen Unterform bin! Ich bitte um Entschuldigung! Kann das bitte verschoben werden?

 

[karolherbst]

ohh Gott, eine möchtegern emo-bands furchtbar, obwohl die Seite schon wieder Stil hat. die zweite Band nun ja, egal. Ich glaube da gibt es bestimmte div ids nach denen du eben über CSS alles beliebige machen kannst, gibt genug Seiten bei denen du das WYSIWYG mäßig erstellen kannst.

 

[WalkingDisaster]

Diese WYSIWYG Editoren kenne ich, finde ich aber sinnlos. Denn da bekommt man auch nur dieses "Standart" Design. Bei den von mir gezeigten Beispielen sind die Divs meiner Meinung nach verschoben bzw aus/eingeblendet.
Ich meine auch es gibt einfach vorgegebene Klassen, die man dann verändern kann, aber dazu habe ich leider bisher nichts gefunden.

OT: Zum Glück gibt es doch immer noch Unterschiede in den Musikgeschmäckern.

 

[ferni]

Wichtigster Punkt, den du dir nochmal ansehen solltest und gegebenfalls nebenbei parat haben solltest sind die CSS-Separatoren. Ohne diese wird es sehr schwer werden und weiters kann ich dir den Tipp geben "Fang einfach nicht damit an, dich über die sinnlose Strukturierung des Codes zu ärgern"
lg jo

 

[knacky]

Einfach mal das Firebug Addon für Mozilla Firefox runterladen und dir damit das HTML und das CSS ansehen.

 

[MasterofDistres]

CSSEdit ist auch super, um den Aufbau besser zu verstehen und v.a. das Live-Editing ist super hilfreich

 

[Apple_rocks]

Seite hat Stil nur die Band ist zum kotzen, sorry !

 

[mschoening]

Hi,
ich habe jetzt einige MySpace Versionen hinter mir und hoffe, dass bald die neuen Musiker Profile online gehen. Es ist wirklich unglaublich wie schlecht die Profile gestaltet sind. Das wohl größte Problem ist, dass du bei deinem CSS folgendes nicht verwenden darfst:

- jegliche Kurzschreibweisen (background, font, etc.) -> MySpace will: background-color, background-image
- HEX Farben nur ausgeschrieben (also kein 000 oder fff) -> MySpace will: 000000 oder ffffff

Das sind ja noch zu verschmerzende Probleme jetzt kommt das schlimme:

- man darf keine IDs verwende weil das Symbol # gelöscht wird
- man darf keine Conditional Comments verwenden
- man darf so oder so gar keine Kommentare verwenden (werden angezeigt)

Dazu kommt, dass du aus Sicherheitsgründen kein JS verwenden darfst, genausowenig wie frames oder iframes!

Nach vielen Versionen bin ich zum Schluß gekommen, dass es das einfachste ist, das original MySpace Design zu löschen und einfach mit einem position: absolut DIV von vorne anzufangen.

Als Beispiel:
http://www.myspace.com/edureyes
http://www.myspace.com/wallylopez
http://www.myspace.com/beatport

Jetzt kommt seit letzter Zeit noch hinzu, dass Flash Inhalt mit Links auf externe Webseiten nicht mehr funktioniert (es sei denn man ist MySpace developer und baut ein Widget). Der Parameter "allowNetworkAccess" wird automatisch auf false gesetzt.

Es gibt durch verschiedene Selektoren die Möglichkeit eine relativ große anzahl an Tables direkt anzusprechen. Diese Selektoren funktionieren aber leider erst seit IE7.

Wenn du auf IE6 verzichten kannst, kannst du ruhig mit solchen Sachen arbeiten:

body > div > div > table:first-child

Ich hoffe es hiflt dir weiter...

P.S: Achso, da der Tip mit CSS Edit ist sehr hilfreich. Das Live-Editing nimmt einem sehr viel Arbeit ab weil du das Profil nicht ständig aktualisieren musst. Mir ist es aber auch schon mal passiert, dass es mit Webkit (CSS Edit) alles wunderbar aussah und ich dannach alles wegwerfen konnte, weil Gecko und IE anderer Meinung waren...

LG,
Max

 

[mschoening]

So könntest du zum Beispiel das original Layout löschen:

body table { margin-top: -50000px; }

body td table, body div table { margin-top: 0; }

body div table form { display: none; }

body table div form { display: block; }

.navigationbar { display: none; }

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

.wrapper {
	left: 50%;
	top: 216px;
	margin-left: -400px;
	padding-bottom: 50px;
	position: absolute;
	width: 800px;
}

LG,
Max

 

[WalkingDisaster]

Vielen Dank mschoening für diese ausführliche Erklärung! Genau sowas habe ich gesucht. Als Editor habe ich bisher immer Dreamweaver genommen, hat ja auch nen Designmodus, aber ich schau mir die von Euch empfohlenen Programme nochmal genauer an.
Ich habe noch eine Frage bezüglich des Layouts. Ich nehme an du fertigst erstmal ein Design in Photoshop an, richtig? Wie groß machst du das?

WalkingDisaster

 

[mschoening]

Hi,
ich fange grundsätzlich immer auf dem Papier an ! Dann ein generelles Layout in Photoshop (meistens nicht breiter als 800px, der MySpace header ist 800px breit und das Entfernen ist in den Nutzungsbedingungen untersagt). Bevor du dich aber in Photoshop verausgabst würde ich dir empfehlen erstmal die Möglichkeiten auszuprobieren, die dir überhaupt im MySpace Profil zur Verfügung stehen. Es bringt nichts wenn du ein wunderschönes Layout hast was sich nicht umsetzen lässt.

LG,
Max

 

[WalkingDisaster]

Wo bekomme ich denn die ganzen vordefinierten Klassenbezeichnungen von Myspace her?
Danke schonmal für die zahlreichen Antworten ist echt klasse!

 

[mschoening]

Hi,
lad dir CSS Edit runter und dann einfach mit "Live Preview" X-Ray einstellen und du kannst über die einzelnen tables drübergehen und die classes sehen!

Wenn du es nicht hinbekommst erklär ich es noch mal ausführlicher...

LG,
Max

 

[WalkingDisaster]

Einige Zeit ist ins Land gestrichen und ich hab mir mal wieder vorgenommen an meinem Myspace-Design zu arbeiten. Habe mir auch CSS-Edit geladen, aber irgendwie bekomme ich pro Myspace-Seite 5 CSS-Styles. Das verwirrt mich etwas...und im Grunde ist es auch nicht das, was man als User im 'Backend' eingeben kann, oder?
Eine ausführliche Erklärung wäre vielleicht doch ganz gut. :-X