我曾經發貨過一個客戶'主頁上有 Lorem Ipsum 的三段仍然放在 " 中;關於&引用;部分。直播了大約四十分鐘,然後他們的營銷主管給我發了一張包含主題行和引用的屏幕截圖;這是什麼語言。&引用;沒有人死,但我在每個項目中都搜尋了這個詞 ipsum 此後每次部署之前,我都建造了 lorem ipsum 發電機 在 toolz。dev 上,部分原因是為了停止從五年前的書籤中複製虛擬文字。
這是大多數佔位符文字指南跳過的事情:Lorem Ipsum 的重點不是它看起來花哨。就是這樣 正確數量的不可讀文字,形狀正確,所以你可以在沒有人爭論副本的情況下判斷佈局。弄錯了數量,佔位符對你撒了謊--在兩個簡潔的句子下看起來完美的設計當真實的段落出現時會崩潰。因此,本指南較少涉及歷史(儘管有一些),而更多涉及生成與替換內容實際匹配的文本。
一切都在您的瀏覽器中運行。沒有註冊,工作流程中沒有廣告,沒有任何內容發送到任何地方。
TL;DR: 的 lorem ipsum 發電機 從三個滑桿建立佔位符段落 - 有多少段落、每個句子的平均單字和每個段落的平均句子 - 並在拖曳時重新生成即時內容。它以熟悉的&引用開頭; Lorem ipsum odor amet, consectetuer adipiscing elit。"行並用隨機的拉丁語單字填充其餘部分,因此每個區塊看起來都不同。調整大小給您 真正的 預期內容,將其複製出來,並在您的專案中搜尋 "ipsum"出貨前。當真實單字到達時,請檢查它們的長度 字計數器.
什麼是 Lorem Ipsum,為什麼是拉丁語?
Lorem Ipsum 是加擾的偽拉丁語,用作填充文本,因此設計師可以在真實內容存在之前評估佈局。著名的開場 - "Lorem ipsum dolor sat amet, consectetur adipiscing elit..." - 是 Cicero' 的殘破片段;s De Finibus Bonorum et Malorum,寫於西元前 45 年的倫理學論文。這些字在幾個世紀前就被砍掉並改成讀起來像拉丁文但毫無意義的東西。
"為什麼是拉丁文"問題有一個很好的答案: 無意義就是這個特徵。 如果你用真正的英語填滿一個模型,每個評論它的人都會閱讀文字,形成對副本的意見,然後停止查看設計。用 Lorem Ipsum 填滿它,沒有什麼可讀的,所以注意力會集中在你想要的地方 - 間距、類型、層次結構和節奏。這個約定已經足夠古老了(印表機在 1500 年代以這種方式打亂打字,Letraset 在 1960 年代傳播它,桌面出版軟體在 1980 年代烘烤它),每個利益相關者在看到它時都將其視為 "佔位符,而不是最終的。"
具體來說,關於 toolz。dev 生成器的一個誠實的註釋是:它不會逐字複製精確的經典段落。它以可識別的行開頭,然後從拉丁風味術語庫中隨機抽取單詞,因此每次的身體都是新鮮的,而不是相同的西塞羅片段。對於佔位符目的來說,這是一個優點 - 您可以產生幾個看起來不同的區塊。
長度控制如何運作?
這就是該工具真正有用的部分,也是介面與人們期望的不同之處。沒有&引用;給我50個字和引用;或&引用;給我3個句子和引用;按鈕。相反,您使用三個滑桿塑造文本,工具將它們乘以段落:
段落計數 (1 到 20) - 您得到多少段落。
平均。每句單字數 (5 到 25) - 目標句子長度。生成器在這個數字周圍添加了一點隨機方差,因此句子在機器人上並不相同,這使得結果讀起來像自然的散文節奏而不是表格。
平均。每段句子 (2 到 15) - 每個段落運行多長時間,同樣存在一些差異。
所以你的粗略字數是 段落 × 每段句子 × 每句單字. 10 個單字×8 個句子的一段大約是 80 個單字。這些設定下的十段是一篇長篇文章'相當於身體。文字會在您移動任何滑桿的瞬間重新生成,因此您可以透過眼睛而不是算術來撥打形狀。當它看起來正確時,點擊 仿造.
值得一提的現實小感:大約七分之一的句子以問號而不是句點結尾。它是隨機的,它使佔位符牆讀起來更像真實的寫作。
如何在 Toolz。dev 上逐步產生佔位符文字
步驟1:開啟發電機
去 lorem ipsum 發電機. 負載時已經產生一個段落,因此您可以立即處理一些內容。
第 2 步:設定段落計數
拖 段落計數 無論您的佈局需要多少塊。一張卡片的描述是 1;部落格身體模型可能是 5 到 8。
步驟 3:塑造句子和段落長度
使用 平均。每句單字數 和 平均。每段句子 匹配 密度 您的真實內容。簡潔的使用者介面副本:短句、短段落。一篇長讀文章:兩者都更長。這是人們跳過的一步,也是讓佔位符誠實的一步。
第四步:複製
擊 仿造. 文字以純文字形式落在您的剪貼簿上,然後進入 Figma、HTML 範本、CMS 欄位或您的編輯器,保持不變。
第 5 步:當您需要清白時重置
的 復職 按鈕將滑桿傳回預設值(1 段、每句 10 個單字、每段 8 個句子)。移動任何滑桿也會重新洗牌單詞,因此,如果您只想在相同設定下使用不同的隨機區塊,請輕推滑桿並將其推回。
為什麼佔位符文字會擊敗空的留言盒
空文字區域與太多文字一樣嚴重地存在於您的佈局中。您無法判斷無上的行高,無法看到卡片如何包裝,也無法判斷兩列網格是否平衡。佔位符文字可讓您評估設計階段實際重要的事物:
間距和節奏 - 當元素中有文字時,元素之間的垂直空間是否感覺正確。排版 - 正文字體在這種大小和尺寸下是可讀的。層次結構 - 標題、副標題和正文明顯分開。包裝和溢出 - 當文字有點太長時,固定高度的卡片會發生什麼。回應性 - 同一區塊如何從桌面重新流到狹窄的電話列。
至關重要的是,使用 亂七八糟的 文字而不是草稿副本會阻止審稿人批准特定的單詞,而這些單詞無法在與真實內容接觸後倖存下來。
尺寸正確:一張備忘單
最常見的錯誤是,當真實的東西是一句話時,用三個段落填充一個位置 - 設計看起來很棒,然後在真實副本到達時中斷。將生成器瞄準您實際期望的內容:
| 佈局槽 | 粗略的目標 | 滑塊起點 |
|---|---|---|
| 按鈕/標籤 | 2個SECT4字 | 每句 5 的單字,抓住開頭單字 |
| 英雄小標題 | 10 講 20 字 | 1 段,12 個字/句子,2 句 |
| 特色卡 | 15.30 字 | 1 段,10 個字/句子,2 個 SEAR3 句子 |
| 部落格摘錄/元 | 20個40字 | 1 段,12 個字/句子,3 句 |
| 關於部分 | 100-200 字 | 2段,12字/句,6句 |
| 文章正文 | 500 至 1000 字 | 6段10段,14字/句,8句 |
然後故意做相反的事情:一旦"預期&引用;長度看起來不錯,將標題曲速到其長度的兩倍,並將段落縮減為兩個單詞,看看佈局在哪裡破裂。使用佔位符進行壓力測試是免費的;使用客戶端進行壓力測試'真正的啟動內容不是。
佔位符文字值得保留的地方
設計模型。 Figma、Sketch 和 Adobe XD comp 都需要每個插槽中可信的文字量才值得查看。
HTML/CSS 原型。 當您在內容之前建立結構時,將產生的段落直接放入標記中:
<article>
<h2>Section Heading Goes Here</h2>
<p>Lorem ipsum odor amet, consectetuer adipiscing elit. Sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua...</p>
</article>
響應式測試。 產生短塊和長塊並確認相同的組件同時存在。
電子郵件和簡報範本。 時事通訊佈局和幻燈片母版需要在每個文字方塊中放置佔位符,以便在編寫活動副本之前演示設計。
如果您的真實標題可能會影響佈局(通常確實如此),請考慮手動輸入看起來逼真的標題,同時將正文保留為 Lorem Ipsum。 &引用;如何開始並引用;強調與 " 不同的佈局;Lorem Ipsum Dolor,"如果您稍後從這些標題產生 URL 蛞蝓,則 蛞蝓發電機 將它們變成乾淨的道路。
一條規則:永遠不要運送它
佔位符文字已透過製作網站、印刷報紙、政府表格發布,並且一次令人難忘地發佈到廣播電視上。它的發生是因為 "I'稍後會替換它"這是我們都告訴自己的謊言。有兩個習慣可以防止這種情況發生:
逐步替換 - 隨著內容到達,將 Lorem Ipsum 替換為真實複製部分,因此佈局看起來總是完整的,但假文字會穩步縮小。並執行最終搜尋 - 在任何部署之前,grep 或 Ctrl-F 您的專案為 "lorem"和&引用;ipsum。"這需要五秒鐘,這是正常的星期二和帶有主題行"的電子郵件之間的區別;這是什麼語言。&引用;
常見問題
該工具是否以 " 開頭?Lorem ipsum dolor sat amet"?
關閉,但不完全正確。它以 " 開頭; Lorem ipsum odor amet, consectetuer adipiscing elit。" - 經典行的常見可識別變體 - 然後用隨機的拉丁風格單字填充文本的其餘部分。開瓶器就在那裡,因此任何查看您的模型的人都會立即將其讀取為佔位符;隨機體意味著您產生的每個區塊看起來都不同。
如果沒有字數選項,如何控制長度?
您用三個滑桿塑造長度:段落計數、每個句子的平均單字和每個段落的平均句子。將它們相乘以獲得粗略的單字計數 - 例如 3 段 × 8 個句子 × 10 個單字大約是 240 個單字。當你拖曳時,文字會即時再生,所以你可以透過眼睛來調整它的大小。
為什麼使用 Lorem Ipsum 而不是真正的英語佔位符?
因為真正的英語會吸引審稿人閱讀單字並判斷副本,從而分散了人們對設計的注意力。亂碼拉丁語故意無法閱讀,因此注意力集中在佈局、排版和層次結構上 - 這正是您在模型階段試圖評估的內容。
"Lorem Ipsum" 是什麼意思?
沒有任何可翻譯的東西。這是西塞羅和#39的一個被打亂、故意損壞的片段;公元前 45 年的拉丁語,單字被切碎並重新排序,因此讀起來像拉丁語,但沒有真正的含義。毫無意義是重點--沒有什麼可讀的,所以審稿人看的是佈局而不是單字。
如何在 Word 或 Figma 中插入 Lorem Ipsum?
在 Microsoft Word 中,在空白行上鍵入 =lorem (),然後按 Enter - =lorem (3,5) 給出三個段落,每段五個句子。 Figma 沒有內建生成器,因此使用此工具中的插件或貼上文字。從生成器複製到任何地方的工作原理都相同:文字以純文字形式著陸,並原封不動地放入任何編輯器、CMS 欄位或設計工具中。
Lorem Ipsum 受版權保護嗎?
否。來源是西塞羅 2000 年前的文本,牢牢地屬於公共領域,加擾的佔位符表格已經自由使用了 500 多年。您可以將其放入任何項目,而無需擔心許可問題。
將 Lorem Ipsum 留在即時頁面上會傷害我的 SEO 嗎?
是的。如果它被發布和索引,搜尋引擎會看到毫無意義的內容,而您的真實相關副本應該在哪裡,這會削弱頁面'主題訊號,看起來可能很薄。啟動前務必替換每個佔位符區塊,並透過搜尋 " 進行確認;ipsum。"
移動滑桿會給我新文字還是相同文字?
新文字。每個滑桿更改都會重新洗牌隨機單詞,因此推動滑桿(或推動它並將其移回)是獲得相同形狀的新塊的快速方法。只有開頭行保持不變。
真實內容準備好後我該怎麼辦?
放入您的最終副本,然後驗證它是否適合您設計的空間。這 字計數器 確認它達到了您的長度目標,如果您正在將草稿與編輯進行比較,則 文字差異 工具準確地顯示了變化的內容。
包裹起來
Lorem Ipsum 之所以能存活五個世紀,是因為它完美地解決了一個狹窄的問題:它用什麼都沒有的正確形狀填充佈局,這樣你就可以判斷設計而不是爭論文字。訣竅是用填充它 正確的金額 什麼都沒有--與即將出現的真實內容相匹配--然後真正記得把它拿出來。
用 產生你的 lorem ipsum 發電機:設定段落數和句子密度,複製,貼上。當真實內容落地時,用 來調整大小 字計數器,將標題轉換為乾淨的 URL 蛞蝓發電機,並用 來區分你的修訂 文字差異 工具。免費、私密且完全在您的瀏覽器中。
