Khảo sát thị trường và xác định thị phần cho website

Các doanh nghiệp Việt Nam thường chỉ chú ý nhiều đến quảng cáo mà ít chú ý đến việc khảo sát, nghiên cứu thị trường và xác định thị phần cho web.
Xem thêm.
>>Mẫu thiết kế website khách sạn đẹp
>>Mẫu thiết kế website du lịch đẹp
>>Công ty thiết kế website

Cũng phải thừa nhận rằng một chiến dịch quảng cáo chất lượng sẽ mang lại doanh thu tương xứng cho doanh nghiệp nhưng thường thì chi phí cho các chiến dịch quảng cáo này là khá lớn vì thế không phải bất cứ doanh nghiệp nào cũng có đủ khả năng thực hiện.

Quảng cáo không quan tâm nhiều đến nhu cầu thị trường mà chỉ làm sao đưa thông tin (một chiều) đến nhiều người nhất vì thế nó rất công phu và tốn kém.

Thực hiện khảo sát là phương pháp quen thuộc để nghiên cứu thị trường. Các kết quả khảo sát sẽ là cơ sở để doanh nghiệp xây dựng chiến lược và chiến thuật tiếp thị cho website của mình. Bạn phải cân nhắc xem đối tượng người đọc mà bạn hướng tới là ai và trên mạng có đối tượng người đọc đó không. Biết được cung và cầu của thị trường cho bạn nhiều thông tin quan trọng để bạn phát triển trang web của mình.

Những câu hỏi sau sẽ giúp bạn khảo sát thị trường hiệu quả

• Bạn định thiết kế web về chủ đề gì?
• Những trang web nào trên mạng đang có cùng chủ đề với bạn?
• Họ có thành công không?
• Thị phần của họ có lớn không?
• Chủ đề bạn sẽ viết về nó có nhiều người khai thác chưa?
• Tiềm năng thành công của chủ đề đó có cao không?
• Chủ đề bạn sắp làm có đang phát triển tốt không?
• Người đọc sẽ mong chờ gì ở trang web mới của bạn?
• Trang web của bạn có những điểm mạnh gì?
• Người đọc có quan tâm đến những gì bạn viết không?
• Thế mạnh cạnh tranh của bạn với họ là gì?

Tôi chắc rằng bạn có thể nghĩ ra nhiều câu hỏi khác hơn thế nữa khi tìm hiểu những trang web đang tồn tại viết về chủ đề bạn sắp viết. Trong luc này họ là những đối thủ trực tiếp của bạn. Do vậy bạn hãy tìm hiểu thật kỹ về họ, về những gì họ đang làm, cách họ làm có gì hay có gì chưa đúng. Chỉ bằng cách quan sát không thôi, bạn cũng sẽ rút ra được rất nhiều kinh nghiệm cho trang web của mình.

Bài "Khảo sát thị trường và xác định thị phần cho website"
Theo Công ty thiết kế web ADC Việt Nam

Lập mục tiêu hành động cho website

Khi đã tạo cho mình một kim chỉ nam và xác định nơi đến. Giờ sẽ là lúc bạn lập ra những mục tiêu hành động. Khi lập trang web, tất nhiên mục tiêu của bạn sẽ là đưa trang web của mình thành trang web hàng đầu của Việt nam về lĩnh vực bạn làm. Ví dụ bạn muốn phát triển một trang web về chia sẻ nhạc trực tuyến và bạn muốn mọi người khi nghĩ đến download nhạc là nghĩ đến trang web của bạn. Mục tiếu đó bạn đặt ra hoàn toàn có thể thực hiện được, nhưng nó là chuyền về lâu về dài. Bạn có thể chia nhỏ giai đoạn đó ra thành các phần nhỏ với các mục tiêu ngăn hơn.

Ví dụ bạn sẽ cố gắng trong tháng đầu sẽ upload hết 15 Gb nhạc đang nằm trong ổ cứng của bạn. Sau đó tháng tiếp theo sẽ cố gắng thêm phần lời bài hát cho từng bài. Cuối năm sẽ có một kho nhạc tương đối lớn và đều có lời bài hát. Như vậy bạn sẽ dễ dàng đạt mục tiêu hơn, hôm nay upload vài trăm Mb, ngày mai upload thêm vài chục Mb và viết vài chục lời bài hát.

Cứ chia nhỏ dần ra và cuối cùng mục tiêu ngăn hạn đó sẽ đạt được. Khi một loạt các mục tiêu ngăn hạn đạt được thì mục tiêu ban đầu của bạn cũng sẽ đạt được. Nó cũng như người ta xây dựng một toà nhà vậy. Họ có bản phác thảo ngôi nhà sẽ được xây dựng, và khi tiến hành họ sẽ xây phần móng, đặt từng viên gạch, đổ mái, trang trí và khi hoàn thiện sẽ giống như bức tranh ban đầu.

Công thức SMART khi xây dựng mục tiêu hành động

Làm thế nào để xác định được mục tiêu chính xác? Trong kinh doanh hiện đại, người ta thường đề cập đến nguyên tắc SMART, tức là mục tiêu được xây dựng dựa trên những tiêu chí sau:

• S-Specific: Cụ thể, rõ ràng và dễ hiểu;
• M-Measurable: Đo đếm được;
• A-Achievable: Có thể đạt được bằng chính khả năng của mình;
• R-Realistic: Thực tế, không viển vông;
• Time bound: Thời hạn để đạt được mục tiêu đã vạch ra.

Trong đó, tiêu chí “đo đếm được” gắn với những con số cụ thể. Ví dụ, mục tiêu của tôi muốn thiết kế một web về du lịch, vậy thiết kế website du lịch như thế nào? nghĩa là cần phải có con số cụ thể để đo đếm được. Ví dụ một tỉ hay mười tỉ... Hơn thế nữa, chữ “M” còn mang tính động viên (Motivation), điều này sẽ luôn thôi thúc, tạo ra niềm mong muốn cháy bỏng để tập trung mọi hoạt động nhằm hướng tới mục tiêu nỗ lực phấn đấu để đạt được.

Cũng đối khi người ta nhầm lẫn giữa chữ “A” và chữ “R”. Tuy nhiên, điều “có thể thực hiện được” không đồng nhất với “thực tế”. Một người được mời về làm giám đốc tài chính ngân hàng thương mại cổ phần, bằng cấp chuyên môn và kinh nghiệm điều hành đều siêu hạng (A) mà không có “Chân” trong hội đồng quản trị (R) thì không thể có cơ hội trở thành tổng giám đốc của ngân hàng đó được. Từ ví dụ này có thể hiểu, nếu có đầy đủ điều kiện thuộc tiêu chí A mà thiếu đi tiêu chí R thì không thể đạt được mục tiêu. Điều này còn đúng hơn trong đời sống chính trị.

Bước tiếp theo sau khi xác định được Mục tiêu SMART là hãy viết mục tiêu đó ra giấy, đặt trên bàn làm việc hay bất cứ chỗ nào mà bạn có thể nhìn thấy hàng ngày. Cách này giúp bạn luôn nghĩ đến nó và thúc đẩy bạn hành động hướng tới mục tiêu đề ra.

Mục tiêu phải cụ thể

Vẫn với ví dụ về trang web nhạc trong phần trên, nếu mục tiêu của bạn sẽ là đưa trang web trở nên rất thành công và nổi tiếng. Tuy nó là một mục tiêu tốt nhưng không cụ thể. Mục tiêu hành động nên cụ thể và rõ ràng. Nếu thay vì chỉ có mục tiêu sẽ thành công và nổi tiếng, để cụ thể hơn bạn có thể xây dựng mục tiêu là trang web của tôi trong vòng 2 năm sẽ được nhiều trang web trong nước nhắc đến và đặt đường link liên kết.

Mục tiêu phải đo đạc được

Quay trở lại ví dụ trang web nhạc ở trên, nếu mục tiêu của bạn là trong một năm, trang web của tôi phải là trang web nổi tiếng nhất cộng đồng mạng. Đó không phải là mục tiêu không thể thực hiện, nhưng để đo đạc được sự thành công đó là rất khó. Bạn có thể lập mục tiêu có thể đo đạc được như là cuối năm rank Alexa sẽ là 50.000 hoặc Google PageRank của tôi sẽ là 5.

Mục tiêu phải có thể đạt được

Nếu mục tiêu của trang web nhạc kia lại là “cuối năm nay tôi sẽ có hơn chục ngàn bài hát và 50.000 thành viên”. Lẽ tất nhiên nếu đạt được thì đó là quá mỹ mãn, nhưng mục tiêu đó rất xa rời thực tế vì một trang web mới hình thành, khó có thể đạt được mục tiêu đó trong vòng một năm.

Mục tiêu phải phù hợp với thưc tại khách quan

Bạn phải tin tương vảo mục tiêu mình đặt ra là có thể thực hiện được và hoàn thành mục tiêu đó là một phần rất quan trọng trong những việc bạn làm. Nếu bạn còn phải đi học và còn nhiều việc khác để lo, mà mục tiêu phải upload 200 Mb nhạc mỗi ngày thì không phù hợp với hiện thực khách quan.

Luôn có thời hạn nhất định cho mỗi một mục tiêu

Nếu bạn chỉ nói “trang web của tôi sẽ phải thành công” thì rất mông lung và vô định. Khi nào thì trang web sẽ được cho là thành công? 1 năm? 2 năm? 5 năm hay 10 năm? cho dù là mục tiêu của bạn có thế nào đi chăng nữa, bạn cũng luôn phải đặt cho nó một thời gian cụ thể. Giống như bạn muốn làm xong bài về nhà mà bạn chỉ nói “tôi sẽ làm bài về nhà” thì có vẻ như không biết khi nào bạn sẽ làm. Nhưng nếu bạn nói “trước 11 giờ đêm nay là tôi sẽ làm xong bài về nhà”. Lúc này khi đến 11 giờ đêm, bạn tự nhiên có thể biết được mình đã đạt được mục tiêu mình đặt ra hay chưa.

Kết luận

Đôi khi vì nghĩ rằng việc tạo một trang web không cần phải mất quá nhiều thời gian để xây dựng nên mục tiêu hành động. Nhưng bạn cũng nên biết rằng, trong cuộc sống nếu muốn được thành công đều cần phải có một hoặc nhiều mục tiêu để phấn đấu. Nếu bạn thực sự muốn trang web của bạn sẽ thành công trong tương lai, việc xây dựng mục tiêu hành động là rất cần thiết.

Bạn nên viết mục tiêu hành động của mình vô giấy, dán lên màn hình máy tính, dán lên tường trong nhà vệ sinh, viết lên gương để mỗi sáng thức dậy là bạn lại thấy nó và tự nhắc mình phải có nghĩa vụ để hoàn thành mục tiêu đã đề ra. Nó sẽ đóng vài trò là một đồng hồ báo thức nhắc nhở bạn đã đến lúc làm gì đó để hoàn thành được mục tiêu.

>> Công thức hoàn hảo để tạo nên thương hiệu

Bài “Lập mục tiêu hành động cho website”
Demon Warlock

Mục tiêu và tôn chỉ hoạt động của website

Mục tiêu và tôn chỉ hoạt động của một website rất quan trọng và có ảnh hưởng rất lớn đến sự phát triển của trang web. Nó phải đóng vai trò làm kim chỉ nam cho mọi hoạt động. Mỗi khi bạn lạc mất phương hướng, tôn chỉ của trang web sẽ giúp bạn quay lại hướng bạn đang đi và lèo lái con tàu về đến đích đã đặt ra trước.

Tôn chỉ hoạt động bao gồm những mục tiêu có thể thực hiện được, nhóm khách hàng tiềm năng, sản phẩm và những kỳ vọng vào sự phát triển ở tương lai.

Ví dụ về những tôn chỉ hoạt động của những công ty nổi tiếng trên thế giới

- Wal-Mart (tập đoàn bán lẻ lớn nhất nước Mỹ): cho người dân thường có cơ hội được mua hàng như những người giàu

- Walt Disney: Mang niềm vui cho mọi người

- Coca Cola: Tạo ra giá trị và tạo nên sự khác biệt ở bất cứ nơi nào có chúng ta

- McDonald: Chúng ta sẽ là nhà hàng phục vụ nhanh nhất thế giới, cung cấp cho khách hàng bữa ăn tuyệt hảo, dịch vụ tốt, sạch sẽ và có giá trị. Do đó chúng ta có thể làm mỗi một khách hàng phải hải lòng.

- Southwest Airline: hơn 40 năm qua kể từ khi thành lập, công ty này vẫn luôn trung thành với một tôn chỉ: “Chất lượng phục vụ tốt nhất thể hiện qua cung cách nồng nhiệt, thân thiện, niềm tự hào của mỗi nhân viên về công ty và về việc được phục vụ khách hàng. Và để đạt được sứ mệnh này, công ty xem nhân viên là sức mạnh lớn nhất và lợi thế cạnh tranh bền vững nhất về dài hạn”. Tôn chỉ hoạt động của Southwest Airlines hoàn toàn không mới, nhưng hầu như không công ty vận tải hàng không nào tại Mỹ có thể thực hiện điều này một cách nhất quán, liên tục và đầy quyết tâm như Southwest Airlines suốt hơn bốn thập niên qua. Và họ đã thành công không phải bằng việc đưa ra các tôn chỉ thật hay ho, mà là trung thành và bền bỉ thực hiện đến cùng các tôn chỉ đó.

Do vậy bạn có thể tạo ra một tôn chỉ hoạt động cho mình và nhớ rằng nó phải rõ ràng, có mục tiêu thực hiện được và kỳ vọng phát triển

Tôn chỉ hoạt động của ADC Việt Nam là:

Với Kim chỉ nam hành động là "Hợp tác để vượt qua mọi rào cản và thách thức", ADC Việt Nam mong muốn được hợp tác, cùng phát triển với các Bạn !

Với tôn chỉ hoạt động đã rõ ràng, sau này nếu bạn có bị sa lầy vào những bài viết quá cao xa hoặc bị áp lực của một nhóm người đọc phải mở rộng phạm vi của trang web … đến lúc bạn dường như đã lạc mất phương hướng, hãy đọc lại tôn chỉ của trang web và nó sẽ hướng bạn đi đung con đường đã vạch sắn. Có một nhà triết học từng nói “nếu anh không biết bến cảng nào là nơi đến, thì chẳng có ngọn gió nào là thổi đúng hướng anh đi”.

Bài "Mục tiêu và tôn chỉ hoạt động của website"

Nguồn ý tưởng thiết kế website

“Nguồn ý tưởng thiết kế website” một tiêu đề rất lạ phải không bạn. Nhưng mà lại rất cần thiết cho các bạn đã đang và sẽ là webdesigner & coder. Và là một webdesigner & coder, đôi lúc bạn sẽ phải đối mặt với một căn bệnh cực kì khó chịu “Cạn ý tưởng” hoặc “Ý tưởng chưa về”.

• Những lúc đó bạn phải làm gì?
  
• Cứ ngồi đó và đợi nó hết ư?

Trong quá trình thiết kế website chắc chắn bạn rất khó khăn trong việc tìm các nguồn vector, icon, brush, hình của người mẫu, thiên nhiên….Hay thậm chí là các bài giảng, chia sẽ kinh nghiệm từ các người đi trước. Trong bài viết “Nguồn ý tưởng thiết kế website” mình sẽ giới thiệu với các bạn về các nguồn mà mình đã và đang dùng trong thiết kế và lập trình.

Trong bài này mình sẽ giới thiệu về những nơi mà bạn có thể học hỏi kinh nghiệm cùng chiêm ngưỡng và thả mình cùng óc sáng tạo của các webdesigner trên toàn thế giới.

Nguồn vector, icon, brush, font trong thiết kế web

Thư viện Font miễn phí – www.dafont.com

Dafont hiện đang có 12,486 font với nhiều thể loại khác nhau như viết tay (Grafitti, viết ẩu…), nét thường, font theo ngày lễ (hallowen, valentine) và còn nhiều thể loại khác nữa. Các font trên dafont hầu hết đều cho bạn tải miễn phí, nếu như có khả năng thì nên donate cho font của họ. Tuy nhiên bạn cũng phải xem các qui định về chia sẽ trong tập tin Readme.txt kèm theo tập tin nén khi download về.

UTM font cho người Việt – Font chữ đẹp UTM

http://fontchudeputm.blogspot.com/ - Đây là trang portfolio của anh Michael Đinh Trung Kiên, hiện đang là Graphic designer, bắt đầu thiết kế font từ năm 2003 với font VNI-Ong Do là tác phẩm đầu tay. UTM là là viết tắt của Unicode Thiên Minh, bộ font có rất nhiều thể loại (viết tay, nét đậm, trang trí, chúc mừng năm mới), và mang đậm phong cách phương Tây lẫn phương Đông. Và hai font mà mình thực sự thích trong bộ font UTM đó là UTM Neo Sans Intel và UTM Avo, vừa mang phong cách Tây, vừa gõ được tiếng Việt. Là một webdesigner thì chắc chắn rằng UTM là một bộ font mà bạn cần phải có.

Free Icon – www.iconfinder.com

Với 155,756 icon được đăng tải và 810 icon sets được tạo ra, và tất cả đều được tải miễn phí. Wow!!! Thật tuyệt vời phải không các bạn. Đây là nơi mà mình tìm kiếm và download icon miễn phí cho các thiết kế của mình. Chỉ việc gõ từ khóa mà bạn muốn kiếm như heart, arrow, icon, facebook chẵng hạn, tất cả đều có.

Free Vectors – www.vecteezy.com

Được thành lập vào năm 2007 bởi anh chàng Shawn, nó nhanh cóng trở thành một website chia sẽ vector miễn phí lớn. Với khẩu hiệu “Stupid Name. Cool Vector Art!”, Vecteezy tập hợp nhiều mẫu vector từ các nhà thiết kế trên thế giới tạo thành một nguồn lớn cho bạn lựa chọn. Các vector đều được tải và sử dụng miễn phí cho các dự án đồ họa và thiết kế của bạn. Tuy nhiên, khi tải về bạn phải đồng ý với những quy định do nhà thiết kế đề ra khi tải về sử dụng.

Free PSD Brushes – www.brusheezy.com

Đây cũng là một sản phẩm nữa của anh chàng Shawn, hiện nay thì có thêm 2 người nữa cùng phát triển Jonathan và Erin. Mỗi tháng có hơn 1,2 triệu lượt download, và đang có hơn một ngàn thành viên cùng hoạt động chia sẽ trên brusheezy. Ngoài các brush mẫu thì website này còn cung cấp cả các patern, action, file psd,v.v… Chắc chắn rằng đây là nguồn mà bạn không thể bỏ qua được trong quá trình thiết kế.

Hình ảnh miễn phí – www.sxc.hu

SXC đã được đưa ra vào tháng 2/2001 như một sự thay thế cho các nhà thiết kế không thể mua được các ảnh với chất lượng cao và đắt tiền ở các website khác. Ý tưởng là tạo ra một trang web nơi mà những người sáng tạo có thể trao đổi hình ảnh của họ để tìm cảm hứng làm việc. Trang web đã phát triển thành cộng đồng lớn với hơn 2.5 triệu thành viên và khoảng 400.000 hình ảnh trực tuyến từ 30.000 nhíp ảnh trên toàn thế giới được đăng tải với nhiều thể loại khác nhau (thiên nhiên, chất liệu, kiến trúc, …..) bạn chỉ vào và gõ từ khóa mình cần tìm, tiếng Anh thôi nhá.

Bộ sưu tập màu sắc - Kuler Color

Với chủ đề “Explore, create and share color themes” tạm dịch là “Khám phá, sáng tạo và chia sẽ màu sắc”. Kuler là một sản phẩm của ông trùm đồ họa Adobe. Với mục đích là tạo ra những bộ sưu tập màu sắc, giúp cho bạn nhanh chóng trong việc lựa chọn màu sắc cho thiết kế của mình. Với hàng ngàn bộ sưu tập được tạo ra, thì đây chắc hẵn sẽ là website mà bạn không thể bỏ qua được.

PSD Tutorials Plus - www.psd.tutsplus.com

PSD+ thuộc hệ thống của Envato, với một đội ngũ năng động, sáng tạo, và giàu trí tưởng tượng từ khắp các nơi trên thế giới. Họ cung cấp các bài viết chia sẽ kinh nghiệm, video tutorial về photoshop từ căn bản tới nâng cao. Với cách làm việc đầy kinh ngiệm và thâm thiện chắc chắn sẽ cung cấp cho bạn những bài hướng dẫn đầy chất lượng.

Nguồn ý tưởng thiết kế web trong thiết kế và lập trình

Tư liệu về thiết kế web – www.webdesign.tutsplus.com

Webdesign+ cũng thuộc hệ thống Envato, nhưng khác với PSD+. Họ chỉ cung cấp các tư liệu về thiết kế web, cũng với một đội ngũ sáng tạo, và đầy đặng kinh nghiệm về WordPress, webdesign, html/css. Cũng với kiến thức từ căn bản tới nâng cao, các công nghệ hiện đại như HTML5 và CSS3, và còn có nhiều những tip rất hay khác đang đợi bạn khám phá.

Ý tưởng thiết kế - www.awwwards.com

Awwwards là một website được thành lập nhầm công nhận những tài năng trong làng Webdesign. Họ có một ban giám khảo là những nhà thiết kế, những bloger tài năng trên thế giới. Với thang điểm 10 bao gồm 50% Design, 25% Creativity, 10%Content và 15% Usability. Mình chắc rằng, khi bạn bí ý tưởng, vào đây dạo một vòng, trở ra hít thở thật sâu, thế là lại có ý tưởng.

Nếu bạn có một thiết kế và tự tin bạn cũng có thể dự thi với 21.6$. Nếu thắng giải thì bạn sẽ được 1 sticker nho nhỏ ở góc website, trông rất là ngầu. Hiện mình cũng đang cố gắng hoàn thiện một bản thiết kế để đem đi thi xem thế nào.

Thiết kế đa dạng - www.thebestdesigns.com

The Best Designs được thành lập vào năm 2001, và năm nay chính là sinh nhật tròn 10 tuổi của họ đó. The Best Designs có khoảng 4000 website được lưu trữ, với nhiều thế kế đa dạng, nhiều sắc màu, nhiều ý tưỡng rất lạ và bắt mắt đều tập trung ở đây. Mỗi năm họ có hàng ngàn thiết kế dự thi, nhưng chỉ một số ít trong đó được đăng lên web. Mình nghĩ rằng, đây là một website giúp bạn mở mang trí óc, vương cánh với năm châu.

Bộ sưu tập tuyệt vời truyền cảm hứng - www.creattica.com

Creattica là một bộ sưu tập tuyệt vời truyền cảm hứng cho bất kì nhà thiết kế nào. Mỗi ngày có hàng ngàn người truy cập. Bạn hãy tạo cho mình một tài khoãn (hoàn toàn miễn phí) và chia sẽ những thiết kế của mình. Hiện đang có 11406 mẫu thiết kế đủ mọi thể loại từ 3544 nhà thiết kế. Đây sẽ là bộ thư viện mà bạn không thể bỏ qua lúc đang gặp khó khăn trong việc thiết kế. Các tác phẩm từ nhiều người ở khắp nơi trên thế giới chắc chắn sẽ là nguồn cảm hứng cho bạn.
Xem thêm.
>>Mẫu thiết kế website khách sạn đẹp
>>Mẫu thiết kế website du lịch đẹp

>>Công ty thiết kế website

Kết luận

Các bạn ạ, đôi lúc thoải mái mà ý tưởng vẫn chưa ra thì theo mình các bạn nên lướt qua những trang web trên. Nó sẽ giúp ích rất nhiều cho các bạn đấy. Rất nhiều nguồn ý tưởng để thiết kế web phải không các bạn. 

Bài “Nguồn ý tưởng thiết kế website”

Khái niệm và ứng dụng của Responsive Web Design

Sự phát triển nhanh chóng của các tablet pc và mạng 3G đặt ra một yêu cầu chính đáng cho những người thiết kế web: giao diện trang web phải thích nghi được trên từng loại thiết bị dù cho người đó dùng Iphone, iPad, netbook, BlackBerry, Kindle hay những chiếc điện thoại di động có màn hình nhỏ. Và trong 5 năm tới sẽ còn rất nhiều thiết bị được đưa ra thị trường với vô vàng các ràng buộc mới và nhiều kích thước màn hình khác nhau, bài toán này sẽ làm những người thiết kế tiếp tục đau đầu trong thời gian sắp tới.
Xem thêm.
>>Mẫu thiết kế website khách sạn đẹp
>>Mẫu thiết kế website du lịch đẹp
>>Công ty thiết kế website

Phát triển nhiều phiên bảng khác nhau cho từng thiết bị?

Rõ ràng đó không phải là một lựa chọn tốt, bởi với vô vàn các thiết bị hiện tại đã khiến chúng ta phải mệt mỏi để hỗ trợ từng đấy thiết bị chưa tính đến những năm sau khi “thời của tablet” lên đến đỉnh điểm. Vậy bạn phải hy sinh một lượng người dùng trên một vài loại thiết bị nào đó hay có còn một lựa chọn nào khác?.

Thực vậy, hàng loạt đồ công nghệ khủng ồ ạt ra đời cộng với nhu cầu xài Web trên di động của bọn người dùng ngày càng gia tăng, đồng nghĩa chúng ta phải tính chuyện Web mình làm hiện thế nào trên các kích thước màn hình khác nhau? Nếu bây giờ đang là năm 2008 – năm người ta hay nhắc tới chủ nghĩa tôn thờ fixed width layout , có lẽ đề cập tới chuyện này là thừa thãi. Nhưng giờ đã là lúc thích hợp nhất, dù có vẻ hơi muộn, để chúng ta nói về Responsive Web Design – RWD.

Responsive web design (tạm dịch thiết kế thích nghi) là một khái niệm khuyến cáo những người thiết kế và người phát triển phải đáp ứng và thích nghi được với môi trường (hay thiết bị) của người dùng về kích thước màn hình, platform, trạng thái xoay hay đứng.

Khái niệm về Responsive web design

Trong ngành thiết kế responsive architecture không phải là khái niệm xa lạ, bạn có bao giờ để ý đến những cánh cửa tự động đóng mở, nó sẽ tự động mở ra một khoản không gian vừa đủ cho một người hoặc nhóm người bước vào. Một hệ thống điều chỉnh điều hòa và ánh sáng tự động điều tiết nhiệt độ và ánh sáng tùy theo số lượng người đang có trong phòng…

Responsive web design không phải là ý tưởng hoàn toàn mới, nó kế thừa và tương tự như responsive architecture, trang web khi được thiết kế phải có khả năng tự động điều chỉnh để thích nghi với nhiều nhóm người sử dụng khác nhau.

Ứng dụng của Responsive Web Design

Hiển nhiên một điều chúng ta không thể dùng một cảm biến hoặc một chip thông minh như cách mà người ta làm khi xây dựng cửa tự động hay hệ thống nhà thông minh. Chúng ta phải nhìn nhận nó một cách khá trừu tượng. Hiện tại, một vài ý tượng đã được sử dụng: fluid layout, media queries và script có thể định dạng lại trang web và mark-up khá tốt.

Bạn cũng nên nhớ rằng responsive web design không chỉ là việc tùy chỉnh cho phù hợp với kích thước màn hình và resize lại hình ảnh, nó mở ra một cách nghĩ hoàn toàn mới về thiết kế. Chúng ta sẽ lượt qua những ý tưởng đã được sử dụng và những ý tưởng đang còn nằm trên bàn giấy.

Độ phân giải màn hình

Càng nhiều thiết bị, càng nhiều độ phân giải khác nhau, sự phổ biến của những thiết bị như iPhone, iPad và các smartphone có thể chuyển từ dạng xem ngang và đứng một cách nhanh chóng.

Thêm nữa khi thiết kế cho cả màn hình nằm ngang và màn hình đứng, chúng ta phải tính đến hàng trăm kích thước màn hình khác nhau. Ta có thể nhóm một số kích thước lại với nhau và thiết kế cho từng nhóm một, và thiết kế riêng cho từng nhóm này nếu cần thiết. Bên cạnh đó bạn cũng phải biết rằng khá nhiều người dùng không bao giờ maximize trình duyệt của mình.

Flexible layout

Một vài năm trước, khi flexible layout còn là thứ gì đó xa xỉ đối với website. Thứ duy nhất flexible trong thiết kế là số lượng cột và text. Ảnh có thể dễ dàng làm “vỡ” cấu trúc website. Việc thiết kế trên một khoảng kích thước tính bằng pixel khiến người thiết kế lúng túng khi trang web chuyển giữa các kích thước khung hình khác nhau.

Hình ảnh cần phải được tự động điều chỉnh và không được phép làm vỡ cấu trúc website, vì ta không làm một sản phẩm in ấn. Khi kích thước ảnh không bị fix ở một giá trị nào đó, nó mang lại nhiều lợi ích hơn mong đợi, ý tưởng tuyệt vời cho những những thiết bị có thể xoay ngang và đứng.

Trang web trên được thiết kế bằng cách sử dụng markup một cách thông minh, fluid grid, fluid image.

Filament Group’s Responsive Images

Kỹ thuật này được giới thiệu bới Filement Group, theo đó thay vì resize lại hình ảnh, sẽ load hẳn một ảnh khác khi cần, cách này có thể tiết kiệm được việc load ảnh lớn ko cần thiết với các thiết bị nhỏ.

1	<img src="smallRes.jpg" data-fullsrc="largeRes.jpg">

Media Queries

CSS 3 vẫn hổ trợ đầy đủ media type từ CSS2.1 như screen, print, handheld, và đã bổ sung khá nhiều khai báo mới như max-width, device-width, orientation, color. Mai mắn thay những thiết bị chạy android, ipad đều không sử dụng trình duyệt IE!!! nên bạn an tâm khi sử dụng những thuộc tính css 3.

1	<link rel="stylesheet" media="screen and (max-width: 600px)" type="text/css" href="shetland.css" />

Ẩn hoặc hiển thị nội dung

Rõ ràng việc chỉ hiển thị những nội dung thật sự cần thiết trên những thiết bị có kích thước nhỏ là cần thiết, kinh nghiệm cho thấy trên các thiết bị di động bạn chỉ nên có một thanh navigation đơn giản, nhấn mạnh nội dung, xem dạng list niều dòng tốt hơn là chia thành nhiều cột

Touchescreen vs Cursors

Màn hình cảm ứng ngày càng phổ biến. Những thiết bị có màn hình cảm ứng thường có kích thước nhỏ, rõ ràng bạn phải thấy được rằng việc tương tác qua ngón tay cần một khoản không gian lớn hơn như khi dùng chuột, màn hình cảm ứng cũng chẳng hề có trạng thái hover khi gì bạn chỉ có chạm và chạm

Tổng Kết

Thiết kế web không đơn thuần là tạo ra sản phẩm đẹp trong mắt người dùng mà còn là công việc tạo ra trải nghiệm mới cho người dùng. Responsive web design nếu được implement tốt sẽ tăng trải nghiệm người dùng những không thể giải quyết cho tất cả mọi người dùng mọi loại thiết bị, mọi nền tảng, nó sẽ còn được tiếp tục cải thiện trong nhiều năm tới, nhưng bạn có thể áp dụng nó ngay hôm nay cho những dự án mới.

Bài "Khái niệm và ứng dụng của Responsive Web Design"
Theo ADC Việt Nam