Jahr: 2008

Kategorien
CSS Templates Stylesheets Webentwicklung

CSS Vorlage Whiteberry 02 vorgestellt

Dieses Template verwendet eine Breite von 950px der eigentliche Contentbereich ist 700px breit mit einem padding von 10px.

#gesamt {
width:950px;
margin:10px auto;
text-align:left;
}
#content {
float:right;
clear:right;
border:1px solid #CCCCCC;
border-right:1px solid #757575;
border-bottom:1px solid #757575;
width: 700px;
padding:0;
margin:0;
background-color: #A0C0E0;
color:#444444;
text-align:left;
}

Das Menue ist eine unsortierte Liste. Die Formatierung erfolgt durch:

ul#mainnav {
list-style:none;
margin:0;
padding:0;
}
ul#mainnav li {
text-decoration:none;
display:block;
width:100%;
padding:3px 0%;
text-align:left;
}
ul#mainnav li a:link, ul#mainnav li a:visited {
text-decoration:none;
display:block;
width:100%;
padding:3px;
text-align:left;
color:#202040;
background-color: transparent;
}
ul#mainnav li a:hover {
background-color:#E0A0A0;
color:#000066;
padding:3px 0%;
text-align:right;
}

Im Contentberecih schließt sich ein Footer ein, der ist 50px hoch und in der Schriftgröße 11px. durch die Klasse Text wird ein Einzug von 10px erreicht, im Contentbereich wie im Footer.

#footer {
height:50px;
padding:0;
margin:0;
text-align:left;
background-color:#E08080;
font-size:11px;
color:#757575;
width:100%;
border-top:1px solid #F0F0F0;
}
#content .text, #footer .text {
padding:10px;
}

Dieses Template ist CSS validiert.

74 kB

Kategorien
ITIL

Planung eines Changes

Time for Changemanagement
Erstellen eines Implementierungsplans

Der Changemanager entwickelt einen Changeimplementierungsplan unter Verwendung der Risikoanalyse. Das Ziel ist es, einen Plan zu erstellen, der das Risiko und die Auswirkung für den Kunden minimiert. Hierzu ist es notwendig den zeitlichen Ablauf festzulegen und Tasks zur Planung und Vorbereitung technischer Aspekte zu verteilen.

Wird das Releasemanagement

  • Große und kritische Hardware Rollouts, insbesondere bei Abhängigkeiten zu einer Softwareänderung in den Geschäftssystemen.
  • größere Software-Rollouts, besonders erstmalige Einführung neuer Anwendungen zusammen mit einer begleitenden Softwareverteilung und ggf. benötigten Supportverfahren
  • Bündelung verwandter Änderungen zu Einheiten von praktikabler Größe

Zuweisen der Tasks

Zu jedem Change gehören Arbeitsaufträge. Der Changemanager weist diese Tasks den dafür zuständigen Arbeitsgruppen zu. Der Changemanager weist den zuständigen Arbeitsgruppen im Tool die entsprechenden Tasks zu.

Abarbeiten der Tasks

Abarbeiten der vom Changemanager zugewiesenen Tasks. Der Spezialist befolgt die Anweisungen im Task, erledigt die dort spezifizierten Aufgaben und schließt anschließend das Ticket.

Test durchführen

Vor der Implementierung des Changes ist ein Test der geplanten Änderungen durchzuführen um sicherzustellen, das der Change mit minimalen Auswirkungen auf die Services umgesetzt wird. Der Spezialist testet den geplanten Change und dokumentiert die Testergebnisse im dazugehörigen Task.

Quelle: IT Service Management Forum

Kategorien
ITIL

Registrierung eines Changes

Time for Changemanagement

Changeanfrage

Bewertung und Filterung

Prüfung, ob die Anfrage in Konflikt mit internen Standards oder Richtlinien steht und Prüfung, ob das Changemanagement für die Anfrage notwendig ist. Dies ist dann der Fall, falls deren Implementierung folgendes verursacht:

  • Unterbrechung eines Service während der Servicezeiten
  • Die Funktionalität des Service verändert sich
  • Update der CMDB nötig
  • Prüfung, ob bereits ein Changeticket zu der Anfrage besteht
  • Prüfung, ob es sich um einen Notfallchange handelt.
  • Prüfung, ob es sich um einen Standardchange handelt.

Notfallchange

  • Öffnen eines Notfallchange.
  • Der Changemanager erstellt ein Changeticket.

Standardchange

Der Changemanager erstellt ein neues Changeticket.

Neuen Change erstellen einschliesslich Kategorisierung/Priorisierung

  • Erstellen eines neuen Changetickets und durchführen von Kategorisierung und Priorisierung
  • Festlegen, worum es in der ChangeAnfrage geht
  • Festlegung von Auswirkung und Dringlichkeit
  • Kategorisierung der Anfrage mithilfe der Klassifizierungsmatrix

Analyse von Auswirkung und Risiko

Durchführen einer Analyse von Auswirkung und Risiko des geplanten Changes für einen Change der Kategorie “Normalchange”.

Es muss festgestellt werden, welche

  • Auswirkungen die Änderung hat auf die Geschäftsvorgänge des Kunden
  • Auswirkungen die Änderung hat auf Services des Kunden oder andere Services
  • Auswirkungen die Änderung hat auf Nicht IT Infrastruktur.
  • Auswirkungen eine Unterlassung der Änderungen hätte
  • Ressourcen (Zeit, Personal, Kapital, Infrastrukturelemente) für die Umsetzung erforderlich sind

Quelle: IT Service Management Forum

Kategorien
ITIL

Prozessbeschreibung Changemanagement

Time for Changemanagement

KURZBESCHREIBUNG

Wovon ist hier eigentlich die Rede? Das Changemanagement ist verantwortlich für die Steuerung von Änderungsprozessen im Zusammenhang mit:

  • Hardware
  • Kommunikationsanlagen und der entsprechenden Software
  • Systemsoftware
  • Produktive Anwendungsprogramme
  • allen Dokumentationen und Verfahren, die mit dem Betrieb, dem Support und der Wartung von Systemen in der Produktionsumgebung betroffen sind
PROZESSZIELE

Was ist das Ziel? Das Ziel des Prozesses Changemanagement ist, Änderungen auf effektivste Art und Weise zu implementieren und gleichzeitig negative Auswirkungen auf Anwender während der Implementierungsphase des Changes zu minimieren.

PROZESS-INPUT
  • RfC
  • CMDB
  • FSC
PROZESS-OUTPUT

Implementierte Changes, PIR, FSC, CAB-Protokolle und deren Aktivitäten, Berichte des Changemanagements

KRITISCHE ERFOLGSFAKTOREN
  • adäquate Toolunterstützung zur Bearbeitung von Changes
  • Einsetzung von Standardchanges zur Verringerung der Arbeitsbelastung des Changemanagementprozesses
NUTZEN
  • Bessere Ausrichtung der Services an den geschäftlichen Erfordernissen
  • Bekanntheit und Kommunikation von Änderungen gegenüber Anwendern und Servicesupportmitarbeitern wird gesteigert
  • Bessere Risikoeinschätzung
  • Weniger negative Auswirkungen von Änderungen auf die Qualität der Services
  • Bessere Einschätzung der Kosten der beabsichtigten Änderungen
  • Gesteigerte Produktivität der Anwender durch weniger Betriebsunterbrechungen und qualitativ höherwertiger Services
  • Eine größere Änderungsanzahl kann bewältigt werden
PROZESSKENNZAHLEN
  • Anzahl der Changes pro Monat.
  • Anzahl der Changes der Kategorie “Standardchange” pro Monat
  • Anzahl der RfCs pro Monat
  • Anteil der nicht erfolgreich umgesetzten Änderungen pro Monat

Warum Change Management so wichtig ist

Veränderung war immer wichtig. Während „Veränderung“ vor zehn, fünfzehn Jahren noch zeitlich abgesteckte Innovationssprünge bedeutete, ist die fortlaufende strukturelle Anpassung heute die Grundvoraussetzung dafür, dass Unternehmen und Organisationen aller Größen handlungs- und wettbewerbsfähig bleiben. Nur Organisationen, die in der Lage sind, den sich laufend verändernden Bedingungen unserer modernen Arbeitswelt flexibel anzupassen, können in ihr überleben.

Der Grund dafür lässt sich zusammenfassen: WENIG RESSOURCEN.

Quelle: IT Service Management Forum

Kategorien
Stylesheets Webentwicklung

How to use the target attribute

Prozess Pyramide

target

Die Eigenschaft target ersetzt das nicht mehr valide HTML-Attribut target="".

Mit den Werten none, window und tab kann festgelegt werden, ob der Browser einen Link im gleichen Fenster, in einem neuen Fenster oder als neuen Tab öffnen soll.

Der :target-Selektor ist eine dynamische Pseudoklasse und selektiert Elemente, die Ziel eines Verweises sind.

Beispiel:

a:target { 
  color: red; 
}

In diesem Beispiel wird jeweils das aktuell angesprungene Verweisziel in roter Schrift dargestellt.

Kategorien
Stylesheets Webentwicklung

How to create an multi column layout

CSS Programming Image

column

Um die Erstellung eines mehrspaltigen Seitenlayouts ohne viel Code zu ermöglichen, sollen drei neue CSS-Eigenschaften eingeführt werden.

Zum einen kann man mit column-count festlegen, wie viele Spalten erzeugt werden sollen, mit der Eigenschaft column-gap gibt man den Abstand zwischen den einzelnen Spalten an und mit column-width legt man die Breite der Spalte fest. Dabei sollen nur prozentuale Angaben möglich sein.

Beispiel:

body {
    display: grid;
		gap: 10px;
}

@media (min-width: 500px) { 

body {
 grid-template-columns: 1fr 3fr 1fr;	
 grid-template-rows: auto 1fr 100px;
}

header,footer {
  grid-column: 1 / -1;
}

Zusammenfassend kann gesagt werden: Das Holy-Grail-Layout ist ein Webseiten-Layout, das mehrere, trotz unterschiedlichen Inhalts gleich hohe Spalten hat.

Weiterführende Infomationen findet ihr auf: https://wiki.selfhtml.org/wiki/CSS/Tutorials/Grid/mehrspaltige_Layouts

Kategorien
Stylesheets Webentwicklung

Das klassische Boxmodell einfach erklärt

Prozess Pyramide

Mit CSS können Sie Elementen (feste) Breiten, Höhen und Abstände geben und diese nebeneinander positionieren.

Die rechteckigen Blöcke, die im Elementbaum erzeugt und auf dem Bildschirm dargestellt werden, folgen einem Schema, dem „Box-Modell“. Es ist somit Grundlage jeden Layouts.

Jedes Block-Element wie Textabsätze (p), -Abschnitte (div, article, main, aside, …) und Überschriften (h1, h2, …) bildet eine rechteckige Box, die Sie frei formatieren können.

Beispiel:

overflow-x, overflow-y

Mit overflow-x und overflow-y kann der “Überlauf” eines Elementes(overflow) für jede Richtung einzeln eingestellt werden (also ob z.B. ein Scrollbalken angezeigt werden soll).

box-sizing

Mittels box-sizing kann eingestellt werden ob sich die Breite eines Elementes auf deren Inhalt oder auf Inhalt+Rahmen+padding bezieht. (Webkit: -webkit-box-sizing)

calc()

Die Eigenschaft calc(), die z.B. innerhalb einer CSS-Eingeschaft wie width oder height stehen kann, ist es möglich Breiten- und Längenangaben direkt auszurechnen.

Kategorien
Stylesheets Webentwicklung

How to set properties with selectors

Prozess Pyramide

CSS 3 Selektoren

Damit Formateigenschaften auf ein Element angewendet werden können, muss definiert werden, welche Elemente angesprochen werden. Dies geschieht über Selektoren.

Ein CSS-Selektor nennt die Bedingungen, die auf ein Element zutreffen müssen, damit der nachfolgende Regelsatz an CSS-Deklarationen auf das Element angewendet wird. Der Selektor ist somit der Teil vor den geschweiften Klammern.

Mit neuen Selektoren kann man Elemente noch genauer auswählen.

Beispiele: 

first-of-type
first-letter
Kategorien
Stylesheets Webentwicklung

How to use CSS property resize

html code beispiel

resizeoutline

Die Eigenschaft resize bestimmt, ob ein Element durch die Maus vergrößert, bzw. verkleinert werden kann.

Mit outline kann ein Rahmen zum Hervorheben um Elemente herumgelegt werden, der aber nicht die Box breiter macht.

Eine Veränderung der Größe ist nur möglich und sinnvoll, wenn die overflow-Eigenschaft des Elements einen Wert hat, der verschieden von visible ist.
Chrome und Safari lassen keine Verkleinerung des Elementes zu.

Kategorien
Stylesheets Webentwicklung

Schrift und Satz – der Textfluss

CSS Programming Image
text-wrap

Bessere Steuerung von Zeilenumbrüchen: Mit text-wrap können Zeilen an Interpunktionszeichen umgebrochen werden.

word-wrap

Mit word-wrap legt man fest wie Wörter umgebrochen werden dürfen. hyphenate bricht Wörter um, indem an die vorangehende Silbe ein “-” angehängt wird.

word-break

Die word-break-Eigenschaft legt fest, welche Zeilenumbruch-Beschränkungen für ein Element gelten. Diese Eigenschaft ist nur für asiatische Schriftarten interessant.

Textfluss

text-overflow

Was mit überfließendem Text geschehen soll, kann mit text-overflow gesteuert werden. Hier kann man z.B. automatisch bei zu langem Text Pünktchen “…” anhängen lassen. (Opera:-o-text-overflow )

Blöcke

text-align-last

Die Eigenschaft text-align-last gibt (falls text-align:justify; gesetzt ist) an, wie die letzte Zeile des Blocksatzes gehandhabt werden soll.

text-justify

Genauso verhält sich auch text-justify zu text-align. Diese Eigenschaft gibt an wie stark der Blocksatz erzeugt werden soll. Zum Beispiel nur durch die Zwischenräume der Wörter oder auch durch die Zwischenräume der Buchstaben.

Sonstige

Mit white-space-collapse kann, wie der Name schon sagt, die Handhabung von Leerzeichen gesteuert werden.

Die Eingeschaften text-align, letter-spacing und word-spacing erhalten weitere Werte.

text-kashida-space ist eine Eigenschaft die noch undefiniert ist. Unter Umständen kommt diese auch gar nicht im CSS3 zum Einsatz.

WebFonts

@font-face

Mit @font-face kann eine beliebige Schriftdatei auf einem Server angegeben werden, die dann heruntergeladen und vom Browser verwendet wird. Zu beachten ist hierfür aber besonders die Lizenzart der Font.

Dies war eigentlich schon seit sehr langer Zeit in der CSS2 Spezifikation, wurde aber mangels Browserunterstützung in CSS 2.1 wieder entfernt.

@font-face {
      font-family: "Fertigo";
      src: url(http://www.taptaptap.com/Fertigo.otf)
          format("opentype");

Neuste WebKit-Versionen (Safari 3) enthalten diese Funktion, Schriften dynamisch nachzuladen. Der Internet Explorer unterstützt seit Version 4 das nachladen von Schriftarten im eigenen .eot-Format.