Trang chủ Blog | Các câu hỏi thường gặp | Yahoo! Việt Nam

      Tên blog

      Sửa Đóng

      Bài mới nhất

      Sửa Đóng
      Bài viết Tìm bài viết:
      Trích dẫn Báo cáo

      ♦ Hường dẫn thiết kế themes cho 360Plus

      Thư mục: [♥Thủ Thuật Y!Plus♥] |
      Quan trọng
      Đăng ngày: 17:05 04-06-2009
      Bài viết dành cho nhưng ai bắt đầu bước vào thiết kế themes cho 360Plus (đặc biệt dành cho đối tượng từ bên 360 chuyển qua), ai biết rồi thì không phải đọc bài này đâu ^^ !
      Mọi chi tiết hình ảnh trong bài viết chỉ có tính minh họa và được chụp bằng Prt Scr nên hình ảnh không sắc nét, vì thế có xấu thì cũng phải cố mà đọc       , ai mà vào hỏi trong box 360plus những cái đã được giới thiệu trong này thì đứng có trách đấy (câu này dành cho mem 2T)

      I. Giới thiệu qua về 360Plus

      360plus được coi là blog chính thức của yahoo việt nam, có thể vào 360plus bằng một số con đường sau

      - Cách 1: vào trang chủ của yahoo việt nam: http://vn.yahoo.com , sau đó click vào phần khoanh đỏ phía dưới



      - Cách 2: Vào trực tiếp link của trang chủ 360plus:
      http://vn.blog.yahoo.com
      Sau đó vào blog bằng cách click vào một trong 2 vùng khoanh đỏ ở dưới



      - Cách 3: vào qua bảng chat yahoo việt nam (giống như cách vào 360 bằng yahoo8.) (sry không xài ym 9. vn nên không chụp hình được tự mà ngâm cứu nhé)

      Với thiết kế cho 360Plus, Kata lưu ý các designer đặt mục tiêu dung lượng lên hàng đầu, vì số lượng cần design sẽ rất nhiều, nếu dung lượng lớn thì load sẽ rất lâu (thế thì đẹp cũng chẳng ai nhìn thấy), tốt nhất là nặng nhất cũng tầm <100kb/hình, tiếp theo là vấn đề phối màu nền và màu chữ sao cho dễ nhìn, tránh rối mắt, sau đó mới đến bố cục toàn trang!

      II. Lan man nhiều quá cũng không hay, vào chủ đề chính, muốn design thì phải có thông số, sau đây là một vài thông số quan trọng

      1. Về background

      Về nền background, có thể tạm hiểu là nền toàn trang (như 2 cái viền màu xanh bên rìa của trường tồn này nè )
      Cái đó thì đương nhiên không có thông số mặc định, tùy độ phân giải của mỗi người =_= thế thì phải làm thế nào đây
      cách tốt nhất là sử dụng hình nền dạng lặp, dung lượng chỉ tầm <50kb mà lại lặp lại trên toàn màn hình, có thể xem dưới mọi độ phân giải (bg của blog Kata là một ví dụ)

      Ngoài ra, cũng có thể sử dụng hình nền như bình thường, nhưng thông số sẽ như sau: chiều ngang tối thiểu là 1280, tốt nhất là để 1400, chiều dài thì tối thiểu là 800, tối đa không giới hạn. Vì sao ư ? hãy thử nhìn hình minh họa

      Bg Kata sử dụng kích thước 1280x1500
      với những ai sử dụng độ phân giải 1280x800 hoặc 1280x1024


      Với những ai sử dụng độ phân giải 1024x600 hoặc 1024x768 (vì cắt ảnh không khéo nên nhìn hơi xấu)


      Nó vẫn bao trùm toàn màn hình, nhưng nếu ngược lại bạn sử dụng size ảnh chiều ngang 1024 thì 2 bên sẽ thừa ra một khoảng trống, có thể khắc phục giống trường hợp của Kem


      đó là bên cạnh code cho thêm thông số màu, khi đó những phần themes không với tới sẽ có màu theo thông số bạn chỉ định

      2. Về themes cho blog

      Hơi lạ phải không, vì trong 360 themes cho blog cũng chính là bg, còn themes cho blog có thể hiểu là ví dụ như cái khoảng trắng của trường tồn ở giữa 2 rìa màu xanh
      themes cho blog tùy thuộc vào kiểu dàn trang bạn chọn
      nếu bạn chọn dàn kiểu 3 cột
      themes cho blog sẽ đi từ đây đến đây, và chiều rộng là 920px (híc, ngày trước không có ai viết cái này nên tất cả đều phải tự chụp rồi đo bằng pts =_=)


      còn nếu kiểu 2 cột, thông số chiều rộng sẽ là 760px
      themes cho blog sẽ đi từ đây đến đây



      ==========================
      trích dẫn xen ngang, không nhất thiết bạn phải cần làm cả số 1(background) lẫn số 2(themesblog), có thể lược bỏ số 2 đi nếu thấy không cần thiết, và đa số mọi người ngay từ background đã vẽ luôn nền cho blog rồi
      một vài ví dụ điển hình

      Themes chỉ xài số 1:


      Themes chỉ xài số 1 (nhưng trong background vẽ luôn nền cho blog, tạo cảm giác phân chia giữa background và nền blog):


      Themes xài cả số 1 và số 2:




      3. Module: Chia thành 2 mảng

      A- Mảng 1:
      a. Border (có thể hiểu là viền module) (cái này rất ít người làm), trích dẫn từ bài viết của dephia
      Border chia thành 2 loại border ngắn và dài

      Border dài:
      • 2 đường viền ngang : 1024 x 5
      • 2 đường kẻ dọc : 5 x 10
      • 2 nút bên trái góc trên và dưới khung : 5 x 5
      Border ngắn: Một ảnh kích thước 5x5
      ví dụ




      b. Nền module: nó sẽ sử dụng repeat nên kích thước tùy ý, có thể để nó có thể nhìn xuyên bằng cách giảm opacity trong blending option
      Ví dụ về blog sử dụng mảng 1:



      B- Mảng 2: Hầu hết mọi người xài mảng này, vì không bị gò bó bởi viền và nền
      Module được chia thành 4 phần
      - Phần đỉnh
      - Phần tiêu đề
      - Phần thân
      - Và Phần cuối (Thô bỉ học mà nói thì gọi là phần đít )

      Tuy nhiên khi design chỉ sử dụng một trong 2 trường hợp sau
      TH1: Phần đỉnh + phần thân + phần cuối
      TH2: phần tiêu đề + phần thân và phần cuối
      Về cơ bản, kết quả thu được của 2 trường hợp là gần tương tự nhau, sử dụng trường hợp một thì khoảng cách giữa phần đầu và nội dung sẽ xa hơn một chút

      Hồi trước Kata không biết về 2 mảng này, cứ nghĩ chắc là có code đưa một số hình lên trên đầu module =_= kiếm hoài không ra, sau một hồi mò mẫm mới ngẩn người ra là cứ thế mà design mà thay vào thôi

      Về các hướng dẫn design thì cái này có thể gọi là không giới hạn, tùy theo ý tưởng của designer
      minh họa một số module đi-ẹp nè










      4. Về footer, cái này thì chia sẻ kinh nghiệm của bản thân qua bao lần dại dột mà thôi
      Thế "Footer" là gì ?
      Là cái này này



      Thiết kế nó để làm gì ?
      Trả lời: để làm chữ ký, để làm quảng cáo, để làm logo, hoặc để trang trí,.... vân vân và vân vân + vân vân - vân vân ....
      Ví dụ (lấy ví dụ từ bản thân)











      Không thích làm thì có sao không ?
      Trả lời: Chẳng sao cả, không thích thì có thể để nguyên đó hoặc vứt bỏ nó đi cũng được


      5. Về masshead: Cái này có thể gọi là cái mà các designer hầu như bỏ qua, chẳng ai thiết kế -> khá phức tạp và rắc rối (cái này xin kiếu sang bài viết sau nhé, bạn nào vẫn thích làm thì liên hệ mình, qua 2T, qua blog, qua ym tùy ý)
      Masshead không cần thiết phải cầu kỳ hoặc quá đẹp, chỉ cần nó hợp với themes của bạn sử dụng là được rồi, không có cũng chẳng sao
      Một số ảnh minh họa về masshead







      Phù ! xong phần thông số, mệt vãi xoài, breaktimes 15', làm tách cafe rồi tính sau
      Time's up, let's cont....


      III. Tiếp theo về khoản dàn trang:
      360plus chia thành nhiều dạng, Mình thì chỉ chia thành 2 loại thôi, 2 cột và 3 cột
      đương nhiên nếu muốn biến nó thành 1 cột cũng được (xài code)
      Cái này thì mình nghĩ không cần ảnh minh họa, bạn ấn vào nút thiết kế-> dàn trang, chọn kiểu dàn trang bạn thích và ấn nú xong ^^

      IV. Cách thêm và bỏ module:
      V. Liên quan đến code CSS
      về code thì vô box yahoo plus mà đọc nhé, hoặc cần thêm code thì hỏi Kata cũng được, tại dạo này bận bên MTO2T nên không có time viết share code được (về share code đã giao nhiệm vụ cho olympia sưu tập + share)
      Về nhét code
      mọi thao tác đều bắt đầu bằng nút thiết kế
      Về mục VI và V, các bạn tham khảo tại đây nhé (có hình minh họa và khá đầy đủ)
      http://truongton.net/forum/showthread.php?t=814501

      VI.Other
      Nhu đã giới thiệu, trong plus có rất nhiều cái để design, sau đây là một số ví dụ minh họa

      1. Về vạch ngăn dòng giữa các bài viết



      2. Về hover       (chẳng biết dịch sang tiếng việt là gì, đại khái nếu chỉ qua cái bạn chỉ định thì nó sẽ hiện ảnh lên)





      3. Về button và icon
      nó là cái trang trí cho phần nội dung trong blog bạn, những cái này đa số mọi người đều tự kiếm, (google chẳng hạn ^^)

      4. Về nút Home
      là nút trên ava của bạn, có thể sử dụng các nút home được share có sẵn, trích dẫn một số được share từ cool.love










      nhưng nếu đã thiết kế thì nên thiết kế cả nút home, khi đó nó sẽ hợp với blog của bạn hơn

      5. về module profile


      6. về banner (cái này thì xin khỏi mình họa)
      Đương nhiên là vẫn còn nhiêu cái nữa, không thể liệt kê hết ra được, tùy phong cách của designer thôi


      VII. Lời khuyên chân thành
      Đừng quá sợ hãi bởi cả một đống chữ ở trên mà Kata vừa viết, vì 1 themes các bạn làm các bạn chỉ sử dụng 1/3-2/3 trong só đó, và có rất nhiều cái các bạn có thể sử dụng sẵn hình ảnh trên mạng
      ví dụ
      background, các nút ấn, button, hover, border,....
      Tránh gặp các lỗi giống blogger bình thường (làm dụng ảnh dạng gif + nhiều hiệu ứng)



      ====================================================



      Bản quyền bài viết thuộc về Kata Maybus

      Nguồn : Thư mục Thiết kế theme - RapClub - Thả Dê Thành - Đào Hoa Hội.

      ------------------

      Nếu bạn là người có tự trọng thì khi dùng lại những thông tin trên xin hãy ghi rõ bản quyền và nguồn thông tin! còn nếu bạn là người kô có liêm sỉ thì 1 bài này hả, muốn lấy cứ lấy đi, xem thử lấy bài này về nhà rồi có nổi hơn chút nào ko nhá !

      Mọi người vào đọc Entry ko liên quan đừng để ý mấy dòng này làm gì nhé. Mình chỉ viết, nói cho những đứa cần phải nghe thôi.
      Trích dẫn (0)
      Tìm tag: thủ thuật Y!Plus, Bi, Đào Hoa Hội, thiết kế theme
      Tổng cộng 33 lời bình
      Lời bình mới

      Bài viết về bạn hoặc có tag tên bạn:

      • Chưa có bài nào có liên quan.

      Người đăng ký yêu thích blog này cũng đồng thời thích:

      • Chưa có blog yêu thích nào có liên quan.