Czy istnieje konkretny termin na rynny poziome?


12

Kontekst
Mój zespół pracuje nad responsywną stroną internetową i pozwalamy użytkownikowi konfigurować niektóre właściwości strony, w tym odstępy między „komórkami” siatki. Przeprowadziliśmy rozmowę na temat prawidłowej terminologii służącej do identyfikacji „przestrzeni między komórkami”. Oczywiście moglibyśmy użyć czegoś takiego jak „margines”, ale jest to nieco zbyt szerokie, ponieważ obejmowałoby to przestrzeń między stroną a komórkami najbardziej zewnętrznymi. Chcemy zidentyfikować przestrzeń tylko między komórkami. Nasi użytkownicy niekoniecznie są obeznani z technologią (co oznacza CSS itp.), Ale mogą mieć pewne doświadczenie w projektowaniu graficznym (lub przynajmniej znać wspólną terminologię).

Pytanie
„Rynna” wydaje się być najbardziej poprawnym terminem, ale większość definicji „rynny”, które mogę znaleźć, odnosi się konkretnie do odstępu między kolumnami .

Czy istnieje konkretny termin określający odstęp między rzędami ? Czy też właściwe jest po prostu nazywać je „rynnami poziomymi”?

Przykład
Oto ilustracja tego, co próbuję zidentyfikować.
(Zdjęcie zapożyczone z https://www.init.de/en/news/responsive-design )

wprowadź opis zdjęcia tutaj

Problemy z moją bieżącą terminologią
„Rynna pozioma (/ pionowa”) jest moim zdaniem nieco myląca, ponieważ nie jest jasne, czy rynna znajduje się pomiędzy poziomymi (/ pionowymi) elementami, czy zapewnia poziomą (/ pionową) przestrzeń między pionem (/ elementy poziome). W moim zespole istnieje pewna różnica zdań co do tego, która definicja jest dokładna, więc uważam, że to wystarczający dowód na to, że to zdanie jest mylące.

Przynajmniej w odniesieniu do sieci „padding” i „margin” nie są odpowiednie do tego, co opisuję. Wypełnienie odnosi się do przestrzeni między ramką a treścią, a margines odnosi się do przestrzeni wokół elementu. Dwa sąsiednie elementy z marginesem 10px miałyby między sobą rynnę o wielkości 20px. (Tak, wiem, że marginesy CSS często się zawalają, ale nie zawsze ).

Termin „rynna” jest często używany w responsywnych ramach gridowych, więc wiem, że jest to termin akceptowalny w tworzeniu stron internetowych. Zastanawiam się tylko, czy istnieje bardziej odpowiednie określenie „rynna pozioma”.


Dobre pytanie, nie znam terminu na to. Jednak termin rynna jest często niewłaściwie używany. Odstępy między kolumnami są właściwie nazywane aleją . Zobacz ten obraz dla wyjaśnienia
Zach Saucier

W szczególności nie chodzi ci tu o prowadzenie, prawda? Co z odstępami między akapitami?
e100

Kontekst jest wszystkim. Ponieważ brzmi to jak tabela, sugeruję pożyczenie jakiejkolwiek terminologii używanej przez MS Excel przy wyborze opcji formatowania komórek arkusza kalkulacyjnego (myślę, że to „wypełnianie” IIRC)
DA01

Jeśli chodzi o odstępy między akapitami, jeśli naprawdę mówimy o poziomej przestrzeni między akapitami w kolumnie, uważam, że terminem graficznym jest „odstępy między akapitami”.
DA01

Odstępy między komórkami są niepoprawne, ponieważ zwiększa to przestrzeń wokół stołu / siatki
JDB wciąż pamięta Monikę

Odpowiedzi:


3
Krótka odpowiedź

Użyłbym „odstępów między wierszami”.

Długa odpowiedź

Jak wspomniał JDB, ja też wolałbym używać terminów związanych z internetem, zamiast próbować importować składane słowa z (fascynującego) świata mediów drukowanych.

Użyłbym terminów „odstępy między kolumnami” i „odstępy między wierszami”, ponieważ większość układów siatki używa terminów „kolumny” i „siatki”. Unikałbym używania terminów „margines” i „wypełnienie”, aby uniknąć kolizji ze słowami kluczowymi CSS.


1
Nowa specyfikacja siatki CSS definiuje grid-row-gapigrid-column-gap , ale tak naprawdę lubię „odstępy” tylko trochę lepiej.
JDB wciąż pamięta Monikę

7

W zakresie projektowania stron internetowych, które wydaje się być przedmiotem pytania PO, wolałbym używać terminów związanych z siecią, zamiast próbować importować składane teksty z (fascynującego) świata mediów drukowanych.

Nazwałbym to „marginesem pionowym” jak we właściwości CSS margin. Margines to odstęp między granicą sąsiednich elementów (w przeciwieństwie do wypełnienia, czyli odstępu wewnątrz elementu, między jego granicą a jego zawartością).

wprowadź opis zdjęcia tutaj

Słowami W3C:

Margines czyści obszar wokół elementu (poza ramką). Margines nie ma koloru tła i jest całkowicie przezroczysty. źródło

Zwróć uwagę, że obramowanie elementu może być przezroczyste. Nie musi być widoczny.

Deweloperzy z pewnością zrozumieją ten termin. I moim zdaniem, choć „margines” jest mniej czarujący niż „rynna”, „przejście” lub „ślimak”, klienci z pewnością uznają to za bardziej przyjazne określenie.

Dygresja

Cellpaddingi cellspacingsą podobne do paddinga margin, ale są one zbyt szczegółowe. Są to prawidłowe atrybuty HTML tagów <table>i <td>, w przeciwieństwie do ogólnych atrybutów CSS. Nie można ich stosować do żadnego innego znacznika oprócz tych. Jeśli mówisz tylko o tabelach (jak w konstrukcjach wykonanych przy użyciu <table>znacznika), to poprawne byłoby wywołanie tego obszaru cellspacing. Jeśli mówimy o prostokątnych obszarach w ogóle (jak w obszarach określonych przez <div>, <span>, <img>lub jakiejkolwiek innej zmiennej), to marginbyłoby bardziej dokładne.

Na marginesie, proszę zauważyć, że atrybuty cellpadingi cellspacingsą bardzo niezadowolone dla współczesnych projektantów i programistów stron internetowych, ponieważ ten typ atrybutu miesza strukturę (HTML) ze stylem (CSS), w wyniku czego strony są trudniejsze w utrzymaniu i / lub rozwijaniu przez zespoły. Deweloperzy są zachęcani do powstrzymania się od stosowania tych atrybutów i używać atrybutów CSS paddingi marginzamiast.

To samo dotyczy używania tabel do tworzenia ogólnych układów, tak jak kiedyś. Puryści twierdzą, że tabel należy używać wyłącznie do wyświetlania danych tabelarycznych. <div>i <span>do rusztowań należy stosować tagi. Wszystko to z nadzieją, że pewnego dnia będziemy mieli semantycznie poprawne strony internetowe, w których znaczniki znaczą semantycznie kontekst, a nie tylko tak za kulisami.


2
„Margines” to ogólny termin odnoszący się do przestrzeni wokół elementów, podczas gdy „rynna” konkretnie odnosi się do przestrzeni między elementami. Na przykład, jeśli każdy z dwóch sąsiadujących elementów ma margines 10 pikseli, wówczas rynna między nimi będzie miała szerokość 20 pikseli. Widziałem często „rynnę” używaną w różnych strukturach układu siatki, więc nie sądzę, że jest poza zasięgiem w kontekście stron internetowych. Zastanawiam się tylko, czy to poprawny termin określający przestrzeń między pionowo ułożonymi elementami.
JDB wciąż pamięta Monikę

1
@JDB: Wystarczająco uczciwe ... Chyba akceptacja „rynny”, ponieważ przestrzeń między elementami zależy od odbiorców. BTW, marginesy HTML / CSS czasami się zwijają, więc dwa elementy z marginesem 10px niekoniecznie miałyby rynnę 20px. Mogą się skończyć z rynną 10px, jeśli marginesy się zawalą. css-tricks.com/almanac/properties/m/margin
cockypup

Ponadto (nie denerwujące, jestem bardzo entuzjastycznie nastawiony do tego tematu) w „marginesie” CSS nie jest terminem ogólnym. Ma bardzo szczegółową definicję. w3.org/TR/CSS2/box.html
cockypup

1
Słuszna uwaga. Zgadzam się, że lepiej byłoby mieć termin, który odnosi się do „faktycznej przestrzeni, która jest ostatecznie pozostawiona między elementami”.
cockipup

1
Mimo że wymieniono wszystkie sposoby, w których marginesy się nie zawalają, „zwinięcie marginesu wydaje się być wyjątkiem, a nie regułą w dokumentacji. Dokumentacja brzmi jak angielskie gramatyki: brak reguły i wszystkie wyjątki. Być może przynajmniej dla swojego zespołu definiujesz termin (jak „aleja”), który jest pionowym marginesem między elementami po (nie) zawaleniu.
Yorik

4

Pod względem składu Slug jest powszechnym terminem określającym odstęp poziomy. - Odstęp po / przed akapitem, pozioma szczelina między sekcjami lub między regułami itp. Ślimak ma określony rozmiar podobny do rozmiarów typów i zostałby umieszczony w jednej linii z metalowym typem, aby stworzyć odpowiedni odstęp pionowy.

na podstawie edycji ....

Cell paddingwydaje się najbardziej oczywistym wyborem. Lub cell spacing.


Czy ten termin dotyczy również odstępów po sekcjach? czy tylko akapity?
Zach Saucier

1
Ma zastosowanie do każdego obszaru, w którym używana jest przestrzeń pozioma. W czasach gorącego tekstu ślimak był używany do stworzenia równej przestrzeni w poziomie między dowolnymi składanymi obszarami, niezależnie od tego, czy były to akapity, kolumny, reguły itp.
Scott

Podoba mi się, ale jest to bardzo mylące w projektowaniu stron internetowych, ponieważ w grę wchodzi druga definicja.
JDB wciąż pamięta Monikę

1
Slug był terminem używanym do określenia odstępów. Metalowe ślimaki, które zostały wpuszczone, aby atrament nie przylgnął. Zostały użyte do stworzenia poziomych odstępów i wyrównania tekstu, a także między czcionkami do stworzenia odstępów w akapitach lub innych potrzebnych odstępów. Zdaję sobie sprawę, że nie jest to termin, o którym wielu projektantów wiedziałoby, chyba że pracowali dla gazet. To tak naprawdę nie oznacza, że ​​to nie jest dokładne. Elementy pionowe to xheight, wiodące i ślimaki. Jeśli jednak chodzi o projektowanie stron internetowych, zwykle używam „marginesu”.
Scott

1
... i zdaję sobie sprawę, że pytanie zostało edytowane, aby dodać znacznie więcej po opublikowaniu tej odpowiedzi. Nie było wcześniej żadnej wzmianki o „sieci”.
Scott

1

W projekcie układu te poziome rynny w siatce nazywane są „liniami przepływowymi” lub „liniami wiszącymi”


2
Witamy w GD.SE! Proszę lepiej wyjaśnić swoją odpowiedź. Co masz na myśli przez „projektowanie układu”?
Mensch

Aby dodać do tego, co powiedział Kurt, być może możesz również podać przykłady wizualne.
WELZ
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.