Program webbdesign bra webbdesignprogram från CoffeeCup

september 4, 2010 by Samuel Liljekvist · Leave a Comment
Filed under: webdesign 

Några program för webbdesign som fungerar bra. Webbdesignprogram finns det många av. Dessa har jag testat och därför kan jag rekommendera dessa program för webbdesign. Programmet Firestarter hjälper dig att bli flashdesigner utan att kunna Flash. Programmet Form Builder hjälper dig att skapa webbformulär utan att kunna programmera. CoffeeCup HTML-editor är en utmärkt HTML-redigerare som hjälper dig att bygga snygga och proffsiga hemsidor. Flash Photo Gallery skapar proffsiga fotogallerier snabbt och enkelt.

Kolla in dessa tutorials och se själv. Alla webbdesignprogrammen finns att ladda ner gratis under en provperiod.

CoffeeCup Firestarter

Download CoffeeCup Firestarter – Click Here

Flash Form Builder

Download CoffeeCup Flash Form Builder – Click Here

HTML Editor

Download CoffeeCup HTML Editor – Click Here

Flash Photo Gallery

Download CoffeeCup Flash Photo Gallery – Click Here

  • Share/Bookmark

Tags: , , , , ,

Iphone 4, pris Iphone 4, Apple Iphone, Iphone 4 Telia

september 2, 2010 by Samuel Liljekvist · Leave a Comment
Filed under: IT nyheter 

Och så kom den min Iphone 4 från Telia. Apple Iphone 4 visar direkt vad den går för. Jag byter upp mig från en Iphone 3 (inte Iphone 3g eller 3gs) så det är ett stort kliv för mig och för mänskligheten! Som vanligt fungerar allting klockrent från första början. Så är det alltid med Apple! Min Imac 27″ gör mig aldrig besviken och när jag nu synkade Itunes med min nya Iphone 4 från telia, så fick jag direkt in alla mina inställningar, bilder, kontakter, apps och allt annat i min nya Iphone. Apple I Love You!
Iphone 4 Telia, pris apple Iphone

  • Share/Bookmark

Tags: , , , ,

HTML-verktyg online för webbdesign och bloggdesign

augusti 14, 2010 by Samuel Liljekvist · 1 Comment
Filed under: webdesign 

Jag använder mig av några mycket användbara verktyg för webbdesign som effektiviserar arbetet med att designa och bygga hemsida eller blogg, som jag tänkte tipsa om här.

Ofta har man en text som är full av formateringar och radbrytningar som man vill få bort. Detta kan man göra genom att klistra in texten i en ruta och vips får man den nya rena texten i rutan under. Du kanske har en text som du snabbt vill omvandla från vanlig text till HTML. Eller du kanske har en komprimerad HTML-text som är helt oläslig. Då kan du omvandla den till läslig HTML. Det finns fler smarta funktioner som du ser i listan nedan. Det bästa är att allt är helt gratis! och att alla verktyg är online (du behöver alltså inte ladda hem något program).

Textverktyg

  • Remove Line Breaks from Text
  • Alphabetize Text
  • Capitalize the First letter of Sentences
  • Remove Whitespaces
  • Uppercase Text or Lowercase Text

HTML-verktyg

  • Convert Word to HTML
  • Convert Text to HTML
  • Convert CSV Text to HTML Table
  • Compress HTML Code
  • Uncompress HTML (Make Readable)
  • Encode URL
  • Javascript Pop-up Window Maker

Allt detta hittar du på Textfixer.com →

  • Share/Bookmark

Tags: , , , , , ,

Tre sätt att formatera med CSS – Cascading Stylesheets

augusti 12, 2010 by Samuel Liljekvist · 3 Comments
Filed under: CSS, webdesign 

Tre sätt att formatera ett dokument med CSS

Du kan lägga till CSS-kod till dina webbsidor på tre olika sätt: lokalt (inline), inbäddat (embedded) och länkat från en separat CSS-stilmall. Det klokaste valet när det gäller utveckling av webbplatser är dock att länka XHTML-sidorna till en CSS-stilmall, men vi kommer även att titta på de två andra alternativen eftersom de kan vara användbara medan du utvecklar dina sidor. En stilmall är en helt och hållet separat fil som enbart innehåller CSS-kod. En stilmall kan delas av ett obegränsat antal XHTMLsidor vilket garanterar att utseendet förblir enhetligt från sida till sida och medger att ändringar som görs av en viss stil omedelbart återspeglas på hela webbplatsen.

Lokala (inline) stilar

Lokala (inline) stilar bifogas till en tagg med hjälp av XHTMLtaggen style, så hän:

<p>Det här stycket visas med webbläsarens standardforrmat; för stycke. </p>

<p> style=font-size: 25pt; font-weight:bold; font-style:italic; color:red;”>Genom att lägga till lokal (inline) CSS-formatering för det här stycket, kan vi åsidosätta standardformateringen.</p>

<p>Och nu är vi tillbaka till det vanliga standardstyckeformatet utan någon lokal stil.</p>

Här är ytterligare några saker du behöver kär:änna till om lokala (inline) stilar:

  • Deras räckvidd är mycket begränsad. En lokal stil påverkar endast den tagg till vilken den är bifogad.
  • Praxisen att använda lokala stilar är helt enkelt ett annat sätt att skriva presentationskod direkt tillsammans med taggarna, precis som vi gjorde förr i tiden. Att lägga till lokala stilar överallt är lika illa för kodens flyttbarhet och redigeringsbarhet som att lägga till (X)HTML-attribut som exempelvis FONT. Lokala stilar bör generellt undvikas.
  • Vid de sällsynta tillfällen när man behöver åsidosätta ett format på ett visst ställe och det inte finns något bättre sätt att göra det, kan man skapa en lokal stil utan att behöva känna ;ig alltför skyldig. Med detta sagt, kan man nästan alltid undvika att använda lokala stilar genom att lägga till ett unikt ID eller en klass till taggen i fråga och sedan skriva motsvarande stil i stilmallen.
  • Användning av en lokal stil är ett bra sätt att pröva en stil innan man lägger in den i stilmallen (se avsnittet ”Länkade stilmallar” som strax följer). Kom bara ihåg att helt och hållet ta bort style-attributet när du fått den effekt du vill ha och klippa ut och klistra in enbart själva stilen i stilmallen. I annat ella ändrinaar du pör via stilmallen för just den taggen, och eiia ändringar du gör via stilmallen för just den taggen, och du riskerar att spendera timmar på att försöka fixa till stilmallen när problemet egentligen gömmer sig i XHTML-koden.
  • Lokala stilar prioriteras framför stilar som man definierar med inbäddade stilar (beskrivs härnäst), vilka i sin tur prioriteras framför globala stilar som man definierar i en stilmall. (Se avsnittet ”Vad innebär Cascading” senare i det här kapitlet för mer ingående information om hur konflikter mellan stilar hanteras.)

Inbäddade stilar

Man kan placera en grupp CSS-stilar i head-delen i ett XHTML – dessa kallas inbäddade stilar. Inbäddade stilar fungerar sa
här:

<head>

<title>Exempel på inbäddade stilar</title>

<meta http-equiv=”Content-type” content=”text/html; charset=iso8859-1″ />

<meta http-equiv=”Content-Language” content=”sv” />

<style type=”text/css”>

/* <![CDATA[ */

1 { font-size: 16pt; font-weight:bold;}

p {color:blue;>

/* ]]> */

</style>

</head>

Taggen style talar om för webbläsaren att den kommer att träffa på kod som inte är (X)HTML; taggens attribut fastslår att koden är !SS. (Om du vill inkludera JavaScript i dokumentets head-del tället för CSS, använder du taggen script med attributet ”text/ JavaScript”).

Här följer några kommenterar angående inbäddade stilar:

  • Räckvidden för inbäddade stilar är begränsad till sidan n som innehåller stilarna.
  • Om du bara publicerar en enda sida med dessa speciella stilar kan du bädda in stilarna i dokumentets head-del, även om du då egentligen inte separerar stilarna från innehållet; de finns fortfarande i samma dokument. Du får lära dig mer om inbäddade stilar när du arbetar med de enkelsidiga övningsexemplen i det här kapitlet.
  • Om man arbetar med flera stilar för en komplex layout, ex^mpelvis ett formulär, är det ibland enklare att skriva stilar 3m inbäddade stilar i head-delen i dokumentet, så att man inte hela tiden masta växla mellan XHTML-dokumentet och stilmallen. När sedan allt fungerar kan man flytta stilarna till stilmallsdokumentet och ersätta stilarna i head-delen med en länk till stilmallen.
  • Inbäddade stilar prioriteras framför stilmallar, men ft förlorar mot attribut som man definierar i lokala stilar. (Se avsnittet ”Vad innebär Cascading” senare i det här kapitlet för mer ingående information om hur konflikter mellan stilar hanteras.)

Länkade stilar

Man kan placera stilarna i ett separat dokument, en stilmall, som länkas till flera sidor så att stilarna får global räckvidd (över hela webbplatsen). Stilarna som definieras i en sådan stilmall kan påverka webbplatsens samtliga sidor, inte bara en enstaka sida eller tagg. Det här är den enda av de tre metoderna som verkligen separerar presentationsstilarna från koden för strukturen. Om du samlar alla dina CSS-stilar i en stilmall på det här sättet blir det enklare både att designa och redigera en webbplats.

Om man exempelvis behöver göra ändringar som påverkar hela webbsajten (”kunden vill att all brödtext ska vara blå, inte svart”) an man göra det lika snabbt och smärtfritt som när man modifierar en enskild CSS-stil. Detta är sannerligen mycket enklare än uppgiften att modifiera alla font-attribut för varje stycketagg på varje sida på webbplatsen, vilket man var tvungen att göra innan CSS fanns tillgängligt.

Du kan länka din stilmall till så många XHTML-sidor som du vill med en enda kodrad i head-delen i varje XHTML-sida:

<link href=”my_style_sheet.css” media=”screen” rel=”stylesheet” type=”text/ess” />

Stilarna tillämpas sedan på koden för varje sida när sidan laddas.

Observera att i taggen link ovan, definieras attributet media som ”screen”, vilket innebär att stilen är utformad för bildskärmen, vilket i det här fallet betyder webbläsaren. (Vissa användaragenter söker efter särskilda mediaattribut som bättre passar deras visgskapacitet – möjligheterna här är exempelvis: all, projection, handheld, print, aural. Gå till webbplatsen W3 Schools (www.w3schools.com/css/css_mediatypes.asp) för att se en komplett lista.)

En webbläsare som laddar sidan använder den stilmall som taggen link anger. Men genom att lägga till ännu en link-tagg där attributet media definieras som ”print”, kan man tillhandahålla en andra tilmall som webbläsaren använder i samband med utskrift. En stilmall specialutformad för utskrift kan eventuellt dölja navigeringselement och andra element som inte fyller någon funktion när innehållet ska visas på papper.

Om du skapar en andra stilmall för utskrift kan taggen se ut så här:

<link href=”my_style_sheet_print.css” media=”print’ re/=”stylesheet” type=”text/ess” />

I kommande inlägg om stilmallar ska vi titta på regler för hur man skriver stilmallar och hur begrepp som arv, exakthet (specificity) och Cascading styr hur dessa regler påverkar koden.

  • Share/Bookmark

Tags: , , , , , , , ,

Nästa sida »