Internet, html og Dreamweaver Anden øvelsesgennemgang Onsdag den 13. juni Webkommunikation 2007 v/ Niels Christian Nielsen.

Slides:



Advertisements
Lignende præsentationer
Introduktion til CSS Videre med CSS. Body egenskaber Body-markøren omslutter alle vores indholdselementer. Du kan derfor ved at tillægge en række egenskaber,
Advertisements

Introduktion til HTML HTML dokumentets struktur & Indhold.
Hejnsvigbynet.dk Opdatering med typo3 CMS. •Mål –Deltagere skal kunne oprette og redigere tekst, tabeller og billeder på en underside •Forudsætninger.
Klik på Aktivér redigering på meddelelseslinjen.
Hjemmesidekonstruktion Tjekspørgsmål 1.Hvad er et markup-sprog – hvad bruges det til? 2.Hvad er forskellen mellem et markup-sprog og et scriptsprog? 3.Hvad.
Vejledning i weblog-værktøjet
Introduktion til CMS. Indhold ● Forberedelse af indhold til hjemmeside ● Opsætning af hjemmeside (CMS)
Modul 2: Website Undervisere: Stefan og Helle Hvad handler modulet om?
Introduktion til CSS I gang med min første HTML & CSS hjemmeside.
Highlighting En teknik til at fremhæve områder af tekster eller billeder 1.
Blogger.com - lav din egen hjemmeside
IT i Byggeriet Semester kursusgang Introduktion til projektweb og html Kjeld Svidt Kjeld Svidt  Institut for Bygningsteknik  Aalborg.
Vejledning i blog-værktøjet WordPress Opdateret oktober 2012.
Vejledning i blog-værktøjet WordPress Opdateret august 2008.
Vejledning i blog-værktøjet WordPress Opdateret februar 2009.
Cascading style sheets (CSS) Formål med css • Adskillelse af indhold og udtryk • Større typografisk frihed • Nemmere redigering Eksempel uden style sheetuden.
Asma (Mona) Khan & Mathilde Lolle
Program for Dag1 1. ca Intro til kurset og gruppeopdeling 2. ca Markupsprog og browsere – hent Komodo 3. ca Tags, xhtml, Validering.
Grundlæggende Webdesign Blåt hold – øvelsesgang 2
1. Del - Karin. Undervisere: Peter, Karin, Jens og Gitte Hvem er Peter & Karin? Broadcast:
Dag 9: Programpakker Jquery og JQuery Mobile
Fil kendskab KLIK for start. De vigtigste filer er dem i Office-pakken. Word dokument.doc Word skabelon.dot Word dokument.RTF Excel projektmappe.xls Excel.
CSS ver. 2 Rikke Møller-Poulsen. Visning af billeder?!? Er der stadig nogen, der har problemer med at få vist billeder på deres site?
Skoleporten Hvordan tilpasser jeg layout mulighederne i
Google som søgemaskine
Masterpages/Otto Knudsen 1 Master Pages Master Pages i ASP.NET 2.0.
Eksekvering/Otto Knudsen 1 Udrulning Publicering af en web-applikation.
Introduktion/Otto Knudsen 1 Overblik WebForms ASP.NET.
Webserveren kan afvikle flere applikationer, der hver har deres eget selvstændige ”liv” og hukommelse. Den enkelte applikation består typisk af flere elementer.
Blogging Udvidet design og funktion
Formål med dag 2 1.Hvordan lægger man websider ud på internettet 2.Hvordan optimerer man billeder til web? 3.Hvordan sætter man billeder ind på websider?
XML1 4.7 XML and Its Data Model. XML2 Introduktion til XML, 178 XML = eXtensible Markup Language Markup language –sprog, hvor data "pakkes ind" i tags.
18 – Java Server Faces. 2 NOEA2009Java-kursus – JSF 2 Web-applikationer - 1 Brugere interagerer med en Web-browser Browseren sender forespørgsler til.
1 Webdesign - De første trin Grundliggende begreber Internettet (1969-): En fællesbetegnelse for netværk eller tjenester der benytter samme.
Øvelsesgang 1 - DWDK Rikke Poulsen. Timernes indhold supplement til læsningen og forelæsningen Jeres behov? Gennemgang af opgaverne? Andre emner, i vil.
Udviklingstarget for portaler og portalservices Resume: Indstilling til SG og overdragelse til OIM.
Stig Irming-Pedersen ASP.NET MVC Partner Copenhagen Software.
Implementering af eget design til en D!ng-hjemmeside v/ Ewan Andreasen
BlueDoc 2.0 (C) 2003 TMA Components Web-integreret Intranet søgemaskine.
HTML intro Dag 1. Client – Server miljø Client Server Klient ◦ Hardware (Screen size, colors, processor…) ◦ Platform (Mac, Windows, Linux…) ◦ Browser.
Intro Evaluering De sidste to gange?. HTTP, cookies og sessions Forelæsning nr 10 Tilbage til trafikken mellem server – client Sende HTTP-request og respons.
Gennemgang af hjemmeside.
CSS - Cascading Style Sheets HTML-koder for tekststruktur og for formatering HTML-koder for tekststruktur CSS-koder for formatering FørNu Lettere at redigere.
Webserveren kan afvikle flere applikationer, der hver har deres eget selvstændige ”liv” og hukommelse. Den enkelte applikation består typisk af flere elementer.
IT i Byggeriet Semester kursusgang Introduktion til projektweb og html Kjeld Svidt Kjeld Svidt  Institut for Bygningsteknik.
DWDK Øvelsesgang 2. Tegnsæt: utf-8 vs. iso Utf-8 = universelt tegnsæt Giver advarsel i validator Dokument skal gemmes i utf-8 format i notepad.
Fremstilling af Simple WEB steder [ITPL] Foråret 2004
IT i Byggeriet Semester kursusgang Introduktion til projektweb og html Kjeld Svidt Kjeld Svidt  Institut for Bygningsteknik  Aalborg.
Webserveren kan afvikle flere applikationer, der hver har deres eget selvstændige ”liv” og hukommelse. Den enkelte applikation består typisk af flere elementer.
XML 2. Formatering af XML data med CSS Når man arbejder med XML og CSS er fremgangsmåden den samme som i forbindelse med HTML og CSS.
PD – kursusgang 3 Introduktion til Java Script. Mål Viden om hvordan JavaScripts indlejres i HTML dokumenter Viden om programmering i JavaScript  Erklæring.
CSS - Cascading Style Sheets HTML-koder for tekststruktur og for formatering HTML-koder for tekststruktur CSS-koder for formatering FørNu Lettere at redigere.
DWDK – øvelsestime 3 CSS – let the fun begin!!. Tilgængelige slides Disse slides ligger på mit public drev
Grundlæggende web design, ITU Torsdag d. 3 nov Javascript.
Grundlæggende DW, HTML, CSS, udskæring.
Client / Server teknologi Eksamensteori Anbefaling: Tag notater.
Kjeld Svidt  Institut for Byggeri og Anlæg  Aalborg Universitet IT i Byggeriet Semester kursusgang Introduktion til projektweb og html Kjeld.
Webdesign & Webkommunikation, ITU Torsdag d. 9 feb HTML © Hasse Feldthaus.
PD – kursusgang 2 Introduktion til Frames og Cascading Style Sheets.
Udvikling af mobilsites Einar Gislason / FTF. Mobilsites Mobilvenlige sites.
Øvelsestimer (opgave 3) v/Morten Davidsen Øvelseslærer på ITU cand.merc.(dat.) studerende på CBS.
Øvelsestimer (opgave 3) v/Morten Davidsen Læser til daglig cand.merc.(dat.) på CBS.
Kjeld Svidt  Institut for Byggeri og Anlæg  Aalborg Universitet IT i Byggeriet Semester kursusgang Projektweb og html (fortsat) Kjeld Svidt.
Dreamweaver, CSS og eksterne applikationer Fjerde øvelsesgennemgang Onsdag den 20. juni Webkommunikation 2007 v/ Niels Christian Nielsen.
PHP Intro Webintegrator PHP. PHP Baggrund PHP er et server-side programmeringssprog anvendt til udvikling af dynamiske webapplikationer og websteder.
Computerens talsystem
De grundlæggende redskaber
De grundlæggende redskaber
Vejledning: Publicering af artikler på portalen.
Efter folkeskolen kan du i Danmark typisk vælge én af 2 ”retninger”
Præsentationens transcript:

Internet, html og Dreamweaver Anden øvelsesgennemgang Onsdag den 13. juni Webkommunikation 2007 v/ Niels Christian Nielsen

Første set: Om internettet - servere, klienter og browsere - filer - billede - farver, Sproget html - html-indføring - html-øvelser Programmet i dag Andet set: Dreamweaver, programmet - Introduktion af værktøjer, leg med farver og kode. - forbered FTP-upload, gemme filer - forklaring af layers - lav enkelt link mellem flere sites, og upload disse.

Internettet 1

Internettet 2 KlientServer Sprog HTML, javascript PHP, ASP KarakterStatiskDynamisk Browsere: Internet Explorer, Firefox, Opera, Safari browserstatistik browserstatistik Styresystem: Windows, Mac, Linux

Internettet 3 Filerbrugfilendelse Html-fil Indeholder htmlkodning - til visning af netsider.html /.htm Flash-fil Indeholder flashkodning - til visning af avanceret indhold til netsider.swf javascript Indeholder javascript - til visning af avanceret indhold til netsider.js Cascading Style Sheets Indeholder css-kodning - til definering af form af netsider..css asp-filer Serverside sprog, bruges til at lave dynamsike netsider (asp-sprog + andre som html).asp php-filer Serverside sprog, bruges til at lave dynamiske netsider (php-sprog + andre som html).php

Internettet 4 Billedfilerbrugfilendelse Jpg-fil Til billeder med mange forskellige farver.jpg Gif-filer Få farver plus transparent.gif Png-fil Som gif (i 8- bitversionen), blot ikke proprietært modsat gif- fil-systemet Kan også mere, følg nedenstående link.png Forskellene mellem filerne beskrevet indgående

Internettet 5 Farver kodes efter hexadecimalsystemet: #RRGGBB Sort: # Hvid: #ffffff Blå: #0000ff Grå: # Websafe colors

Internet og html

HTML 1 Hyper Text Markup Language Reglerne små bogstaver, hierarki, attributter angives i ” ” Skabelon:<start-tag>indhold</slut-tag> Stand-alone: Stand-alone: Skabelon med attribut: indhold indhold der kan være flere attributter i en tag

HTML 2 Eksempel på koder 1 Grundstrukturen: Angiv en titel her Angiv en titel her </head><body> Tekst som bliver vist på netsiden. </body></html>

HTML 3 Eksempel på koder 2 Link: Link tekst Link: Link tekst relativ sti kontra absolut sti Farvet tekst: Farvet tekst Farvet tekst: Farvet tekst NB! Semikolon efter værdien Fed tekst tekst, Kursiv tekst tekst, Overskrift: overskrift (eller h2, h3….h6 ) Paragraf: tekst Paragraf: tekst

HTML 4 Eksempel på koder 3 Standalone tags: Et billede: Et billede: Linjeskift:

HTML 5 Lær meget mere på

Øvelse 1

Øvelse 2 Opgave: - Få et billede til at fungere som link fra en side til en anden. - Få den anden side til at linke tilbage til den første side. (brug relativ sti-angivelse)

Dreamweaver ► ► Introduktion af værktøjer, leg med farver og kode.   View: code vs design   Insert, Properties, Advanced layout, Design, Files ► ► Forbered FTP-upload, gemme filer   Filmenu: Site > New site (ftp-oplysninger)   Filmenu: Modify > Page properties (indstillinger for hele site) ► ► Forklaring af layers   Absolutte/relative og ’nested’ + proporties () ► ► Lav enkelt link mellem flere sites, og upload disse.