Người đăng: Unknown

vào lúc 19:40

Trước đây bạn có thể dùng dịch vụ của Google để tạo ra địa chỉ email mang tên miền riêng của bạn. Nhưng giờ nó không miễn phí nữa rồi. Bài viết này giới thiệu đến các bạn cách tạo địa chỉ email từ dịch vụ Outlook của Microsoft với nhiều tính năng thú vị, và hoàn toàn miễn phí.

Mình đã có đến hàng tá cái email, vào mỗi thời điểm thì những email đó đều hữu dụng vô cùng. Nhưng đến hiện tại thì mình chủ yếu sử dụng 2 email chính để giao tiếp, đó là: ntdlife@gmail.com và about@trungduc.net .

Google có nói một câu như thế này: “Cái gì tốt, chúng tôi sẽ làm tốt hơn, và miễn phí!”. Gmail thực sự tốt, mình dùng và chẳng thấy có vấn đề gì cần phải đáng chê trách cả. Tuy nhiên, đó là với nhu cầu của một người bình thường, còn khi bạn đang vượt qua ngưỡng đó thì nhiều khả năng bên nên xem lại.

Với một email với tên miền riêng của bạn, cái ấn tượng đầu tiên khi giao tiếp qua email bao giờ cũng sẽ cao hơn, tạo sự tin tưởng hơn (đa phần là vậy) . Ví dụ mình cần bán một mặt hàng cực HOT của một công ty ABC, mình chọn phương án email marketing, thay vì gửi mail ten-minh@abc.com, mình lại gửi email ten-minh-abc@gmail.com. Vậy nếu như bạn là khách hàng, bạn tin tưởng vào cái nào hơn? Nếu bạn làm Marketing Online, bạn nghĩ cái nào hiệu quả hơn?

Nếu bạn là một Team, hoặc một đơn vị nhỏ, việc tiết kiệm tiền dịch vụ Mail Server cũng không thừa. Việc giao tiếp bằng email của riêng công ty cũng là cách thể hiện sự chuyên nghiệp và đưa mặt mình ra với cộng đồng.

Trước đây bạn có thể dùng dịch vụ của Google để tạo ra địa chỉ email mang tên miền riêng của bạn. Nhưng giờ nó không miễn phí nữa rồi. Bài viết này giới thiệu đến các bạn cách tạo địa chỉ email từ dịch vụ Outlook của Microsoft với nhiều tính năng thú vị, và hoàn toàn miễn phí.

Vậy tạo Email với tên miền riêng như thế nào?

1. Yêu cầu cần có để thực hiện
1. Bạn có địa chỉ email trên live.com (click để đăng ký)

2. Bạn có tên miền riêng và có quyền thay đổi các record (bản ghi) trên tên miền này.

2. Các bước cấu hình xác thực
Đầu tiên bạn truy cập vào địa chỉ (http://www.live.com/) này và đăng nhập vào tài khoản của mình:

Sau khi đăng nhập thành công, bạn tiếp tục truy cập vào địa chỉ (https://domains.live.com/) và nhấn vào nút Get started trong phần Custom Domains như hình bên dưới:

Ở màn hình Get started, bạn nhập vào địa chỉ tên miền của bạn ở mục Provide your domain name. Tiếp theo bạn chọn mục Set up Windows Live Hotmail for my domain rồi nhấn Continue để chuyển sang bước kế tiếp:

Nếu bạn gõ đúng, màn hình sau sẽ xuất hiện:

Sau khi xác nhận các thông tin, bạn nhấn nút I Accept để chấp nhận. Bạn sẽ nhận được thông báo sau:

Màn hình này hiển thị chi tiết thông tin cần thiết để thực hiện yêu cầu xác thực quyền sở hữu đối với tên miền mà bạn khai báo với Microsoft. Các cấu hình này sẽ được sử dụng lần lượt ở các hướng dẫn bên dưới.

Việc cần làm hiện tại là bạn đăng nhập vào phần quản lý tên miền của bạn tại nhà cung cấp. Giao diện mỗi nhà cung cấp dịch vụ đưa ra có phần thay đổi đôi chút, nhưng tựu trung vẫn là những thiết lập cơ bản về DNS và các record.

Sau khi đăng nhập xong vào phần quản lý tên miền, bạn truy cập vào mục Cấu hình DNS để bắt đầu thiết lập.

+ Với Yêu cầu cấu hình mail:

Bạn tùy chỉnh DNS domain như sau (Mình dùng Cloudflare, các trang quản lý DNS khác làm tương tự):

+ Với Yêu cầu cấu hình Prove domain ownership (chứng minh quyền sở hữu tên miền):

Bạn tùy chỉnh DNS domain như sau:

+ Với Yêu cầu cấu hình Sever Trust & Messenger configuration:

Bạn tùy chỉnh DNS domain như sau:

Sau khi cấu hình DNS xong xuôi, bạn quay lại trang Domain setting(domains.live.com/Manage/ManageDomains.aspx?DomainName=ten-domain.com) và click vào nút Refresh.

Thường thì phải đợi 30 phút – 1 tiếng để cập nhật lại DNS. Và bảng thông báo hiện ra như thế này nghĩa là bạn đã xong được 1 nửa.

Bạn có đến 50 địa chỉ email cho tên miền của bạn. Việc cấu hình tuy đơn giản nhưng Microsoft lại “rộng rãi” hơn 50 lần so với Google. Giờ thì việc cần làm là kiểm chứng lại chất lượng dịch vụ mà Microsoft cung cấp xem thế nào so với dịch vụ của Google.

3. Tạo địa chỉ email cho người dùng
Trong menu bên trái, bạn chọn mục Member accounts để thực hiện việc quản lý các địa chỉ email đã tạo cũng như tạo mới chúng.

Trong màn hình bên phải, bạn nhấn nút Add rồi nhập vào các thông tin như hình bên dưới để bắt đầu tạo email:

*Account name là tên của Email. Ví dụ: ducnt@iluvhanoi.com thì ducnt là Account name.

Nếu bạn muốn xóa để tạo lại thì có thể nhấn vào nút X đỏ ở mục Delete. Nếu bạn muốn tạm khóa địa chỉ này thì bạn có thể nhấn vào mục Edit và chọn Suspend mail. Nếu đã chọn Suspend mà muốn kích hoạt lại thì bạn chọn Enable mail.

Và cứ như vậy, bạn có thể tạo đến 50 địa chỉ nhưng những địa chỉ này hiện tại chỉ có thể đăng nhập tại Outlook.com mà thôi. Nếu bạn muốn đăng nhập tại một trang riêng như của Google thì Microsoft cũng có thể, hãy tiếp tục theo dõi.

4. Tạo địa chỉ đăng nhập bằng chính tên miền của bạn
Cũng trong menu bên trái, bạn chọn mục Custom Addresses

Tiếp theo bạn nhấn nút Add và đặt tên cho phần sub-domain của tên miền bạn đã có. Ví dụ bạn chọn là mail, khi đó, khi đăng nhập bạn có thể truy cập vào địa chỉ mail.[tên miền]

Và khi nhập xong, bạn nhấn OK để quay lại giao diện thêm địa chỉ truy cập, lúc này mục Status hiển thị trạng thái xác thực chưa hoàn tất với dấu X đỏ:

Trong phần CNAME (Canonical Name) bạn cũng tạo một record mới với mục Name có thông tin là mail; mục Host có thông tin là go.domains.live.com.

Đến đây việc cấu hình đã hoàn tất và bạn còn chờ xác thực tên miền từ Microsoft để có thể truy cập bằng chính địa chỉ tên miền của mình. Quá trình xác minh nhanh hay chậm tùy vào khả năng nhận diện record mới trên DNS và có thể mất đến 72 giờ. Khi xác thực thành công, mục Status thể hiện dấu check màu xanh lá và bạn có thể truy cập vào email của bạn bằng chính tên miền mà bạn đã tạo.

5. Xác thực thông tin và đăng nhập
Bây giờ bạn hãy thử thoát ra và đăng nhập bằng địa chỉ email với domain riêng đó (xxx@iluvhanoi.com), bạn sẽ nhận được một thông báo thay đổi Password

Sau khi nhập xong bạn sẽ đăng nhập lại với mật khẩu mới. Hãy click vào Mail ở menu trên cùng để xác thực thông tin.

Nhập ngày tháng năm sinh và quốc gia bạn cư trú.

Xác nhận lần cuối, và đây là thành quả của bạn.

Lời kết
Đến đây là kết thúc quá trình tạo Email với tên miền riêng, bằng cách sử dụng Outlook. Cá nhân mình đã và đang sử dụng Outlook một thời gian khá dài, mail chính của mình: about@trungduc.net cũng được cấu hình tại đây.

Với một nhà cung cấp miễn phí thì mọi thứ như vậy là quá tuyệt vời!

Giờ thì đến bạn rồi, hãy làm thử và cho mình biết kết quả nhé.

Tác giả bài viết: Trung Đức

Người đăng: Unknown

vào lúc 06:57

in font

0 nhận xét

Trên L’espresso, một tạp chí lớn bậc nhất của Ý, nhà thiết kế Oliver Reichenstein có lần đã phát biểu: “Thiết kế web là một nghề quá tự do, chỉ có quá tự do thì người ta mới có thể làm ra nhiều trang web tệ kinh khủng đến như thế”. Các website của Việt Nam không nằm ngoại lệ. Nội dung là phần cốt lõi của một website, nhưng các nhà thiết kế web Việt Nam có vẻ hầu như chẳng thèm quan tâm tới trải nghiệm của người dùng khi đọc nội dung trên trang web của mình.

Cỡ chữ
Để đánh giá trải nghiệm người dùng với các thiết kế web, hãy nhìn vào phần mềm NoSquint.

NoSquint là một addon nằm trong top 80 trên gần 10.000 addon được sử dụng nhiều nhất của Firefox, được người sử dụng bầu chọn 5 sao, được chính Mozilla gán mác Nên dùng (Recommend).
Tính năng tương tự NoSquint được tích hợp thẳng (build-in) luôn vào trình duyệt Chrome. NoSquint làm chức năng tự động phóng to mọi trang web. Thành công của những phần mềm kiểu NoSquint nói lên một điều, các trang web bây giờ thiết kế rất khó đọc.

Theo nghiên cứu, mắt người sẽ thoải mái nhất khi đọc văn bản cỡ 12-14pt (point). Vì vậy nên cỡ chữ mặc định của các phần mềm soạn thảo văn bản như MS Word, OpenOffice,… đều là 12pt. VnExpress, Dân trí, Vietnamnet,… hầu hết các trang web lớn của Việt Nam cũng đều dùng font cỡ 12pt.

Nhưng các nhà thiết kế web không để ý rằng, phần mềm soạn thảo văn bản dùng để làm ra các văn bản in, và qui tắc “cỡ 12-14pt” để áp dụng cho văn bản giấy. Lúc đó đơn vị pt là một con số tuyệt đối, 72pt=1inch, tức là mắt sẽ thoải mái khi đọc chữ cỡ trong khoảng 0,423 đến 0,494cm. Còn pt trên trang web, khi hiển thị lên màn hình là một con số tương đối, nó sẽ biến đổi khác nhau tùy thuộc vào độ phân giải của màn hình. Độ phân giải màn hình càng cao thì kích cỡ thật của pt càng bé.

[IMG]

Mười năm trước, khi màn hình phổ thông là 17inch, độ phân giải 1440×900 thì kích thước “pt màn hình” xấp xỉ “pt thực” nên 12pt vẫn dễ đọc. Nhưng bây giờ, công nghệ đã có nhiều bước tiến lớn, các hãng đua nhau nâng cấp chất lượng màn hình, độ phân giải tăng vọt, hệ quả là chữ hiển thị trên website cũng bị thu nhỏ hẳn lại, nhất là với laptop, đặc biệt trong tình hình máy xách tay nhiều hơn để bàn như hiện nay. Hãy thử nhìn vào một số máy trên thị trường:

Lenovo X300 13.3inch: 12pt màn hình = 0.318cm ~ 9pt thực
Toshiba Satellite 14.4inch: 0.3cm ~ 8.5pt thực
Thinkpad T61p 15.4inch: 0.276cm ~ 7.85pt thực

Rõ ràng với chữ bé như vậy thì đọc rất mệt, rất mỏi mắt. Vậy nếu các nhà thiết kế web không muốn người đọc phải dùng phần mềm bổ trợ khi đọc website của mình thì hãy bắt kịp với công nghệ, sử dụng các phương pháp tự động thay đổi cỡ font theo độ phân giải màn hình như là RWD (Responsive Web Design) chẳng hạn, hay chí ít cũng tăng kích cỡ font văn bản lên.

Arial và Times New Roman
Trước đây, các nhà thiết kế web của Việt Nam gặp phải một vấn đề khó chịu, đó là font chữ tiếng Việt. Nếu người dùng không có font tiếng Việt cài trong máy, chữ tiếng Việt sẽ bị “vỡ”, không thể đọc được. Nên các nhà thiết kế thường chọn dùng những font có sẵn đi theo hệ điều hành, gọi là system font, như là Arial, Times New Roman, Tahoma, Verdana,… để đảm bảo máy người dùng lúc nào cũng hiển thị được tiếng Việt. Nhất là Arial và Times New Roman, hai font mặc định của Microsoft, được dùng ở khắp mọi nơi. VnExpress: Arial cho trang chủ, Times New Roman cho thân bài; Dân trí: Arial cho trang chủ, Times New Roman cho thân bài; Zing: Times New Roman; 24H: Arial,… Cứ tiếng Việt là Arial và Times New Roman.

Một lần, trên diễn đàn về font chữ, có người lên xin tư vấn thế này:

- Tôi vẫn thường dùng Arial với Times New Roman và thấy rất hài lòng, giờ tôi muốn tìm thêm vài font đẹp khác để đôi lúc thay đổi cho đỡ nhàm chán.

Câu trả lời được nhiều người đưa ra nhất là:

- Một khi Times New Roman và Arial mà cũng vừa mắt bạn thì đối với bạn, font nào cũng đẹp hết.
Có nghĩa là Arial và Times New Roman… cực xấu.

Nửa sau của thế kỉ 20, có một font đạt được thành công rất lớn đó là Helvetica, thành công đến mức có hẳn qui luật: “Nếu khó chọn, cứ dùng Helvetica”. Arial là một phiên bản copy của Helvetica, có sửa đổi để tránh bản quyền. Nhưng chính thứ “bắt chước có sáng tạo” đó đã làm mất đi những cái cân đối và hài hòa đã làm nên thành công của Helvetica, khiến người ta ví đọc văn bản Arial cảm giác không khác ngồi ăn tối trên một cái bàn cập kênh. Times New Roman được thiết kế cho báo giấy Times (của London) những năm 30 thế kỉ trước. Để tiết kiệm giấy nên Times New Roman khá hẹp, khoảng cách giữa các chữ sít nên dễ gây rối và mỏi mắt với đoạn văn bản dài. Cả hai font này đều không nên dùng.

Bây giờ, công nghệ đã cho phép tải font từ máy chủ, các trang web có thể hiển thị đúng font theo thiết kế mà không phụ thuộc vào font cài trên máy người dùng. Điều này đã giải phóng cho các trang web việc phụ thuộc quá nhiều vào system font. Nếu bạn quan tâm tới tính thẩm mỹ của chữ nghĩa, tới tính dễ đọc của trang web, nếu bạn không muốn trang web của mình lọt thỏm giữa một rừng các trang Arial, Times New Roman nhan nhản trên internet bây giờ thì có rất nhiều font tốt để cho bạn lựa chọn: Myriad như Apple, Lucida Grande như Facebook, Frutiger như ở sân bay Charles de Gaulle, Pháp; rồi Franklin Gothic, Gill Sans,… hay thậm chí nhiều trang web đã thiết kế font chữ riêng cho mình để đảm bảo phong cách và tính độc đáo.

Công nghệ có sẵn, font có nhiều, nếu vẫn sử dụng Arial và Times New Roman thì đó là một sự lựa chọn lười biếng và cẩu thả.

[IMG]

Khoảng trắng
Ngày xưa, khi vào Google, nhìn nguyên trang web hầu như chỉ có mỗi logo và ô tìm kiếm, còn lại là cả một khoảng trắng mênh mông, tôi nghĩ “sao phí không gian thế”. Nhưng càng ngày, tôi càng thấy đó là một trong những thiết kế xuất sắc nhất trên thế giới. Thiết kế đó khiến cho người dùng không thể phân tán sự chú ý sang bất kì việc gì khác, ngoài việc sử dụng dịch vụ của Google. Google đã áp dụng rất tốt câu: “Khoảng trắng không phải phí, khoảng trắng là để tăng tập trung vào nội dung”.

Nhưng rất tiếc, tư tưởng “phí” vẫn đang thống trị đầu óc các nhà thiết kế web Việt Nam hiện nay. Các website thi nhau nhét tranh ảnh, quảng cáo, bài vở kín mít tất cả các chỗ trống trên trang web, giống hệt đường Hà Nội lúc tan tầm, chật chội, ngột ngạt và chẳng chú tâm được vào cái gì. Khoa học đã chứng minh 98% con người trên thế giới này là “đơn nhiệm”, tức là chỉ làm tốt khi làm một lúc một việc. Nhét càng nhiều nội dung vào một chỗ chỉ càng làm người đọc chẳng tập trung được vào chỗ nào.

Họ sẽ lại nói “cần phải có nhiều quảng cáo để lấy thu nhập cho trang web”. Câu trả lời là website của họ không thể quảng cáo nhiều bằng Google, mà Google vẫn đủ không gian cho khoảng trắng. Như vậy vấn đề nằm ở trình độ và tư tưởng thiết kế chứ không phải ở “quảng cáo”.

[IMG]

Trong khi các trang web lớn trên thế giới như Yahoo, càng ngày càng tăng khoảng trắng trên trang chủ, thì các trang web của Việt Nam mỗi ngày lại nhồi thêm lắm thứ vào trong một nơi. Người ta có câu: Nội dung là trên hết (Content is King). Nếu muốn người đọc tập trung vào nội dung của website thì các nhà thiết kế web nên Tối đa hóa khoảng trắng. Hãy nhớ: Khoảng trắng là để tăng tập trung vào nội dung.

Typography
Nếu không phải là một website multimedia, thì phần chiếm nhiều không gian nhất của trang web chính là văn bản. Để làm ra một trang web tốt, người thiết kế sẽ phải để nhiều tâm trí vào việc trình bày văn bản. Từ việc chọn font đẹp, dễ đọc, phù hợp với phong cách thiết kế tổng thể, nổi bật lên nội dung, cho đến phối hợp chữ với hình ảnh, hài hòa với bố cục, màu sắc, thân thiện với người dùng.

Những điều đó là đối tượng nghiên cứu của một bộ môn có tên là Typography. Typography cung cấp các qui luật về thẩm mỹ, các qui tắc trình bày văn bản thân thiện với người đọc, và rất nhiều vấn đề thú vị khác về khoa học và nghệ thuật về chữ. Với tình trạng thẩm mỹ các trang web như hiện nay, các nhà thiết kế web Việt Nam rất nên đi học Typography.

MÊ KIM DUNG
Nguồn: Tạp chí lập trình

Người đăng: Unknown

vào lúc 03:10

in codeweb, layout

0 nhận xét

Khi bắt tay vào thiết kế web, bạn đi từ công đoạn A sang B như thế nào? Jason Cianfrone sẽ khái quát các bước tiếp cận tìm ý tưởng của riêng anh khi tiến hành thiết kế website. Chúng ta hãy cùng tìm hiểu là các đó là gì nhé.

Khi bạn dành được công việc đó, bạn sẽ đi gặp khách hàng và ghi chép lại nhiều nhất có thể những yêu cầu của họ. Và tiếp theo sẽ làm gì? Mặc dù các designer web có các bước thiết kế website riêng của mỗi người, nhưng tôi nghĩ mình nên chia sẻ phương pháp tiếp cận riêng của tôi với các bạn. Các bước này không phải là một danh sách liệt kê những gì bạn phải làm khi thiết kế, mà đơn giản chỉ là những phương pháp mà tôi thích. Nó giúp tôi rèn luyện về cảm hứng và đánh giá công việc.

Bước 1. Đánh giá, học hỏi, hiểu

Hãy xem xét các mục tiêu của thiết kế và nghĩ xem làm thế nào để bản thiết kế đạt được những mục tiêu đó.

Trước khi bạn vội vàng ngồi ngay lên máy để thiết kế, sử dụng các phần mềm xây dựng code ưa thích của mình, bạn hãy để đầu óc của mình suy nghĩ theo đúng hướng. “Đúng hướng” theo tôi đó là suy nghĩ ngắn gọn và xem thông điệp của bản thiết kế là gì để hoàn thành các mục tiêu của bạn.

Với những ghi chép trong tay, tôi sẽ nhớ hình dung lại khi gặp khách hàng, tìm kiếm những ý chính và mục tiêu của thiết kế, và nghĩ xem làm thế nào để bản thiết kế đạt được những mục tiêu đó. Cá nhân tôi đã nhận thấy rằng công đoạn này đạt hiệu quả nhất là khi tránh xa màn hình vi tính.

Đưa ra tất cả các giải pháp có thể

Tôi đọc qua những ghi chép của mình và đánh giá những khó khăn, vạch ra những giải pháp có thể cho các mục tiêu đã đề ra. Ví dụ, nếu khách hàng yêu cầu website với cảm giác “bình yên” hoặc “thư giản”, vậy là cần phải tiến hành với màu sắc, thể loại, hình ảnh, bố cục và khoảng trắng. Nếu đối tượng mục tiêu chủ yếu của khách hàng không am hiểu về công nghệ hoặc máy tính, vậy thì chính kinh nghiệm của người dùng, chức năng và những lời kêu gọi hành động lại là những yếu tố tác động đến bản thiết kế. Tôi luôn cố gắng dành nhiều thời gian cần thiết cho công đoạn này và đánh giá càng nhiều càng tốt. Khi tôi cảm thấy hài lòng, tôi sẽ chuyển sang công đoạn tiếp theo.

Bước 2. Thiết kế Wireframe

Thiết kế Wireframe có thể được tiến hành trên máy hoặc vẽ bằng tay trên giấy.

Công đoạn tiếp theo chính là thiết kế Wireframe

Tôi thích vẽ bằng tay trên giấy bởi tôi có thể ghi chép lại những lưu ý về wireframe để sau có thể xem lại. Mặc dù vậy, đôi khi bạn sẽ cần bàn bạc với khách hàng về các wireframe trước khi tiến hành thiết kế, khi đó wireframe nên làm trên máy tính.

Các công cụ thiết kế wireframe

Tôi thường dùng Adobe Illustrator hoặc bất cứ chương trình chỉnh sửa đồ họa nào. Ngoài ra còn có một số công cụ khác như Balsamiq Mockups hoặc Mock Flow app.

Điều quan trọng bạn cần lưu ý đó là các wireframe không chỉ được vẽ cho các phiên bản trình duyệt của website. Hãy nghĩ đến liên kết chéo thiết bị trong toàn quá trình và hãy xem các yếu tố trên trang sẽ hoạt động như thế nào qua tất cả các thiết bị.

Bước 3. Tìm cảm hứng

Tìm kiếm cảm hứng ngoài màn hình vi tính.

Những ý kiến đánh giá sẽ giúp tôi hiểu rõ hơn về bản thiết kế để tiếp cận với các wireframe. Nhưng trước khi bắt tay vào thiết kế, tôi thích tìm cảm hứng từ rất nhiều nguồn.

Tôi sẽ bắt đầu với việc quan sát các website khác cũng có các mục tiêu tương tự như những gì tôi đã vạch ra. Nếu những gì các bạn thích, tôi không chỉ copy lại mà còn nghĩ cách làm sao để nó có thể được thiết kế tuyệt hơn. Tôi cũng hỏi xem khán giả nguồn của website sẽ phản ứng như thế nào với thiết kế đó?

Thiết kế phù hợp

Các designer thường có cảm hứng với việc tạo ra các tính năng hoặc yếu tố riêng trong bản thiết kế của mình, đơn giản chỉ vì họ thích chúng. Tuy nhiên, bạn đừng nên suy nghĩ về các xu hướng thiết kế hay cố tạo ra cái gì đó mà những designer khác sẽ thích. Mà nó phải có liên quan đến dự án của bạn.

Ý kiến của khách hàng cũng có thể tạo nên các cảm hứng. Ví dụ, nếu tôi đang thiết kế website cho một cửa hàng trang sức, thay vì cứ lên Google và gõ tìm “các website trang sức thiết kế đẹp nhất”, tôi sẽ tìm đến một cửa hàng trang sức nào đó, quan sát thiết kế nội thất cửa hàng và suy nghĩ về cảm giác của mình khi đi vào hoặc cách bày bán sản phẩm của cửa hàng.

Mang theo máy ảnh

Nguồn cảm hứng thường đến từ những nơi không được chờ đợi nhất. Tôi thường tìm thấy cảm hứng khi rời khỏi màn hình máy tính của mình. Thiết kế trong một thế giới thực thường đóng một vai trò vô cùng to lớn; kiến trúc, nghệ thuật, thiết kế sản phẩm, nhiếp ảnh. Ngoài ra, những hình khối, hình dạng, và màu sắc của thiên nhiên luôn cho ta những cảm hứng tuyệt vời. Và chiếc máy ảnh luôn giúp tôi ghi lại nguồn cảm hứng này.

Bước 4. Thiết kế và xây dựng

Nghỉ ngơi là một điều vô cùng cần thiết

Đến lúc này, tôi đã cảm thấy như mình đã biết rõ những gì cho bản thiết kế. Tôi đang tràn ngập cảm hứng và không thể chờ đợi thêm nữa. Tôi thích thiết kế trong âm nhạc; âm nhạc giúp tôi không bị mất tập trung bởi những tác động bên ngoài và thật chú tâm trong thế giới riêng của mình. Tôi để tất cả các ghi chép và wireframe bên cạnh và liên tục xem lại chúng.

Giải lao

Ngoài ra, tôi thường giải lao trong khi thiết kế và thấy rất hữu ích. Cứ chăm chăm vào cái gì đó liên tục trong suốt 8 tiếng đồng hồ sẽ chỉ khiến chúng ta suy nghĩ cứng nhắc theo một hướng mà thôi. Hãy thư giãn và nghĩ về thiết kế khi không ngồi trước màn hình vi tính, điều đó sẽ có thể giúp bạn có những sáng tạo mới. Quan trọng nhất, tôi không bao giờ quên việc mình đang thiết kế cho ai; Nghề của tôi chính là thể hiện theo cách sáng tạo những điều họ cần.

Dịch theo creativebloq.com | Ban Biên Tập RGB.vn

Người đăng: Unknown

vào lúc 18:46

in codeweb

0 nhận xét

An HTML table is an element comprised of table rows and columns, much like you'd see when working with an application such as Excel. Tables are container elements, and their sole purpose is to house other HTML elements and arrange them in a tabular fashion -- row by row, column by column.

Advertise on Tizag.com

Tables may seem difficult at first, but after working through this lesson, you'll see that they aren't so horrible. A table element consists of three different HTML tags including the <table> tag, <tr> (table rows), and the <td> (table columns) tags.

HTML Table Code:

<table border="1">
  <tr>
    <td>Row 1 Cell 1</td>
    <td>Row 1 Cell 2</td>
  </tr>
  <tr>
    <td>Row 2 Cell 1</td>
    <td>Row 2 Cell 2</td>
  </tr>
</table>

Basic HTML Table Layout:

Row 1 Cell 1	Row 1 Cell 2
Row 2 Cell 1	Row 2 Cell 2

We've adjusted the formatting of the code by adding additional spaces before some of the table elements, but this has no bearing on the rendering of the element. It simply helps keep track of each tag/element and helps us ensure we don't miss an opening or closing tag which would prevent our table element from rendering correctly. We've also added a border attribute to ensure the table cells/rows are more visible to our readers.

Content elements like HTML lists, images, and even other table elements can be placed inside each table cell. Doing so aligns the elements in a tabular fashion and provides structure.

HTML Table Code:

<table border="1">
  <tr>
    <td width="50%">
      <ul>
        <li>List Item 1</li>
        <li>List Item 2</li>
        <li>List Item 3</li>
      </ul>
    </td>
    <td>
      <ul>
        <li>List Item 4</li>
        <li>List Item 5</li>
        <li>List Item 6</li>
      </ul>
    </td>
  </tr>
  <tr>
    <td>
      <p>Avoid losing floppy disks with important school...</p>
    </td>
    <td>
      <a href="http://www.espn.com" target="_blank" rel="nofollow">
        <img src="http://www.tizag.com/pics/htmlT/ahman.gif" class="linksESPN" />
      </a>
    </td>
  </tr>
</table>

HTML Table 2:

List Item 1 List Item 2 List Item 3	List Item 4 List Item 5 List Item 6
Avoid losing floppy disks with important school...

HTML tables allow the web designer to align page content in a tabular fashion while spanning elements horizontally across the web page, rather than stacking them up one on top of another.

html - table rows & table columns

A table can contain an infinite number of table rows. Each table row is essentially a table element itself, with an opening and closing tag (<tr> </tr>). Table columns are also considered child elements of HTML tables, and like table rows, an HTML table may contain an infinite number of table data cells (<td> <tr>).

Table rows and columns are container elements that house other HTML elements such as text links, images, and lists, as we've seen in previous examples. Below, we've applied a background color to the table example in order to help distinguish the different table elements.

HTML Table Code:

<table border="1">
  <tr title="You are looking at Row 1" bgcolor="silver">
    <td>Row 1 Cell 1</td>
    <td>Row 1 Cell 2</td>
  </tr>
  <tr title="You are looking at Row 2" bgcolor="aqua">
    <td>Row 2 Cell 1</td>
    <td>Row 2 Cell 2</td>
  </tr>
</table>

HTML Table Code Example:

Row 1 Cell 1	Row 1 Cell 2
Row 2 Cell 1	Row 2 Cell 2

html - tables: spanning multiple rows and cells

Use rowspan to span multiple rows merging together table rows and colspanto span across multiple columns.

HTML Table Rowspan Attribute:

<table border="1">
  <tr>
    <td><b>Column 1</b></td>
    <td><b>Column 2</b></td>
    <td><b>Column 3</b></td>
  </tr>
  <tr>
    <td rowspan="2">Row 1 Cell 1</td>
    <td>Row 1 Cell 2</td>
    <td>Row 1 Cell 3</td>
  </tr>
  <tr>
    <td>Row 2 Cell 2</td>
    <td>Row 2 Cell 3</td>
  </tr>
  <tr>
    <td colspan="3">Row 3 Cell 1</td>
  </tr>
</table>

HTML Colspan and Rowspan Attributes:

Column 1	Column 2	Column 3
Row 1 Cell 1	Row 1 Cell 2	Row 1 Cell 3
Row 1 Cell 1	Row 2 Cell 2	Row 2 Cell 3
Row 3 Cell 1

cell padding and spacing

With the cellpadding and cellspacing attributes, you will be able to adjust the spacing between table cells. Setting the cellpadding attribute determines how much space will exist between a table cell border and the elements contained within it, whereas cellspacing determines how much space will exist between each table cell. Color has been added to the table below to emphasize these attributes.

HTML Cellpadding/Cellspacing Code:

<table border="1" cellspacing="10" bgcolor="rgb(0,255,0)">
  <tr>
    <td><b>Column 1</b></td>
    <td><b>Column 2</b></td>
  </tr>
  <tr>
    <td>Row 1 Cell 1</td>
    <td>Row 1 Cell 2</td>
  </tr>
  <tr>
    <td>Row 2 Cell 1</td>
    <td>Row 2 Cell 2</td>
  </tr>
</table>

HTML Cellspacing and Padding:

Column 1	Column 2
Row 1 Cell 1	Row 1 Cell 2
Row 2 Cell 1	Row 2 Cell 2

And now we will change the cellpadding of the table and remove thecellspacing from the previous example. This should clearly demonstrate the difference between cellpadding and cellspacing.

HTML Code:

<table border="1" cellpadding="10" bgcolor="rgb(0,255,0)">
  <tr>
    <td><b>Column 1</b></td>
    <td><b>Column 2</b></td>
  </tr>
  <tr>
    <td>Row 1 Cell 1</td>
    <td>Row 1 Cell 2</td>
  </tr>
  <tr>
    <td>Row 2 Cell 1</td>
    <td>Row 2 Cell 2</td>
  </tr>
</table>

HTML Cell Pads:

Column 1	Column 2
Row 1 Cell 1	Row 1 Cell 2
Row 2 Cell 1	Row 2 Cell 2

The value you specify for padding and spacing is interpreted by the browser as a pixel value. So a value of 10 is simply 10 pixels wide. Most HTML attributes that use numeric values for their measurements represent a pixel value.

Người đăng: Unknown

vào lúc 18:40

in codeweb

0 nhận xét

Các ký tự đặc biệt

Có một vài ký tự đặc biệt trong HTML. Ví dụ như bạn không thể hiện được dấu lớn hơn hoặc nhỏ hơn trong các đoạn văn bởi vì trình duyệt có thể hiểu nhầm chúng là ký tự của các thẻ.

Nếu bạn muốn trình duyệt hiển thị được những ký tự này, chúng ta phải chèn những code đặc biệt vào trong tài liệu thiết kế web.

Code của ký tự đặc biệt dạng như sau : &tên code hoặc &#mã ký tự

Ví dụ : Hiển thị một dấu nhỏ hơn chúng ta viết : &lt hoặc &#60

Sự thuận lợi của tên code là nó dễ nhớ hơn mã ký tự. Tuy nhiên nhiều trình duyệt vẫn chữa hỗ trợ đầy đủ tên code (trong khi trình duyệt hỗ trợ rất tốt cho mã ký tự)

Khoảng trắng(Non-breaking Space)

Ký tự đặc biệt được sử dụng nhiều nhất khi thiết kế web là khoảng trắng.

Thông thường thì HTML sẽ lượt bỏ các khoảng trắng trong đoạn văn. Nếu bạn có 10 khoảng trắng liên tiếp thì 9 cái sẽ bi lượt bỏ. Để thêm nhiều khoảng trắng liên tiếp chúng ta sử dụng :  

Ví dụ :

Bạn có thể xem một số ví dụ về các ký tự đặc biệt ở đây : Try it yourself

Các ký tự đặc biệt thường sử dụng khi thiết kế web

Chú ý : tên code thì phân biệt chữ hoa và thường là khác nhau!

Ký tự	Diễn tả	Tên code	Mã ký tự
	Khoảng trắng
<	Nhỏ hơn	<	<
>	Lớn hơn	>	>
&	Dấu và	&	&
¢	Cent	¢	¢
£	Pound	£	£
¥	Yen	¥	¥
€	Euro	€	€
§	Section	§	§
©	copyright	©	©
®	registered trademark	®	®

Bạn có thể xem toàn bộ các ký tự đặc biệt tại HTML Entities Reference.

Thiết kế website Hội An

Quảng cáo

Chúng tôi là ai ?

Hướng dẫn tạo email với tên miền riêng hoàn toàn miễn phí với Outlook

Các nhà thiết kế web nên học typography

4 bước để thiết kế một website hoàn hảo

html - tables

HTML Table Code:

Basic HTML Table Layout:

HTML Table Code:

HTML Table 2:

html - table rows & table columns

HTML Table Code:

HTML Table Code Example:

html - tables: spanning multiple rows and cells

HTML Table Rowspan Attribute:

HTML Colspan and Rowspan Attributes:

cell padding and spacing

HTML Cellpadding/Cellspacing Code:

HTML Cellspacing and Padding:

HTML Code:

HTML Cell Pads:

Các ký tự đặc biệt trong thiết kế web

Các ký tự đặc biệt

Khoảng trắng(Non-breaking Space)

Ví dụ :

Các ký tự đặc biệt thường sử dụng khi thiết kế web

facebook

Quảng cáo

Labels

Popular Posts

Trang

Giới thiệu về tôi

Lưu trữ Blog

About

Link List

Nhận xét

Contact Details