Hoveria on käytetty verkkosivustoilla jo vuosia tapa tarjota katkelma tietoa vierailijoille käynnistämättä toimintoa. Älypuhelimien ja tablet-laitteiden haltuessaan asteittain ottaa haltuunsa Internet, meidän on kiinnitettävä heihin enemmän huomiota verkkosivuston suunnittelussa. Koska kosketusnäytöt eivät pysty käsittelemään hoveria, meidän on tutkittava vaihtoehtoja hover-efekteille. Jos olet määrittämässä omaa verkkosivustoasi tai sinulla ei ole resursseja palkata ammattimaista verkkosuunnittelijaa, tämä opas on sinulle.
Voit hallita leijuvaikutuksia kosketusnäytöillä, mutta se voi olla hieman hankala. Voit ehkä suunnitella ne kokonaan ja käyttää jotain muuta kokonaan. Jos olet asettanut käyttämään niitä työpöydällä, sinulla on yleensä kolme vaihtoehtoa siirtää vaikutelmat mobiilisivustoille:
- Poista ne kokonaan ja korvaa ne ensisijaisella toiminnolla.
- Lisää toissijainen valikko, jossa voit joko napauttaa kerran hover-efektiä varten ja vielä kerran ensisijaista toimintaa varten.
- Sijoita leijautustiedot omalle sivulle.
Kaikki toimivat hyvin kosketusnäytöissä ja pöytätietokoneissa, mutta vaativat joitain suunnittelutoimenpiteitä olemassa olevan suunnittelun toteuttamiseksi. Voit kiertää sen myös JavaScriptillä tai älykkäällä jQuery-koodilla, jos sinulla on taitoja, mutta jos yrität selvittää kaiken itse, saatat olla parempi käyttää suunnittelun vaihtoehtoja kuin koodia. Käy tällä sivulla, jos haluat tutkia vaihtoehtoja hover-tehosteille.
Poista leijuvaikutukset suunnittelustasi
Ellet voi palkata ulkopuolista verkkosuunnittelijaa auttamaan sinua, saatat olla parempi poistaa leijuvaikutukset kokonaan. Varmista, että ne näyttävät siistiltä ja voivat tarjota hyödyllistä lisätietoa, mutta on aina muita tapoja saavuttaa sama vaikutus.
Voit pitää valikkotoiminnon ensisijaisena toimenpiteenä ja sisällyttää lisätietoja muualle sivulle. Voit käyttää breakout-ruutuja, ponnahdusikkunoita, lisätä kuvaajan sisältöä pisteelle, jota yrität tehdä, tai jotain muuta. Jos sinulla ei ole taitoja toteuttaa jQueryä, tämä on todennäköisesti yksinkertaisin vaihtoehto.
Lisää toissijainen valikko
Toissijainen valikko sisältää ensimmäisen napautuksen, joka simuloi leijuvaikutusta. Voit sisällyttää tiedot valikkoon ja näyttää toisen valikon samassa elementissä. Tämä toinen valikko toimii todellisena valintana, kuten tapahtuu työpöydällä. Ensimmäinen painallus simuloi hiiren leijautumista ja toinen painallus käyttäjää, joka suorittaa ensisijaisen toiminnan.
Tämä on siisti vaihtoehto hover-tehosteille, mutta sitä rajoittaa näytön koko ja se rajoittaa efektiin lisättävien tietojen määrää. Hover-tehosteet ovat luonteeltaan rajoitettuja, mutta matkapuhelimellasi niitä rajoittaa tekemäsi näytönkiinteistö. Jos haluat todella sisällyttää lisätietoja epästandardilla tavalla, se voisi olla se.
Sijoita leijautustiedot omalle sivulle
Ehkä helpompi vaihtoehto olisi sisällyttää hover-tiedot omalle sivulleen tekstilinkillä. Tämä yksinkertaistaa valikkoasi ja pitää navigoinnin suorana. Hyperlinkitys toimii kaikissa laitteissa ja saat ylimääräisen sivun sivuston kokoa ja SEO: ta varten. Haittapuoli on, että joudut lisäämään lisäsisältöä vähintään 300 sanalla, jotta se toimisi.
Niin kauan kuin pystyt täyttämään tiedot tarpeeksi huolellisesti, jotta ne lukevat hyvin ja lisäävät lisäarvoa lukijalle, mielestäni tämä on paras vaihtoehto. Päätös, mihin nämä linkit lisätietoihin sijoitetaan, on sinun itsesi tehtävä ja riippuu suunnittelusta, mutta lisäsivut antaa sinulle ylimääräisen mahdollisuuden lisätä toimintakehotuksia, lisätä puhelinnumerosi, sähköpostiosoitteesi ja mahdolliset lisätiedot, joita voidaan käyttää myydä.
Oleskelu hover
Jos haluat käyttää jonkinlaista hover-efektiä pääsivustollasi, sinun on työskenneltävä sitä mobiilisivustollesi tai ainakin mobiiliversioon. On olemassa vaihtovaihtoehtovaihtoehtoja tai JavaScript-ratkaisuja, mutta niiden käyttöönotto vaatii asiantuntijan. Tällä sivulla käsitellään vaihtoehtojasi, jos haluat tutkia niitä tarkemmin.
Yksi helpoimmista ansoista, johon joudut aloittaessasi omalla tai rakentamalla ensimmäistä verkkosivustoasi, on suunnittelu itsellesi, ei yleisöllesi. Sinun on ehdottomasti suunniteltava jotain haluamaasi, mutta käytettävyyttä harkittaessa on priorisoitava yleisö. Sinun on myös otettava huomioon laitteet, joita he käyttävät, ja tapa, jolla ne todennäköisimmin tekevät parhaan yhteyden verkkosivustoosi.
Jos yleisösi on nuori, he käyttävät mobiililaitetta. Jos he käyttävät mobiililaitteita, hover-tehosteet ja muut samankaltaiset suunnitteluvaihtoehdot eivät ole paras vaihtoehto.
