Vertical Scrolling: Photoshop layout
- January 27, 2012
- 9 comments
Sau khi đã hoàn thành về series photoshop căn bản thì chúng ta sẽ bước qua những video hướng dẫn mới, với kỹ thuật cao hơn, không chỉ có thiết kế và còn cả lập trình nữa. Thông qua series này, mình sẽ hướng dẫn các bạn làm một website từ đầu tới cuối với phong cách Vertical Scrolling.
Trong bài đầu tiên thì chúng ta sẽ sử dụng photoshop để layout một website giả lập với tên là “Izwebz survey” nhằm khảo sát ý kiến người dùng. Ngoài các thao tác căn bản như đã học trong các bài trước, chúng ta sẽ tìm hiểu thêm về cách tạo texture cho website.
Phía dưới là hình demo website sau khi đã được tao ra với công cụ photoshop.

- Chú ý mã màu: Đỏ:e74c4a; Xanh:30adbf; Background:f7f7ef;
- Tham khảo thêm các cách khác tạo texture: Webdesign.tutsplus.com
Trong bài thứ 2 của series này thì chúng ta sẽ bắt tay vào chuyển từ photoshop sang HTML & CSS. Tuy nhiên, chúng ra sẽ sử dụng HTML5 và CSS3. Cái này mình sẽ nói rõ trong bài tiếp theo.
Giờ thì hãy thưởng thức thôi nào.
Thời lượng: 42 phút
File Size: 220 MB (168 Mb .7z)
Screen size: HD 720p
Download Mp4: Mediafire
Email: izwebz.art@gmail.com (Minh Mẫn)
« Vertical Scrolling: Slice & Code
[WP Tip] Timthumb & featured image »
Cho hỏi là width của cái layout trong PTS là bao nhiêu px vậy?
Mình để width là 1280px đó bạn.
Cái sọc xanh ngang dọc để làm gì thế a ơi
Muốn thanks các bác thật nhiều, tiếc là không có nút like
cảm ơn admin nha’
Site này bạn có hướng dẫn làm trên WordPress ko? Mình rất thích WordPress.
Đã update lại link nhé.
Về quê vừa lên.
Ngồi hóng phần 2 HTML5
Anh Mẫn ơi. Sao em download mà nó đòi key ha anh.
Anh cho em key được không.????
Cảm ơn Võ Minh Mẫn về những tutorial, song cần trau chuốt và nâng cao chất lượng sản phẩm hơn nữa.