Eigener Online-Shop mit wix.com
03.09.2014 in Webentwicklung von Stefan-RiedlWird es Zeit für einen eigenen Online-Shop? Dann kommt hier die Lösung. Auch ohne jegliche Programmierkenntnisse ist es möglich, seine eigenen Waren und Dienstleistungen im World Wide Web auf der eigenen Website anzubieten. Dieses...
SASS - CSS bekommt Superkräfte
19.08.2014 in Webentwicklung von StavrosIn diesem Tutorial möchte ich euch die Skriptsprache bzw. das Framework namens SASS vorstellen. SASS ist eine CSS-Erweiterung, die es ermöglicht, CSS-Code dynamisch zu erzeugen. Auf diese Art und Weise kann ein Farbwert beispielsweise in...
NodeJs - Teil 1: Die Installation
28.06.2014 in Webentwicklung von CrazyLoppIm ersten Teil geht es um die Installation von NodeJS. Zusätzlich wird selbstverständlich auch ein kleines Hello-World-Programm erstellt und ausgeführt.
Eigene Website mit Homepage-Baukasten von Wix
05.06.2014 in Webentwicklung von Stefan-RiedlIn diesem 40-minütigen Video-Training möchte ich euch das Prinzip eines interessanten Homepage-Baukastens auf Basis eines HTML-Editors vorstellen. Das Training richtet sich vorrangig an jene, die keinerlei HTML- & CSS-Kenntnisse...
Dynamischer CSS-Workflow: Ein kleiner Exkurs in LESS
16.05.2014 in Webentwicklung von StavrosIn diesem Tutorial möchte ich euch die Skriptsprache bzw. das Framework namens LESS vorstellen. LESS ist eine CSS-Erweiterung, die es ermöglicht, CSS-Code dynamisch zu erzeugen. Auf diese Art und Weise kann ein Farbwert beispielsweise in...
Wie man Webseiten Retina ready macht
12.01.2014 in Webentwicklung von StavrosDie Technologie schreitet bei Smartphones , Tablets und PCs bzw. MACs immer weiter voran. So ist es auch kein Wunder, dass viele der hier genannten Geräte ein sogenanntes Retina- bzw. HiDPI-Display besitzen. Solche Bildschirme sind der...
Dynamische Platzhalter-Bilder: Online-Dienste und ein Script zum Selbermachen
09.10.2013 in Webentwicklung von DuddlePlatzhalter-Bilder sind ein nützliches Werkzeug im Entwicklungsablauf einer Website. Während die Grafik-Abteilung noch in Photoshop arbeitet, kann der Webdesigner mit Platzhaltern bereits einen Prototyp mit korrekt formatierten Bildern...
Formular-Erstellung: Formular mit Datei-Upload - Teil 2
27.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie man einen Datei-Upload mit PHP realisiert. Das angehängte Script ermöglicht euch einen Multi-File-Upload und ist gut für eigene Zwecke anpassbar.
Formular-Erstellung: Formular mit Datei-Upload - Teil 1
26.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie man einen Datei-Upload mit PHP realisiert. Das angehängte Script ermöglicht euch einen Multi-File-Upload und ist gut für eigene Zwecke anpassbar.
Formular-Erstellung: Formular mit reCaptcha schützen
23.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch zeigen, wie ihr eure Formulare mit dem Captcha-System von reCaptcha schützen könnt. Die Implementierung ist vergleichsweise einfach und schnell erledigt. Alle Informationen und Downloads zu...
Formular-Erstellung: Die Grundelemente - Twitter Bootstrap
20.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären. wie ihr ansehnliche Formulare mithilfe des Frontend-Frameworks Bootstrap bauen könnt. Bootstrap: http://twitter.github.io/bootstrap/ initializr: http://www.initializr.com/
Formular-Erstellung: Verarbeitung mit AJAX
15.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training kombinieren wir das Wissen aus den vorangegangenen Video-Trainings. Mittels PHP und jQuery realisieren wir einen E-Mail-Versand, ohne dass die Seite neu aufgerufen wird; dazu nutzen wir die AJAX-Funktionen des...
Formular-Erstellung: Verarbeitung mit PHP - Teil 2
12.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie ihr die Daten aus einem Formular mit PHP verarbeiten könnt. Dazu versenden wir mithilfe der PHP mail()-Funktion eine einfache Text-E-Mail und im weiteren Verlauf auch HTML-E-Mails. ...
Formular-Erstellung: Verarbeitung mit PHP - Teil 1
09.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie ihr die Daten aus einem Formular mit PHP verarbeiten könnt. Dazu versenden wir mithilfe der PHP mail()-Funktion eine einfache Text-E-Mail und im weiteren Verlauf auch HTML-E-Mails. ...
Formular-Erstellung: Formular-Validierung mit Validatr
07.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch das Script Validatr vorstellen, mit dem ihr eine einfache Eingabe-Validierung durchführen könnt. Validatr: http://jaymorrow.github.io/validatr/
Formular-Erstellung: Formular-Validierung mit jQuery Validate
02.08.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie ihr eure Formulare mithilfe von jQuery Validate auf die korrekte Dateneingabe hin validieren könnt. Schaut euch dazu auch folgende Links und Dokumentationen an: Homepage:...
Formular-Erstellung: Verarbeitung mit jQuery
30.07.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training stelle ich euch einige einfache Beispiele zur Datenverarbeitung eines Formulars mittels jQuery vor. Ich zeige euch alle wichtigen Basics, mit denen ihr dann auch eure eigenen Scripte schreiben könnt.
Formular-Erstellung: Die Grundelemente - Exoten
29.07.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch noch einige weitere Formular-Elemente / Attribute aus dem Bereich Grundlagen vorstellen, die in HTML5 neu hinzugekommen und aufgrund ihrer Funktionen noch nicht allzu häufig in der freien Wildbahn...
Formular-Erstellung: Die Grundelemente - Styling mit CSS
26.07.2013 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch die einfachen Styling-Möglichkeiten eines Formulars mittels CSS zeigen. Als Vorlage passen wir das einfache Formular aus dem vorherigen Video-Training "Formular-Erstellung:...
Formular-Erstellung: Grundelemente
25.07.2013 in Webentwicklung von Pascal-BajoratIn diesem ersten Video-Training möchte ich euch die Grundlagen der Formular-Erstellung etwas näher bringen. Dabei zeige ich euch die typischen Elemente, mit denen ein Formular in HTML aufgebaut wird.
Tuning: Kompression für Besucher
10.03.2013 in Webentwicklung von CuranaiIm Zeitalter von Mobilgeräten ist wenig Traffic und hohe Geschwindigkeit alles. Ich zeige, wie man mit wenigen Handgriffen auszuliefernde Datenmengen drastisch reduziert und somit seinen Besuchern deutlich mehr Performance bietet.
Typografie im Web mit CSS3, @font-face und Cufon
10.04.2012 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch zeigen, wie ihr zum einen Schriften mit Googles WebFonts und / oder Cufon einbindet. Weiterhin zeige ich euch, wie ihr Schriften im Web mittels CSS stylen könnt.
HTML5 / CSS3: Webseiten richtig testen / Browsertests
31.01.2012 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie ihr eure neuen HTML5- und CSS3-Webseiten richtig testen könnt. Dabei kommen folgende Tools zum Einsatz: http://browsershots.org/ VMware Fusion
Die besten Tools zum Erstellen von HTML5- und CSS3-Webseiten
14.01.2012 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch einige sehr hilfreiche Tools vorstellen, mit denen man HTML5 und CSS3 entwickeln kann. Dazu gehören: html5css3box.com mycodestock.com kuler.adobe.com prefixmycss.com ajaxload.info...
Spieleprogrammierung mit HMTL/CSS & JavaScript am Beispiel Hangman
08.09.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch erklären, wie ihr ein einfaches Spiel auf Basis von HTML, CSS und JavaScript programmieren könnt. Bei dem Spiel handelt es sich um das bekannte Galgenmannspiel (Hangman, Galgenmännchen, usw.),...
Website im kinderfreundlichen Look & Feel - Teil 2: Coding
13.08.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch zeigen, wie ihr eine komplette Webseite auf HTML5- und CSS3-Basis umsetzen könnt. Dabei verwenden wir natürlich nicht nur den neuen HTML5-Doctype, sondern auch einige der neuen HTML5-Tags und...
Die meistgenutzten Content-Overlay-Boxen (Lightboxen)
05.08.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training erkläre ich euch, wie ihr die meistgenutzten Content-Overlay-Boxen (Lightboxen) einbaut und benutzt. Download-Links: http://www.huddletogether.com/projects/lightbox2/ - Lightbox2 http://colorpowered.com/colorbox/...
Entwicklung einer mobilen Webseite für mehrere Endgeräte mit HTML5 und CSS3
04.08.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch verschiedene Themen vorstellen. Als Beispiel werde ich euch eine kleine Webseite zeigen, die für verschiedene mobile Endgeräte ausgelegt ist und das aktuelle Commag zum Download anbietet. Dabei...
A-bis-Z-Projekt: Erstellung einer kompletten Webseite - Teil 3 - Wordpress-Theme erstellen
08.07.2011 in Webentwicklung von Pascal-BajoratIn dieser Fortsetzung der Video-Training-Reihe "A-bis-Z-Projekt (Trockenbau-Waren.de)" zeige ich euch, wie ihr das Layout, das wir in Teil 1 erstellt und in Teil 2 in HTML und CSS umgesetzt haben, nun an Wordpress anpasst (also...
A-bis-Z-Projekt: Erstellung einer kompletten Webseite - Teil 2 - Programmierung mit HTML und CSS
04.07.2011 in Webentwicklung von Pascal-BajoratIn dieser Video-Training-Serie möchte ich euch einen Einblick in die Erstellung einer kompletten Webseite geben, vom Design über die Programmierung bis hin zur Onlineschaltung. In diesem Video zeige ich euch, wie ihr das Layout aus...
A-bis-Z-Projekt: Erstellung einer kompletten Webseite - Teil 1 - Layout
30.06.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training-Dreiteiler möchte ich euch einen kompletten Einblick in die Erstellung einer Webseite geben, vom Design über die Programmierung bis hin zur Onlineschaltung. Das fertige Projekt kann hier angeschaut werden:...
Facebook- und Social-Media-Integration in Websites
24.06.2011 in Webentwicklung von Pascal-BajoratDas Thema Facebook und Social-Media-Integration ist für viele Webmaster ein Thema, das kaum noch vernachlässigt werden kann. Denn Facebook ist überall präsent. In diesem Video-Training möchte ich euch zeigen, wie ihr den...
Die wichtigsten Firefox-Add-ons & Plug-Ins für Webdesigner und Webworker
22.06.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch einige wichtige und hilfreiche Add-ons für den Mozilla Firefox vorstellen. Dabei dürfte gerade meine letzte Empfehlung etwas komisch klingen, viele dürften das Problem aber kennen. Wenn man den...
Nützliche Web-Tools für Webdesigner
24.05.2011 in Webentwicklung von Pascal-BajoratIn diesem Video-Training stelle ich euch diverse nützliche Web-Tools vor, die jedem Webdesigner eine große Hilfe bei der täglichen Arbeit sein können. https://mycodestock.com/ http://kuler.adobe.com/ http://css3generator.com/...
Kontaktformular per PHP und mit JavaScript-Validation
31.10.2010 in Webentwicklung von Pascal-BajoratIn diesem Video-Training möchte ich euch zeigen, wie ihr ein barrierefreies Kontaktformular in HTML und CSS baut, wie es danach mit einem PHP-Formmail-Script abgeschickt und mit JavaScript auf valide Eingaben überprüft wird....
Fonts in Webseiten einbinden
01.10.2010 in Webentwicklung von Pascal-BajoratIn diesem Tutorial zeige ich euch, wie ihr Fonts, die nicht zur Standardauswahl der meisten Computer gehören, in Webseiten einbinden könnt. Dabei demonstriere ich euch folgende Möglichkeiten: Google Font Directory –...
Tipps und Tricks zur Webentwicklung: WYSIWYG-Editoren in Webseiten einbinden
02.08.2010 in Webentwicklung von Pascal-BajoratIn diesem Video zeige ich euch, wie ihr die wohl zwei bekanntesten WYSIWYG-Editoren CKEditor und TinyMCE in eure Webseite einbinden könnt und welche Verwendungsbeispiele es gibt.
Tipps und Tricks zur Webentwicklung: Suchmaschinenoptimierung - so geht's!
20.07.2010 in Webentwicklung von Pascal-BajoratIn diesem Video-Training zeige ich euch, worauf es bei der Suchmaschinenanmeldung ankommt, wie man seine Webseite analysiert und den Code für Suchmaschinen optimiert. Es werden alle wichtigen Basics und eine kleine Beispielanmeldung...
Tipps und Tricks zum Webdesign: Linktipps
15.07.2010 in Webentwicklung von Pascal-BajoratWeiterführende Links mit Tipps und Tricks zur Webentwicklung stelle ich dir in diesem Video-Training vor. - Farbhilfesysteme Kuler http://kuler.adobe.com/ - Linktipp für Icons: http://iconspedia.com/ und www.iconload.de - Linktipp zur...
Tipps und Tricks zur Webentwicklung: Conditional Comments
09.07.2010 in Webentwicklung von Pascal-BajoratIn diesem Video zeige ich euch, wie Ihr Conditional Comments verwenden könnt. Eine Übersicht über mögliche Konstellationen findet ihr unter diesem Link.
Tipps und Tricks zur Webentwicklung: Dropdown Navigation mit CSS
07.07.2010 in Webentwicklung von Pascal-BajoratIn diesem Video zeige ich euch, wie ihr eine Dropdown Navigation mit CSS realisieren könnt.
Tipps und Tricks zur Webentwicklung: CSS speziell für IE6
03.07.2010 in Webentwicklung von Pascal-BajoratIn diesem Video zeige ich euch, wie ihr CSS-Code erstellt, mit dem explizit der IE6 angesprochen wird. So können z.B. Bugs behoben oder spezielle Update-Nachrichten für den IE6 erstellt werden.
Tipps und Tricks zur Webentwicklung: print.css
27.06.2010 in Webentwicklung von Pascal-BajoratTipps und Tricks zum Webentwicklung: print.css. In diesem Video zeige ich euch, wie ihr eure Webseite mithilfe der sogenannten print.css druckfreundlich gestalten könnt. Die print.css ist eine CSS Datei, die richtig angewandt eure...
Tipps und Tricks zum Webdesign: jQuery und jQuery UI
25.06.2010 in Webentwicklung von Pascal-BajoratTipps und Tricks zum Webdesign: jQuery und jQuery UI. In diesem Video zeige ich euch wie ihr einfache Animationen mit der jQuery erstellen könnt, wie die Grundstruktur und Aufbau der jQuery auszusehen haben. Weiterhin zeige ich einige...
Tipps und Tricks zum Webdesign: Cufon
21.06.2010 in Webentwicklung von Pascal-BajoratTipps und Tricks zum Webdesign: Cufon. In diesem Video-Training zeige ich euch, wie ihr mithilfe des Scriptes Cufon Schriften in eurer Webseite verwenden könnt. Cufon bietet die Möglichkeit, z.B. ttf-Dateien zu konvertieren und in einer...
Tipps und Tricks zum Webdesign: Shadowbox
16.06.2010 in Webentwicklung von Pascal-BajoratTipps und Tricks zum Webdesign: Shadowbox. In diesem Video zeige ich euch, wie ihr die Shadowbox in eure Website integrieren könnt, wie ihr den Online-Generator verwendet und ein paar Beispiele zur Verwendung.
Tipps und Tricks zum Webdesign: Prototype Lightbox 2
04.06.2010 in Webentwicklung von Pascal-BajoratTipps und Tricks zum Webdesign: Prototype Lightbox 2. In dem Video zeige ich euch, wie ihr die Prototype Lightbox 2 von Lokesh Dhakar in eure Webseite einbinden und anpassen könnt.
Tipps und Tricks zum Webdesign: Browsertest für Websites
28.05.2010 in Webentwicklung von Pascal-BajoratIn dem Video-Training zeige ich dir, wie du deine Websites am einfachsten in diversen Browsern testen kannst. Es werden folgende Tools verwendet: VMWare Fusion für Mac OS X browsershots.org spoon.net/Browsers
Tipps und Tricks zum Webdesign: Einleitung und Themenübersicht
23.05.2010 in Webentwicklung von Pascal-BajoratEinleitung zur Video-Tutorial-Reihe: Tipps und Tricks zur Webentwicklung. Ich stelle dir in den folgenden Video-Trainings einige nützliche Firefox-Addons sowie diverse Tools, Scripte und WebLinks vor. Konkret geht es um: Addons für...
Template Vorlage in Typo3 einbinden
12.10.2009 in Webentwicklung von imaginataHier könnt Ihr erfahren, wie man ein Menü (vertikal) in Typo3 anlegt. Die Vorlage findet Ihr zur freien Verfügung im Netz. Viel Spaß!
