คำถามติดแท็ก website-design

คำถามเกี่ยวกับการออกแบบรูปลักษณ์ที่สวยงามของเว็บไซต์ทั้งในทางปฏิบัติและเชิงทฤษฎี สำหรับคำถามเกี่ยวกับการเขียนโค้ดโครงสร้างของเว็บไซต์โปรดไปที่ Stack Overflow สำหรับคำถามเกี่ยวกับประสบการณ์การใช้งานโปรดไปที่ UX.SE ถามทุกสิ่งที่เกี่ยวข้องกับการออกแบบกราฟิกและเลย์เอาต์ที่มองเห็นได้ที่นี่บน GD.SE

4
ฉันควรใช้สีโลโก้ของ บริษัท เป็นสีของเว็บไซต์หรือไม่
ฉันกำลังสร้างเว็บไซต์สำหรับ บริษัท ที่ฉันอยู่ แต่ฝ่ายการตลาดไม่ได้ให้สีกับฉันมาก พวกเขาบอกว่าเราจำเป็นต้องใช้#2DCCD3ทุกที่เพราะมันอยู่ในโลโก้ แต่ฉันพบว่าความอิ่มตัวและ จำกัด เว็บไซต์ดูเหมือนกับคนอื่น ๆ ที่ใช้สีน้ำเงิน และ บริษัท ไม่ได้มีการนำกลยุทธ์แบรนด์มาใช้มันมีอยู่ทั่วสถานที่และความคิดของฉันคือการสร้างมันขึ้นมาหลังจากกำหนดเว็บไซต์ คำถามของฉันคือพวกเขาถูกต้องหรือไม่ ฉันควรใช้สีนั้นเพื่อจดจำแบรนด์หรือไม่กับเว็บไซต์ที่น่าจดจำ? จานสีที่ฉันแนะนำสำหรับเว็บไซต์คือ: ไล่ระดับสี: #ff2645เป็น#d05822 โฮเวอร์ใน: #ff2645 ข้อความและองค์ประกอบที่เป็นของแข็งใน: #fff ไอคอนที่อยู่ใน: #0F8186 PS ไม่ใช่ทุกหน้าจะมีการไล่ระดับสี

7
เรียนรู้ Photoshop เพียงเพื่อการออกแบบเว็บ
ฉันต้องการเป็นนักออกแบบเว็บไซต์ดังนั้นฉันจึงดูวิดีโอแนะนำ Photoshop จำนวนมาก แต่บทเรียนเหล่านี้บางส่วนไม่มีประโยชน์สำหรับการออกแบบเว็บ ตัวอย่างเช่นภาพยนตร์บางเรื่องเกี่ยวกับผิวหนังหรือฟันหรือวาดดอกไม้หรือเปลี่ยนรูปแบบของกำแพงหรือสิ่งต่าง ๆ เช่นนี้ เพราะฉันไม่มีทรัพยากรที่เฉพาะเจาะจงสำหรับการออกแบบเว็บและแบบฝึกหัดเหล่านี้เป็นเวลาที่เสียไปสำหรับฉัน! คุณรู้แหล่งที่มาของบทช่วยสอนใดบ้างเพื่อช่วยฉันเรียนรู้การออกแบบเว็บใน Photoshop? ฉันควรทำอย่างไรเพื่อมุ่งเน้นการออกแบบเว็บใน Photoshop? Photoshop ส่วนใดที่จำเป็นสำหรับการออกแบบเว็บและส่วนใดที่ไม่ใช่?

6
เส้นทางนักพัฒนาไปยังนักออกแบบ: วิธีการ
ในฐานะนักพัฒนาที่ต้องการเป็นนักออกแบบฉันสนใจที่จะเรียนรู้วิธีสร้าง UI อันดับต้น ๆ สำหรับเว็บไซต์แอพมือถือและอื่น ๆ อย่างไรก็ตามฉันไม่รู้อะไรเกี่ยวกับ Photoshop หรืออะไรที่เกี่ยวข้องกับการออกแบบทักษะหลักของฉันคือ HTML และ CSS . ฉันจะเริ่มได้ที่ไหน ฉันจะเรียนรู้วิธีสร้างเว็บไซต์และอินเทอร์เฟซที่สวยงามได้อย่างไร

7
แนวทางปฏิบัติที่ดีที่สุดในการจัดการกับตัวแบ่งบรรทัดที่ต้องการในการออกแบบเว็บที่ตอบสนองคืออะไร
ฉันออกแบบเว็บไอเท็มหน้าเว็บอย่างง่ายสำหรับการขายหรืออีเมล ฉันมักพบว่ามีปัญหากับพาดหัวและตัวแบ่งบรรทัดที่ฉันต้องการตามความกว้างของสื่อที่แตกต่างกัน ตัวอย่างเช่นฉันอาจมีหัวข้อเช่น: สิ่งใหม่ของเราคือสิ่งที่ดีที่สุดตั้งแต่หั่นขนมปัง! ด้วยการไม่สนใจเส้นแบ่งเส้นแบ่งเช่นนี้: สิ่งใหม่ของเราคือสิ่งที่ดีที่สุดตั้งแต่หั่นขนมปัง! ที่เว็บขนาดเต็มฉันต้องการแยกบรรทัดหลังจาก "ตัว" สร้างสองบรรทัด สิ่งใหม่ของเราคือสิ่งที่ดีที่สุดตั้งแต่หั่นขนมปัง! สำหรับหน้าจอที่มีความกว้างปานกลางฉันจะแบ่งสองครั้ง: สิ่งใหม่ของเราคือสิ่งที่ดีที่สุดตั้งแต่หั่นขนมปัง! สำหรับหน้าจอที่แคบลงฉันจะแตกหักหลังจาก "ใหม่" หลังจาก "thingamabob" และหลังจาก "สิ่ง" สร้างสี่บรรทัด ของเราใหม่thingamabob เป็นสิ่งที่ดีที่สุดตั้งแต่ขนมปังหั่น! ฉันจริงๆไม่ต้องการที่จะใช้แท็กแบ่ง ( <br>) เพราะที่ยากชุดแบ่งในทุกขนาด จนถึงตอนนี้ฉันได้ใช้เคียวรีสื่อบันทึกและเปอร์เซ็นต์ความกว้างสำหรับแท็กต่างๆh1- h5เพื่อให้ความกว้างของแท็กบังคับให้หยุดพัก แต่ดูเหมือนว่า "แฮ็ค" สำหรับฉัน (มันก็ค่อนข้างเจ้าอารมณ์ในบางครั้งตามข้อความจริง) เป็นวิธีที่ดีที่สุดในการควบคุมตัวแบ่งบรรทัดโดยไม่ต้องเขียนโค้ดลงใน html อย่างไร

2
วิธีทำให้สีปรากฏบนพื้นหลังที่แตกต่างกันอย่างไร
พื้นหลังเกี่ยวกับการรับรู้สี: เนื่องจากลักษณะของสายตามนุษย์และการประมวลผลภาพโดยสมองที่มีภาพลวงตาที่มีสีเดียวกันจะมีลักษณะที่แตกต่างกันขึ้นอยู่กับพื้นหลัง เป็นที่รู้จักกันในนามเอฟเฟกต์ความคมชัดภาพประกอบด้านล่าง - รูปสี่เหลี่ยมผืนผ้าตรงกลางเหมือนกัน: ที่มา: Wikimedia ภาพประกอบ(และรายงาน) โดย NASAทำให้ผลของสีพื้นหลังชัดเจนยิ่งขึ้น: ที่มา: ห้องปฏิบัติการวิจัยการใช้สีของนาซา (โปรดสังเกตว่าสีที่สูงที่สุดสองสีในภาพที่สองปรากฏเหมือนกัน แต่จริง ๆ แล้วแตกต่างกันโดยสิ้นเชิง) แล้วการออกแบบเว็บล่ะ คำถามของฉันเกี่ยวข้องกับการออกแบบเว็บโดยเฉพาะในกรณีนี้สีของข้อความลิงค์ในพื้นหลังที่แตกต่างกัน สำหรับสีข้อความที่กำหนดหนึ่งจะพบสีเสริมเพื่อให้มันปรากฏบนพื้นหลังที่แน่นอนได้อย่างไร ลองมาดูตัวอย่างสำหรับคำถามนี้ ลองพิจารณาตัวอย่างด้านล่างด้วยตัวอักษรสีเหลือง#FFF000บนพื้นหลังต่อไปนี้: สีขาว#FFFFFF, ดำ#000000, #555555และสีเทา อย่างที่คาดไว้ไม่เหมือนกันเลย ( ดูและดาวน์โหลดไฟล์. PSD ที่นี่ ) เราจะทำให้มันดูเหมือนกันทั้งสามได้อย่างไร เห็นได้ชัดว่าข้อความบนพื้นหลังสีขาวจะต้องมีสีเหลืองเข้มและข้อความบนพื้นสีเทาต้องการการปรับสี / โทนสี (ข้อความโดยรอบจะมีผลกับมันด้วย - แต่อาจเป็นเรื่องยากสำหรับบัญชี) สามารถคำนวณสีที่สมบูรณ์แบบนี้ได้โดยใช้ Hex, RGB หรือระบบอื่นหรือไม่? นั่นคือที่มาของคำถามนี้เพราะมันจะมีประสิทธิภาพมากกว่าการประมาณค่าด้วยตนเอง


5
ฉันจะบันทึก SVG ที่อยู่บนเว็บไซต์ไปยังคอมพิวเตอร์ของฉันได้อย่างไร
ฉันต้องการทำงานกับโลโก้จากเว็บไซต์นี้(ที่มุมบนซ้าย): นี่คือส่วนของรหัสที่ฉันคัดลอกมาจากหน้า: <svg viewBox="0 0 215 50" height="50" width="215" xmlns="http://www.w3.org/2000/svg"><path d="M128.783 40.08v7.74h2.078v-5.66h18.843v5.66h2.08v-7.74h-3.322V5.82h-14.017c0 14.588-.467 23.26-2.596 34.263h-3.064zm-43.58 2.08h4.154V5.82h-4.153v3.116l-9.138 24.352V5.818h-4.153V42.16h4.153v-3.114l9.138-24.35v27.465zm-22.842 0h4.36l-6.904-21.08 4.83-15.262h-2.13l-4.88 15.263H52.08V5.82h-4.155V42.16h4.156v-19h4.048l6.233 19zm71.562-2.08c1.764-10.433 2.492-18.842 2.598-32.186h7.783V40.08h-10.38zm74.6 2.08h4.31L204.894 5.82h-4.31l.88 4.206-6.852 32.137h2.13l2.59-12.097h6.548l2.643 12.098zm-169.574 0h4.31L35....8zm147.355 0h4.158V5.82h-13.968v2.076c-.05 8.05-.414 18.12-1.143 23.204-.466 3.066-1.61 5.508-3.532 5.508v5.555c3.588 0 4.623-4.83 5.246-9.24.936-6.752 1.4-16.976 1.506-25.025h7.732V42.16zM159.88 7.896h9.347V5.818H155.73V42.16h13.497v-2.08h-9.348V20.564h7.265v-2.076h-7.266V7.895zm-59.1 0h9.34V5.818H96.626V42.16h13.496v-2.08h-9.34V20.564h7.266v-2.076h-7.265V7.895zm-96.2 0h8.306v34.267h4.152V7.895h8.306V5.818H4.58v2.077zm28.396 6.023l2.858 14.067h-5.66l2.802-14.067zm169.58 0l2.853 14.067h-5.66l2.807-14.067z"></svg> ฉันไม่ชำนาญในเรื่องนี้มากนัก แต่ได้ลองวางลงในไฟล์ข้อความแล้วโดยการบันทึกเพิ่มเติมเป็น …

11
ฉันควร (นักออกแบบเว็บไซต์) ติดกับ gimp หรือซื้อ Photoshop?
ฉันเป็นนักออกแบบเว็บไซต์ ฉันไม่ได้ใช้ / เป็นเจ้าของผลิตภัณฑ์ Adobe ใด ๆ ... ยกเว้นการดูวิดีโอแฟลชออนไลน์อย่างแน่นอน ขณะนี้ฉันใช้ gimp 2.6 สำหรับความต้องการด้านกราฟิกของฉัน ได้ฟรีและฉันรู้วิธีใช้งาน ดูเหมือนว่าจะมีทรัพยากรสำหรับ Photoshop ถึง 10 เท่าเท่าที่จะทำได้ แม้ว่าฉันจะมีความรู้ดีเกี่ยวกับความสามารถในการออกแบบกราฟิกของฉันไม่ดีนัก คุณคิดว่าฉันควรซื้อ Adobe Photoshop หรือไม่ แล้วผลิตภัณฑ์อื่น ๆ ของพวกเขาล่ะ? คุณแนะนำหนังสือเว็บไซต์บล็อก ฯลฯ เพื่อช่วยให้ฉันได้รับทักษะการออกแบบกราฟิก / เว็บที่ดีขึ้นหรือไม่? โปรดพูดจากประสบการณ์และขอบคุณล่วงหน้า!

3
ฉันจะแสดงตัวอย่างการทำงานของงานพัฒนาเว็บไซต์ที่ผ่านมาโดยไม่ต้องเชื่อมโยงไปยังเว็บไซต์ที่มีการเปลี่ยนแปลงอยู่ตลอดเวลาได้อย่างไร
เมื่อใดก็ตามที่ฉันออกแบบเว็บไซต์ฉันคิดว่ามันมีประโยชน์ไม่เพียง แต่แสดงการดักจับหน้าจอเท่านั้น น่าเสียดายที่ลูกค้าส่วนใหญ่แก้ไขเว็บไซต์ด้วยตนเองและหากพวกเขาไม่จ่ายเงินให้ฉันเพื่อการบำรุงรักษาไซต์จะสูญเสียสิ่งที่ดึงดูดซึ่งไม่ทำให้ฉันชื่นชอบการแทรก URL ในพอร์ตโฟลิโอของฉัน มีแนวทางปฏิบัติที่ดีที่สุดในการแสดงการออกแบบเว็บ / UI (ที่ใช้งานได้จริงและไม่ใช่การจับภาพหน้าจอที่เรียบง่าย)? คุณเก็บสำเนาออฟไลน์ไว้เพื่อแสดงลูกค้าหรือไม่ คุณเชื่อมโยงไปยังเว็บไซต์ที่มีอยู่ของคุณ (Behance หรืออื่น ๆ ) ได้อย่างไร

6
ภาพหน้าจอเว็บไซต์คุณภาพสูงสุด
ฉันได้สร้างเว็บไซต์ที่ฉันต้องการเพิ่มลงในแฟ้มสะสมผลงานของฉัน แต่ฉันมีเวลายากที่จะได้รับภาพหน้าจอคุณภาพสูงของเว็บไซต์เต็มรูปแบบ ฉันพยายามบันทึกเว็บไซต์เป็น PDF แต่นั่นเต็มไปด้วยข้อผิดพลาดบริการออนไลน์อื่น ๆ ไม่สามารถสร้างภาพขึ้นมาได้ ฉันก็แค่พยายามที่จะจับภาพหน้าจอปกติบน mac เพื่อรวมเข้าด้วยกัน แต่มันก็มีคุณภาพลดลงจริง ๆ เมื่อฉันลดขนาดลง มีความคิดที่ดีไหม? :)

4
ภาพ SVG ดูลดขนาดลงกว่า png, jpg หรือ gif ที่มีความละเอียดสูงหรือไม่
ฉันรู้ว่าถ้าคุณต้องการขยายภาพ SVG เป็นทางเลือกที่ชาญฉลาด อย่างไรก็ตามสถานการณ์ของฉันคือฉันมีไอคอนที่ฉันต้องการให้ผู้ใช้สามารถอัปโหลดผ่าน CMS SVGs นั้นช่างยากที่จะสร้างขึ้นดังนั้น jpg, gif หรือ png จึงเป็นรูปแบบที่เหมาะสำหรับผู้ดูแลระบบ หากอัปโหลดขนาดเท่ากันหรือใหญ่กว่าขนาดหน้าจอและคงไว้ในอัตราส่วนที่ถูกต้องสามารถ jpgs, gif หรือ pngs มีคุณภาพสูงเท่ากับ SVG เมื่อลดขนาดลงหรือไม่ ข้อสันนิษฐานของฉันคือเบราว์เซอร์จำเป็นต้องลดขนาด svg ให้ต่ำลงด้วยเช่นกันดังนั้นพวกเขาจึงมีแนวโน้มที่จะเบลอมากเท่ากับรูปแบบอื่น ๆ แม้ว่า gif จะดูเบลอมากกว่า

9
ฉันควรขอชำระเงินสำหรับโลโก้และการออกแบบเว็บไซต์เมื่อส่งมอบล่าช้าหรือไม่
ฉันได้ออกแบบโลโก้และเว็บไซต์สำหรับ บริษัท เพราะฉันใช้เวลานานกว่าปกติเล็กน้อย (3 สัปดาห์) พวกเขากำลังพูดถึงการว่าจ้างคนอื่น ฉันส่งงานออกแบบ (ออกแบบโลโก้ 10 แบบอย่างน้อย 50 รูปแบบ) และออกแบบเว็บไซต์ หากพวกเขาจ้างคนอื่นความพยายามทั้งหมดของฉันก็สิ้นเปลือง ฉันยังคงต้องขอชำระเงินหรือไม่ ฉันคิดว่าฉันควรจะได้ แต่ไม่ควรพูดถึงทั้งหมดเช่น 20% ของมัน กรุณาช่วย.

5
ฉันควรทำอย่างไรกับโปรไฟล์สีเมื่อออกแบบสำหรับเว็บ
ฉันได้อ่านบทความนี้โดยดั๊กเอเวอรี่ซึ่งเขาอธิบายวิธีปิดการใช้งานการจัดการสีใน Adobe Photoshop และบทความติดตามผลเพื่อตอบรับความโกลาหลของผู้แสดงความคิดเห็นที่โต้เถียงและสนับสนุน sRGB แม้ว่าฉันจะยังไม่มั่นใจในเทคนิคใด ๆ ควรนำไปใช้ในเวิร์กโฟลว์ส่วนตัวของฉัน จากสิ่งที่ฉันได้รวบรวมในขณะที่อ่านบทความ (โปรดแก้ไขให้ฉันถ้าฉันผิด) วิธีที่ถูกต้องในการจัดการกับเรื่องนี้คือให้ Photoshop จัดการสีเป็น sRGB และใช้Proof Colorsเมื่อต้องการมากกว่า ตัวอย่าง "ซื่อสัตย์" ของผลงานของคุณ ในขณะนี้ฉันมีโครงการเว็บไซต์ทั้งหมดที่ได้รับการออกแบบโดยปิดการใช้งานโปรไฟล์สี ฉันเริ่มทำอย่างนั้นเพราะเมื่อหลายเดือนก่อนฉันสังเกตเห็นว่าสีที่แสดงบน Photoshop ถึงแม้ว่ารายงานอย่างถูกต้องโดยEyedropper Toolของ Photoshop เองก็ไม่สอดคล้องกันเมื่อวัดจากภาพหน้าจอไปยังสิ่งที่ฉันเห็นใน Google Chrome เมื่อเปิดภาพที่ส่งออกเป็น PNG หลังจากการค้นหาอย่างรวดเร็วฉันพบข้อความที่ฉันอ้างถึงก่อนหน้านี้และใช้คำแนะนำอย่างสุ่มสี่สุ่มห้า (โดยไม่ต้องสังเกตการติดตามหรืออ่านเกี่ยวกับปัญหาด้วย) ตั้งแต่นั้นมาฉันก็ไม่มีปัญหา: ฉันถ่ายภาพหน้าจอของงานของฉันใน Photoshop และฉันอัพโหลดให้นักพัฒนาใช้งาน เขาจะได้เห็นสีเดียวกับที่ฉันเห็นและใช้เมื่อพัฒนาการออกแบบและฉันไม่ต้องกระโดดผ่านห่วงเพื่อดูว่าฉันกำลังทำอะไรอยู่ คำถามของฉัน: จำเป็นหรือไม่ที่จะต้องใช้ sRGB ในการออกแบบเว็บ (ฉันเข้าใจถึงความหมายของการไม่ใช้มันในการถ่ายภาพหรือการพิมพ์) เมื่อมันเพิ่มงานมากขึ้นโดยบังคับให้คุณใช้Proof Colors ? (นั่นเป็นเพียงวิธีที่ฉันเห็นโปรดแก้ไขฉันหากฉันผิด) เนื่องจากประหยัดกับโปรไฟล์ ICCจะนำไปสู่เบราว์เซอร์บางอย่างถูกต้องใช้รายละเอียดขณะที่คนอื่นไม่สนใจมันบทความยังบอกว่ามันอาจจะเป็นความคิดที่ดีที่สุดในการออกแบบเพียงกับ sRGB แล้วเซฟไว้ได้โดยไม่ต้องโปรไฟล์ …

2
ลูกค้ามักคิดว่าพวกเขาเป็นนักออกแบบที่ดีกว่าฉัน
เมื่อฉันออกแบบเว็บไซต์หรือแอปพลิเคชั่นใหม่ฉันพิถีพิถันในทุกรายละเอียดเพื่อให้สวยงามในขณะที่ยังใช้งานได้ง่าย อย่างไรก็ตามเกือบตลอดเวลาลูกค้ามีแนวคิดที่ดีกว่า พวกเขาร้องขอการเปลี่ยนแปลงอันยิ่งใหญ่และตามเวลาที่พวกเขาพอใจฉันละอายที่จะเรียกมันว่างานของฉัน ฉันเสียเวลามากขึ้นและผลิตภัณฑ์ดูเป็นมืออาชีพน้อยลง ฉันควรทำอย่างไร นี่เป็นปัญหาทั่วไปสำหรับผู้อื่นหรือไม่ มีวิธีการโน้มน้าวใจลูกค้าว่าคุณเป็นนักออกแบบและพวกเขาควรไว้วางใจในความเชี่ยวชาญของคุณ (โดยไม่ทำให้เกิดเสียง) ฉันเพิ่งจัดการกับลูกค้าประเภทผิดหรือเปล่า? หรือนี่คือวิธีที่เป็นอยู่และยิ่งฉันยอมรับมันเร็วเท่าไหร่มันก็จะยิ่งดีขึ้นเท่านั้น คุณมีประสบการณ์อย่างไร

10
สิ่งที่ควรออกแบบก่อน: โลโก้หรือเว็บไซต์
ฉันกำลังขอให้ใครบางคนสร้างการออกแบบเว็บไซต์ให้ฉัน แต่ฉันไม่แน่ใจว่าเว็บไซต์ควรผลักดันการออกแบบโลโก้หรือโลโก้ผลักดันการออกแบบเว็บไซต์หรือไม่ ฉันควรจะออกแบบโลโก้ก่อนหรือหลัง?

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.