Med responsiv design ("följsam design") förändras och anpassas webbsidornas layout helt automatiskt till besökarens enhet, skärmstorlek och skärmupplösning.
Antal kolumner och bilder (i bredd) kan med responsiv design automatiskt anpassas. Bilder och annat kan också skalas om i förhållande till fönsterbredden. Det innebär att besökare kan se samma webbplats från till exempel mobiltelefoner, surfplattor och persondatorer, utan att behöva scrolla i sidled samt zooma ut och in vilket hade behövts annars.
Responsiv design med mobilanpassning är ett populärt alternativ till att designa olika versioner av webbplatsen där besökaren aktivt väljer om denne vill se sidan i "desktopversion" eller "mobilversion". Det är också kostnadseffektivt för ägaren att endast behöva skaffa samt underhålla en version av sajten. Google prioriterar dessutom mobilanpassade hemsidor i sina sökresultat.
I mobilläget får besökarna ibland lite mindre information för att lättare få en snabb överblick. De får större text och knappar, tydliga menyer som är enkla att klicka på, samt en layout där de slipper zooma in och ut och i stället kan scrolla upp och ned.
Webbsidorna jag gör har full responsivitet, med mobilanpassning. De ser därmed bra ut och blir lättlästa i alla sorters enheter. Jag gör dessutom alltid extra justeringar i koden och layouten för att ytterligare anpassa webbsidorna till de olika enheterna!
B Bootstrap är det vanligaste systemet för att skapa avancerade, responsiva webbsidor. Jag använder företrädesvis Bootstrap 5.x, den senaste utgåvan av Bootstrap. Första stabila versionen av Bootstrap 5 släpptes 5 maj 2021.
Bootstrap 5 har stöd för de nyare utgåvorna av dagens populära webbläsare och plattformar.
Om du behöver stöd för lite äldre webbläsare använder jag Bootstrap 4.x. Vilka webbläsare du behöver stöd för beror på vilka dina målgrupper är (och vad de använder för webbläsare). Det klurar jag ut.
Brytpunkter i en responsiv layout motsvarar olika webbläsarbredder i pixlar (px). Exempelvis är 768px brytpunkt vid övergång från surfplatta till mobiltelefon i Bootstrap.
I alla versionerna av Bootstrap ingår mobilanpassning, men antalet brytpunkter är i övrigt olika. Bootstrap 3 har till exempel responsivitet med fyra brytpunkter (se bilden ovan). Bootstrap 4 har fem brytpunkter och Bootstrap 5 har sex brytpunkter. Den sjätte brytpunkten i Bootstrap 5 gör det möjligt att ännu bättre kunna utnyttja bredden i datorer med stora (breda) skärmar.
De största skillnaderna mellan Bootstrap 5 och Bootstrap 3 och 4 är att Bootstrap 5 är lite snabbare samt har mer responsivitet än de andra med sina sex brytpunkter. I Bootstrap 5 har man också bytt ut jQuery mot (vanilla/"rent") JavaScript. jQuery är ett JavaScript-bibliotek.
Hos mig får du en responsiv, mobilanpassad hemsida, med extra allt. Jag skräddarsyr den till dig. Till kontaktsidan
BitWeb24, Britt-Inger Jonsson
E-post: info@bitweb24.se
Svar inom några timmar.
Telefon: 072-210 78 58
Telefontid bokas via e-post eller sms.
Jag har skrivit några informationstexter som har med webb och dagens hemsidor att göra. I dem förklarar jag bland annat några viktiga begrepp.
Index - Bra att veta