Archiv für den Autor: Sigrid Kowalewski

Ob man eine statische HTML-Seite plant oder ein Content Management System installiert ist am Anfang zu klären

Webseiten bauen, Folge 4: CMS oder statische HTML Webseite?

CMS WordPress oder statische HTML-Webseite?

Der Unterschied: Für CMS wie WordPress benötigt man eine Datenbank. Die Informationen werden dynamisch aus Seitenvorlagen und Datenbank erzeugt. Statische Webseiten brauchen keine Datenbank. Da sind die Informationen (statisch) auf der jeweiligen HTML-Seite. Was sind dynamische Funktionen und wozu brauche ich sie? Lest, was zu eurem Projekt passt… 

Ohne CMS viel Bewegung in der statischen Webseite von Aquatilis-tv

Auf dem WordPress-Theme twentyfourteen baut diese Webseite auf. Aquatilis.tv ist wunderschön und eine meiner Lieblings-Webseiten. Für so ein individuelles Design benötigt man JavaScript und php-Kenntnisse und die Nachahmung ist sicher nur was für Fortgeschrittene…

Pro und Kontra: CMS oder statische HTML-Webseite:

Einstieg

  • CMS WordPress zu installieren ist nicht schwer. Aber es muss eine Datenbank eingerichtet werden.
  • Eine statische HTML Webseite erstellt man einfach mit einem HTML Editor wie Adobe Dreamweaver (Adobe Creative Suite), Brackets (mehr dazu bei t3n) oder Notepad (für PC kostenlos) , und kopiert diese einfach auf den Server.

CMS 0 : 1 HTML-Seiten

Kosten

  • Es gibt kostenlose und kostenpflichtige HTML Editoren.
  • WordPress ist kostenlos, die meisten Plugins und viele Themes (Layouts) sind kostenlos.
  • Die Hosting-Kosten für Wordpress sind höher, weil im Angebot des Providers PHP 5 und ausreichend Speicherplatz enthalten sein muss.
  • Für kleine, statische HTML-Seiten reicht meistens der billigste Webspace.

CMS 0 : 2 HTML-Seiten

Affiliate Websites (Websites mit Werbung)

  • CMS: dynamische Bannerauslieferung inbegriffen.
  • Statische HTML-Seiten: dynamische Funktion mit JavaScript möglich

CMS 1 : 2 HTML-Seiten

Website-Pflege

  • CMS: Änderungen wie neue Inhalte und Bilder, oder der Ausbau von Artikeln und Seiten sind schneller erledigt. Die Navigation wird z.B. automatisch angepasst.
  • Schneller Layoutwechsel möglich

CMS 2 : 2 HTML-Seiten

Ladezeiten

  • Die Ladezeiten werden vor allem bei mobile immer wichtiger.
  • CMS: Nachteil durch dynamische Generierung.
  • Statitische HTML-Seiten sind schneller geladen.

CMS 2 : 3 HTML-Seiten

Sicherheit

  • WordPress-Sites und andere CMS wurden gehackt: Durch die Datenbankzugriffe größere Angriffsfläche, als statische HTML-Seiten.
  • HTML-Seiten sind sicherer.

CMS 2 : 4 HTML-Seiten

Skalierbarkeit

  • CMS: Website lässt sich gut ausbauen.
  • Bei statischen HTML-Seiten: aufwändig bei großen Websites.

CMS 3 : 4 HTML-Seiten

Fazit:

Für eine einfache Website: statische HTML-Seiten.

Eine kleine Webseite hat nicht mehr als zehn, fünfzehn Seiten. Dafür braucht man eigentlich kein CMS Content Management System.
Eine Such-Funktion ist nicht nötig, wenn man eine klare Navigation und Seitenstruktur hat. Wer nur einmal im Monat eine neue News auf die Seite stellt, braucht auch kein RSS-Feed und kein Archiv. Man kann alle Änderungen bequem händisch einpflegen, und auch Lightboxen und andere Spielereien einbauen.

CMS – für große Webseiten

Will man die Website später ausbauen, sollte man ein CMS wählen. Das Content-Management-System (CMS) ist – eigentlich – für große Webseiten gedacht. Viele Autoren pflegen an unterschiedlichen Stellen Inhalte ein. Es gibt zahlreiche Features und Module für ein CMS, die man einfach installieren kann. Nichts spricht dagegen, solch ein CMS auch für zunächst kleinere Seiten zu installieren.

Templates und Plugins für WordPress

Es gibt viele Templates (Layouts), kostenlose und kostenpflichtige. Diese kann man mit Plugins für Funktionen ausstatten, die nicht im Umfang des Templates enthalten sind.
Die Grundausstattung von WordPress ist eher nüchtern, lässt sich aber sehr schön erweitern. Außer HTML und CSS Kenntnissen sollte man JavaScript und PHP-Grundwissen mitbringen.
Es gibt über 9000 Plugins für WordPress. Die Installation und Konfiguration der Plugins ist einfach. Nur die richtigen Plugins zu finden, ist die Herausforderung. Es lohnt sich, die Plugins auszuprobieren.

Vorteil CMS:

  • Die Plugins haben viele Funktionalitäten, die man einfach einbinden kann.
  • Einfache Bedienung des Systems.

Faktor Sicherheit:

  • WordPress ist eine open source Software. Sicherheitslücken werden von Hackern schnell gefunden, und so können sie die Seite angreifen. Darum muss man die Seite regelmäßig updaten, damit die Sicherheitslücken geschlossen werden.
  • Diese Probleme hat man mit statischen Seiten nicht. Aus dem Grund kommen auch Behörden häufig zu statischen Seiten zurück.

Faktor Design:

  • Wer sich nicht mit dem CMS-System auskennt, ist auf die Gestaltung des ausgewählten Themes (Layouts) festgelegt. Änderungen im Design erfordern tiefere Kenntnisse in Javascript und Php, und erfordern Eingriffe in den Quellcode des CMS. Auch wenn man das kann, macht es richtig viel Arbeit und lohnt sich für kleine Seiten nicht.

Ohne HTML geht nix.

HTML, HyperText Markup Language, ist die Auszeichnungssprache im Internet. Der Browser stellt immer HTML dar. Auch Content Management Systeme wie WordPress erzeugen HTML. Darum wirst du um einige HTML-Kenntnisse nicht herum kommen.

HTML ist das Fundament jeder Webseite.

  • Eine saubere HTML-Struktur ist auch die Grundlage für die onpage-Optimierung, denn viele Analyse-Tools werden von HTML angesprochen.
  • Moderner HTML-Code beschleunigt Webseiten und sorgt für problemlose Indizierung bei Suchmaschinen.

Hier finde ich ein Template.

Wenn die Entscheidung gefallen ist, geht es auf die Template-Suche. Auf jeden Fall muss das Template responsive sein, das heißt, es muss für die verschiedenen Endgeräten optimiert sein. Man bekommt kostenlose Themes für WordPress und kostenpflichtige. Das twentysixteen ist das neueste Basic WordPress Theme, das man sich mit Plugins aufpeppen kann. Schneller gehts es mit Themes, die schon viele Features beinhalten. Enfold ist zum Beispiel so ein Theme, das mit sehr gut gefällt, aber das Angebot ist riesig.

Was ist mit kostenlosen Themes?

Für die Suche sollte man sich ausreichend Zeit nehmen und, wenn möglich, die Templates auch testen. Das geht leider nur bei den kostenlosen Themes. Aber ihr werden dann auch merken, dass die kostenlosen Themes oft nur mit Basis Funktionen ausgestattet sind. Wenn man mehr will, wird man auf die kostenpflichtige Pro-Version verwiesen. So bieten diese Themes, über die kostenlose Version, die Möglichkeit zum testen. Man kann die Themes für WordPress direkt bei WordPress bekommen oder bei themeforest.net oder Templatemonster.com für alle Systeme.
Auch die beliebten OnePager gibt es für WordPress und für HTML. Inspirierend ist auch der Artikel des Entwickler Magazins T3n zum Thema Portfolio Webseiten. Viel Spaß bei der Suche!

Portfolio Website mit CMS WordPress von Stefan Ivanov

Die Webseite des Webdesigners Stefan Ivanov gehört auch zu meinen absoluten Favoriten. Sie ist im Prinzip ein One Pager, der mit CMS WordPress. Der Designer hat aus dem WordPress Theme twentythirteen ein eigenes Theme aufgebaut, hinreißend!

Nächste Folge: WordPress installieren

Editorial Design Trend: animierte Photoshop-Datei

Animierte Magazin Cover gestalten – Editorial Design Trend

Animierte Cover – Bewegung im Editorial Design

Animierte Cover – ein neuer Editorial Design Trend für Web-Magazine. Das bringt Bewegung in das statische Layout und sorgt für Aufmerksamkeit. Lest, wie ihr ein animiertes Cover selbst herstellt – das Beste daran: Es ist gar nicht schwer.

Für animierte Cover brauchst du ein geeignetes Motiv, zum Beispiel eine Zeichnung, die eine Bewegung ausführen soll, und Adobe Photoshop. Hier ist die Anleitung:

Im Photoshop kann man ganz leicht animierte Cover erstellen.

Für das animierte Cover legst du auf den Ebenen im Photoshop die Bewegungsphasen ab. Dann ziehst du die Ebenen auf die Zeitleiste unten. Mit der Leertaste lässt du die Animation laufen.

Du gehst dabei im Prinzip vor wie beim Zeichentrick-Film: Fertige so viele Zeichnungen an, wie Bewegungsphasen erforderlich sind. Dann legst du jede Bewegungsphase auf eine Photoshop-Ebene. Jetzt ziehst du die Ebenen auf die Zeitleiste in der gewünschten Reihenfolge auf die Zeitleiste am unteren Photoshop-Rand. Und damit ist das animierte Cover schon fast fertig.
Mit der Leertaste kannst du die Animation abspielen und das Ergebnis prüfen. Vielleicht musst du ja noch etwas korrigieren. Zum Beispiel stellst du noch die Dauer der Frame-Verzögerung ein (kleines Dreieck) und wählst die Option für die Schleife. Stelle zum Beispiel unbegrenzt ein, wenn es ein Loop sein soll. Und das war’s auch schon. Um die Seite in deine Website einzubauen, musst du sie noch speichern: Wähle Datei für Web speichern, als gif speichern, und fertig ist das animierte Cover.

Hier sind einige Beispiel für tolle, animierte Cover. Da bekommt man doch gleich Lust, so was auch mal zu machen, wie geht’s euch?

animierte Cover sind im Editorial Design ein neuer Trend. Hier das Cover von Time Out

Editorial Design Trend: animierte Cover im Web sind ein echter Hingucker. Besonders gelungen ist das Januar Cover des US Magazins Time Out.

Das US-Magazin Variety mit einem animierten Cover

Drei Motive, ein Cover: Animierte Cover funktionieren auch bestens bei People Magazinen, wie hier das US-Magazin Variety beweist. Hier sind nur 3 Bilder in der Zeitleiste abgelegt – die 3 Cover Motive.

Das niederländische Magazin Volkskrant zeigt eine Typovariante für animierte Cover

Das niederländische Volkskrant Magazine zeigt eindrucksvoll, welche textlichen Möglichkeiten das animierte Cover in sich birgt. Für die Kreativität der Texter ein wunderbares Spielfeld… Hier sind nur zwei Bilder in der Zeitleiste. Wobei eine der Textvarianten etwas zu kurz eingeblendet ist. Hier könnte man in der Zeitleiste im Photoshop noch nachjustieren.

 

 

 

 

 

 

Hand einer Echse, Ausstellungsplakat der Ausstellung "Genesis" von Sebastiao Salgado

Sebastião Salgado Ausstellung in München

Die Sebastião Salgado Ausstellung muss man sehen!

Abenteurer, Künstler, Menschenfreund, Visionär. Die Ausstellung „Genesis“ des brasilianischen Fotografen Sebastião Salgado ist bewegend und großartig. Aber man muss sich beeilen, denn sie läuft nur noch bis zum 24. Januar 2016 im Kunstfoyer der Bayerischen Versicherungskammer, Maximilianstraße 53. Auch für Eltern und Kinder unbedingt empfehlenswert.

Das Plakat der Ausstellung Genesis von Sebastião Salgado zeigt eine Echsenhand, die aussieht, wie die Hand eines mittelalterlichen Herrschers. Wer hätte so viel Eleganz in einem Reptil vermutet. Und so staunt man vor jedem ausgestellten Foto über die Wunder dieser Welt, die uns die Arbeiten von Sebastiào Salgado vor Augen führen.

Staunen über die Wunder der Welt

Es sind schwarz-weiss Fotografien von exotischen Landschaften der Antarktis, Afrikas, Papua Guineas und von Menschen, die bis heute ganz ursprünglich leben, von Bewohnern Sibiriens in ihren Jurten auf dem Eis, von Völkern im Dschungel des Amazonas und in der Steppe Afrikas und von exotischen Tieren. Manchmal vergisst man fast, dass die Erde so viele verschiedene Gesichter hat, und das das alles jetzt passiert, während wir unserer modernes Leben führen. Mit großer künstlerischer Ästhetik, fantastischer Bildkomposition und Motivauswahl wird uns in „Genesis“ die Schönheit der Erde gezeigt.

Elefant in der Steppe von Afrika von Sebastiao Salgado fotografiert

Ästhetische und faszinierende Fotos von exotischen Tieren in der Natur

salgado-web4salgado-web3

Baum für Baum die Welt retten mit dem Instituto Terra

Die Ausstellung ist mehr als nur eine Sammlung großartiger Fotografien. Sie ist die Arbeit eines Mannes, der die Welt und die Menschen wirklich retten will: 1990 gründete er zusammen mit seiner Frau Lélia Deluiz Wanick das Instituto Terra , eine Umwelt-Organisation, die in Brasilien am River Doce, den Regenwald aufforstet. Durch Waldrodungen war der ganze Landstrich verdorrt. Durch die Arbeit des Instituto Terra wurde das Land für die Menschen und die Tiere wieder lebenswert gemacht. In dem ambitionierten Projekt wurden bisher über 2 Millionen Bäume gepflanzt. Jetzt gibt es wieder Wasser und die Farmer der Gegend bewirtschaften ihr Land nach dem Vorbild des Instituto Terra.

Das Salz der Erde – Der Film über das Leben und die Arbeit von Sebastião Salgado

Im Rahmen der Ausstellung läuft in den Museumslichtspielen in der Sonntags-Matinee, bis zum 24.1.2016, die sehr sehenswerte Filmreportage Das Salz der Erde von Wim Wenders. Der Film zeigt den Menschen Sebastião Salgado: Sein Kompromissloses Leben für das Abenteuer und die Fotografie, seine tiefe Verbundenheit zur Erde und den Menschen und seine Visionen und Aktionen für die Rettung unserer Welt.

Die Ausstellung Genesis von Sebastião Salgado ist täglich geöffnet von 9-19 Uhr,
im Kunstfoyer der Bayerischen Versicherungskammer,
München (Lehel), Maximilianstraße 53, Eintritt frei.

Grafik der beste Domain Name

Webseiten bauen, Folge 3: Der beste Domain Name

Folge 3: Der Domain Name besteht aus mehreren Komponenten, die zusammen Deiner Website einen unverwechselbaren Namen und dir richtige Adresse geben. Dabei kann der Domain Name mehr oder weniger frei gewählt werden – allerdings gilt es, dabei einige Erfolgsregeln zu beachten.

Woraus besteht eine Webadresse (URL)?

Der Domain Name ist Teil der URL (Uniform Resource Locator). Sie besteht aus drei Komponenten:
www.meine-firma.de

  1. Subdomain = www.  (world wide web – man kann das www. weglassen)
  2. Domain Name = meine-firma (hier hat das Keyword die größte Bedeutung)
  3. Toplevel-Domain = .de (hier sind verschiedene Endungen möglich)

Toplevel Domains werden in zwei Gruppen unterteilt: Landerspezifische und Generische TLDS. Unter dem Link könnt ihr die komplette Liste der TLDS einsehen. Hier sind einige Beispiele:

Landesspezifische TLDS (Toplevel Domains)

  • .de (Deutschland)
  • .fr (Frankreich)
  • .ag (Antigua)
  • .tv (Tuvalu)

Generische TDLS

  • .com
  • .net
  • .org
  • .info
  • .eu

Domain Endungen werden oft „zweckentfremdet“:

Dabei kommt oft Erstaunliches heraus. Hier einige Beispiele:
.to ist die Domain Endung von Tonga. Damit kann man eine url wie come.to erstellen
.la (laos) als Domain Endung für LA (Los Angeles)
.by (bayern) als Domain Endung für stand.by

Der Domain Name ist perfekt, welche Domain Endung ist noch frei?

Welche der TLDS noch frei ist, erfährt man unter https://www.eurodns.com/de/.  Dein Domain Name muss dort eingesetzt werden und das Tool zeigt dir die verfügbaren Domain Endungen. Sollte deine Wunschdomain schon vergeben sein, kannst du es auch bei Sedo, einer Börse für Domains, versuchen. Hier kann man Domains kaufen und verkaufen. Ist dein Domain Name dabei wird es nicht ganz billig. Entweder sind die Preise vorgegeben oder man macht ein Angebot. 500 Euro bis mehrere tausend Euro sind da schnell erreicht. Da muss man abwägen, ob sich der teure Domain Name wirklich lohnt. Andererseits entstehen höhere Kosten für SEO, wenn ein Domain Name ungünstig ist.

Welche Domain Namen sollte eine Firma registrieren?

  • Firmenname
  • Dienstleistungen (Keywords)
  • Produkte/Marken
  • Relevante Keywords/Keywordphrasen
  • slogan/claim
  • Mit und ohne Bindestrich
  • Varianten: Reihenfolge, Substantivierte Werben…
  • Tippfehler (als Weiterleitungsadresse)
  • generische Begriffe
  • plural/singular

Welche Domain-Endungen sollte eine Firma registrieren?

  • .de
  • .com
  • .net
  • .org
  • .info
  • .biz
  • .eu
  • länderspezifische TLDs für Kampagnen/Aktionen

Aufgaben der Domains sind Weiterleitung/Aktionen/Kampagnen/Landingpages

Wieviele Seiten sollte meine Website haben?

Onepager: Nur eine Seite zu haben ist nicht Vorteilhaft für das Suchmaschinenergebnis. Man kann aber einen Onepager-Eindruck erzeugen durch aneinander hängen von Einzelseiten.
7-8 Seiten sollte eine Domain haben (mehrere tausend Seiten sind ideal)

Over-Optimasation: Man sollte nicht over-optimieren. Soviel Geduld muss sein: Der Google Dance (Archivierung der Suchmaschinenergebnisse) dauert 5 Wochen. Wer zu oft ändert, wird herabgestuft.

Am 20.1.2016 erscheint die 4. Folge: CMS WordPress oder statische HTML-Webseite – Pro und Kontra

Weihnachtsgrüße

Frohe Weihnachten und ein glückliches Neues Jahr!

Miley Cyrus singt Silent Night

Aus dem Film „A very Murray Christmas“ mit Bill Murray, directed by Sofia Coppola powered by Netflix. Nicht nur der Song, sondern der ganze Film ist toll. Und ich bin sowieso Fan von Bill Murray-Fan und nach diesem Song auch von Miley Cyrus.

Ich wünsche euch ein schönes und entspanntes Fest, und freue mich darauf euch, gesund und munter, im nächsten Jahr wieder zu sehen – nicht nur auf facebook.

Sigrid Kowalewski