Seitenstruktur

Seitenstruktur So strukturierst du richtig - In meiner heutigen Contenseite werde ich dir erklären, wie ich hier diese und meine anderen Seiten erstellt habe. also alles mit dem Design und dem Hintergrund und allem. Ich habe etliche Schritte gemacht, wo ich auch einige Screenshots gemacht habe und wo ich dir das alles auch in Bildern zeige.

Du brauchst definitiv keine Angst zu haben, ich werde dir jeden einzelnen Schritt in Bildern zeigen und dir auch im weiteren viele nützliche Sachen bekanntgeben.  

Bsp. du möchtest dir über WordPress deine Seite erstellen, dann benötigst du Optimizepress 3.0 und erstellst das mit dem integrierten Smarttheme von Optimizepress 3.0.

Hierbei zeige ich dir alles hochwertige an der Seitenstruktur was du darüber wissen solltest.

ich nutze Smarttheme seit einigen Jahren und der Umgang damit macht mir sehr Spaß. Du kannst alles damit machen und hast jede Möglichkeit ein bestimmtes Element einzufügen.

Auf dem linken Bild siehst du wie ich eine total leere Blanke Seite erstelle. Im linken Bereich siehst du das Optimizepress und da wo "Create New Page" steht, ist schon das Smarttheme mitintegriert. Du brauchst es nur anzuklicken und dir eine neue Seite zu erstellen.

Nach dem klicken auf "create new Page" wird dir nun der "Page Title" angezeigt, da wo du den titel für deine Seite angibst. Danach klickst du auf Create Page und es wird dann weitergeleitet.

Nachdem du den Titel bei  Page Title angegeben und auf "Create Page geklickt hast, wirst du nun auf diese Seite weitergeleitet. Dort klickst du auf ADD NEW SECTION. und wählst dann ein Layout für deine Seite aus.

Nun erscheint es dir so wie im rechten Bild das "SELECT COLUMN LAYOUT". Dort wählst du dir dein entsprechendes Layout dafür aus.

Nun wirst du wie im linken Bild auf diese Seite weitergeleitet und klickst nun auf ADVANCED SETTINGS, es öffnet sich ein kleines Fenster und klickst nun auf ADVANCED OPTIONS.

Nun wird dir wie im rechten Bild auf der linken Seite vom Fenster angezeigt was du alles machen kannst. Für deinen Design wählst du zB. SEPERATOR und kannst deine Seite so wie hier diese Seite designen. Auch das werde ich dir hier zeigen.

Hier im linken Bild kannst du auch erkennen welchen SEPERATOR TYPE ich genommen habe um diesen zu nutzen. Du kannst aber auch irgendein anderes aus der Liste nehmen. Ich zeige dir ja hier nur.

Hier kannst du den Design und auch die Größe oder Breite vom Design/Seperator ändern.

In meinem Sinne gebe ich danach immer die Pixelgröße 130 an.

Das ist dafür, dass man das Logo gut erkennen kann.

Hier siehst du nun wie du die größe von dem Design deiner Seite ändern kannst und wie es noch weiter geht.

Du klickst einfach auf das Farbfeld und änderst die Werte. Ich nutze die Werte #E84D12 zb.

Bei size wähle ich die Pixelgröße 130 aus.

Nun klicke ich auf den mittleren Pfeil, um den Design zu aktivieren und fortzufahren.

Nachdem du deine Seite aktiviert hast kannst du nun dein Logo einfügen, indem du auf das Pluszeichen im mittleren oberen Bereich klickst. Im linken Bereich siehst du das Element IMAGE und verschiebst das nun auf das Plus Zeichen und kannst somit dein Logo einfügen. Aber das zeige ich dir im nächsten Bild hier unten drunter.

Es erscheint jetzt bei dir dieses Fenster wie im linken Bild und du kannst dir nun dein Logo auswählen. In meinem Sinne ist es mein eigenes Logo, welches du auch oben siehst.

So und nun erscheint bei dir auch so wie bei mir im linken Bild das mit der Größe des Bildes, welches du noch umändern musst. Bei der Verpixelung vom Logo nehmen ich immer die gleiche Größe und das ist das 350 Pixel Groß.

Hier im rechten Bild siehst du das auch wie ich das meine.

Wenn du jetzt noch auf das "Image" Fläche klickst ist dein Bild nun auf deiner Seite und ich würde auch mal Speichern.

Wie du im linken Bild siehst, haben wir gemeinsam das Design und das Logo richtig eingestellt.

Wie du sehen und selber feststellen kannst war dies doch bis hierhin recht einfach und ganz easy von mir erklärt. Deshalb finde ich meine Erklärungen oder meine Kenntnisse richtig hochwertig und ich erkläre dir das wesentliche was du in einem Video doch hören solltest. Doch die Seitenstruktur ist noch nicht fertig. Es fehlen noch einige Sachen.

Wie du schon im rechten Bild erkennen kannst, werde ich mir jetzt ein neues element einfügen. Was fehlt jetzt auf unserer Seite? Genau, die Überschrift. Ich verschiebe nun die HEADLINE in den freien Bereich unter meinem Logo.

So nun habe ich mir meine Headline eingefügt und die Schriftgröße kann ich nun auch ändern.

So nun sind wir schon etwas weiter als wir die Seite angefangen haben zu erstellen und haben jetzt auch die Headline, also die Überschrift.

Zu beachten: Die Überschrift sollte immer H1 sein, welches du in den Schriftformaten ändern kannst.

im nächsten Bild werde ich dir nun dann mit dem Inhalt zeigen.

Nachdem ich mir hier das PARAGRAPH von den Elementen eingefügt habe, geht es jetzt weiter mit dem Inhalt, also mit dem Content.

Hier im letzten Bild siehst du noch eine interne Verlinkung und auch das Datenschutz und das Impressum, welche ich mit dem List Menu von den Elementen in meine Seite eingefügt habe.

Zuletzt habe ich hier auf dieser ganzen Seite die Schriftart IBM Plex Sans mit der Schriftgröße 21 und als Font Weight Normal verwendet. Im Headline (Überschrift verwende ich normalerweise immer die Schriftgröße 23.

Noch vorweg: Hier auf meiner Seite erfasse ich nur Content. Das ist hier nur hochwertiger Inhalt zum lesen. Du erfährst aus meinem Content und machst mir das auch nach. Dieser kleine absatz hier sollte eigentlich zur Contentgestaltung, aber hier ist es auch in Ordnung, was ich mit der Contentgestaltung meine.

Ich habe dir hier einen Artikel erfasst, wie du deine Contentgestaltung machst, wie du richtig schreibst.

Folge meiner Facebook-Fanpage!

Folge mir auf Twitter!