Page tree
Skip to end of metadata
Go to start of metadata

Wybierz (kliknij, aby rozwinąć) konkretną ..... aby poznać szczegóły wybranej funkcjonalności.



Podczas pracy w edytorze wizualnym, każdorazowe wciśnięcie klawisza Enter powoduje przejście do nowej linii i tworzy jednocześnie nową wydzieloną sekcję tekstu (nowy blok). Każdy taki blok sygnalizowany jest w edytorze kreskowaną obwiednią z literą „P”. Litera ta oznacza tzw. paragraf (paragraf w znaczeniu języka HTML, którzy tworzy strukturę każdej strony internetowej). Przeznaczeniem sekcji jest wizualne dzielenie treści na mniejsze części, co optycznie zwiększa czytelność zawartości tekstowej.

Wspomniane bloki (sekcje) technicznie w języku HTML noszą nazwę paragrafów (wprost z języka angielskiego). Jednocześnie z punktu widzenia zasad języka pisanego, funkcją nawiązują raczej do akapitów, gdyż to zadaniem akapitów jest właśnie dzielenie treści tekstowych na mniejsze fragmenty w celu zwiększenia czytelności tekstu. I tak właśnie należy traktować te elementy. Na wszelki wypadek precyzujemy: „paragraf” jako nazwa używana technicznie nie jest oczywiście tożsama z paragrafem rozumianym jako znak „§” lub jako podstawowa jednostka redakcyjna tekstu prawnego.

Jeśli potrzebą użytkownika jest wymuszenie przejścia do nowej linii (tzw. złamanie wiersza) w ramach danej sekcji (paragrafu), należy posłużyć się kombinacją klawiszy Shift + Enter. Spowoduje to przejście do nowego wiersza w bieżącej sekcji.

Redagując dłuższy tekst, koniecznie pamiętajmy o logicznym podziale treści na akapity (czyli na powyżej wspomniane sekcje, zwane też blokami lub paragrafami w znaczeniu języka HTML). Praktycznie każdy tekst omawia jakąś myśl, ideę lub sprawę. Jedno lub wiele zdań stanowiących pewną całość treściową (związaną z omawianym zagadnieniem) powinno znaleźć się we wspólnym bloku. Nowa sekcja (traktowana jako akapit) winna więc być używana jako zaznaczenie nowej myśli w bieżącym wątku wypowiedzi.

Przez stylowanie tekstu rozumie się nadawanie mu cech wizualnych (np. rozmiar fontu, kolor znaków, styl liternictwa). Tak zwaną klasę stanowi zaś umowny zbiór przyjętych zasad stylowania.

Przykład ogólny wyjaśniający ideę. Moglibyśmy umówić się, że następujące trzy zasady stylowania:

  • pogrubienie fontu
  • font w kolorze czerwonym
  • podkreślenie fontu

zawarte zostały w klasie o nazwie „Ważne”. Wynika z tego, że każdy zaznaczony fragment tekstu w edytorze, któremu przypisana zostanie klasa typu „Ważne” uzyska (odziedziczy po własnościach klasy) pogrubienie, jednocześnie wyświetlany tekst uzyska kolor czerwony i jednocześnie zostanie podkreślony.

Czynność taką nazywa się stylowaniem tekstu.

Korzystając z edytora wizualnego, można wobec tekstu zastosować następujące klasy stylowania:

  • Normal – styl normalny (domyślny)
  • Header 1 – nagłówek rzędu pierwszego (tj. o najważniejszym znaczeniu, np. jako tytuł)
  • Header 2 – nagłówek rzędu drugiego (o mniejszym znaczeniu, np. tytuł rozdziału)
  • Header 3 – nagłówek rzędu trzeciego (o jeszcze mniejszym znaczeniu, np. tytuł podrozdziału)
  • Header 4–6 – analogiczne nagłówki niższych rzędów
  • Preformatted text – otacza tekst ramką i stosuje font o stałej szerokości znaków (zalecane do cytowania kodów wyrażonych w językach programowania itp.)
  • Dane tabelaryczne – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania danych zawartych w tabelach)
  • Dokument – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania hiperłącz prowadzących do plików o charakterze dokumentu, czyli plików MS Office, LibreOffice, PDF itp.)
  • Informacja – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania danych o charakterze informacyjnym, organizacyjnym)
  • MojaPG – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania hiperłącz prowadzących do systemu MojaPG)
  • Ostrzeżenie – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania ważnych lub bardzo ważnych informacji albo uwag, ostrzeżeń)
  • System zewnętrzny – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania hiperłącz prowadzących do innych niż MojaPG systemów zewnętrznych)
  • Sukces – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania informacji o powodzeniu jakiego przedsięwzięcia, zadania lub o zakończeniu jakichś czynności itp.)
  • Uwaga – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania istotnych informacji, na które należy zwrócić uwagę, do zamieszczania uwag o mniejszym znaczeniu umownym niż uwagi w stylu Ostrzeżenie)
  • Wiadomość – otacza tekst granatową ramką i dodaje dedykowaną ikonę (do wyróżniania informacji o charakterze organizacyjnym, o niezamierzonych zmianach, o nieobecnościach itp.)

Ponadto przewidziano dwa style liniowe (tj. stosowane tylko we wskazanej/wskazanym wierszu/wierszach):

  • Cited work – w celu oznaczenia tekstu, że stanowi on cytat (w chwili obecnej wizualnie nie wyróżnia się on wyglądem)
  • Computer code – otacza fragment tekstu jasnym czerwonym tłem, font wyświetla w kolorze czerwonym i stosuje font o stałej szerokości znaków (w celu oznaczenia tekstu, że stanowi on fragment kodu wyrażonego w języku programowania itp.)

Z podanych klas stylowania należy korzystać zgodnie z ich przeznaczeniem, zachowując umiar. Na przykład nadużywanie stylów mających na celu zwrócenie uwagi użytkownika, przyniesie skutek odwrotny: strona stanie się w ten sposób „krzykliwa” i nieprzejrzysta dla odbiorcy. Rozsądnie używane klasy stylowania urozmaicają wygląd witryny i pomagają wyróżnić najbardziej istotne informacje.
Jeśli jednak większość tekstu zostanie w jakiś sposób wyróżniona, czytający zatraci wgląd na to, co tak naprawdę jest najważniejsze na oglądanej stronie. Strona nie może być zatem zbyt „pstrokata”, kolorowa, w większości wyróżniona w treści, składająca się ze zbyt wielu elementów ruchomych czy marketingowych. Tym bardziej witryny uczelni technicznej, jaką jest Politechnka Gdańska, winny być raczej stonowane i „poważne” (choć niekoniecznie „nudne”).

Edytor wizualny udostępnia kilka gotowych szablonów treści:

  • Tabelka – wstawia gotowy „zaczyn” tabeli złożonej z 3 wierszy (z których jednej stanowi nagłówek) i z 3 kolumn
  • Strona kontaktowa – wstawia zestaw napisów przydatnych przy podawaniu danych kontaktowych do osoby lub jednostki organizacyjnej
  • Ważna wiadomość – wstawia blok, który wyróżniony jest szarym tłem i ciemnoszarym obramowaniem i w którym umieścić można potrzebną treść
  • Newsletter – ramka prosta – wstawia gotowy blok do wypełnienia treścią, w którym nagłówek i przycisk „Czytaj więcej” może być hiperłączem do dowolnej witryny. Sam blok posiada gotowe stylowanie utrzymane w kolorach granatowym, czerwonym i szarym
  • Nekrolog – wstawia gotowy blok z czarnym ozdobnym obramowaniem i z czarną przepaską w prawym górnym rogu bloku. Blok służy do zamieszczania nekrologów i wspomnień o odeszłych pracownikach lub osób związanych z Uczelnią

Pozostałe niewymienione tu szablony (a widniejące w okienku edytora) mają charakter techniczny i w kontekście samodzielnego wykorzystania ich przez użytkownika nie mają raczej sensu.

Nie trzeba chyba przekonywać, że zamieszczany tekst powinien być możliwie wolny od błędów ortograficznych, stylistycznych i interpunkcyjnych. Chcielibyśmy jednak zwrócić uwagę na to, że redagując zawartość tekstową, warto pamiętać o stosowaniu poprawnych znaków:

  • cudzysłowu
  • łącznika (zwanego również dywizem)
  • półpauzy
  • myślnika (zwanego również pauzą)

Cudzysłów. W języku polskim używa się najczęściej cudzysłowu w postaci pary znaków: „ ” (jest to tzw. cudzysłów apostrofowy). Niestety, ze względów technicznych i historycznych typograficznie poprawny cudzysłów nie jest dostępny bezpośrednio z klawiatury komputera (w sensie braku dedykowanego mu klawisza) i nie należy on do podstawowego komputerowego zestawu znaków. Dlatego niezwykle często w tekstach m.in. na stronach internetowych redaktorzy dla oznaczenia cudzysłowu korzystają z dostępnego na klawiaturze znaku ", co jest jednak niepoprawne z językowego i typograficznego punktu widzenia.
Wbrew pozorom, użytkownicy nie są skazani na stosowanie „niepolskich” znaków cudzysłowu. W edytorze wizualnym systemu eKontakt (jak i w wielu innych systemach obsługiwanych w oknie przeglądarki) dostępna jest możliwość wstawiania poprawnych znaków cudzysłowu.

W pierwszej kolejności klikamy na ikonę Wstaw znak specjalny:

W wyświetlonym okienku klikamy na czwarty znak od prawej w przedostatnim wierszu znaków, co spowoduje wstawienie w tekst znaku otwierającego cudzysłów:

Chcąc użyć znaku zamykającego cudzysłów, ponownie klikamy w edytorze na ikonę Wstaw znak specjalny i z wyświetlonego okienka wybieramy znak szósty od prawej w szóstym wierszu znaków, tak jak na ilustracji:

W ten sposób wstawione cudzysłowy będą w pełni zgodne z polskimi zasadami językowymi i typograficznymi.

Drugim zagadnieniem jest poprawne stosowanie znaków łącznika, półpauzy oraz myślnika. Wszystkie trzy znaki wizualnie zapisywane są w formie poziomych kresek, jednak ich długości są różne.

Łącznik (zwany niekiedy dywizem) stanowi najkrótszą z poziomych kresek stosowanych w języku polskim. Znak ten wykorzystywany jest do przenoszenia wyrazów, oddzielania członów wyrazów oraz w zapisach oznaczeń, w numerach identyfikacyjnych lub technicznych. Na przykład:

  1. Przenoszenie wyrazów

    rdzawo-
    czerwony

    foto-
    grafia

  2. Wyrazy wieloczłonowe

    flaga biało-czerwona
    Kędzierzyn-Koźle
    Stanisława Fleszarowa-Muskat

  3. Zapis oznaczeń

    tel. 058 347-11-45
    ISBN 978-83-246-6520-4
    80-233 Gdańsk

Do poprawnego zapisu językowego i typograficznego symbolu łącznika wystarczy użyć dostępnego na klawiaturze komputera klawisza zlokalizowanego na prawo od cyfry zero. Tak, jest to znak „minus” stosowany również w zapisie matematycznym. Symbol odejmowania i myślnik zapisywany jest zasadniczo tym samym znakiem graficznym. Pamiętajmy, że zgodnie z zasadami języka polskiego, znak łącznika nie jest nigdy otaczany odstępami (spacjami).

Ciekawostka: w komputerowych systemach kodowania znaków przewidziano wprawdzie specjalny dedykowany symbol graficzny dla oznaczania matematycznego symbolu odejmowania (jest on również dostępny w kodzie HTML), jednak w praktyce jest wykorzystywany dość rzadko. Również edytor wizualny treści systemu eKontakt nie udostępnia tego znaku.

Półpauza pod względem językowym nie jest tradycyjnym znakiem interpunkcyjnym występującym w języku polskim. Znak ten zapożyczony został z typografii anglosaskiej w związku z upowszechnianiem się technik cyfrowych. Półpauzę przedstawia kreska pozioma dłuższa od łącznika, lecz krótsza zarazem od myślnika. Nie jest ona dostępna bezpośrednio z klawiatury komputera, stąd bardzo często redaktorzy stron zamiast niej błędnie używają znaku dywiza. Stosowana jest między wyrazami, do zapisu zakresu wartości liczbowych, przedziałów czasu i przy zapisach definicji. Na przykład:

na stronach 14–16,
w godzinach 9:00–10:30,
przycisk zwierny – element elektromechaniczny (…)

Współcześnie półpauza wyparła w dużej mierze znak myślnika, nawet w publikacjach drukowanych. Często więc półpauza występuje w roli myślnika. W celu wstawienia jej w tekst, w edytorze wizualnym klikamy na ikonę Wstaw znak specjalny:

Następnie wybieramy piąty znak od prawej w szóstym wierszu symboli graficznych (licząc od góry):

Myślnik (zwany niekiedy pauzą) przedstawiany jest za pomocą najdłuższej kreski poziomej. Jest tradycyjnym znakiem interpunkcyjnym języka polskiego. Używany zwykle w zapisie dialogów, we wtrąceniach zamiast przecinka, w wyliczeniach oraz między wyrazami dla oznaczania relacji lub stanu pomiędzy nimi:

— sygnalizacja świetlna dzienna i nocna
— sygnalizacja kształtowa dzienna
— sygnalizacja kształtowa nocna

Jutro będę w Gdyni, pojutrze — w Koninie.

— Proszę okazać dokumenty — oświadczył funkcjonariusz.

Znak nie jest dostępny bezpośrednio z klawiatury komputera (w sensie dedykowanego klawisza), stąd bardzo często redaktorzy stron zamiast niego błędnie używają znaku dywiza. W celu wstawienia myślnika, w edytorze wizualnym klikamy na ikonę Wstaw znak specjalny:

Następnie wybieramy czwarty znak od prawej w szóstym wierszu symboli graficznych (licząc od góry):


Powiązane artykuły