Żargon projektantów stron: słownik i źródła
Filed Under (informatyka) by Tomek on 01-06-2009
Słowo komentarza: tekst ten nie jest mojego autorstwa, został przetłumaczony z angielskiego tekstu Web Design Industry Jargon: Glossary and Resources autorstwa Cameron Chapman. Tłumaczenie starałem się, aby było bardziej piękne niż wierne i dostosować niektóre treści do polskich realiów. Źródła w większości pozostawiłem angielskie, dodając tylko w kilku miejscach polskie.
We wszystkich aspektach projektowania stron istnieją specjalistyczne terminy. Dla kogoś dopiero zaczynającego swoją przygodę z projektowaniem lub chcącego mieć wykonany design swojej strony, cały ten techniczny slang może być przytłaczający — szczególnie akronimy.
Poniżej znajduje się przewodnik po branżowych terminach, który powinien pomóc ci na twojej drodze do zrozumienia, o czym rozmawiają projektanci. Dodatkowo, zamieściliśmy źródła do każdego pojęcia, abyś mógł zasięgnąć szerszych informacji.
A
AJAX
Skrót od Asynchronous JavaScript and XML (Asynchroniczny JavaScript i XML). Typowym zastosowaniem AJAXa jest tworzenie dynamicznych aplikacji internetowych i umożliwienie asynchronicznego transferu danych bez potrzeby przeładowywania strony przez użytkownika. JavaScript na stronie obsługuje większość funkcjonalności aplikacji sprawiając, że zachowuje się ona bardziej jak aplikacja systemowa niż internetowa.
- 100 Ajax Tutorials and Resources – Tutorial Blog
- Free Resources for Quickly Developing AJAX Applications – Woork
- 80+ AJAX-Solutions for Professional Coding – Smashing Magazine
Automagicznie
Kombinacja słów „automatycznie” i „magicznie”. Generalnie odnosi się ona do czegoś, co opiera się na skomplikowanym technicznie procesie, który jest ukryty dla użytkowników, przez co wygląda jakby działało to w sposób czarodziejski. Jeśli się nad tym zastanowić, wiele współczesnych technologii internetowych można zaklasyfikować jako „automagiczne”.
- Automagical – Wiktionary
- What’s the Origin of Automagically? – Feld Thoughts
B
Back End
Back end strony to jej część ukryta przed przeciętnym użytkownikiem. Back end najczęściej zawiera strukturę informacji, aplikacje i system zarządzania treścią na stronie. Czasem nazywany jest też panelem administracyjnym.
- Building the Back-End of a Photo Site – Nettuts+
Below The Fold (pod zgięciem)
Termin ten wywodzi się z czasów tradycyjnych gazet drukowanych. W ich terminologii, „below the fold” oznacza treść w dolnej połowie strony (pod miejscem, w którym gazeta jest zginana). W internecie „below the fold” oznacza treść, która znajduje się poniżej górnej części, którą przeciętny użytkownik widzi tuż po załadowaniu się strony (innymi słowy, użytkownik musi użyć kółka myszy lub suwaka z boku strony, aby zobaczyć tą treść).
- Scrolling Research Report V2.0—Part 1: Visibility and Scroll Reach – ClickTale
- Blasting the Myth of the Fold – Boxes and Arrows
- Below the Fold: Why Scrolling Isn’t a Bad Thing – Build Internet!
Bounce Rate (Współczynnik odrzuceń)
Bounce rate strony jest to procent ludzi, którzy opuścili stronę z tej samej podstrony, na którą weszli, bez oglądania innych podstron. Może to być dobry wskaźnik tego, jak działa nawigacja na stronie, jak również ocena jakości prezentowanej treści (duży bounce rate nie oznacza nic dobrego dla żadnej z tych rzeczy).
- How to Analyze and Improve the ‘Bounce Rate’ for Your Website – Dosh Dosh
- What is Your Bounce Rate? – Lunartics
- What Your Bounce Rate is Trying to Tell You – FutureNow’s GrokDotCom
Breadcrumbs (Okruszki)
Okruszki są częścią nawigacji, najczęściej wyświetlaną w górnej części strony. Pokazują podstronę, na której się aktualnie znajdujemy oraz podstrony, znajdujące się wyżej w hierarchii witryny. Przykładowo, na blogu okruszki mogą mieć postać: Strona główna > Kategoria > Rok > Miesiąc > Post (lub mogą być prostsze, na przykład: Strona główna > Kategoria > Post). Termin pochodzi z angielskiej wersji bajki „Hansel and Gretel” (w Polsce znanej pod tytułem „Jaś i Małgosia”). Używany jest zarówno termin angielski, jak i polski, z przewagą tego pierwszego.
- Breadcrumb Navigation – Web Design Practices
- Breadcrumb Navigation Increasingly Useful – Jacob Nielsen’s Alertbox
- Breadcrumbs In Web Design: Examples And Best Practices – Smashing Magazine
C
Cache (pamięć podręczna)
Zcachowane pliki są zachowywane przez przeglądarkę, aby kiedy następnym razem będą potrzebne, uniknąć ponownego ich ściągania i dzięki temu szybciej załadować stronę.
- Caching Tutorial – mnot.net
- How Caching Works – HowStuffWorks
- Web Caching and Content Delivery Resources – web-caching.com
Client-side
Określenie stosowane do skryptów obsługiwanych przez przeglądarkę użytkownika zamiast przez serwer (jak to się dzieje w przypadku skryptów server-side). Skrypt client-side najczęściej szybciej odpowiadają na akcje ze strony użytkownika, ale uruchomienie ich trwa dłużej.
- Client-Side JavaScript Guide – Netscape Devedge
- Tutorial 16: Client-Side Scripting 101 – Webreference.com
- Understanding Client-Side Scripting – PCMag.com
CMS
Skrót od Content Management System (System Zarządzania Treścią). Jest to backendowe narzędzie do zarządzanie treścią strony, które pomaga rozdzielić treść od designu i funkcjonalności strony. Pozwala to na łatwiejsze wprowadzanie zmian w wyglądzie i funkcjonalności strony niezależnie od treści. Zazwyczaj umożliwia też łatwiejsze wprowadzanie treści przez osoby niebędące projektantami stron.
- OpenSourceCMS wypróbuj różne CMSy bez ściągania i instalowania ich.
- List of Content Management Systems – Wikipedia
- 10 Things To Consider When Choosing The Perfect CMS &ndash Smashing Magazine
- Porównanie systemów CMS – Wikipedia
CSS
Skrót od Cascading Style Sheets (Kaskadowe Arkusze Stylów). Używane są do zdefiniowania wyglądu strony poza plikiem HTML. W ostatnich latach, CSS zastąpił tabele i inne oparte na HTMLu metody tworzenia layoutów stron. Jest wiele zalet korzystania z CSS, a najważniejszymi jest uproszczenie plików HTML (co może wpłynąć pozytywnie na pozycję w wynikach wyszukiwania) oraz możliwość gruntownej zmiany wyglądu strony poprzez edycję jednego tylko pliku, bez potrzeby zmieniania plików z treścią.
- Cascading Style Sheets – Web Design Group
- CSS Basics – splashpressmedia
- CSS from the Ground Up – Webpage Design for Designers
CSS Framework
Framework CSS jest to zbiór plików CSS używanych na początku do stworzenia strony przy użyciu XHTML i CSS w sposób szybki i bezbolesny. Zazwyczaj zawiera style CSS dotyczące typografii i layoutu.
- Top 12 CSS Frameworks and How to Understand Them – Speckyboy Design Magazine
- Blueprint: A CSS Framework
- Content with Style – A CSS Framework
- Guidelines for Developing Your Own CSS Framework – W3Avenue
D
Deprecated (Przestarzały)
Kod oznaczony jako deprecated, jest to kod, który nie jest już zawarty w specyfikacji języka. Najczęściej dzieje się tak, kiedy zostaje on zastąpiony przez alternatywne rozwiązanie o lepszej dostępności lub efektywności.
- Deprecation – Wikipedia
- Deprecated Tags and Attributes in HTML – HTMLQuick.com
- Disabling Deprecated HTML Using CSS – David’s Kitchen
DHTML
Skrót od Dynamic HyperText Markup Language (Dynamiczny Hypertextowy Język Znaczników). DHTML łączy XHTML (lub inny język znaczników), DOM (zobacz), JavaScript (lub inny język skryptowy) i CSS (lub inny język definiujący wyświetlanie) w celu stworzenia interaktywnej strony.
- DHTML Tutorial – w3schools
- DHTML/CSS Tutorials – JavaScript Kit
- DHTML Explained – HTMLSource
Dither
W GIFie i innych formatach obrazów istnieje ograniczona paleta kolorów, które mogą być użyte dla każdego obrazu. Z tego powodu, nie wszystkie kolory mogą zostać wyświetlone. Dither oznacza przybliżenie tych kolorów przez kombinację pikseli o innych kolorach leżących obok.
- Color Dithering in GIF Images – Web Developers Notes
- Dithering GIF Images: Optimizing GIF Files – Webdesign.About.com
DNS
Domain Name Service, Domain Name System lub Domain Name Server. Ogólnie, jest to coś, co dokonuje zamiany numerów IP na nazwy domen. Do serwerów DNS dopisywany jest adres IP twojej strony razem z domeną, którą jej przypisujesz. W drugą stronę, kiedy ktoś wpisuje nazwę twojej domeny w przeglądarce, serwery DNS zamieniają nazwę domeny na adres IP i kierują przeglądarkę do odpowiedniego serwera.
- How Domain Name Servers Work – HowStuffWorks
- DNS Resources Directory – dns.net
Doctype
Deklaracja, jaka wersja HTML jest użyta w dokumencie. Ma ona bezpośredni wpływ na to, jak twój kod HTML zostanie zwalidowany (patrz: walidacja).
- HTML DOCTYPE Declaration – w3schools
- Fix Your Site With the Right DOCTYPE! – A List Apart
- Choosing a DOCTYPE – Web Design Group
DOM
Document Object Model (Obiektowy Model Dokumentu). Jest to, niezależna od języka i platformy sprzętowej, konwencja reprezentacji obiektów w dokumentach XML, XHMTL i HTML. Zasady interakcji i programowania DOM są opisane w DOM API.
- DOM (Document Object Model) Reference – JavaScript Kit
- DHTML – HTML DOM – w3schools
- The Document Object Model Dissected – Web Developer’s Virtual Library
Domena
Nazwa, pod jaką identyfikowana jest twoja strona. Do domeny przypisany jest adres IP. Domena może składać się z dowolnej kombinacji liter, myślników (-) i cyfr, ale nie mogą zaczynać się od myślnika. W zależności od rozszerzenia (.com, .net, .org, .pl itp.), domena może składać się z 26-63 znaków.
- Domain Name Information – 4 Creating a Website
- ICANN stands for “Internet Corporation for Assigned Names and Numbers”
- Choosing the Domain Name for Your Blog – ProBlogger
Dostępność (Accessibility)
Generalnie, jest to umożliwienie użytkowniania witryny przez ludzi z upośledzeniami, włączając w to osoby niedowidzące korzystające z czytników ekranu, niedosłyszących, daltonistów i innych. Strona o niskiej dostępności jest praktycznie niemożliwa do użycia przez osoby z tymi upośledzeniami. Dostępność jest szczególnie ważna dla stron dostarczających informacji dla osób z upośledzeniami (służba zdrowia, serwisy administracji publicznej itp.) jednak jest to ważna rzecz do rozważenia przy projektowaniu każdej strony.
- Resources on Accessible Web Design – the University of Washington.
- Website Builder Advice: How to Make a Website Good for Everyone – Mardiros Internet Marketing.
- An Introduction to Accessible Web Design – Sitepoint.
DTD
Document Type Definition (Definicja Typu Dokumentu). Jest jednym z kilku języków do tworzenia schematów dokumentów SGML i XML. Zawiera listę atrybutów, elementów, encji, komentarzy i notatek do użycia w dokumencie oraz określa powiązania między nimi.
- DTD Tutorial – w3schools
- XML DTD – An Introduction to XML Document Type Definitions – XMLFiles.com
- Document Type Definition (DTD) Tools – Stylus Studio
E
E-Commerce
Skrót od electronic commerce (handel elektroniczny). Kupno i sprzedaż towarów za pośrednictwem strony internetowej. Produkty sprzedawane poprzez e-commerce mogą być fizycznymi obiektami wymagającymi wysyłki lub produktami cyfrowymi, dostarczanymi elektronicznie.
- E-Commerce Resources – Inc.com
- The Art of eCommerce Web Design – Sitepoint
- 25+ Magento Templates For Your E-Commerce Business – this site
- 5 Universal Principles For Successful eCommerce Sites – this site
- 35 Free High-Quality E-Commerce Templates – this site
Element
W XMLu element jest głównym składnikiem dokumentu. Poszczególny elementy mogą zawierać w sobie tekst, inne elementy lub wszystkie te rzeczy.
- XML Elements – w3schools
- XML Element – tizag.com
- The Basics of Using XML Schema to Define Elements – IBM
Em
Jednostka miary używana do ustawiania rozmiaru czcionki i innych elementów wewnątrz strony w zależności od elementu nadrzędnego. Czcionka o rozmiarze 1 em jest równa rozmiarem czcionce zdefiniowanej dla elementu nadrzędnego (2 em oznacza czcionkę dwa razy większą, a .5 em — mniejszą o połowę).
- How to Size Text Using Ems – Clagnut
- The Amazing Em Unit and Other CSS Best Practices – InformIT
- Effective Style with em – Monday By Noon
Ex
Miara rozmiaru czcionki zależna od wysokości małej litery x w używanej rodzinie czcionek.
- The CSS ex Unit – Web Matters
- Em Units Versus Ex Units – MozillaZine
F
Farma linków (Link Farm)
Jest to strona stworzona specjalnie w celu zwiększenia popularności innych stron, poprzez zwiększenie liczby zewnętrznych linków do tych stron. Podczas gdy niektóre farmy linków są pojedynczymi stronami z listą niepowiązanych za sobą linków, inne składają się z sieci stron, wymieniających między sobą linki. Wyszukiwarki potrafią rozpoznawać ten typ stron i często usuwają farmy linków ze swoich katalogów i przyznają kary stronom linkującym do i z nich.
- Promotion Tip: Link Farms Grow Spam – NetMechanic
- What is a Link Farm? – Webdesign.About.com
- Link Farm: What It Is and How You Can Identify It – SEO for Blogging
Favicon
Favicony są małymi (zazwyczaj 16×16 lub 32×32 piksele) ikonami wyświetlanymi w większości przeglądarek obok pasku adresu. Są one ustawiane poprzez dodanie odpowiedniego elementu w kodzie HTML przez autora strony. Najczęściej tworzone są w 8- lub 24-bitowej głębi kolorów i zapisywane w formatach .ico, .gif lub .png.
- favicon.cc is an online favicon generator
- FavIcon from Pics creates a favicon from an image
- How to Create a Favicon.ico – PhotoshopSupport.com
Focal point
Jest to miejsce na stronie, które w naturalny sposób przyciąga wzrok. Może to być obraz, banner, text, animacja Flash lub cokolwiek innego. Projektanci chcą mieć pewność, że to, co występuje w focal point jest najważniejszą częścią strony.
- Create a Focal Point for Web Designs – Before and After Web Page Redesign – Webdesign.About.com
- The Focal Point is the Most Important Design Element – Stylish Design
Fold (zgięcie)
Jest to termin wywodzący się z prasy (gdzie fold oznacza fizyczne zgięcie na papierze). Fold na stronie internetowej oznacza punkt, który znajduje się na dole okna tuż po otwarciu strony w przeglądarce (innymi słowy, jeśli chcesz zobaczyć coś, co znajduje się pod zgięciem, musisz użyć kółka myszy lub paska przeglądarki). Istnieją różne opinie na temat tego, jak ważne jest uwzględnienie zgięcia w procesie projektowania strony.
- The Fold Is An unnecessary Design Limitation – Three Minds
- Infatuated with ‘Above the Fold’ Web Design? – 360innovate Blog
- The Scrolling Experience and “The Fold” – graphpaper.com
Font Family (Rodzina czcionek)
Jest to opis definiujący krój czcionki w dokumencie CSS. Własność font-family zawiera listę czcionek, które mogą zostać użyte na stronie i zazwyczaj kończy się ogólną kategorią czcionek (jak „serif” lub „sans-serif”).
- CSS font-family Property – w3schools
- How to Decide Which Font Family to Use – Webdesign.About.com
Font Style
W CSSie, font style określa, czy czcionka ma być pisana kursywą, czy nie.
- CSS font-style Property – w3schools
- CSS Font Style – Hscripts.com
Font Weight
Określa, czy czcionka ma być wyświetlana jak pogrubiona (lub pocieniona) ma być wyświetlana czcionka.
- CSS font-weight Property – w3schools
- font-weight – Mozilla Developer Center
Front-End
Przeciwieństwo back-end. Są to wszystkie elementy witryny, które użytkownik może zobaczyć (strony, obrazy, treść itd.). W szczególności jest to interfejs używany do przemieszczania się po treściach na stronie.. Czasem nazywane jest to User Interface.
- Ten Usability Heuristics – Useit.com
- Writing an Interface Style Guide – A List Apart
G
Graceful Degradation
Oznacza umieszczenie na stronie elementów wykorzystujących możliwości najnowszych przeglądarek w sposób, który umożliwia użytkownikom starszych przeglądarek obejrzenie przynajmniej podstawowych treści na stronie. Oznacza to też upewnienie się, że jeżeli jakaś część strony nie działa w czyjejś przeglądarce, to nie zamyka mu to dostępu do całej strony.
- Graceful Degradation – Dan’s Web Tips
- Graceful Degradation – Viewable with Any Browser
GUI
Graphical User Interface (Graficzny Interfejs Użytkownika). GUI korzysta z urządzeń wejścia (jak mysz) i wizualnej reprezentacji tego, jak użytkownik może oddziaływać na aplikację internetową. Innymi słowy, jest to cały front-end, jaki możesz zobaczyć w aplikacji. Jego celem jest umożliwienie interakcji z aplikacją bez potrzeby pisania kodu.
- Graphical User Interface – Wikipedia
- Principles of Good GUI Design
- A Summary of Principles of User-Interface Design
H
Heksadecymalne
Oznaczany także jako liczby „hexowe”, oparte są na systemie szesnastkowym i są wykorzystywane do definiowania kolorów. Liczby w systemie szesnastkowym składają się z cyfr 0-9 i liter A-F. Kolory heksadecymalnie zapisywane są w trzech parach znaków. Jest tak, ponieważ kolory ekranu zbudowane są z trzech składowych: RGB (Red, Green, Blue — Czerwony, Zielony, Niebieski). Pierwsza para znaków definiuje barwę czerwoną, druga — zieloną, a trzecia — niebieską.
- The Hex Hub is a chart to help choose hexadecimal colors
- 500+ Colors – cloford.com
- Color Charts – Webmonkey
Hit
Wbrew powszechnej opinii, hit nie oznacza pojedynczego użytkownika na stronie. Pojęcie to odnosi się do ściągnięcia pojedynczego pliku z twojego serwera. Oznacza to, że jedna strona może wygenerować wiele hitów, ponieważ każda strona składa się zazwyczaj z więcej niż jednego pliku (.html lub inny podstawowy plik, plik .css, różne obrazy itp.) i każdy z nich jest ściągany z serwera podczas ładowania strony. Niektórzy marketingowcy mają w zwyczaju przedstawiać liczbę hitów nieświadomym klientom, ponieważ sprawia to wrażenie, że na stronie panuje o wiele większy ruch niż jest to w rzeczywistości.
- The Difference Between Hits, Visitors, Visits, and Page Views – Opentracker
- Hits Explained – MediaCollege.com
.htaccess
Plik .htaccess jest to domyślny plik konfiguracyjny serwera Apache dla katalogu, w którym się znajduje. Dyrektywy konfiguracyjne zawarte w pliku .htaccess odnoszą się do katalogu, w którym plik ten się znajduje oraz do jego pod katalogów. W pliku .htaccess można określić takie rzeczy, jak autoryzację, autentyfikację, przepisywanie URLi, kontrolę pamięci podręcznej i własne strony błędów serwera.
- Comprehensive Guide to .htaccess – JavaScriptKit
- .htaccess Cheatsheet – The Jackol’s Den
- Htaccess Tools gives tools to generate an .htaccess file
HTML
Skrót od Hypertext Markup Language (Hypertekstowy Język Znaczników). Jest to podstawowy język używany na stronach internetowych. HTML został zaprojektowany przede wszystkim do zapewnienia odpowiedniej struktury treści na stronie (wspólnie z CSSem obsługującym layout i kwestie stylistyczne), jednak może być także wykorzystany do określenia, jak ma być wyświetlana treść.
- HTML Tutorial – w3schools
- HTML Code Tutorial provides comprehensive HTML tutorials
- HTML Primer – HTML Goodies
HTTP
HyperText Transfer Protocol (Protokół Przesyłania Dokumentów Hypertekstowych). Jest to zestaw reguł obsługujących przesyłanie zapytań hypertekstowych między przeglądarkami a serwerami.
- HTTP – Hypertext Transfer Protocol – W3C
- HyperText Transfer Protocol – Web Developer’s Virtual Library
HTTPS
Skrót od HyperText Transfer Protocol over SSL (Secure Socket Layer) lub HyperText Transfer Protocol Secure. Podobnie jak HTTP jest to zbiór reguł komunikacji między przeglądarkami a serwerami, ale tym razem wykonywane jest to za pomocą bezpiecznego, szyfrowanego połączenia.
- HTTP Secure – Wikipedia
- Hypertext Transfer Protocol over Secure Socket Layer – Freebase
Hyperlink
Hyperlink jest to link z jednej strony do innej, wewnątrz witryny lub poza nią. Mogą one być tekstem lub obrazem i są w jakiś sposób wyróżnione (tekst często poprzez podkreślenie, zmieniony kolor czcionki lub jej grubość). Istnienie hyperlinków stanowi część „hyper” w „hypertext”.
- Creating Hyperlinks – Iron Spider
- How to Create a Hyperlink in Dreamweaver – Webdesign.About.com
Hypertext
Jest to tekst w komputerze zawierający hyperlinki. Może także zawierać inne formy prezentacji danych takie, jak tabele lub obrazy, jako dodatek to czystego tekstu i linków.
- Hypertext – Wikipedia
- The Definition of Hypertext and Its History as a Concept – Cyber Arts Web
I
iFrame
Skrót od Inline Frame. Iframe jest używany do wyświetlania jednej lub wielu stron www wewnątrz innej strony (która nie jest stroną zawierającą frameset).
- HTML iFrame Tag – w3schools
- Scripting iFrames—Tutorial and Examples – Dynamic Web Coding
- Remote Scripting with IFRAME – Apple Developer Connection
Image Map (Mapa obrazu)
Jest używana w XHTMLu, aby pozwolić różnym elementom obrazu na bycie klikalnymi elementami (równocześnie pozwala pewnym częściom obrazu na bycie elementami nieklikalnymi).

- How to Make and Image Map – HTML Code Tutorial
- How-To: Creating Image Maps – Elated
- CSS Image Maps – Frank Manno
Inheritance (dziedziczenie)
W CSS elementy, które nie posiadają predefiniowanych styli, przejmują je od swojego rodzica w drzewie dokumentu.
- Inheritance and Cascading Styles in CSS – Web Design from Scratch
- Cascading Order and Inheritance in CSS – David’s Kitchen
- CSS Cheat Sheet: Inheritance, Cascade, Specificity – Community MX
J
K
Komentarz
W projektowaniu stron komentarz jest to informacja zawarta w plikach HTML lub XHTML, która jest ignorowana przez przeglądarkę. Stosowane są do oznaczenia różnych części pliku i jako notatki dotyczące kodu. Dobre komentarze ułatwiają projektantowi (autorowi strony lub komuś wprowadzającemu poprawki) zmiany na stronie, pomagając w określeniu, jaka część kodu pełni jaką funkcję. Istnieją różne rodzaje komentarzy dla różnych języków programowania i języków znaczników.
- HTML Comment Tag – w3schools.com
- Adding HTML Comments – Page Resource
- Good Comments Make Good HTML – AstaHost
L
LAMP
Skrót od Linux, Apache, MySQL i PHP (czasem zastąpiony przez Perla lub Pythona). Odnosi się on do specyfikacji serwera (definiuje odpowiednio: system operacyjny, serwer www, bazę danych i język skryptowy). Jedną z zalet specyfikacji LAMP jest to, że używane oprogramowanie jest darmowe i open source.
- Building a LAMP Server – LAMP How To
- LAMP (Software Bundle) – VisWiki
Landing Page
Strona, na którą użytkownik wchodzi jako pierwszą w witrynie. Często tworzona jest specjalna landing page w celu zachęcenie nowego użytkownika do specjalnej wykonania specyficznej akcji (związanej zazwyczaj z jakąś kampanią reklamową lub marketingową).
- Landing Page Tutorials and Case Studies – Copyblogger
- 11 Ways to Improve Landing Pages – Digital Web Magazine
- 14 Instant Landing Page Upgrades – Conversation Marketing
Layout elastyczny (Elastic Layout)
Layout wykorzystujący procenty i em’y wspólnie z własnością max-width w celu umożliwienia layoutowi strony dopasowanie się, kiedy użytkownik zmienia rozmiar czcionki. Potrafi on dopasować się do szerokości przeglądarki i rozmiaru czcionki.
- Elastic Design – A List Apart
- The Incredible Em & Elastic Layouts with CSS – Jon Tangerine
- Archive for Elastic Layout – CSSGlance Gallery
- Elastic Layouts Still Have Issues – StevenClark.com.au
Layout o stałej szerokości (Fixed Width Layout)
Layout o stałej szerokości posiada ustaloną (najczęściej w pikselach) przez projektanta szerokość. Nie zmienia się ona niezależnie od rozdzielczości ekranu, rozmiaru monitora, czy wielkości okna przeglądarki. Pozwala on na wprowadzanie na poczekaniu zmian w designie, które będą takie same dla wszystkich przeglądarek. Projektanci mają większą kontrolę nad tym, jak strona jest wyświetlana na różnych platformach.
- Creating a Fixed-Width Layout with CSS – TechRepublic
- CSS Layouts: The Fixed. The Fluid. The Elastic. – Beast-Blog.com
- Fixed-Width CSS Layouts – Search Engine Friendly Layouts
Layout płynny (Fluid Layout, Liquid Layout)
Layout płynny opart jest na procentach rozmiaru okna przeglądarki. Będzie się on zmieniał w zależności od szerokości przeglądarki, nawet jeśli użytkownik zmieni rozmiar okna w trakcie przeglądania strony. Layouty tego typu w pełni korzystają z informacji o szerokości okna przeglądarki, dopasowując informację, aby cały czas mieściła się na ekranie.
- Liquid Layouts the Easy Way – Max Design
- Create a Simple Liquid Layout – .net Magazine
- The Perfect 3 Column Liquid Layout – Matthew James Taylor
- Creating Liquid Layouts with Negative Margins – A List Apart
Link zewnętrzny (Backlink)
Linki zewnętrzne to linki z innych strony do twojej. Czasem nazywane są też „trackbackami” (szczególnie na blogach). Linki zewnętrzne mają duży wpływ na pozycję strony w wynikach wyszukiwania. Dużo linków zewnętrznych ze stron o dobrej pozycji w wyszukiwarkach może znacząco polepszyć wyniki wyszukiwania twojej strony, szczególnie jeśli w tekstach odnośników użyte zostały odpowiednie słowa kluczowe.
- Why That Site with 50 Backlinks Beats Your Site with 1000 Backlinks – Jim Boykin’s Blog.
- PageRank Checker for Your Backlinks – Smark PageRank
- The Importance of Backlinks – webconfs.com
Limit transferu
Całkowita ilość danych, jakie mogą być przesłane z serwera w ciągu miesiąca (lub innego okresu określonego przez dostawcę hostingu). Po przekroczeniu tego limitu, najczęściej konieczna jest dodatkowa opłata w celu wykupienia większego limitu transferu.
M
Markup
Pojęcie to odnosi się do konwersji zastosowanej w dokumencie tekstowym w celu przerobienia go w dokument HTML, XML lub innego języka znaczników.
- Bulletproof HTML: 37 Steps to Perfect Markup – Sitepoint
- Markup as a Craft– Digital Web Magazine
- Markup Guide– Mezzoblue
Meta dane (Meta Data)
Meta dane to dane zawarte w części head dokumentu HTML i zawierają informacje o stronie. Informacje te nie są widoczne poza kodem źródłowym. Meta dane zawarte są w metatagach.
- An Introduction to Metadata – The University of Queensland
- META—Metadata – Web Design Group
Meta tag
Meta tag jest to tag HTML użyty do dołączenia meta danych do części head twojej strony.
- How to Use HTML Meta Tags – Search Engine Watch
- Meta Tag Generator – AddMe.com
- HTML Meta – w3schools
N
Nawigacja
Nawigacja oznacza system, który pozwala użytkownikom twojej strony na poruszanie się po niej. Najczęściej jest przez nią rozumiane menu, ale linki wewnątrz strony, breadcrumbs, linki do podobnych materiałów, paginacja i wszystkie inne typy linków, które pozwalają użytkownikowi na poruszanie się po witrynie, są również częścią nawigacji.
- The 8 Types of Navigation Pages – User Interface Engineering
- Basic Principles of Web Site Navigation – Web Developer’s Journal
- CSS Menus – 13styles
Non-Breaking Space
Oznaczana także jako . Jest białym znakiem, który nie jest pomijany przez HTML. Jej głównym zadaniem jest wypełnianie pustych komórek tabeli lub dodawanie przerw między wyrazami (lub na początku akapitu, jeśli potrzebne jest wcięcie).
- In HTML, What is a Non-Breaking Space? – Indiana University’s University Information Technology Service Knowledge Base
- Non-Breaking Space on Wikipedia
O
Odsłona (Pageview)
Odsłona jest ściągnięciem całego dokumentu strony z serwera przez przeglądarkę użytkownika. Innymi słowy, każda odsłona twojej strony oznacza, że ktoś (lub robot wyszukiwarki) oglądał ją.
- Pageviews are Obsolete – Evhead
- Page View Metrics? Bah, Humbug! – Matt Cutts
- Tyranny of the Page View Nearly Over? – ReadWriteWeb
Open Source
Open source oznacza kod źródłowy programu komputerowego, który został udostępniony publicznie. Programami open sourcowymi mogą być zarówno aplikacje internetowe, jak i instalowane na komputerze. Programy te są najczęściej darmowe lub bardzo tanie, a pisane są przez zespoły ludzi, czasem składające się głównie z wolontariuszy.
- Open Source Initiative
- The Open Source Web Design Toolbox: 100 Web Design Template Sources, Tools and Resources – Design Vitality
- 30 Useful Open Source Apps for Web Designers – Six Revisions
P
Permalink
Skrót od „permanent link”. Używane głównie na blogach, permalink jest linkiem, który jest stałym adresem danego posta. Ponieważ zawartość większości blogów często się zmienia, permalink oferuje możliwość zapisania posta w ulubionych stronach lub linkowania do niego, nawet kiedy zostanie już usunięty ze strony głównej lub głównej kategorii na blogu.
- What is a Permalink and Why Do I Need It? – Blogging Basics 101
- Using Permalinks – the WordPress Codex
Plug-in
Często pisany razem jako „plugin”. Jest to kawałek kodu od osób trzecich, który rozszerza możliwości strony. Najczęściej używany jest w połączeniu z CMSem lub platformą do blogów. Pluginy są sposobem na dodanie nowych funkcjonalności do strony bez potrzeby przeprogramowywania jej głównej części. Termin plugin może odnosić się też do oprogramowania od osób trzecich instalowanego wewnątrz programu komputerowego w celu zwiększenia liczby jego funkcji.
- 22 Firefox 3 Plugins Web Designers Can’t Live Without – Design Reviver
- Designing Plugins for Reuse – Intellectual Cramps
- Writing a Plugin – the WordPress Codex
Pseudo-Element
Pseudo-element jest specjalnym elementem dodawanym do selektora CSS w celu uzyskania specjalnego efektu.
- CSS Pseudo-Elements – w3schools
- Learn CSS, Part 7: Pseudo Elements – Dev Articles
- Understanding Pseudo-Elements – Snook.ca
Pseudo-klasa
Podobnie jak pseudo-elementy, pseudo-klasy są używane w celu dodania specjalnych elementów do selektorów CSS.
- Learn CSS: Pseudo Classes – Dev Articles
- Pseudo Classes – HTML Dog
Progressive Enhancement
Jest to strategia w projektowaniu stron polegająca na zastosowaniu technologii internetowych w sposób warstwowy, co pozwala każdemu na obejrzenie podstawowej wersji strony korzystając z dowolnej przeglądarki i łącza internetowego, jednocześnie zapewniając rozszerzoną wersję strony dla użytkowników z połączeniem o większej przepustowości i bardziej zaawansowanymi przeglądarkami.
- Understanding Progressive Enhancement – A List Apart
- Progressive Enhancement with CSS – Aaron Gustafson
- Progressive CSS Enhancemen – John Resig
- Pragmatic progressive enhancement – why you should bother with it – Christian Heilmann
Przeglądarka
Jest to program, korzystając z którego, użytkownik przegląda strony internetowe. Przykładami przeglądarek mogą być Safari, Firefox, Google Chrome, Opera, Internet Explorer.
- BrowserShots lets you check cross-browser compatibility of any site
- Accessible Design Guide – Viewable with Any Browser
- Designing for Every Browser: How to Make Your Site Fully Cross Browser Compatible – Design Vitality
Przepustowość
Prędkość z jaką dane mogą być przesyłane. Najczęściej używaną jednostką są bity na sekundę (bps), kilobity na sekundę (kbs) lub inna ich wielokrotność. Mniejsza przepustowość połączenia z internetem (na przykład połączenie telefoniczne — dial-up) oznacza, że dane są ściągane wolniej niż przy połączeniu o dużej przepustowości (kabel lub światłowód).
- Speed Test – Speakeasy
- Bandwidth Explained – FindMyHosting.com
R
Rozdzielczość
Fizyczna liczba pikseli wyświetlana na ekranie (na przykład 1280×1024). W przeciwieństwie do druku, rozdzielczość wyświetlana nie przekłada się na liczbę pikseli lub punktów na cal ekranu, ponieważ może zostać zmieniona poprzez zmianę rozdzielczości ekranu (co, oczywiście, nie wpływa na fizyczne wymiary ekranu). Rozdzielczość obrazu może być odniesiona do liczby pikseli na cal, jednak nie wpływa to na sposób, w jaki wyświetlany jest on na ekranie.
- Display Resolution – Wikipedia
- Monitors: Resolution – thescreamonline.com
RSS (Really Simple Syndication)
Jest to standaryzowany format XML, który pozwala na rozpowszechnianie treści z jednej strony na inną. Jest on powszechnie stosowany na blogach. RSS pozwala także użytkownikom na subskrybowanie bloga lub strony i otrzymywanie aktualności za pomocą czytnika RSS.
- What is RSS? RSS Explained – whatisrss.com
- RSS 2.0 Specification – RSS 2.0 at Harvard Law
- What is RSS? – Software Garden
S
Schema
Ogólnie rzecz biorąc, jest to dokument XML używany zamiast DTD do opisywania innych dokumentów XML.
- XML Schema Tutorial – w3schools
- Practical XML Schema – JavaWorld
- XML Schema Tools (XSD) – Stylus Studio
Selektor
W CSSie, selektor jest elementem do którego zostanie zastosowany dany styl.
- Selectutorial CSS Selectors – Max Design
- Performance Impact of CSS Selectors – High Performance Web Sites Blog
- CSS Advanced Selectors—Functional and Design Specification – Adobe Open Source
Semantic Markup
Semantic Markup oznacza, że treść zapisana jest wewnątrz tagów XHTML, która informują o kontekście, w jakim została ona użyta. Podstawowy semantic markup odnosi się do używania elementów takich jak nagłówki i akapity, ale jego użycie można rozszerzyć o wiele więcej użytecznych kontekstów, w celu zapewnienia na stronie o wiele pełniejszej semantyki.
- Writing Semantic Markup – Digital Web Magazine
- Explaining Semantic Markup – Robert’s Talk
- The Definitive Guide to Semantic Web Markup for Blogs – Pearsonified
Serwer
Serwer jest komputerem z zainstalowanym odpowiednim oprogramowaniem i możliwościami sprzętowymi, które pozwalają mu na obsługę stron internetowych i czynią go dostępnym dla użytkowników z całego internetu. Istnieje kilka różnych konfiguracji, które mogą być użyte dla serwera, włączając w to wspomniany wcześniej LAMP.
- How Web Servers Work – HowStuffWorks
- Geek to Live: How to Set Up a Personal Home Web Server – Lifehacker
- The Apache Software Foundation provides the open source Apache web server software
Server-Side
Server-side oznacza, że skrypt wykonywany jest na serwerze, w przeciwieństwie do skryptów client-side, wykonywanych w przeglądarce użytkownika. Skrypty server-side często wykonują się dłużej, ponieważ strona musi zostać przeładowana po akcji ze strony użytkownika.
- Server-Side Scripting Primer – w3schools
- Server Side Scripting Tutorials – Bytes
- Client Side or Server Side, What’s the Difference? – Web Site Owner
SGML
Standard Generalized Markup Language (Standardowy Uogólniony Język Znaczników). Jest to język znaczników używany do definiowania struktury dokumentu. SGML nie jest często wykorzystywany, ale jest językiem obsługującym podstawowe rzeczy zarówno dla XML, jak i dla HTML.
Skrypt
Generalnie pojęcie to odnosi się do części kodu w dokumencie HTML, który sprawia, że jest on bardziej dynamiczny i interaktywny. Skrypty mogą być pisane w wielu różnych językach, takich jak na przykład JavaScript.
- PHP Tutorial: Writing Your First PHP Script: Feedback Form Script – thesitewizard.com
- HTML Scripts – tizag.com
- Basic JavaScript – HTMLSource
SOAP
Simple Object Access Protocol. Protokół oparty na XMLu, służący do wymiany informacji przez internet. Pozwala aplikacjom na jednej stronie na dostęp do aplikacji lub bazy danych na innej.
- SOAP Tutorial – w3schools
- Simple Object Access Protocol – scottnichol.com
- SOAP, the Simple Object Access Protocol – Web Developer’s Virtual Library
Specyfikacja
Specyfikacja jest dokumentem zawierającym jasne definicje i wymagania dla serwisu internetowego lub technologii. Zazwyczaj zawiera też informacje, jak ta technologia będzie używana, jak również tagi, elementy i inne zależności.
- List of Web Service Specifications – Wikipedia
- W3C—Worldwide Web Consortium develops specifications for any internet technologies
Standardy internetowe
Standardy są specyfikacjami rekomendowanymi przez World Wide Web Consortium (W3C) dla ustandaryzowania projektowania stron. Głównym ich celem jest ułatwienie zarówno projektantom stron, jak i twórcom przeglądarek, aby strony miały spójny wygląd bez względu na platformę.
- Web Standards – The Motive Web Design Glossary
- World Wide Web Consortium
- What Are Web Standards? A Comprehensive Explanation of What is Comprised in the Term – Robert’s Talk
- Web Standards Checklist – Max Design
Strona
W języku polskim, terminem tym określa się zarówno pojedyncze dokumenty, jak i całe serwisy. W tym pierwszym znaczeniu, jest to najczęściej dokument HTML przeznaczony do wyświetlania w przeglądarce. W wielu przypadkach strony zawierają w sobie kod w innych językach takich jak PHP, Ruby on Rails lub ASP. Strony w drugim znaczeniu tego słowa składają się z wielu stron pierwszego rodzaju.
- Web Page – Wikipedia
- How Web Pages Work – HowStuffWorks
Styl inline
Styl zapisany w atrybucie elementu, którego dotyczy, zamiast w nagłówku dokumentu lub w osobnym arkuszu stylu.
- Inline Style Sheets – Quackit.com
- Css Tutorial—Inline Style – Howtocreate.co.uk
Styl wbudowany (Embedded Style)
Jest to kod CSS zapisany w części head dokumentu XHTML. Wpływa on tylko na elementy na tej stronie w przeciwieństwie do kodu zamieszczonego w osobnym pliku CSS, który może być dołączony do wielu stron jednocześnie. Style z wbudowanego fragmentu kodu nadpisują ewentualne style z dołączonego zewnętrznego pliku CSS.
- Embedded Style Sheets – Quackit.com
- CSS Embedded Styles – htmlite
Styl zewnętrzny
Kod CSS zapisane w osobnym dokumencie. Największą zaletą korzystania z zewnętrznych arkuszy stylów jest możliwość dołączenia ich jednocześnie do wielu plików HTML/XHTML, co oznacza, że zmiany wprowadzone w tym pliku będą miały wpływ na wszystkie pozostałe dokumenty bez potrzeby edycji każdego z nich.
- CSS How To… – w3schools
- How to Use External Cascading Style Sheets (CSS) on Web Pages – Webdesign.About.com
- Using External CSS Style Sheets – Tech-Evangelist
Szablon (Template)
Template jest to plik używany do stworzenia na stronie spójnego designu. Często są używane w połączeniu z CMSem i zawierają zarówno informacje o strukturze strony, jak i informacje o tym, jak powinna ona wyglądać.
- 44 Tutorials for Creating Web Templates – ARTEgami
- Dreamweaver Tutorial: How to Use Templates to Manage Your Website in Dreamweaver CS3 – thesitewizard.com
- Making a Template in Photoshop – voidix
T
Tekst odnośnika (Anchor Text)
Tekst użyty w linku kierującym do twojej strony. Jego treść może mieć duże znaczenie dla wyników wyszukiwania twojej strony. Zobacz także: Link zewnętrzny (Backlink).
- Anchor Text Explained – AssociatePrograms.com
- Anchor Text Optimization – WebProNews
- How to Make an HTML Anchor Text Link – DomainBean
- Backlink Anchor Text Analysis – webconfs.com
Tag
Zestaw znaczników określających początek i koniec elementu. Mogą one zawierać HTML lub inny kod w celu określenia, jak dane elementy mają wyglądać lub zachowywać się na stronie (zobacz także: Tag HTML).
- HTML Tags / Codes / Web Page Design – Web Source
- Tag List – davesite.com
- Overview of All Tags – Web Design Group
Tag HTML
Nazywane także elementem HTML. Jest to część kodu opisująca, jak dana część strony ma być formatowana. Typowe tagi określają takie rzeczy jak nagłówki, akapity, linki i wiele innych elementów.
- HTML Tags – Webdesign.About.com
- HTML Tags – HTML Dog
- HTML Tag Quick Reference Guide – DevX.com
U
URL
Uniform Resource Locator (Ujednolicony Format Adresowania Zasobów). URL strony to jej adres, określający, gdzie w internecie się ona znajduje.
- Uniform Resource Locator – Wikipedia
- Uniform Resource Locators – W3C
Usability
Usability określa, jak łatwo użytkownikom używać twojej strony w celach, do jakich została ona stworzona. Innymi słowy, nawigacja, treść, obrazy i inne interaktywne elementy są łatwe w użyciu, funkcjonują zgodnie z oczekiwaniami, a użytkownicy, dla których została przygotowana twoja strona, nie potrzebują żadnego specjalnego przeszkolenia w posługiwaniu się nią.
- Website Design – Usability First
- 10 Principles Of Effective Web Design – this site
- 25-Point Website Usability Checklist – User Effect
- The Ultimate Webdesign Usability Checklist – Not Usable
W
Własność (Property)
Własność jest pojęciem związanym z CSS. Własności określają sposób wyświetlania strony.
- CSS Properties – HTML Dog
- CSS Properties Index – Jens Meiert
- Complete CSS Guide—Properties Introduction – Westciv
X
XHTML
Skrót od eXtensible HyperText Markup Language (Rozszerzalny Hypertekstowy Język Znaczników). Zasadniczo, XHTML jest HTMLem 4.0, który został przepisany, aby spełniać wymogi XMLa.
- XHTML Reference
- XHTML Explained – HTMLSource
- XHTML Tutorial – Quackit.com
XML
Extensible Markup Language (Rozszerzalny Język Znaczników). Używany do pisania własnych języków znaczników. Innymi słowy, XML określa, jak pisać nowe języki (jest przez to czasem nazywany „meta” językiem). Ponadto dostarcza podstawową składnię, co pozwala różnym rodzajom komputerów i aplikacji na dzielenie się informacjami bez potrzeby przechodzenia przez wiele warstw konwersji.
- XML – Wikipedia
- XML Tutorial – w3schools
- XML.com – O’Reilly Media
Y
Z
Zagnieżdżanie (Nesting)
Oznacza umieszczanie jednego elementu HTML wewnątrz innego. Przy stosowaniu tego, trzeba pamiętać o zamykaniu elementów w odwrotnej kolejności niż zostały otwarte.
- Nesting – Dan’s Web Tips
- Grouping and Nesting – HTML Dog
Złe sąsiedztwo (Bad Neighborhood)
Pojęcie to odnosi się do serwerów, na których utrzymywana jest twoja strona. Strona znajdująca się na serwerach hostujących inne strony zajmujące się spamem lub stosujące zakazane przez przeglądarki techniki pozycjonowania (Black Hat SEO) może zostać ukarana gorszą pozycją w wynikach wyszukiwania jedynie za sąsiadowanie z nieodpowiednimi stronami. Innymi słowy, trzeba uważać, jaką firmę hostingową wybieramy, jaki jest jej regulamin i jak konsekwentnie jest on egzekwowany wobec stron naruszających go, aby uniknąć zostania ukaranym za złe sąsiedztwo. Umieszczanie na swojej stronie linków do stron zaliczanych do złego sąsiedztwa również może mieć negatywny wpływ na pozycję strony w wyszukiwarkach.
- Is Your Site Living in a Bad Neighborhood? – RSS Pieces
- Text Link Checker Tool – Bad Neighborhood
- SEO Pitfalls: Outbound Links to Bad Neighborhood Websites – Consider: Open
Zwalidowana
Strony zwalidowane są to takie strony, które nie posiadają błędów zależnych od wersji HTML/XHTML zadeklarowanej na początku pliku. Innymi słowy, kod użyty na tej stronie spełnia wymogi specyfikacji danej wersji HTML/XHTML. Można to sprawdzić przy pomocy różnorodnych walidatorów. Najczęściej stosowanym jest ten na stronach W3C.
- W3C Markup Validation Service
- Validating a Website – the WordPress Codex
- How To: Validating Your Website The Easy Way—Part 1 – Blog Ingenuity








































