WEB DESIGN - team.eliZZZa * webdesign * screendesign * xhtml * css * jQuery * ajax * fragen & antworten * tutorials * community

Jimdo.com Online-Shop nach Baukastensystem

8. September 2010 | Von: Natalie | In: * WD Nützliche Tools, * WP Nützliche Tools, ONLINE TOOLS, Sites / Seiten generieren, USABILITY, | Kommentieren! |

Hat schon jemand damit Erfahrung?

http://de.jimdo.com/ -> P.S Links in der wp-admin maske sind disabled!!!!

lg Natalie

Typografie

28. Mai 2010 | Von: gerald.reisner | In: * Schriften, PlugIns, Typografie, | Kommentieren! |

Hi! Beim täglichen Surfen im Web bin ich auf einen Artikel zum Plug-In “WP Google Fonts” gestossen. Ich habe schon gelesen, daß Google eine kleine Zahl von Fonts fürs Web zur Verfügung stellt, und jetzt, vielleicht eine Woche danach, gibt es schon das passende Plugin.
Wer ist “mutig” und probiert das aus? Als blutiger WP-Anfänger bin ich noch zu feig! Ich freue mich ja noch regelmäßig, wenn alles so funktioniert, wie ich es will.

Nochwas: Das Plugin “wp-Typography” mag ich auch gerne, alleine deshalb, weil die Anführungsstriche dann an der richtigen Stelle stehen, namlich zuerst unten, und dann oben.

Wie gesagt, ich freue mich auch noch über die kleinen Dinge!

Ciao, Gerald

Firefox Erweiterungen für SEO und Webdesign

22. Januar 2010 | Von: thomaskloos | In: * WD Nützliche Tools, * WP Nützliche Tools, GOOGLE, | Kommentieren! |

Firefox ist der offizielle Browser für Suchmaschinenoptimierer und Webdesigner. Warum? Vor allem wegen den vielen Erweiterungen, die einem die Arbeit erleichtern. Angefangen von Developer Tools bis hin zu HTTP Header Tests und Ladezeit Überprüfungen gibt es alles, was man so braucht.

Hier sind: 5 Firefox Erweiterungen für SEO, die ich fast täglich benutze und die mir vor allem für die SEO Analyse einer Website unerlässlich erscheinen.

Nachdem hier, dank eliZZZas Einsatz, viele mit WordPress arbeiten, habe ich auch das Addon Firebug beschrieben. Es wurde hier schon von Sabine erwähnt und ist wirklich eines der besten Firefox Addons um mit WP Sites zu arbeiten.

Kursmitschrift Webdesign 2009 Basiskurs Fortsetzung

12. August 2009 | Von: lissommiller | In: KURSMITSCHRIFTEN, WEB DESIGN, | 1 Kommentar |

KURSMITSCHRIFT 2

KURSMITSCHRIFT TEIL 2

/* Universalselektor: Für alle Elemente gilt */

margin:
0px auto 0px auto
Top Right Bottom Left

(margin: top, right, bottom, left) werden gesetzt um auch in FIREFOX den Balken
mittig bzw. Zentriert zu setzen. Wird ins .css
geschrieben.

Das padding bezieht sich auf den Bereich innerhalb des Rahmens (border)
Das margin bezieht sich auf den äusseren Bereich des Rahmens (border)

Font Size in HTML (.css ganz oben eintragen)
62,5% für alle Browser = 10px (entspricht etwa 100%)

Durch den Fixbefehl von 62,5% + 10px Schriftgrösse muss man zusätzlich im
.css (body) folgendes definieren: 1,3em = quasi der Muliplikator ausgehend von
10px = 100% x 1.3em entspricht somit 13px Schriftgrösse!

Das BLOCKELEMENT “div”
Ein DIV (Blockelement) beginnt immer in einer neuen Zeile!
In .css sieht die Schreibweise des “div” so aus: div#..……
Wir haben ein zusätzliches div#header in unser .css eingebaut und zwar:

div#header: ul li {display:inline} (ein “a”= Inline Element)

Webinfos : www.artzzz.net
www.overnightprints.de (Online Druckerei – 1.000 Stk. für € 9.-
www.printshop.de (Prägestempel – Standard Handmodell für € 89.-)

Transparenz erzwingen für .png24 = pngfix.js
Illustrative Grafik = .gif
Photos = .jpg

DESIGN INFO: Der Gesamtinhalt in KB auf einer Seite sollte nicht 100KB
übersteigen.
pro Bild max. 40KB ideal sind 20-30KB!

Der Header darf etwas grösser sein.
Header von TEAM ELIZZZA besteht aus einem Farbbalken und der Schrift, die
aus tanzenden Personen besteht.

Die Ladezeit beträgt etwa 10-20 Sekunden.
Man orientiere sich nach der 3 KLICK Strategie: 3x klicken um jede INFO zu
finden.

Cache: (sprich-kasch) hierbei handelt es sich um einen Zwischenspeicher damit
Dreamweaver die links (Relationen der Datei) richtig aufreiht bzw. anreiht!
siehe

Dreamweaver Menüleiste einstellen:
Site verwalten od. Neue Site erstellen anklicken.
Einstellungen: FTP anwählen.

Klicke auf Neu…. in Sites verwalten!
Grafix1
Klicke auf FTP Server unterhalb von Site!

Grafix2+3

Der Upload würde unnötig lange dauern , deshalb die Meldung nur die jeweilige Seite
up(zu)loaden. Auch beim Download sollte man die Datei markieren die man vom Server
runterholen möchte, da ansonsten die gesamte Seite downgeloaded wird.

Die oben eingefügte Grafik wird bei Windows Usern wahrscheinlich nicht angezeigt
werden und diese sehen gleich diese Grafikbox mit FTP Konfigurationsmenü.

Grafix4+5

In unserem Fall wäre der Name des Servers : http://www.peoplezzz.net
FTP Host: ftp.peoplezzz.net
Host-Ordner: Kann in den meisten Fällen frei gelassen werden, sucht sich selbständig!
Anmeldung: bezieht sich auf den Namen der eigenen Seite: z.B. inge.peoplezzz.net oder
lissom.peoplezzz.net, hannes.peoplezzz.net, ferry.peoplezzz.net.
Kennwort: das jeweilige Kennwort

Wichtig: mittleres Kasterl Grafix6

Dateien speichern, anklicken.

REMOTE – INFOS (Mac Menü)
Grafix7

CODE FORMAT: UF (unix) einstellen, (Windows Menü)
Grafix8

Windows Dreamweaver Menü
Radiobutton „Nach Eingabe der öffnenden Tags“ anklicken!
Grafix9

Weitere wichtige Voreinstellungen: links auswählen bzw. markieren
Grafix10

und rechts mit + der Auswahl hinzufügen !
Grafix11

Kopieren und Einfügen: Radiobutton „nur Text“ anklicken.
Grafix12

Neues Dokument: HTML/XHTML 1.0 strict + Unicode (UTF-8)
Grafix13

Schriftarten: Unicode
Grafix14

Grafix15

BROWSWER VORSCHAU: Firefox als Primärbrowser wählen !
Grafix16

DESIGN NOTES: Nicht Anklicken!

Notiz: Wer über keine automatische Screenfunktion verfügt, hat die Möglichkeit bei
www.google.com in Suchfunktion MIREK’S FREE (MW SNAP) Kameraprogramm
runterzuladen. Wichtig nur den Mirek’s Link direkt verwenden or try www.snap.com !

Kurze Schreibweisen in .css
Für margin und padding:
Lange Schreibweise = (top)10px (right)20px (bottom)30px (left)20px

Kurze Schreibweise= (top)10px (r+l)20px (bottom)30px
Border width= 10px (o+u) 20px(r+l)

Wenn bei margin steht: 40px (bezieht sich das auf alle 4 SEITEN!!)

Notiz: Kurzbefehl – STRG (APFEL) +D = Kopieren bzw. Duplizieren!

Audio und Videoprogramme finden wir auf: http://avs4you.com

MENÜPUNKTE mit Gummiband verlinken: Den Menüpunkt markieren und in der
Eigenschaftsleiste im Dreamweaver das Gummiband aktivieren und auf den markierten
Text ziehen um interne Verlinkungen auf der Seite herzustellen.

Linkdefinition im .css sheet !

a: link = Aussehen des gesetzten Links, zumeist in blauer Farbe, kann eingefärbt werden.
a: visited link = der bereits besuchte Link, kann beliebig gefärbt werden, zumeist violett.
a: hover = mouse_over link bzw. der Effekt der entsteht wenn man mit der Mouse streift.
a: active {outline:none} sieht man kaum, ist eine meist rot gestrichelte Linie wenn man
den Link aktiviert!

Notiz: Wenn eine Schrift aus mehr als einem Wort besteht, muss das in der .css immer in
Anführungszeichen stehen. Z.B. „Times New Roman“
Gute Menü und Navigationsvorlagen finden wir auf http://jazzz.biz

Geld verdienen mit Amazon: http://partnernet.amazon
Widgets von Amazon dazu direkt holen.

http://www.zanox.com = Globales Online Marketing – we create partners!

3 WERTE SYSTEM ! Content = Inhalt = Inhalt lockt Besucher
1. UNIQUE VISITOR/VISITS
2. PAGE NEWS
3. TIME VISIT

Die Hälfte aller Besucher – monatlich – sollten NEU sein!

Notiz: Rumänien druckt Flyer/Stk. für 80 cent!

Verschiedene Bilder auf verschiedenen Seiten?

26. Juli 2009 | Von: Patricia | In: * Bildbearbeitung, FRAGEN!, NEWS, | Kommentieren! |

Liebes Elizzza-Team!

Ich würde gerne bei meiner Webseite auf jeder Seite ein bestimmtes Bild haben. Gibt es dazu einen eigenen Code für WordPress? Gibt es auch eine andere Lösung als das timthumb?

Habe dazu folgenden Code eruieren können, der allerdings bei mir nicht funktioniert. Vielleicht habe ich auch einen Gedankenfehler dabei:

Sende euch einmal den Link zur Webseite, die ich übrigens kommenden Dienstag zur Diplomprüfung präsentieren werde. Bin schon einmal Dankbar für eure Rückmeldungen.

Link zur Webseite

Liebe Grüße sendet euch Patricia