Tworzenie stron internetowych typu front-end

Tworzenie stron internetowych typu front-end to opracowywanie graficznego interfejsu użytkownika witryny internetowej za pomocą HTML , CSS i JavaScript , aby użytkownicy mogli przeglądać tę witrynę i wchodzić z nią w interakcję.

Narzędzia wykorzystywane do rozwoju front-endu

Dostępnych jest kilka narzędzi i platform, takich jak WordPress , Joomla i Drupal , których można użyć do opracowania interfejsu strony internetowej.

Hipertekstowy język znaczników

HyperText Markup Language (HTML) jest podstawą każdego procesu tworzenia strony internetowej, bez której strona internetowa nie istnieje. Hipertekst oznacza, że tekst zawiera łącza, zwane hiperłączami, osadzone w nim. Kiedy użytkownik kliknie słowo lub frazę, która ma hiperłącze, wyświetli się kolejna strona internetowa. Język znaczników wskazuje, że tekst można przekształcić w obrazy, tabele, łącza i inne reprezentacje. To kod HTML zapewnia ogólne ramy tego, jak będzie wyglądać witryna. HTML został opracowany przez Tima Bernersa-Lee . Najnowsza wersja HTML nosi nazwę HTML5 i została opublikowana 28 października 2014 r. przez W3C rekomendacje. Ta wersja zawiera nowe i wydajne sposoby obsługi elementów, takich jak pliki wideo i audio.

Kaskadowe arkusze stylów (CSS)

Kaskadowe arkusze stylów (CSS) kontrolują aspekt prezentacji witryny i pozwalają nadać jej własny, niepowtarzalny wygląd. Czyni to, utrzymując arkusze stylów, które znajdują się nad innymi regułami stylów i są wyzwalane na podstawie innych danych wejściowych, takich jak rozmiar ekranu urządzenia i rozdzielczość. CSS można dodać zewnętrznie, wewnętrznie lub osadzić w tagach HTML.

JavaScript

JavaScript to imperatywny język programowania oparty na zdarzeniach (w przeciwieństwie do deklaratywnego modelu języka HTML), który służy do przekształcania statycznej strony HTML w dynamiczny interfejs. Kod JavaScript może wykorzystywać obiektowy model dokumentu (DOM), dostarczany przez standard HTML, do manipulowania stroną internetową w odpowiedzi na zdarzenia, takie jak dane wprowadzane przez użytkownika.

Korzystając z techniki zwanej AJAX , kod JavaScript może również aktywnie pobierać zawartość z sieci (niezależnie od pobierania oryginalnej strony HTML), a także reagować na zdarzenia po stronie serwera, dodając prawdziwie dynamiczny charakter do strony internetowej.

WebAssembly

WebAssembly , wspierany przez wszystkie główne przeglądarki (tj. od głównych dostawców Google, Apple, Mozilla i Microsoft), jest jedyną alternatywą dla JavaScript do uruchamiania kodu w przeglądarkach internetowych (bez pomocy wtyczek, takich jak Flash , Java czy Silverlight ; wszystkie są wycofywane, ponieważ przeglądarki rezygnują z obsługi wtyczek). Przed jego przyjęciem istniał asm.js (podzbiór języka JavaScript, a zatem ściśle działający we wszystkich przeglądarkach), który jest również używany jako cel kompilatora z wydajną obsługą w przeglądarkach, takich jak Internet Explorer 11 ; a dla takich przeglądarek, które nie obsługują bezpośrednio WebAssembly, można je skompilować do asm.js i tych przeglądarek obsługiwanych w ten sposób. Mówiąc ogólnie, programiści nie programują bezpośrednio w WebAssembly (lub asm.js), ale używają języków takich jak Rust, C lub C++ lub teoretycznie dowolnego języka, który się do niego kompiluje.

Cele rozwoju

Twórca interfejsu użytkownika pamięta o tych kwestiach, wykorzystując dostępne narzędzia i techniki, aby osiągnąć ten cel.

Dostępność

W związku z ciągłym rozwojem urządzeń mobilnych, takich jak smartfony i tablety, projektanci muszą zadbać o to, aby ich witryna wyświetlała się poprawnie w przeglądarkach na wszystkich urządzeniach. Można to zrobić, tworząc responsywny projekt strony internetowej za pomocą arkuszy stylów w CSS.

Wydajność

Cele wydajnościowe dotyczą głównie czasu renderowania, manipulowania HTML, CSS i JavaScript, aby zapewnić szybkie otwarcie witryny.

Szybki rozwój

Technologia ta umożliwia szybki rozwój i oszczędność czasu.