Paano Tingnan ang Mobile na Bersyon ng isang Website sa isang PC

Kung isa kang web developer o nagmamay-ari ng online na negosyo, maaaring gusto mong malaman kung ano ang hitsura ng isang mobile site sa isang desktop. Ang hitsura at paggana ng iyong mobile site ay maaaring maging mahalaga dahil higit sa kalahati ng trapiko sa Internet ay nagmumula sa mga telepono. Ang mga customer ay mas malamang na manatili sa isang site nang mas matagal o bumili ng isang bagay kung ito ay kaakit-akit sa paningin. Ang isang desktop view ay maaari ring makatulong sa iyo na gumawa ng mga pag-edit at ayusin ang mga posibleng isyu nang mas maaga.

Sa kabutihang palad, ito ay isang medyo tapat na proseso. Sa artikulong ito, ipapakita namin sa iyo kung paano tingnan ang isang mobile na bersyon ng isang website sa iba't ibang mga device at browser.

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Chrome sa isang Mac

Sa Chrome, maaari mong subukan ang front end at makita kung gumagana nang maayos ang lahat ng bahagi ng website sa pamamagitan ng paggamit ng built-in na tool ng developer na tinatawag na DevTools. Dahil nagbibigay ito ng mga paunang natukoy na pagpipilian sa device, ang DevTools ay ang pinakamahusay na paraan para mabilis na mailipat ng developer ang view mula sa desktop patungo sa mobile at vice versa nang walang anumang mga extension ng developer.

Maaari mo ring baguhin ang laki ng screen upang umangkop sa iyong mga pangangailangan at ayusin ang lapad at taas ng screen upang makita kung ano ang magiging hitsura ng iyong website sa iba't ibang laki ng screen. Upang gawin ito sa isang Mac, sundin ang mga hakbang na ito:

1. Ilunsad ang Google Chrome browser at pumunta sa site na gusto mong tingnan.
   
2. Pindutin ang F12 sa iyong keyboard para ma-access ang DevTools.
   
3. Kapag naka-on ang mode, i-click ang icon ng Toggle Device Emulation.
   
4. Maaari kang pumili mula sa isang listahan ng mga iOS at Android device upang tularan ang mga ito.
   
5. Ipapakita nito ang website sa mobile form na iyong pinili.
   

Kapag tapos ka na, isara lang ang window ng developer tools para isara ang mobile na bersyon ng website.

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Chrome sa isang Windows PC

Kung gusto mong tingnan ang isang mobile na bersyon ng isang website sa windows PC sa Chrome, ito ay medyo katulad na proseso:

1. Buksan ang Chrome browser.
   
2. Sa Chrome, pumunta sa website na gusto mong makita sa mobile na bersyon.
3. I-right-click ang webpage at piliin ang Inspect mula sa menu.
   
4. Upang pumunta sa Mga Tool ng Developer, mag-click sa tab na Higit pang Mga Tool at piliin ang Mga Tool ng Developer o pindutin ang F12 upang buksan ang DevTools.
   
5. Magbubukas ang window ng Developer Tools.
6. I-click ang Icon ng Toggle ng Device upang lumipat sa Mobile Site View Mode.
   
7. Piliin ang mobile device na gusto mong tularan (opsyonal).
   
8. Maaari mo na ngayong baguhin ang mga sukat ng screen upang umangkop sa iyong mga pangangailangan.

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Chrome sa isang Chromebook

Ang pag-access sa mobile na bersyon ng isang website sa Chrome gamit ang isang Chromebook ay halos kapareho sa unang dalawang paraan.

1. Buksan ang web browser ng Google Chrome.
   
2. Buksan ang webpage na gusto mong i-access sa iyong mobile device.
   
3. Upang ma-access ang menu, i-click ang patayong tatlong tuldok na icon.
   
4. I-drag ang iyong mouse sa item na Higit pang Mga Tool sa listahan.
   
5. Piliin ang Mga Tool ng Developer.
   
6. Magbubukas ang window ng Developer Tools sa browser.
   
7. I-toggle ang mobile site view mode sa pamamagitan ng pag-click sa icon ng toggle ng Device.
   

Ilalabas nito ang user interface para sa mobile site. Maaari mo ring piliin ang gustong karanasan sa device sa pamamagitan ng pagpili sa gumawa at modelo mula sa dropdown box. Magre-refresh ang webpage bilang desktop site sa tuwing isasara mo ang developer tools console.

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Firefox sa isang Mac

Maaari kang gumamit ng iba pang mga web browser tulad ng Firefox upang tingnan ang isang mobile site sa isang Mac desktop. Ang pagbabago ng laki ng window ng browser ay isa sa mga paraan na ginagamit ng karamihan sa mga web developer upang suriin ang tumutugon na disenyo ng website. Gayunpaman, kadalasan, ang alternatibong ito ay hindi katanggap-tanggap.

Doon magagamit ang mga kakayahan sa web development ng Firefox browser. Maaari mong i-browse ang iyong mga web page sa maraming resolusyon kung alam mo kung paano i-access ang mga mobile na bersyon ng mga website sa Firefox. Sundin ang mga hakbang:

1. Buksan ang mobile na bersyon ng website na gusto mong makita.
2. Mag-right-click sa webpage at piliin ang Inspect na opsyon mula sa menu.
   
3. Piliin ang Responsive Design Mode.
   
4. Piliin ang laki ng screen ng website.
   

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Firefox sa isang Windows PC

Ang mga Windows PC ay mayroon ding opsyon na tingnan ang mga mobile na bersyon ng mga website gamit ang Firefox. Narito kung paano gawin ito:

1. Simulan ang Firefox sa iyong PC.
   
2. Pumunta sa website na gusto mong makita bilang isang mobile na bersyon.
   
3. Pumunta sa Mga Setting sa pamamagitan ng pag-click sa pahalang na tatlong-bar na icon.
   
4. Makakakita ka ng drop-down na menu kung saan kailangan mong pumili ng opsyon sa Web Developer.
   
5. Piliin ang Responsive Design Mode.
   
6. Sa wakas, maaari kang pumili ng modelo ng smartphone upang makita kung paano lalabas ang iyong site sa device na iyon.
   

Paano Tingnan ang Mobile na Bersyon ng isang Website sa Safari sa isang Mac

Sinasaklaw namin kung paano tingnan ang isang mobile website sa isang desktop gamit ang Chrome at Firefox. Ngunit ano ang tungkol sa default na browser na kasama ng mga Mac device, Safari? Sa kabutihang palad, posible ring tingnan ang isang mobile na bersyon ng isang website sa Safari.

1. Ilunsad ang Safari browser.
   
2. Pumunta sa website na gusto mong tingnan bilang isang mobile na bersyon.
   
3. Mag-click sa Options at pagkatapos ay sa Develop menu.
   
4. Mula sa Drop-Down na menu, piliin ang Enter Responsive Design Mode.
   
5. Maaari mo na ngayong tingnan ang mobile na bersyon ng website.
   

Karagdagang FAQ

Maaari Ko bang Tingnan ang Desktop na Bersyon ng isang Website sa Aking Telepono?

Ang sagot ay oo! Maaari kang lumipat mula sa mobile na bersyon patungo sa desktop na bersyon upang tingnan ito nang hindi gumagamit ng computer. Ang mga hakbang upang ilipat ang mobile na bersyon sa desktop na bersyon sa Chrome ay ang mga sumusunod:

1. Pumunta sa website na gusto mong makita sa desktop view.

2. I-tap ang tatlong-tuldok na icon upang ma-access ang menu.

3. Piliin ang opsyon sa Desktop View ngayon.

Tandaan na maaaring mag-iba-iba ang mga hakbang na ito depende sa teleponong ginagamit mo.

kung tatanggalin ko ang aking snapchat tatanggalin ba nito ang mga ipinadala na snap

Ginagawang Mas Madali ang Pagdidisenyo ng Mobile Web

Ang mga tool ng developer ay mahusay upang suriin at baguhin ang isang mobile na bersyon ng isang website sa isang desktop nang hindi lumilipat ng mga device. Maaari mong baguhin ang laki ng screen para makita kung paano gumagana ang mga bahagi sa iba't ibang device. Maaari mong ayusin ang iba't ibang bahagi at gawin ang website para sa maraming laki ng screen gamit ang responsive mode.

Kapag nagdidisenyo ng website, dapat palaging isaisip ng taga-disenyo kung paano lumalabas ang front end ng site sa mga telepono, tablet, at desktop. Ang paggamit ng mga pamamaraang inilarawan sa artikulo ay makakatulong din sa developer na gawin ito at para matukoy din kung aling mga bahagi ng isang website ang lumilikha ng mga isyu upang ayusin ang mga ito.

Nasubukan mo na bang tingnan ang isang mobile na bersyon ng isang site sa iyong desktop? Aling browser ang mas gusto mong gamitin para gawin ito? Ipaalam sa amin sa seksyon ng mga komento sa ibaba.