Anonim

Hover er blevet brugt på websteder i årevis som en måde at give et uddrag af information til besøgende uden at udløse en handling. Når smartphones og tablets gradvist overtager internettet, er vi nødt til at give dem øget opmærksomhed, når vi designer et websted. Da berøringsskærme ikke kan håndtere svæver, er vi nødt til at se på alternativer til svæveeffekter. Hvis du opretter dit eget websted eller ikke har ressourcerne til at ansætte en professionel webdesigner, er denne tutorial til dig.

Du kan administrere svæveeffekter med berøringsskærme, men det kan være lidt akavet. Du kan være bedre til at designe dem helt og bruge noget andet helt. Hvis du vil bruge dem på dit skrivebordsside, har du generelt tre alternativer til at svæveeffekter på mobile websteder:

  1. Fjern dem helt, og udskift dem med den primære handling.
  2. Tilføj en sekundær menu, hvor du enten kan trykke én gang for svæveeffekten og endnu en gang for den primære handling.
  3. Placer sveveoplysningerne på sin egen side.

Alle fungerer godt på berøringsskærme og desktops, men kræver nogle designjusteringer til at implementere inden for et eksisterende design. Du kan også omgå det med JavaScript eller smart jQuery-kode, hvis du har færdighederne, men hvis du selv prøver at finde ud af det hele, kan du være bedre til at bruge designalternativer end kode. Hvis du vil udforske kodealternativer til svæveeffekter, kan du besøge denne side.

Fjern sveveeffekter fra dit design

Medmindre du kan ansætte en freelance webdesigner til at hjælpe dig, kan du have det bedre med at fjerne svæveeffekter helt. Selvfølgelig er de pæne og kan tilbyde nyttige supplerende oplysninger, men der er altid andre måder at opnå den samme effekt på.

Du kan beholde menuhandlingen som den primære handling og inkludere de supplerende oplysninger andetsteds på siden. Du kan bruge breakout-bokse, popups, øge deskriptorindholdet til det punkt, du prøver at lave eller noget andet. Hvis du ikke har evnerne til at implementere jQuery, er dette sandsynligvis den enkleste mulighed.

Tilføj en sekundær menu

En sekundær menu inkluderer det første tryk, der ville simulere en svæveeffekt. Du kan inkludere oplysningerne i menuen og vise en anden menu i det samme element. Den anden menu fungerer som det faktiske valg, som det ville ske på et skrivebord. Det første tryk simulerer musemarkøren, og det andet tryk simulerer brugeren, der udfører den primære handling.

Dette er et pænt alternativ til svæveeffekter, men er begrænset af skærmstørrelse og begrænser mængden af ​​information, du kan tilføje til din effekt. Hover-effekter er begrænset af deres art, men er mere begrænset på mobil af skærmens fast ejendom, du har at gøre med. Hvis du virkelig ønsker at inkludere supplerende data på en ikke-standard måde, kan dette være det.

Placer sveveoplysningerne på sin egen side

En lettere mulighed ville måske være at inkludere svæveoplysningerne på sin egen side med et tekstlink. Dette forenkler din menu og holder navigationen ligetil. Hyperlinking fungerer på tværs af enheder, og du får en ekstra side til webstørrelse og SEO. Ulempen er, at du bliver nødt til at øge det supplerende indhold med mindst 300 ord for at få det til at fungere.

Så længe du kan lægge informationen omhyggeligt nok, så den læser godt og tilføjer læser værdi, synes jeg personligt, at dette er det bedste alternativ. Beslutning om, hvor disse links til de supplerende data skal placeres, er op til dig og afhænger af dit design, men ekstra sider giver dig en ekstra mulighed for at tilføje opkald til handling, tilføje dit telefonnummer, e-mail-adresse og eventuelle ekstra oplysninger, der kan bruges at foretage et salg.

Forbliver med svæver

Hvis du vil bruge en form for svæveeffekt på dit hovedwebsted, bliver du nødt til at indarbejde den på dit mobilwebsted eller mindst i mobilversionen. Der er skiftende menyalternativer eller JavaScript-løsninger, men de kræver en ekspert til at implementere. Denne side drøfter dine alternativer, hvis du ønsker at udforske dem nærmere.

En af de nemmeste fælder, der falder i, når du starter på egen hånd eller bygger din første webside, er at designe for dig selv og ikke dit publikum. Du er bestemt nødt til at designe noget, du kan lide, men når man overvejer brugervenlighed skal man prioritere publikum. Du skal også tage højde for de enheder, de vil bruge, og den måde, de mest sandsynligt vil engagere sig bedst på dit websted.

Hvis dit publikum er ung, bruger de mobil. Hvis de bruger mobil, er hovereffekter og andre designindstillinger som det ikke din bedste mulighed.

3 Alternativer til svæveeffekter på mobile enheder