lørdag 22. februar 2020

Nå har jeg begynt å midtstille mobil-nettsidene på johncons.net


https://www.johncons.net/mobil.html

PS.

Men jeg har ennå igjen, å midtstille resten av mobil-nettsidene.

Og jeg må også teste, hvordan dette blir, på forskjellige mobiler, osv.

(For å si det sånn).

Så sånn er det.

Bare noe jeg tenkte på.

Mvh.

Erik Ribsskog

PS 2.

Sånn blir det da, på en litt gammel Google Nexus-mobil:


http://mobiletest.me/google_nexus_7_emulator/?u=http://www.johncons.net/mobil.html

PS 3.

Nå har jeg hatt en del smart-telefoner.

Men den dyreste, var en Mio, til 3000-4000 vel, som jeg kjøpte, i 2006.

Men det er jo sånn for tida, at 'alle', liksom skal ha Iphone-mobiler.

(Det er liksom det gjeveste.

Må man vel si).

Men hva heter den nyeste Iphone-en, tro.

Hm.

For det hadde kanskje vært artig, å sett mobil-nettstedet, på en av de nyeste/kuleste mobilene.

Hm.

Så jeg får se om jeg finne en nyere mobil-emulator.

(Vi får se).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 4.

Sånn blir visst nettstedet da, på Iphone X.

(Som var den nyeste Iphonen jeg fant emulator for i farta).

Og det kan virke som, at mobil-nettstedet, er litt for bredt, for de fleste mobiler.

Men siden at jeg har egne mobil-sider, (på nettstedet).

Så kan jeg jo bare gjøre 'hovedvinduet' litt smalere, på de nevnte mobil-sidene, etterhvert.

(Dette kan styres fra CSS-siden.

Så det burde ikke være en så utrolig stor/arbeidskrevende jobb.

For å si det sånn).

Så det kan jeg se mer på etterhvert, (etter at jeg fått satt på midtstillingen ordentlig, på alle mobil-sidene, osv).

(Og det er også en del andre ting, å jobbe med, på det nettstedet.

Som jeg har nevnt i den nest-forrige bloggposten, blant annet).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 5.

Her er mer om dette:




PS 6.

Det står i PS-et ovenfor.

At Iphone X, sin skjerm, har en bredde, på 375 pixler.

Og hovedvinduet, (på johncons-web), er vel på cirka 450 pixler.

Så hvis jeg gjør om det etterhvert, sånn at det blir på cirka 375 pixler, da.

(Det er mulig at det står mer på nettet, om det liksom finnes en standard-bredde, for mobil-nettsider).

Da blir nettstedet kanskje litt smalt, for Ipad-er/nettbrett, osv.

Men da er det eventuelt mulig, å også lage, egne nettbrett-nettsider, etterhvert.

(Hvis jeg får tid til det).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 7.

Det er også sånn, (har jeg lest om, for noen år tilbake).

At man kan bruke noe annet, enn pixler.

(Enten Em.

Eller %).

For å beskrive bredden, på et element, på en nettside.

Og da kan man få nettstedet, til å passe, på alle mobiler, liksom.

Det er mulig, at det er bedre, enn å bruke en standard bredde, (i pixler).

Men da er det også det, at bilder kan forvrenges, (for eksempel), hvis jeg ikke tar helt feil.

Nå pleier jeg å surfe mest, fra PC-er.

Så mobil-webdesign er kanskje ikke min sterke side.

(For å si det sånn).

Men jeg får prøve å finne ut mer om dette etterhvert.

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 8.

Det kan være, at 300 pixler, er en grei bredde, for mobil-nettsider.

(Jeg kan prøve å finne ut, en pixel-bredde, som er sånn, at den blir bra, på brorparten av mobilene.

Folk flest bytter vel ut mobilen sin, annethvert år, eller noe lignende.

Så det er kanskje sånn, at man må finne det 'magiske' tallet.

Nemlig hvor bredt skal jeg ha nettsidene.

Og så blir det jo midtstilt, så det ser greit ut, på alle mobiler som har bredere skjerm, enn 300 pixler.

Kanskje det er 90 prosent av mobilene, (bare for ta et tall, (dette kan jeg søke mer om på nettet seinere)).

Og så på de siste ti prosentene, så må de kanskje scrolle litt, for å lese nettstedet.

(Noe man kan unngå, hvis man bruker prosent, (istedet for pixler), men det er jo litt arbeid, å gjøre om, (for jeg må nok da teste en del, for å finne ut hvordan det funker))).

Jeg får prøve å surfe litt mer fra smart-telefon osv.

(For da får jeg kanskje noen 'aha-opplevelser'.

For å si det sånn).

Så sånn er muligens det.

Bare noe jeg tenkte på.

Men men.

PS 9.

Det er jo også det, at hvis folk snur mobilen.

Så kan jo nettstedet være bredere.

Men liker folk å snu mobilen sånn.

Og hvor mange leser nettsider med snudd mobil.

Det blir nesten et sånn 'research topic', som de kalte det, ved University of Sunderland.

(Hvor jeg studerte studieåret 2004/05.

For å si det sånn).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 10.

320 pixler er muligens et slags magisk tall, (og man kan også gjøre noen 'triks', med viewport-en, for å få nettstedet til å se bra ut, på mindre skjermer):


https://www.systek.no/fagblogg/webutvikling-for-smartklokker

PS 11.

Her kan man se, at sånn som mobil-nettstedet mitt er nå, (med en bredde på 450 pixler), så er det ikke så veldig iPhone-vennlig, så jeg får prøve, å få gjort om mobil-nettstedet, sånn at det blir på enten på 320 pixler eller 375 pixler, innen ikke alt for lenge:


https://www.thesitewizard.com/css/mobile-friendly-responsive-design.shtml

PS 12.

Jeg tok et par kurs, i webdesign, da jeg bodde i Keith Court, (hvor jeg bodde fra 2012 til 2014), i Walton.

Og da het det seg, at man skulle bruke mye 'padding', på sidene, av teksten.

Men på mobil, så er det kanskje vanlig, å bruke mindre padding, (for å si det sånn).

Så jeg kan jo bare redusere paddingen litt.

For å gjøre det mer iPhone-vennlig.

(Som en slags 'quick-fix').

Og så kan jeg jo seinere eventuelt gjøre 'hovedvinduet' enda mer smalt/iPhone-vennlig, (hvis det trengs), ved å endre på koden, (som er objekt-orientert, så det burde gå an å finne ut av), på de forskjellige nettsidene.

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 13.

Det er også det, (som nevnt i artikkelen i PS 10).

At enkelte browsere skalerer nettsidene, sånn at de passer på mobil/smartklokke-skjermen.

Så det er mulig at mobil-nettstedet mitt, ser greit ut, på de fleste mobiler.

(Hva vet jeg).

Selv om det nok er greit, å ha det sånn, at det ser bra ut, uten noe 'hokus-pokus' og.

(For å si det sånn).

Så sånn er nok det.

Bare noe jeg tenkte på.

Men men.

PS 14.

I PS 10-artikkelen.

Så nevnes også, at man kan gjøre nettstedet sitt: 'Mobile first'.

Og det uttrykket er nytt for meg.

(Må jeg innrømme).

Da jeg gikk på HiO IU, (studieåret 2004/05).

Og da jeg tok kurs i webdesign, (rundt 2013).

Så lærte jeg ikke noe om dette.

Og da jeg begynte på en ny design, på johncons-web, i 2015, (mens jeg bodde på Høvik).

Så arbeidet jeg, med det i bakhue, at nettstedet skulle bli bra, både på mobil og PC.

(Uten å ha egne mobil-sider).

Men menyen endte nederst, på mobil-sidene.

Og jeg gjorde vel da etterhvert om, sånn at menyen kom nest øverst, (etter logoen).

(Dette var mens jeg bodde i Trondheim.

Noe jeg gjorde vinteren 2018).

Men da ble PC-sidene veldig trauste/uoversiktlige, (synes jeg).

Og derfor bestemte jeg meg, for å heller ha egne mobil-sider.

(Etter at jeg en dag, fikk en 'aha-opplevelse'.

Om et enkelt/'Unix/Linux-inspirert' mobil-kall, som jeg da kunne bruke).

For jeg har jo jobba som Company Researcher, (på vegne av Packaging Europe, i Norwich), i 2007 og 2008.

Og den jobben, (å samle informasjon om emballasje-industrien), gikk mye på, (ihvertfall for min del), å se på firmaer sine nettsider.

Og derfor, (og fordi at jeg er mest vant til å surfe fra PC), så ble jeg litt flau, over å ha stygge/uoversiktlige PC-nettsider.

(På mitt nettsted).

Men hvis jeg da, (i 2018), hadde tenkt: 'Mobile first'.

Så hadde jeg nok blåst i, at PC-sidene ble litt 'nerdete'/rotete.

Og så kunne jeg liksom, ha stilt inn mobil-sidene, sånn at de ble bra.

(Selv om de da muligens ikke ville blitt midtstilte.

Hm.

Eller det hadde vel kanskje vært mulig å få til det og.

Noe sånt).

Så jeg har egentlig, (med det nevnte mobil-kallet), gått litt bort fra, det jeg først prøvde å få til, (å lage PC-sider, som liksom 'brakk', på mobil/nettbrett, sånn at de ble bra/greie, på alle plattformer).

(For å si det sånn).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 15.

Sånn her ble forresten mobil-nettstedet nå, på min smart-telefon, (en billig Huawei som Elkjøp Slependen prakka på meg i 2015), med Chrome:


PS 16.

Så det ble jo ikke, som i mobil-emulatorene, lenger opp, i bloggposten.

For Chrome skalerer nettstedet, sånn at det bruker cirka halve bredden, av skjermen, (av en eller annen grunn), virker det som.

Og det er jo noe som jeg kan se mer på, (og prøve å finne ut grunnen til).

Man kan kanskje manipulere browserne med å bruke viewport, osv.

Og hvordan dette funker på iPhone, (som vel bruker Safari, som standard nettleser, hvis jeg skulle tippe, (hvis ikke det er noen EU-regler for dette nå)).

Det kan jeg jo bare gjette på.

Så dette må jeg nok også lese mer om, (på nettet osv.).

Jeg har også en annen browser, (muligens Huawei sin), på mobilen.

Så jeg kan jo se hvordan nettstedet blir der.

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 17.

Huawei-mobilen har forresten en oppløsning, (skjerm-bredde), på 480 pixler.

Og mobil-nettstedet har en bredde, på 450 pixler.

Men på skjermbildet ovenfor, (i PS 15), så er jo margen, på mye mer enn 30 pixler, (480-450).

(For å si det sånn).

Det kan man jo se.

Så her skalerer Chrome nettstedet, (av en eller annen grunn).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 18.

Her er mer om dette:


PS 19.

Den kinesiske browseren hadde visst ikke helt dagen, men jeg fant ut, (på Chrome), at jeg må gjøre om footeren, på mobil-nettstedet, for den blir visst ikke helt bra der, (av en eller annen grunn):


PS 20.

Bug-en i PS-et ovenfor.

Det kan være noe i mobil-nettstedet sin CSS-side, som jeg må stille på.

(For bold tekst, har sin egen tag der.

For å si det sånn).

Så sånn er muligens det.

Bare noe jeg tenkte på.

Men men.

PS 21.

Nå fant jeg en gammel footer, fra 2018, og den er ikke så stor, men den er ihvertfall lik, både på PC og mobil, (når det gjelder mobil-sidene), og så kan jeg heller endre på den footeren etterhvert, og få teksten midtstilt, (og sette på den teksten om cookies), osv.:



PS 22.

Sånn ble det da, (når jeg kikker på mobil-nettstedet på PC-skjermen):


https://www.johncons.net/mobil.html

PS 23.

Og på mobilen min, så blir det da sånn:


PS 24.

Så den 'nygamle' footeren er bug-fri, (siden at den ser grei ut både på PC-skjermen min og på mobilen min), må jeg si.

Så da setter jeg den footeren, på alle mobil-sidene.

Og så kan jeg heller utvikle den footeren videre.

(Om X antall timer/dager).

Sånn at den footeren blir breiere og sånn at den også får med informasjonen om at nettstedet bruker cookies.

Og da, (når jeg utvikler den videre), så kan jeg prøve å samtidig holde et øye, på mobilen.

Sånn at ikke det samme skjer igjen, (nemlig at det blir bug når man ser på footeren på mobil, (noe som ikke er det helt store, (må man vel si), siden at webdesignere ofte, (i våre dager), har mantraet: 'Mobile first')).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 25.

Footeren dukket opp først opp, på johncons-web, (på PC-sidene), i 2018.

Det var etter at jeg hadde flytta menyen, til under logoen.

(Noe jeg har blogga om lenger opp i bloggposten.

Det var for at ellers kom menyen helt til slutt, når man leste nettstedet på mobil.

Dette var før jeg begynte med egne mobil-sider og mobil-kall).

Og da trengte jeg noen 'paneler', for å liksom fylle opp tomrommet, etter menyen, (på høyre side av skjermen).

(For å si det sånn).

Så sånn var det.

Bare noe jeg tenkte på.

Men men.

PS 26.

Her er mer om dette:


PS 27.

Jeg hadde også en footer, på nettbutikken min, (Posegodt.net), som jeg drev, fra 2010 til 2014/2015.

Men det var en 'Del-footer', med sosiale media-knapper.

Seinere har jeg tenkt, at de knottene, passer bedre, nederst i 'hovedvinduet'.

For det er det som står i hovedvinduet, som man da liker/deler, (for å si det sånn).

(Og ikke hele nettstedet, med menyer, footer, logo og det hele.

For de 'elementene', er jo like, på alle sidene, på nettstedet.

Mens innholdet i 'hovedvinduet' varierer).

Og Posegodt hadde også, en 'Om-side', hvor jeg forklarte om nettstedet.

Så jeg syntes kanskje, at jeg da ikke trengte, en sånn 'informasjons-footer', (eller 'informasjons/copyright-panel'), som i PS-et overfor.

(For å si det sånn).

Så sånn var det.

Bare noe jeg tenkte på.

Men men.

PS 28.

Nå har jeg satt den 'nygamle' footeren på alle mobilsidene på mirror-nettstedet/johncons.net, (jeg endret teksten litt, for å få med det om cookies):


https://www.johncons.net/sikkerhetskopier_mobil.html

PS 29.

Det jeg da lurer på da, er hvordan mobil-side-footeren ser på ut på Angelfire-nettstedet.

(På mobil.

Det vil si på min smart-telefon).

Hm.

Det er mulig at jeg må bytte til den 'nygamle' footeren på det nettstedet og.

Hm.

Så sånn er muligens det.

Bare noe jeg tenkte på.

Men men.

PS 30.

Det er også mulig, at det er smart, å midtstille mobil-sidene, på Angelfire-nettstedet også.

Jeg trodde at de ble 'rare', (med midstilling), på grunn av Angelfire-reklamene.

Men det kan være, at de så rare ut, (med for mye marger på sidene osv.), på grunn av skaleringen til Chrome, (på min mobil).

(Noe sånt).

Så sånn er muligens det.

Bare noe jeg tenkte på.

Men men.

PS 31.

Footeren på Angelfire-mobilsidene, var like ille, (på min mobil):


http://johncons.angelfire.com/mobil.html

PS 32.

Så det neste prosjektet, når det gjelder webdesignen min.

Det blir å bytte mobil-footeren på Angelfire-nettstedet, (til den 'nygamle' footeren).

(Og muligens også midtstille mobilsidene der.

Som på johncons.net).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 33.

Nå har jeg satt på, den 'nygamle' footeren, på forsiden, på Angelfire-mobil-nettstedet, (noe som forresten var litt kinkig på grunn av Angelfire-reklamene):


http://johncons.angelfire.com/mobil.html

PS 34.

Så da setter jeg den footeren, på alle mobil-nettsidene, på Angelfire-nettstedet.

Og så etter det, så har jeg tenkt til å teste, hvordan det blir, å midtstille mobilsidene der.

Hvis det blir likt som på johncons.net, (når det gjelder marger osv., på Chrome, på mobilen min), så midtstiller jeg nok Angelfire-mobil-nettstedet og.

(For å si det sånn).

Og jeg har også, en nokså lang liste, over andre ting, som burde ha vært fikset, på nettstedet/mirror-nettstedet.

(Som jeg kan ta innimellom framover.

Hadde jeg tenkt).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 35.

Hvis man ser på skjermbildet i PS 33.

Så ser man, at den nest nederste Angelfire-reklamen.

Den står helt til høyre, på skjermen.

Men på PC-nettstedet, så er den reklamen midtstilt.

Så det er mulig, at det er på grunn av min kode, at den ikke er midtstilt, (på Angelfire-mobil-nettstedet).

Det har jeg skrevet opp om, på den nevnte 'webdesign-lappen' min, angående ting som jeg kan se på, (når det gjelder johncons-web/mirror-nettstedet).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.

PS 36.

Den nevnte Angelfire-reklamen, fra PS-et overfor.

Den er forresten midstilt, på min PC-skjerm, når jeg ser på Angelfire-mobil-sidene der.

Så jeg regner med at det er en slags 'Angelfire-bug', at den reklamen, ikke er midtstilt, i PS 33.

(Noe sånt).

Så sånn er nok det.

Bare noe jeg tenkte på.

Men men.

PS 37.

Da har jeg satt på den 'nygamle' footeren, på alle mobil-sidene, på Angelfire-nettstedet, (så det neste blir da eventuelt, å midtstille de nevnte mobil-sidene):


http://johncons.angelfire.com/vitnemaal_mobil.html

PS 38.

Sånn ble en Angelfire-mobil-nettside, ('Arkiv'), som midtstilt, (på min mobil), og det var jo en forbedring, (må man vel si):


http://johncons.angelfire.com/arkiv_mobil.html

PS 39.

Så da satser jeg på, (når det gjelder webdesign), å også gjøre om, resten av mobil-nettsidene, på Angelfire-nettstedet, på samme måte.

(Sånn at de blir midtstilte).

Og etter det, så tenker jeg, at jeg får prøve å gjøre om johncons.net, sånn at det bruker 'https', (og ikke 'http'), sånn at en 'blokkerings-melding', (i Opera), forhåpentligvis går bort.

(For å si det sånn).

Så sånn er det.

Bare noe jeg tenkte på.

Men men.