|
หัวข้อ: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: MiithRanDir ที่ 18 กรกฎาคม 2014, 16:08:44 ใครที่ทำเว็บที่รองรับ Responsive อยู่คงจะเคยหาเครื่องมือต่างๆมาลองทดสอบเว็บตัวเอง
แต่วันนี้ผมมีวิธีทดสอบง่ายๆ รวดเร็วไม่ต้องใช้เครื่องมือใดๆ แต่อาจจะไม่ละเอียดลึกพอ แต่ก็ดูได้พอทน เอ๊ะยังไง งงๆ ง่ายๆ เลยแค่กดปุ่ม ย่อ ขนาดบราวเซอร์แล้วก็ลากขนาดบราวเซอร์ดู แค่นี้ก็จะเห็นผลได้ระดับนึงแล้วครับ ใครที่รู้แล้วก็ผ่านไปได้เลยครับ มาบอกไว้เผื่อคนไหนยังไม่รู้ครับ ยกตัวอย่างเว็บตัวเองเลยละกัน (https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-xaf1/t1.0-9/10527762_545536428902840_9103610303513058462_n.jpg) (https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-xfa1/t1.0-9/10559842_545536438902839_973311774623602546_n.jpg) (https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-xpf1/t1.0-9/10544375_545536442236172_5608970346134115867_n.jpg) (https://scontent-b-sin.xx.fbcdn.net/hphotos-xpf1/t1.0-9/10559912_545536478902835_5189462480815266920_n.jpg) (https://scontent-b-sin.xx.fbcdn.net/hphotos-xpa1/t1.0-9/10354066_545536505569499_7909421170587734837_n.jpg) จะเห็นได้ว่าจะตอบสนอง responsive ดี จะไม่มี scrollbar ด้านล่างครับ หวังว่าคงมีประโยชน์บ้างไม่มากก็น้อยครับ :wanwan016: :wanwan016: หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: teemuk ที่ 18 กรกฎาคม 2014, 16:11:05 สิ้นค่าน่าสนใจครับ เดี่ยวเข้าไปดู
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: adidog ที่ 18 กรกฎาคม 2014, 16:12:57 ผมใช้ firefox กด ctrl+shift+m เทสได้ทันทีครับ
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: sys2528 ที่ 18 กรกฎาคม 2014, 16:13:44 ปกติผมก็ใช้เหมือนท่านครับ ตอนนี้ก็ยังใช้อยู่ครับ แต่ผมจะลองตัวนี้อีกตัวครับ
โค๊ด: http://responsivetest.net/#u=http://www.ipostproperty.com/shop หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: sys2528 ที่ 18 กรกฎาคม 2014, 16:16:28 ผมใช้ firefox กด ctrl+shift+m เทสได้ทันทีครับ ได้มาอีกอย่าง ขอบคุณมากครับ เพิ่งรู้ว่ามีนะครับเนี้ย :wanwan017: หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: kakato ที่ 18 กรกฎาคม 2014, 16:18:14 ต้องลอง :wanwan017:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: kondam ที่ 18 กรกฎาคม 2014, 16:30:43 ขอบคุณครับ :wanwan011:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: Moyzier ที่ 18 กรกฎาคม 2014, 16:32:37 เช็คแล้ว โอเคเลยครับ :wanwan020: :wanwan020:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: jaturong ที่ 18 กรกฎาคม 2014, 16:56:35 ผมก็ใช้วิธี้ครับ แต่จะลองกะทุกๆ browser และก็เอามาลองบนทั้ง Smart phone / tablet เพื่อความแน่ใจครับ :wanwan017:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: zero1150kfc ที่ 18 กรกฎาคม 2014, 16:58:04 ผมใช้ firefox กด ctrl+shift+m เทสได้ทันทีครับ โอ้ ความรู้ใหม่ :wanwan017: ส่วนตัวใช้เหมือนเจ้าของกระทู้ครับ :-[ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: Mesut Ozil ที่ 18 กรกฎาคม 2014, 17:13:50 สุดยอด เพิ่งรู้เหมือนกันครับ :wanwan017:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: verysims ที่ 18 กรกฎาคม 2014, 17:15:14 ผมใช้ firefox กด ctrl+shift+m เทสได้ทันทีครับ โอ้ ความรู้ใหม่ :wanwan017: ส่วนตัวใช้เหมือนเจ้าของกระทู้ครับ :-[ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: max30012540 ที่ 18 กรกฎาคม 2014, 18:54:52 ขออนุญาตเจ้าของกระทู้นะครับ
ส่วนตัวใช้ Google Chrome กด F12 เลือกแท๊บ Emulation เมนูด้านซ้ายเลือก Device แล้วเลือกอุปกรณ์ที่ต้องการ กดปุ่ม Emulate หากต้องการยกเลิกกด Reset ครับ (http://a.lnwpic.com/jinsfb.png) หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: toekingsize ที่ 18 กรกฎาคม 2014, 19:06:51 ขออนุญาตเจ้าของกระทู้นะครับ ส่วนตัวใช้ Google Chrome กด F12 เลือกแท๊บ Emulation เมนูด้านซ้ายเลือก Device แล้วเลือกอุปกรณ์ที่ต้องการ กดปุ่ม Emulate หากต้องการยกเลิกกด Reset ครับ ([url]http://a.lnwpic.com/jinsfb.png[/url]) วิธีนี้แสดงผลไม่ถูกต้องครับ แค่ได้สัดส่วนหน้าจอเฉยๆ แต่ไม่แสดงผล Responsive ที่แท้จริง ผมใช้โครมแล้ว กดปุ่ม CTRL ค้างไว้แล้วเลื่อน Scroll ไปที่ขนาด 300% (สำหรับไอโฟน5) ถึงจะแสดงผลได้ถูกต้องครับ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: max30012540 ที่ 18 กรกฎาคม 2014, 19:42:57 ขออนุญาตเจ้าของกระทู้นะครับ ส่วนตัวใช้ Google Chrome กด F12 เลือกแท๊บ Emulation เมนูด้านซ้ายเลือก Device แล้วเลือกอุปกรณ์ที่ต้องการ กดปุ่ม Emulate หากต้องการยกเลิกกด Reset ครับ ([url]http://a.lnwpic.com/jinsfb.png[/url]) วิธีนี้แสดงผลไม่ถูกต้องครับ แค่ได้สัดส่วนหน้าจอเฉยๆ แต่ไม่แสดงผล Responsive ที่แท้จริง ผมใช้โครมแล้ว กดปุ่ม CTRL ค้างไว้แล้วเลื่อน Scroll ไปที่ขนาด 300% (สำหรับไอโฟน5) ถึงจะแสดงผลได้ถูกต้องครับ วิธีไหนก็ได้สัดส่วนไม่เท่าของจริงอยู่แล้วครับ เพราะความละเอียดจอที่ตั้งกับสัดส่วนจอจริงไม่เท่ากันครับ แล้วการประมวลผลของ CPU ไปจนถึง webkit ที่ Google กับ Apple นำไปใช้ก็แตกต่างกัน ดังนั้นทุกวิธีดูภาพรวมเฉยๆครับ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: antimage3114 ที่ 18 กรกฎาคม 2014, 19:53:38 ผมใช้ firefox กด ctrl+shift+m เทสได้ทันทีครับ ความรู้ใหม่ขอบคุณครับหัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: naraj ที่ 18 กรกฎาคม 2014, 20:20:44 ผมล่อจากเว็บบริการอย่างเดียวเลย
โค๊ด: http://mobiletest.me/ :-X หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: gutter ที่ 18 กรกฎาคม 2014, 20:46:44 ใช้อะไรทดสอบ ก็ไม่เหมือนใช้สมาร์ทโฟนของเราดูเอง
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: romance69 ที่ 18 กรกฎาคม 2014, 21:22:38 โอ้ววว พึ่งรู้เหมือนกันแฮะ ขอบคุณครับ :wanwan011:
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: Synchronize ที่ 18 กรกฎาคม 2014, 21:28:51 ของ firefox มีที่ล้ำกว่านี้อีกครับ
กดปุ่ม ctrl + shift + M มันจะเข้าตัวปรับขนาดหน้าต่างได้เลย (http://upload.armuay.com/img/2014-07-17/11-40-19_0.701016.png) (http://upload.armuay.com/2014-07-17_11-40-19_0.701016.png) หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: doctorcar ที่ 18 กรกฎาคม 2014, 21:52:00 เยี่ยมไปเลยทั้งจกขกทและคนตอบ
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: saratlim ที่ 18 กรกฎาคม 2014, 23:11:11 ขอบคุณครับ
หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: toekingsize ที่ 18 กรกฎาคม 2014, 23:24:50 ผมล่อจากเว็บบริการอย่างเดียวเลย โค๊ด: [url]http://mobiletest.me/[/url] :-X อันนี้แนะนำเลยครับ เข้าไปลองมาแล้ว แสดงผลถูกต้องเป๊ะเหมือนใช้โทรศัพท์จริง ผมลองเข้าเว้บผมดูแระ แสดงผลสวยงามครับ http://sisaket-news.com/ ขอบคุณท่านนี้มากๆที่ชี้ทางสว่าง หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: akkradet ที่ 19 กรกฎาคม 2014, 01:00:13 ผมใช้ตัวนี้ครับ ดูได้เกือบครบเลย
โค๊ด: http://www.responsinator.com/ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: goodwide ที่ 19 กรกฎาคม 2014, 01:17:29 :wanwan017:
ความรู้ใหม่ ขอบคุณครับ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: max30012540 ที่ 19 กรกฎาคม 2014, 08:22:25 ผมล่อจากเว็บบริการอย่างเดียวเลย โค๊ด: [url]http://mobiletest.me/[/url] :-X อันนี้แนะนำเลยครับ เข้าไปลองมาแล้ว แสดงผลถูกต้องเป๊ะเหมือนใช้โทรศัพท์จริง ผมลองเข้าเว้บผมดูแระ แสดงผลสวยงามครับ [url]http://sisaket-news.com/[/url] ขอบคุณท่านนี้มากๆที่ชี้ทางสว่าง เว็บนี้แค่ใช้ไอเฟรม . . . :-X (http://a.lnwpic.com/ufk0b1.png) บางเว็บใช้วิธีตรวจจับ User agent เพื่อแสดงส่วนประกอบออกมา แชทด้านล่าง(ในหน้าเว็บผมที่ทดสอบ)หากมีการเปลี่ยน User agent ให้เป็นของ Device จริงๆ รูปแบบจะเปลี่ยนไป (จะแสดงผลเหมือนใน Google Chrome ที่เลือกให้เปลี่ยน User agent ด้วย) หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: Twenty-One ที่ 19 กรกฎาคม 2014, 09:06:04 ผมใช้ตัวนี้ครับ ดูได้เกือบครบเลย โค๊ด: [url]http://www.responsinator.com/[/url] ผมก็ใช้ตัวนี้อยู่ครับ แจ่มมากๆ หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: kanin03 ที่ 21 กรกฎาคม 2014, 21:22:41 ผมใช้ตัวนี้ครับ ดูได้เกือบครบเลย โค๊ด: [url]http://www.responsinator.com/[/url] ผมก็ใช้ตัวนี้อยู่ครับ แจ่มมากๆ อันนี้ก็ดีครับ ตามหลักแล้วก็ใช้เพิ่อดูคร่าวๆ น่ะครับถ้าเราเขียน css ดักตรงตามขนาดหน้าจอมันก็ไม่มีทางเพื้ยนไปกว่าหลอกครับ ไม่งั้นเค้าไม่ทำเว็บพวกนี้หรือทูลสำเร็จรูปหรือย่อขยายหน้าจอได้ ที่มันแสดงผลผิดคือ บางที browser บางตัวมันไม่รองรับ technology บางอย่าง ดูได้ว่า browser ตัวไหนรองรับอะไรบ้าง โค๊ด: http://css3test.com/ แต่มาเปิดกับโทรศัพท์จริง ซึ่งใช้ Chrome ซึ่งไม่รองรับ Grid Layout ก็ทำให้เพี้ยนนั่นเอง :wanwan017: หัวข้อ: Re: เช็ค Responsive เว็บตัวเองง่ายๆ ไม่ต้องใช้เครื่องมือ เริ่มหัวข้อโดย: Jir4yu ที่ 21 กรกฎาคม 2014, 22:21:01 สำหรับผมไม่ได้ใช้ plugin หรือ extension เสริมเลยครับ เพราะเป็น feature ใหม่ที่อยู่ใน Chromium
กดเรียก developer tools ขึ้นมาเหมือน Chrome แต่มีปุ่ม responsive devices ให้เลือก จำลองได้ว่าใช้กับอุปกรณ์อะไร เช่น iphone4, 5, ipad 2-3-4 หรือ android ตัวอิ่นๆ อีกทั้งยังปรับจำลองความเร็วในการโหลดหน้าเว็บได้ด้วยว่าจะเป็น edge 3g หรือ wifi ความเร็วสูง (http://upic.me/i/l2/10428276_679683598734333_2312738825971140446_o.png) (http://upic.me/show/51985551) ผมว่าจริงๆ แล้ว chromium เป็น browser ที่เจ๋ง แล้วก็อัพเดทบ่อยดีด้วยนะครับ นักพัฒนาคนไหนสนใจก็ลองโหลดมาใช้ดูได้ครับ |