[ad_1]
Bắt đầu với bản phát hành này, bạn có thể thêm nhiều lượt xem vào một tài liệu trong Sanity Studio. Bạn có thể mở một vài trong số chúng cùng lúc với Split Panes. Điều này cho phép bạn xây dựng kinh nghiệm tác giả phong phú hơn và nâng cao hơn. Nó cho phép bạn thêm các bản xem trước tùy chỉnh, siêu dữ liệu và các cách khác để xem tài liệu của bạn trong ngữ cảnh. Chỉ cần sử dụng các thành phần React. Nâng cấp (các) Studio của bạn lên phiên bản mới nhất, xem tài liệu mới và khám phá phòng thu mẫu của chúng tôi với một loạt các bản xem trước.
Với việc phát hành Cấu trúc cấu trúc, chúng tôi đã tìm thấy một mô hình tốt cho làm thế nào bạn có thể tùy chỉnh và thiết kế những trải nghiệm tuyệt vời cho tác giả phát triển từ những cấu trúc đơn giản đến những thứ cao cấp hơn. Hôm nay, chúng tôi sẽ công bố các tính năng bổ sung đưa mô hình này đi xa hơn nữa.
Ngoài ra, Sanity Studio sẽ liệt kê ra các loại tài liệu, chính các tài liệu và các biểu mẫu cho tài liệu được chọn trong panes . Các tấm là di động đáp ứng và có thể được thu gọn. Nhưng thường thì bạn muốn kiểm soát nhiều hơn về cách các tài liệu được nhóm lại và bạn muốn điều chỉnh các quy trình công việc khác nhau, nơi bạn muốn truy cập vào cùng một tài liệu, nhưng thông qua các tuyến khác nhau.
Đó là lý do tại sao chúng tôi tạo Trình dựng cấu trúc như một cách cung cấp cho bạn sự linh hoạt hoàn toàn về cách các tài liệu được liệt kê trong các bảng này. Nó cho phép bạn tạo mọi thứ từ một studio chỉ hiển thị một biểu mẫu cho một tài liệu cụ thể, đến một Studio hiển thị danh sách tài liệu tùy chỉnh từ các sự kiện thời gian thực. Trình xây dựng cấu trúc cũng cho phép bạn thiết lập quy trình công việc biên tập bằng cách nhóm các tài liệu dựa trên các giá trị của chúng.
Chúng tôi hiện đã thêm nhiều phương thức vào API Trình tạo cấu trúc cho phép bạn xác định một tập hợp Lượt xem cho cách mỗi tài liệu được hiển thị trong khung của nó. Hiện tại, một khung nhìn có thể là dạng mặc định hoặc bất kỳ thành phần React nào bạn chỉ định. Sau này nhận được đạo cụ, bao gồm các tài liệu trong dự thảo, xuất bản, lịch sử và trạng thái hiển thị của nó. Điều này giúp có thể dễ dàng tạo các trải nghiệm tác giả tùy chỉnh hơn bằng cách sử dụng dữ liệu thời gian thực đã chảy qua Studio.
Các khả năng kỹ thuật sang một bên, đây là một dịp tốt để nói về một điều mà chúng tôi đã nghĩ đến trong một thời gian: Xem trước.
Hầu hết các CMS có chức năng xem trước trực tiếp cho phép bạn giải quyết một URL bên ngoài hoặc chạm vào một công cụ tạo khuôn mẫu tích hợp. Một số người cũng giải quyết điều này bằng cách tạo ra trải nghiệm tác giả What You See Is What You Get (WYSIWYG). Điều này hoàn toàn có ý nghĩa khi nội dung của bạn được mô hình hóa xung quanh một bản trình bày rất cụ thể. Nhưng đó cũng là chi phí: Bạn kết thúc với nội dung gắn liền với một bản trình bày nhất định. Và thay vì tổ chức nội dung xung quanh ý nghĩa thực sự của nó, cuối cùng bạn sẽ buộc nó vào các trang mà nó bị kẹt ngay bây giờ.
Nội dung có cấu trúc làm tăng giá trị của văn bản, hình ảnh và phương tiện khác của bạn, bằng cách mở khóa chúng từ chi tiết cụ thể. Nó cũng có mức độ trừu tượng cao hơn một chút, và một số cách làm việc mới. Chẳng có ý nghĩa gì khi thích ứng với các trải nghiệm chỉnh sửa WYSIWYG nội tuyến, ví dụ như trang web của bạn có thể đang chia sẻ nội dung giữa các bản trình bày khác nhau. nội dung trên các trang và thành phần khác nhau. Hoặc có lẽ quan trọng hơn: giữ quyền tự do làm lại nội dung của bạn thành các bài thuyết trình mới sau đó.
Xem trước là cách để các tác giả và biên tập viên hiểu được không chỉ cách trình bày tác phẩm của họ, mà quan trọng hơn là nhận thức . Chúng tôi nghĩ về việc xem trước như là sự đồng cảm của Cổng thông tin, vì các công cụ giúp cho việc soạn thảo dễ dàng hơn bằng cách cho phép bạn liên quan đến trải nghiệm người dùng.
Nhìn vào các bản xem trước theo cách này buộc câu hỏi: Tại sao nên xem trước các trang web xem trước? Nếu nội dung của bạn sẽ kết thúc ở những nơi khác nhau trước những người khác nhau, bạn có nên thông báo về cách chúng tôi điều chỉnh các bản xem trước trong CMS không? Các chiến lược gia nội dung như Karen McGrane và Jeff Eaton đã đưa ra câu hỏi này hơn nửa thập kỷ trước, nhưng dường như chúng ta vẫn thấy rằng các bản xem trước chủ yếu được nghĩ về việc xem các thay đổi trông như thế nào trên trang web . Ít nhất, đó là nơi có sự đổi mới và năng lượng hiện tại.
Chúng tôi muốn mở rộng và thách thức những ý tưởng đã được thiết lập về việc xem trước trong CMS có thể là gì. Vì vậy, chúng tôi đã tạo ra một loạt các ví dụ về các bản xem trước khác nhau mà chúng tôi hy vọng có thể được sử dụng và truyền cảm hứng.
Và tất nhiên, chúng ta sẽ bắt đầu với một ví dụ rõ ràng, chỉ để giải quyết vấn đề đó.
Giả sử bạn muốn xem trước trực tiếp trang web bạn đang chỉnh sửa. Bạn có thể có điều đó. Ở đây chúng tôi đang sử dụng một lối vào Gatsby. Đầu tiên, đăng ký Gatsby Preview (nếu bạn đã sử dụng plugin nguồn của chúng tôi, nó sẽ hoạt động tốt). Kích hoạt watchMode và thêm mã thông báo đọc. Bây giờ, bạn sẽ có chế độ xem trước thời gian thực độ trễ thấp trong đám mây. Bạn có thể kiểm tra xem nó đã được thực hiện như thế nào trong phòng thu mẫu của chúng tôi trên GitHub.
Đây là một ví dụ tối thiểu khi sử dụng Trình tạo cấu trúc:
] nhập S từ '@ sanity / Desk-tool / architecture-builder'
const url = 'https://yourDomain.gtsb.io/projects/'
const WebPreview = ( { tài liệu ) => {
const { được hiển thị } =
trở lại (
< iframe
src = { url + hiển thị . }
frameBorder = { 0 }
/>
)
}
export const getDefaultDocumentNode = [ ) => {
if ( giản đồType === "dự án" ) {
trở lại S . tài liệu ( ) lượt xem ( [
S . xem . mẫu ( )
S . xem . thành phần ( WebPreview ] title ( 'Web' )
] )
}
}
xuất mặc định S . mặc định
Nếu bạn nghĩ về nó, nơi đầu tiên là nơi gặp gỡ của bạn nội dung của bạn không thực sự là trang web của bạn, nó nằm trong tìm kiếm và trên mạng xã hội. Khi nội dung của bạn được trình bày trong kết quả tìm kiếm và dưới dạng thẻ phương tiện truyền thông xã hội, có những hạn chế khác trong trò chơi, có thể khó kiểm soát hơn. Đó có thể là số lượng ký tự bạn có sẵn hoặc cắt xén hình ảnh được kết nối với nội dung của bạn. Trong phòng thu ví dụ, bạn sẽ tìm thấy một số thành phần đơn giản để xem trước nội dung trông như thế nào trên Google, Twitter và Facebook. Bạn có thể mượn mã này từ Studio mẫu trên GitHub.
Suy nghĩ về các bản xem trước về mặt đồng cảm và trải nghiệm người dùng khiến chúng tôi nghĩ đến khả năng truy cập. Mọi người mang trong mình những khả năng khác nhau và có những thử thách khác nhau, và khi nói đến nhận thức, nó dễ dàng quên đi những thách thức mà bản thân bạn không có. Vì vậy, chúng tôi đã đưa ra ba ví dụ để làm nổi bật điều này:
Một bản xem trước cho phép bạn mô phỏng trang web của bạn trông như thế nào đối với những người có các loại mù màu khác nhau.
Bản xem trước cho phép bạn chọn trường văn bản từ tài liệu của bạn và sử dụng tổng hợp giọng nói trong trình duyệt để bắt chước trình đọc màn hình.
Bản xem trước cung cấp cho bạn bản trình bày trực quan của một trường bằng chữ nổi. Điều này là tất nhiên, không hữu ích cho những người phụ thuộc vào chữ nổi. Mặc dù vậy, hy vọng của chúng tôi là những nỗ lực như những gì được trình bày trong bài nói chuyện này của Theodore Vorillas có thể giúp thu hẹp khoảng cách và làm cho việc xem trước chữ nổi trên các giao diện vật lý dễ tiếp cận hơn.
Chúng tôi đã có khách hàng sử dụng nội dung từ các bảng hiệu kỹ thuật số, kiốt, tương tác và cài đặt của Sanity API. Tại sao không cung cấp cho các biên tập viên của bạn một cách gần đúng về cách thức công việc của họ được trình bày trong các cài đặt này?
Với một chút tính toán CSS và ma trận, chúng tôi đã tạo một thành phần cho phép bạn ánh xạ nội dung vào cài đặt trong thế giới thực. Một lần nữa, nó nhấn mạnh rằng bạn thiết kế nội dung cho các kịch bản với các ràng buộc khác nhau.
Mã cho các bản xem trước IRL trên GitHub.
Nội dung có cấu trúc không được sử dụng trong các kênh kỹ thuật số! OMA sử dụng nội dung từ Sanity để in sách tại nhà xuất bản nội bộ của họ. Những người khác đã sử dụng nó để làm một cuốn sách công thức bánh pizza. Và chúng tôi biết các tổ chức khác tiêu thụ nội dung từ Sanity.io vào một trình tạo PDF được sử dụng để sản xuất tài liệu in.
Chúng tôi cũng muốn làm một ví dụ đơn giản cho việc này và thiết lập một dịch vụ trên Zeit's Now cho phép chúng tôi chạy Puppeteer (Chrome không đầu) trong chức năng không có máy chủ. Sau đó, chúng tôi có thể thiết kế danh thiếp bằng HTML và CSS và tạo ra không chỉ các bản xem trước về cách các thẻ trông như thế nào mà còn cả PDF thực tế. Bạn có thể tải xuống từ trong Studio.
Chúng tôi là người hâm mộ của tất cả các nỗ lực cải thiện trải nghiệm người dùng, nhưng chúng tôi không chắc chắn rằng việc phát minh lại chỉnh sửa nội dung WYSIWYG nội tuyến sẽ khóa nội dung cho một bản trình bày cụ thể là con đường để đi. Thay vào đó, hãy để sử dụng các công cụ hiện đại để tạo ra những trải nghiệm tác giả tốt hơn, linh hoạt hơn. Điều đó không chỉ tìm cách mang lại cho các tác giả cảm giác kiểm soát mà còn trao quyền cho họ khám phá xem nội dung của họ được khán giả cảm nhận như thế nào.
Source link: webdesignernews