Mobil emulering i Google Chrome

Bare sagt, vi elsker Google Chrome. Den går jevnt, ser enkelt ut, og har mange nyttige Apps. Fra utviklerens synspunkt er Google Chrome alltid et skritt fremover når det gjelder å støtte den nyeste webstandarden, noe som er flott.

Det kommer også med en rekke verktøy for webutvikling, hvorav noen ennå ikke har blitt implementert i andre nettlesere innebygde utviklerverktøy. Disse inkluderer Viewport Emulering, Geolocation og Device Orientation Override, og Touch Emulation.

Nylig har Google Chrome presset en ny funksjon kalt mobil emulering som gjør at vi i Chrome kan se hvordan et nettsted vil reagere, jobbe og oppføre seg som i en faktisk mobilenhet. Høres kult ut? Vel, la oss se hvordan det fungerer.

Å være responsiv eller ikke

Selv om Responsive Web Design blir vedtatt i disse dager, men det kunne ikke passe behovene til alle typer nettsteder. Enkelte typer kan kreve et dedikert, separat mobilt nettsted på grunn av begrensningene til mobile enheter - enkelte elementer på nettstedet kan forsvinne på mobilen; funksjoner kan oppføre seg annerledes mens de er mobile og på skrivebordet.

Ta Amazon.com som et eksempel. Når du ser det på skrivebordet og endrer størrelsen på visningsportstørrelsen, skjer ingenting. Ta mobiltelefonen din, se den, og den viser den forenklede mobilversjonen av nettstedet. Amazon tar den separate mobilruten, i stedet for å snu sin hjemmeside responsiv.

Hvordan det fungerer

Hvis du vil gjøre det samme, bygge et dedikert mobilnettsted, du kan nå bruke mobilemulering i Chrome for å lette jobben din for feilsøking av nettstedet. Denne funksjonen, på tidspunktet for skrivingen, er bare tilgjengelig i Chrome Canary . Den finner du under en ny emulasjonsfane i DevTools.

Det er verdt å merke seg at plasseringen eller navnet kunne endres i fremtiden når det er presset til "vanlig" Chrome.

Chrome har en rekke forhåndsdefinerte enheter, inkludert Google Nexus, iPad, iPhone, Blackberry og Kindle. Velg en, klikk på Emulate-knappen.

Enhetsspesifikasjonene, for eksempel Viewport Size, User Agent String og Pixel Ratio, samt andre innstillinger reflekterer automatisk dimensjonene til den valgte enheten.

Oppdater Chrome, og du bør nå kunne navigere på nettstedet som om det vises på mobil. Hvis du ser nærmere, merker du at musemarkøren blir en sirkel som indikerer aTouch Event. På din bærbare touchpad kan du bruke to fingre for å rulle og tre fingre for å sveipe, slik som det.

Videre kan du utforske denne funksjonen på enkelte nettsteder som har en dedikert mobilversjon, for eksempel:

• Facebook
• Google
• Mål
• New York Times
• Youtube

Hvordan bygge et etterfølger av kunder fra komplette strangers

Det kan høres umulig, men å bygge et forhold til leserne dine i et enkelt innlegg er det profesjonelle frilansinnholdsforfatteren lever for. Vårt mål, så farget som det kan høres, er å fange oppmerksomheten til en fullstendig fremmed, og konvertere den personen, forvandle dem til en venn, en nysgjerrig svarsøker, en beundrer, en student, en kunde eller en hvilken som helst kombinasjon av disse .Spørsmå

(Tekniske og design tips)

36 Høykvalitetsmaler og opplæringsprogrammer for å designe bedriftsnettsted

Det er et solidt faktum at virkelige bedrifter har forsøkt veldig vanskelig å infisere deres merkevare på nettet, på grunn av populariteten til internett. Apple vet om det, Coca-Cola vet om det, selv lokalmester i nærheten av huset mitt vet det.For et gigantisk selskap som Nike, kan de sannsynligvis investere en liten del av fondet for å ansette toppnote webdesigner for å bygge et episk nettsted, men for små bedrifter uten penger og designerfaring, vil det være en viktig utfordring for dem å få deres Nettstedet eksisterte online med fin design og funksjonalitet.Dette innl

(Tekniske og design tips)