the creative guide
The Creative Guide

เจาะไซท์เจ็บ ผ่า! เว็บดัง

สารบัญ (Table of content)

เจาะไซท์เจ็บ ผ่า! เว็บดัง | คำนำ | สารบัญ

01 Sanook

  Page Layout
Table Layout
ตารางซ้อนตารางแบบพื้นฐาน
Development Facts
From the Source
ลักษณะเด่นในการออกแบบ
สร้างบริเวณให้มีขอบแบบตัดด้วยกราฟิก (Corner Graphic)
Navigation Bar
Style Sheet
การตั้งชื่อหัวข้อ
ออกแบบเส้นขอบของตารางให้เหมือนกับกราฟิก
การจัดเนื้อหาให้อยู่กึ่งกลางหน้า
Zoom In : สร้างแถบหัวข้อแบบ 3 มิติด้วยตาราง
Quick Steps : เทคนิคการใช้ตารางสร้างกรอบเนื้อหาให้มีขอบเป็นแบบเส้นทึบและมีสีต่างๆ

02 Siam2you

  Page Layout
Table Layout
รวมพื้นที่ว่างไว้ในส่วนของกราฟิก
ทีมพัฒนาเว็บ
Development Facts
Logo Design
Color Schemes
From the Source: แนวทางการออกแบบเว็บสยามทูยู
Activity
Up [2] Date
ใช้เครื่องหมาย - สีขาวสร้างช่องว่าง
Fonts
Zoom In : การออกแบบแถบป้ายหัวข้อและเพิ่มสีสันให้กับเนื้อหา
Quick Steps : สร้างเมนูลัด (Jump Menu) ด้วย Dreamweaver

03 Shinee

  Page Layout
Table Layout
Development Facts
Utility Page
สไตล์ชีทที่กำหนดชนิดและขนาดตัวอักษร
Flash Variety
ลักษณะเด่นในการออกแบบ
From the Source
Zoom In : เทคนิคการสร้างเส้นจุดด้วยกราฟิก
Quick Steps : สร้างเส้นจุดและรูปแบบต่างๆโดยใช้สไตล์ชีท

04 Hunsa

 

Page Layout
Table Layout
Development Facts
แนวทางการออกแบบ
From the Source
Logo
Set Default Homepage ของบราวเซอร์
Graphic Sources
Background Image
Zoom In : สร้างบรรยากาศความหนาวเย็นด้วยหิมะ
Quick Steps : สร้างกราฟิกแบบไม่มีรอยต่อสำหรับเว็บเพจ (Seamless Tiled Graphics)

05 Amazon

  Page Layout
Table Layout
ลักษณะเด่นในการออกแบบ
เรื่องของเนวิเกชั่นบาร์
Navigation Bar Tables
เรื่องของสี
Style Sheet
Zoom In : จัดระเบียบไอคอนและข้อความด้วยตาราง
Quick Steps : กลยุทธ์การให้บริการผู้ใช้ในเว็บ Amazon

06 Apple

  Page Layout
Table Layout
Animation
ใช้ตารางจัดตำแหน่งรูป
Navigation Variety
ลักษณะเด่นในการออกแบบ
ชุดตัวอักษรที่ใช้
การจัดเลย์เอาท์ของหน้าเว็บ
Layout Gallery
Zoom In : สร้างกรอบข้อมูลด้วยกราฟิกและตาราง
Quick Steps : สร้างแถบป้ายที่สามารถขยายออกเต็มพื้นที่หน้าจอ

07 Google

 

Page Layout
Table Layout
ลักษณะเด่นในการออกแบบ
กูเกิ้ลภาคไทย
เทคนิคการจัดกึ่งกลางหน้า
Goooooogle
หน้าหลักอื่นๆของ Google
โลโก้พิเศษฉลองวันหยุดและโอกาสสำคัญต่าง (Holiday Logos)
เรื่องราวสนุกๆของกูเกิ้ล (Google Doodle)
Zoom In : ใช้ตารางสร้างแถบป้ายแบบกราฟิก
Quick Steps : สร้างกรอบสี่เหลี่ยมที่มีเส้นขอบสีต่างๆด้วยตารางซ้อนตาราง

08 Liverpool Football Club

  Page Layout
Table Layout
ลักษณะเด่นในการออกแบบ
Member Services
Hidden Table and Graphic
Flyout Menu
Background Gallery
Round Corner Graphic
Style Sheet
Tab Technic
Web Safe Colors
Zoom In : บริเวณเนื้อหาแบบกึ่งโปร่งใส
Quick Steps : สร้างรูปพื้นหลังแบบกึ่งโปร่งใสด้วย Fireworks

09 Moodstats

  Page Layout
Frame Layout
ลักษณะเด่นในการออกแบบ
1024x768 View
Background Images
File Structure
Style Sheet
Scroll Bar
โครงสร้างของตารางในการจัดเลย์เอาท์
กราฟิกใส (Transparent Graphics)
Matte Option
Logos
ตัวอักษรและลวดลายในกราฟิก
Zoom In : รูปพื้นหลังที่มีลวดลายตามรูปแบบของเนื้อหา
Quick Steps : สร้างลักษณะแสดงและซ่อนชั้นข้อมูล (Show-Hide Layers) ด้วย Dreamweaver

10 The Box

  Page Layout
Table Layout
ลักษณะเด่นในการออกแบบ
Web Safe Colors
Utility Page
Open New Window
Frame Sets
File Structure
Zoom In : Dithered Pattern
Quick Steps : สร้างกราฟิกลายสี่เหลี่ยม (Dithered Pattern) ด้วย DitherBox

Web Gallery

Automotive

  01 I Love CR-V
02 Jeep
03 Mercedes-Benz USA
04 Toyota

Identity

  05 Adobe Studio
06 Mc Alpine Group
07 Razorfish
08 Vulcan

Movie

 

09 Harry Potter
10 Monrak Transistor
11 Spider-man
12 Suriyothai

Music

  13 David Bowie
14 Mick Jagger
15 Phish
16 Pink Floyd

Organization

  17 2002 FIFA World Cup
18 Controlled Freestyle
19 Los Angeles County Art Commission
20 Vitra Design Museum

Products

 

21 Corbis Human
22 Nike
23 Omega Watches
24 Starbucks Coffee

Copyright 2009 © TheCreativeGuide.com