Inleed Webbhotell

HTML-tips admin — Wed, 08 Feb 2012 16:15:03 +0000

Letar du efter ett webbhotell? Då kan vi rekommendera Inleed Webbhotell. Inleed erbjuder webbhotell för 19 kr månaden. Då ingår bland annat 1000 MB utrymme, 10 GB trafik/månaden, PHP, MySQL, E-post, Telefonsupport, E-postsupport, Livesupport och mycket mer. Allt administreras enkelt i deras kontrollpanel, DirectAdmin. WordPress installeras enkelt genom några knapptryck i deras kontrollpanel.

Förutom webbhotell erbjuder man även serverhotell. Med serverhotell kan man hyra en egen server i deras hall eller ställa dit sin befintliga.

Vid frågor om deras produkt rekommenderar vi er att kontakta deras support.

Introduktion i HTML

Anthon — Sat, 19 Nov 2011 16:03:57 +0000

Vad är HTML?

HTML är ett märkspråk som används till att skapa hemsidor som ses i webbläsaren. Det som är meningen med HTML är att en .html-fil skall kunna visas av alla webbläsare oberoende om besökaren sitter på en PC eller Mac. Då krävs det att man kodar på rätt sätt. Med HTML så strukturerar du upp din hemsida med hjälp av taggar. Till exempel: Om du vill göra en del av en text i fet stil så börjar du att skriva och avslutar med . Vissa taggar behöver ingen sluttagg. Till exempel:
eller . Alla taggar kan skrivas med stora bokstäver, t.ex. eller . Alla taggar kallas för element. Det finns också vissa alternativ för de olika taggarna. Vi kanske vill att en text skall visas i färgen röd. Då skriver vi Min röda text. Elementet vi använder nu är och den har ett attribut som heter color. Sen skriver vi vilken färg vi vill ha. Ett attribut måste ha ett mellanslag mellan taggnamnet och attributnamnet. Om vi skriver så tolkas det fel och då blir inte texten röd. Webbläsaren tolkar de olika taggarna och skriver ut själva innehållet. Har du skrivit fel kod så kan inte din webbläsare tolka taggarna och då blir det oftast fel. Det finns olika versioner av HTML. Just nu är HTML 4.0 den version man använder mest. HTML 5 är en ny version men alla webbläsare stödjer inte den versionen.

HTML-dokument

Ett HTML-dokument kan skapas i vilken textredigerare som helst men skall sparas med filändelsen .html. De flesta använder Anteckningar (Notepad) att skriva kod i men det är rekomenderat att skaffa sig en mer avancerad textredigerare, t.ex. Notepad++ eller Eclipse. Efter du har sparat din .html fil så ska du öppna den i din webbläsare. När du ska spara en fil, använd inte å,ä eller ö. En rekomendation är att alltid stava filnamn med små bokstäver. En viktig sak med HTML-taggarna är att dom måste avslutas innan en annan tagg börjar. Följande HTML kod är korrekt:

Min text

Den här koden är felaktig.

>Min text

Om du börjar att skriva och sen glömmer du att skriva en sluttagg till den så kommer allting efteratt bli i fetstil. Glöm aldrig att avsluta en tagg.

Ett exempel på ett HTML-dokument

Ett simpelt HTML-dokument kan ses nedan.

"http://www.w3.org/TR/html4/loose.dtd">
Min hemsida Välkomment till min hemsida! Det är min egen hemsida som jag gjort med hjälp av HTML. Du kanske inte förstår vad det här betyder? Det skall vi nu gå igenom. "http://www.w3.org/TR/html4/loose.dtd"> betyder att vi vill använda oss av version 4.0 av HTML. Det kallas för en DOCTYPE. Du måste alltid ha en DOCTYPE överst i ditt dokument. och ser du att dom finns i början och i slutet. Det betyder att här börjar samt slutar ett HTML-dokument. och är en tagg som alltid skall komma efter taggen. I taggen skriver man sin titel på hemsidan med hjälp av . är också tillför att man ska kunna ange META-taggar och sökvägar till CSS och javascript dokument. För dig som är nybörjare räcker det med att skriva. Att ha en </strong>på sin hemsida är obligatoriskt. Titlen är det som syns högst uppe i din webbläsare.</p> <p><strong><body></strong> och <strong></body> </strong>säger att allt innanför dessa taggar skall visas på hemsidan, exempelvis text och bilder.</p> <p><strong><h1></h1></strong> Anger att texten som står innanför kommer visas som en rubrik. <strong><h1></strong> är den största rubriken medans <h6> är den minsta. Du kan ändra från <strong><h1></strong> till <strong><h2></strong>, <strong><h3></strong> osv.</p> <p><strong><p></p></strong> är till för att skriva stycken.</p> <p><strong></strong> betyder att vi vill visa en bild och attributet <strong>src=”"</strong> anger sökvägen till bilden.</p> <p><strong>HTML-redigerare</strong></p> <p>Det finns många bra HTML-redigerare att ladda ner gratis ifrån nätet. Jag rekommenderar <a href="http://notepad-plus-plus.org/">Notepad++</a>. Dreamweaver finns också men jag gillar inte den eftersom den skapar den mesta koden automatiskt för dig.</p> </article> <article> <h1>16 Insikter i Googles Betygs-riktlinjer (SEO)</h1> <p>HTML-tips admin — Wed, 26 Oct 2011 09:24:48 +0000</p> <p>Search Engine Land har i och med att Google blockerade nyckelords-remisser och nostalgisk mani över MC Hammer sökmotor, läckt ett internet document om Googles officiella riktlinjer för hur dom bedömer kvalité på våra hemsidor.</p> <p>Ni skall veta det innan ni går över till den ursprungliga artikeln, det är att det avslöjas inga hemligheter om Googles algoritm, utan det som delas med är handplockade delar som personen som skrivit artikeln tycker är det mest nödvändigaste att veta utifrån det läckta dokumentet på 125 sidor.</p> <p>På seomoz.com’s hemsida, där artikeln även är skriven, kommer du att få läsa en utbildnings handbok om Googles filosofi om kvalitet.<br /> ”Nyckeln till proaktiv SEO är att förstå hur Google tänker.” – seomoz.com<span id="more-140"></span></p> <p>Gå till sidan där seomoz pressenterar ” 16 Insikter i Googles Betygs-riktlinjer (SEO) ” - <a href="http://www.seomoz.org/blog/16-insights-into-googles-rating-guidelines">http://www.seomoz.org/blog/16-insights-into-googles-rating-guidelines</a></p> </article> <article> <h1>Gratis PSD Grafiskt Användargränssnitt (GUI) för iOS 5 (iPhone 4S)</h1> <p>HTML-tips admin — Sat, 15 Oct 2011 11:32:50 +0000</p> <p><a href="http://html-tips.se/ios-5-gui-psd-iphone-4s"></a></p> <p>Varje gång vi skapar en av dessa filer märker vi precis hur mycket som faktiskt har ändrats. Jag pratar förståss om de små sakerna, detaljerna.<br /> Det är verkligen en lärorikt upplevelse att se saker på så nära håll, vad som verkligen gör ett användargränssnitt.</p> <p>Du märker inte dessa detaljer i ditt vanliga användande, men om vi kollar med förstoringsglas så kan vi se de små, men otroligt viktiga, ändringar som apple har laggt till/ändrat.<span id="more-132"></span><br /> När du använder din telefon för att skicka iväg en tweet, eller kolla e-posten ser du dessa hundratals små detaljer per sekund. Det är dessa detaljer som gör upplevelsen till vad den är.</p> <p>Det är dessa detaljer, såsom en border, djupet på en skugga, vilken färg, storlekar, fonter osv, som gör saker mer konsekventa och andra gör saker mer användbara. Det finns dock ett fåtal detaljer som kan lämna dig kliades i huvudet, och det är därför en så liten detalj spelar så stor roll i hur vi skapar våra små detaljer.</p> <p>Det är just därför personerna bakom teehanlax har varit så vänliga och skapat ett helt kitt med grafiska användargränssnitt (GUI) för iOS 5 (iPhone 4S).</p> <h3>LADDA NER DET ”<a href="http://www.teehanlax.com/downloads/ios-5-gui-psd-iphone-4s/" target="_blank">Grafiskt Användargränssnitt (GUI) för iOS 5 (iPhone 4S)</a>”!</h3> </article> <article> <h1>”Hur mycket kostar en hemsida? ” och andra prisfrågor.</h1> <p>HTML-tips admin — Thu, 06 Oct 2011 05:48:26 +0000</p> <p><a href="http://html-tips.se/hur-mycket-kostar-en-hemsida"></a></p> <p>Hur mycket ska jag betala för min design, och hur mycket ska du ta i betalt för ditt arbete? Det är en ständig diskussion, och det är få som verkar vilja prata om just prissättning.<br /> De flesta designers publicerar aldrig deras egna priser, och lycka till att få ett företag att berätta hur mycket dom spenderade på sin hemsida.. <span id="more-125"></span></p> <p>Resultatet i detta leder till att du som köpare vet inte hur mycket pengar du skall lägga på en design, och du som designer vet heller inte hur mycket dina kunskaper och designer är värda.<br /> Spendera för mycket pengar som köpare, och du kommer att få höra att du har slösat dina pengar, och du kommer att må dåligt i slutändan. Spenderar du dock för lite, riskerar du att stå där med en sketen ”designad av min sons 14 åriga vän” design.</p> <p>Du som designer, om du tar för mycket i betalt, så kommer det att leda till slut att inga kunder kommer till dig. Och tar du för lite i betalt, så kommer ditt intresse för att fortsätta arbetet och din matsäck att ta slut väldigt snabbt.</p> <p>Därför har jag valt att dela med mig av en artikel som folyo.com skrev för en vecka sedan. Där tar dom upp inte enbart kostnaden för en hemsida, utan även andra prisfrågor.<br /> Mycket intressant läsning! Hoppas ni finner nytta ur artikeln, och att ni drar kunskap ur den!</p> <p>URL till folyo.com’s artikel om ”Hur mycket kostar en hemsida?”: <a title="blog.folyo.com/how-much-does-a-website-cost" href="http://blog.folyo.me/post/10723370923/how-much-does-a-website-cost" target="_blank">blog.folyo.me/how-much-does-a-website-cost </a></p> </article> <article> <h1>Skapa surrealistiskt mänskligt ansikte med flammigt hår och sönderfallen effekt i Photoshop</h1> <p>HTML-tips admin — Sun, 18 Sep 2011 10:54:42 +0000</p> <p><a href="http://html-tips.se/skapa-surrealistiskt-manskligt-ansikte-med-flammigt-har-och-sonderfallen-effekt-i-photoshop"></a></p> <p>WebDesignTC tipsade om ett inlägg där psdvault.com skapade en häftig flammande effekt på en text. Väl därinne såg jag en fet text ”Featured Photoshop Tutorial of the Week”. Till höger om texten såg jag ett helt otroligt coolt ansikte (likt den bild ovan) och tänkte, ”shit, det här måste vara intressant för några av mina läsare på html-tips.se.. Jag tar och tipsar om tutorialen!”<span id="more-118"></span></p> <p>Så här har ni den url till tutorialn: <a href="http://www.psdvault.com/photo-effect/create-surreal-human-face-with-flame-hair-and-disintegration-effect-in-photoshop/" target="_blank">http://www.psdvault.com</a></p> <p>Såhär ser den slutgiltiga bilden ut också!</p> <p></p> </article> <article> <h1>CSS3 Pie gör att du kan använda flera av de vanligaste css3 dekorationsstilar i IE6-9</h1> <p>HTML-tips admin — Fri, 16 Sep 2011 20:47:30 +0000</p> <p><a href="http://html-tips.se/css3-pie-gor-att-du-kan-anvanda-de"></a></p> <p>Som de flesta av oss redan vet, så kan inte IE6-9 rendera css3, antingen på det sätt vi vill, eller ur huvudtaget.<br /> Men nu har CSS3 PIE gjort ett script så att även IE6-9 kan rendera många av de flesta mest använda css3 dekorationsstilar!</p> <p>Gå gärna in och kolla på deras hemsida och ladda ned scriptet du också! url: <a href="http://css3pie.com/">css3pie.com</a></p> </article> <article> <h1>Twitter släpper en Web Analytics Tool ( Webbanalysverktyg )</h1> <p>HTML-tips admin — Tue, 13 Sep 2011 20:13:44 +0000</p> <p><a href="http://html-tips.se/twitter-slapper-en-web-analytics-tool-webbanalysverktyg"></a></p> <p>I Tisdags släppte Twitter ett webbanalysverktyg som skall bidra till att ge viss klarhet åt webbplatsägare som förlitar sig på den information som nätverket förmedlar dem.</p> <p>Twitter Web Analytics är tänkt att ge webbplatsägare mer data om effektiviteten i deras Twitter-integrationer.<br /> Den drivs av Backtype, de sociala Analytics företag som Twitter förvärvade i juli.<span id="more-105"></span></p> <p>Twitter Web Analytics kommer, som Christopher Golda, ägaren av BackType och den nya Twitter plattformes chefen, hjälpa annonsutgivare och webbplatsägare förestå tre saker:</p> <ol> <li>Hur mycket av deras innehåll som blir publicerad på Twitter</li> <li>Hur mycket trafik som kommer från Twitter</li> <li>Hur bra Tweet knapparna fungerar</li> </ol> <p>Verktyget är gratis, och är fortfarande bara i Beta. En liten grupp av partners kommer att få tillgång till Twitter Web Analytics denna vecka, men Twitter kommer att släppa detta verktyg till alla webbplatsägare inom bara några veckor.</p> <p>PS. En API kommer att släppas för utvecklare! </p> <p></p> </article> <article> <h1>Skapa Call-to-Action knappar i WordPress med MaxButtons</h1> <p>HTML-tips admin — Fri, 09 Sep 2011 11:28:12 +0000</p> <p><a href="http://html-tips.se/skapa-call-to-action-knappar-i-wordpress-med-maxbuttons"></a></p> <p>Har du också sett flera stora hemsidor använda snygga knappar till att låta sina besökare gå till en specifik sida, eller ladda ned saker från deras sidor?<br /> Har du också undrat hur dom gör?</p> <p>Tidigare satt jag och labborerade med classer på mina länkar, för att återskapa snygga knappar där mina läsare kunde ladda ner/ gå vidare till en annan sida..<br /> Men nu är det slut på det!!<span id="more-93"></span></p> <p>Personerna borta på <a href="http://www.wpbeginner.com/refer/maxfoundry" rel="nofollow" target="_blank">Max Foundry</a> har skapat MaxButtons plugin till wordpress så att du busenkelt kan skapa en dynamisk knapp som du sedan enkelt kan bädda in i ditt inlägg genom att endast skriva [koden-och-id't] direkt i inlägget! Enkelt visst?</p> <p>Låt oss se på en liten film hur detta fantastiska pluginet fungerar!</p> <p></p> <p>Intresserad av mer läsning kring MaxButtons, och vill ladda ned det? Klicka då på länken nedan.</p> <p>URL till inlägget där wpbeginner.com skriver om pluginet: <a title="Skapa call to action knappar i wordpress med MaxButtons" href="http://www.wpbeginner.com/plugins/create-beautiful-call-to-action-buttons-in-wordpress-with-maxbuttons/" target="_blank">http://www.wpbeginner.com/plugins/…..-call-to-action-buttons-in-wordpress-…../</a></p> </article> <article> <h1>Google+ invites / inbjudningar !</h1> <p>HTML-tips admin — Wed, 24 Aug 2011 08:55:33 +0000</p> <p><a href="http://html-tips.se/google-invites-inbjudningar"></a></p> <p>Jag har 150st invites / inbjudningar över till Google’s nya satsning ”Google+”, och kommer nu att dela ut dessa invites / inbjudningarna till mina trevliga läsare!<span id="more-87"></span></p> <p><a title="Google+ invites" href="https://plus.google.com/_/notifications/ngemlink?path=%2F%3Fgpinv%3D7_bLYsFzeWc%3AlmoA04peNDU" target="_blank">Gå till registreringen!</a></p> </article> </main></body></html>