Forum: PC-Programmierung HTML: Einsprungpunkt definieren


von Walter T. (nicolas)


Lesenswert?

Hallo zusammen,

ich weiß: HTML programmiert man nicht, HTML schreibt man. Aber alle 
anderen Themenkreise passen noch schlechter.

Ich habe eine Website, die einen so großen Seitenkopf hat, daß man auf 
einem Mobilgerät schon das ganze Bild mit Seitenkopf voll hat. Bis zur 
ersten Überschrift muß man ein ganzes Stück herunterscrollen. Dieser 
Seitenkopf muß auch da bleiben (decided by management).

Gibt es einen Weg, in einer HTML-Datei einen Einsprungpunkt zu 
definieren, ab dem eine HTML-Datei automatisch geöffnet wird? Sozusagen 
ein default-Anker (so wie die index.html die default-Datei in einem 
Verzeichnis ist).

Viele Grüße
W.T.

von Sven W. (Gast)


Lesenswert?

Hallo Walter

Den Anker kannst du doch beliebig in deinem HTML definieren. Ich mache 
das beispielsweise bei Fehlermeldungen.

Dazu definiere ich zuerst den Anker und springe dann per Javascript 
dorthin.
Im Beispiel ist "Notice" die ID des Ankers.
1
<script type="text/javascript">
2
    window.onload = function ()
3
    {
4
        if (document.getElementById('Notice'))
5
  {
6
      window.location.hash = '#Notice';
7
  }            
8
    }
9
</script>
10
11
<h3 id="Notice">...</h3>

MfG Sven

von Rufus Τ. F. (rufus) Benutzerseite


Lesenswert?

Afaik nein; Du könntest aber Deinem Management vorschlagen, auf 
Mobilgeräte eine alternative Version mit reduziertem Seitenkopf 
auszuliefern. Das kann der Webserver nämlich durchaus erkennen, und auch 
nur mittelmäßig gute Webseiten sind i.d.R. sozusagen "bilingual" 
aufgebaut.

Wenn das Management das nicht will, will das Management offensichtlich 
nicht, daß die Webseite mit Mobilgeräten betrachtet wird.

Alternativ müsstest Du für Dich beim Seitenaufruf Deinen gewünschten 
Anker an die URL anhängen. Von Hand geht das.

Du könntest den Webserver auch so konfigurieren, daß er Inhalte auf 
Mobilgeräte mit an die URL angehängtem "scrolle-seitenkopf"-Anker 
ausliefert.

von Autoit (Gast)


Lesenswert?

Ein Anker definieren und nach dem laden automatisch zum anker springen
https://devopsworld.de/724

von Walter T. (nicolas)


Lesenswert?

Hallo zusammen,

danke für die Antworten.

Sven W. schrieb:
> per Javascript

Javascript habe ich bis jetzt geschafft, bei aktuellen Projekten 
komplett zu vermeiden. Aus dem Alter bin ich draußen.

Rufus Τ. F. schrieb:
> Du könntest den Webserver auch so konfigurieren, daß er Inhalte auf
> Mobilgeräte mit an die URL angehängtem "scrolle-seitenkopf"-Anker
> ausliefert.

Hallo Rufus,

das klingt sehr interessant. Ich muß mich mal in einlesen, ob das 
möglich ist, Verweise ohne Anker mit einem Redirect auf eine bestimmten 
Anker zu versehen, und ob ich mir damit nicht andere Schwierigkeiten 
einhandele.

Viele Grüße
W.T.

von Cyblord -. (Gast)


Lesenswert?

Walter T. schrieb:
> Javascript habe ich bis jetzt geschafft, bei aktuellen Projekten
> komplett zu vermeiden. Aus dem Alter bin ich draußen.

Aja, ... und diese "aktuellen Projekte" sind Vereinswebseiten für 
Hintertupfingen?

Bist du der Zeinerling der Webentwicklung?

von Walter T. (nicolas)


Lesenswert?

Abradolf L. schrieb:
> Aja, ... und diese "aktuellen Projekte" sind Vereinswebseiten für
> Hintertupfingen?

Genau. Irgendwer muß die schließlich auch machen.

von Pandur S. (jetztnicht)


Lesenswert?

Ich empfehl php.

von Weinbauer (Gast)


Lesenswert?

Responsive Webdesign ...

Ist heutzutage n echtes Problem, früher hat man für PC-Bildschirm 
designt und gut war, heut hat man zig Betriebssysteme und Bildschirme.

Zum Problem ... Du kannst den Kopf in n DIV packen und per css bei 
Auflösung kleiner x den div auf display: none setzen

von Weinbauer (Gast)


Lesenswert?

PS: mit php eher schwierig, weil der Server nur etwas umständlich an die 
bildschirmauflösung kommt, normalerweise garnicht.
JS geht, bei noscript wirds dann doof.

von Frank E. (Firma: Q3) (qualidat)


Lesenswert?

Die Unterscheidung unterschiedlicher Bildschirmgrößen bzw. 
Geräte-Kategorien realisiert man per CSS.

Man legt unterschiedliche CSS-Files an und je nach Umgebung wählt der 
Browser eines aus, nennt man "responsive".

http://www.webmasterpro.de/coding/article/css-responsive-webdesign-media-queries-fuer-iphone-ipad-und-smartphones.html

Content-Management-Systeme (z.B. Joomla, Wordpress, Drupal ...) werden 
per Template gestylt. Davon gibts auch welche, wo "responsive" bereits 
eingebaut ist.

: Bearbeitet durch User
von Walter T. (nicolas)


Lesenswert?

Hallo zusammen,

das ist eine nette Diskussion - aber am Thema vorbei. Es ist schon ein 
responsives Webdesign per HTML+CSS vorhanden. Das einzige, was jetzt 
noch stört, ist der riesige Kopf. Der ist aber durchaus gewünscht - er 
soll nur beim Aufrufen der Seite schon überscrollt sein.

Viele Grüße
Nicolas

von Nop (Gast)


Lesenswert?

Walter T. schrieb:

> das ist eine nette Diskussion - aber am Thema vorbei. Es ist schon ein
> responsives Webdesign per HTML+CSS vorhanden. Das einzige, was jetzt
> noch stört, ist der riesige Kopf.

Dann ist es noch nicht responsive.

> Der ist aber durchaus gewünscht - er
> soll nur beim Aufrufen der Seite schon überscrollt sein.

Dann ist er unwesentlich und sollte mobil schlichtweg nicht vorhanden 
sein. Insbesondere sollte er auch keine Bilder nachladen, die dann auch 
noch überscrollt werden.

Elegant löst man Logoprobleme und sowas mit SVG-Files, die man dann per 
CSS skaliert. Sieht immer gut aus. Geht natürlich nicht für sehr 
komplexe Logos, aber die sind sowieso für die Tonne.

von Nop (Gast)


Lesenswert?

Walter T. schrieb:
> Der ist aber durchaus gewünscht

Ach ja - nein, das ist er nicht. Sowas will keiner sehen. Offenbar hat 
das Marketing in der Firma noch nicht begriffen, daß man Webseiten für 
Kunden (und solche, die es werden könnten) macht, sondern die glauben, 
daß eine Webseite zur Selbstbeweihräucherung des Marketings dient.

DAS ist die eigentliche Baustelle und kein EInsprungspunkt oder so ein 
Unsinn.

von H. E. (hobby_elektroniker)


Lesenswert?

Walter T. schrieb:
> Hallo zusammen,
>
> danke für die Antworten.
>
> Sven W. schrieb:
>> per Javascript
>
> Javascript habe ich bis jetzt geschafft, bei aktuellen Projekten
> komplett zu vermeiden. Aus dem Alter bin ich draußen.
>
Wie darf man das verstehen? JS hat doch nichts mit dem Alter zu tun.
Was spricht gegen JS?

>
> Rufus Τ. F. schrieb:
>> Du könntest den Webserver auch so konfigurieren, daß er Inhalte auf
>> Mobilgeräte mit an die URL angehängtem "scrolle-seitenkopf"-Anker
>> ausliefert.
>
> Hallo Rufus,
>
> das klingt sehr interessant. Ich muß mich mal in einlesen, ob das
> möglich ist, Verweise ohne Anker mit einem Redirect auf eine bestimmten
> Anker zu versehen, und ob ich mir damit nicht andere Schwierigkeiten
> einhandele.
>
> Viele Grüße
> W.T.

Welche technische Möglichkeiten bestehen bei dir, Mobile Geräte zu 
erkennen? Vor allem stellt sich die Frage, wenn du auf JS komplett 
verzichten willst.

von Walter T. (nicolas)


Lesenswert?

Nop schrieb:
> Dann ist er unwesentlich und sollte mobil schlichtweg nicht vorhanden
> sein.
>
> [...]
>
> Elegant löst man Logoprobleme und sowas mit SVG-Files, die man dann per
> CSS skaliert.


Es ist kein Logo. Es ist ein Navigationselement.


Nop schrieb:
> Offenbar hat
> das Marketing in der Firma noch nicht begriffen

Es ist auch keine Firma.

von Nop (Gast)


Lesenswert?

Walter T. schrieb:

> Es ist kein Logo. Es ist ein Navigationselement.

Dann ist die Navigation eben nicht responsive, so einfach ist das. Die 
Lösung ist, sie responsive zu machen.

Dazu gibt's mehrere Methoden, die nicht nur das Problem kaschieren, 
sondern es lösen:

1) Reduktion der Navigation auf das Wesentliche. Nicht mehr als 5-7 
Elemente. Wenn das nicht gelingt, ist die Webseite überladen, und es 
fehlt ein schlüssiges Navigationskonzept. Die Webseite sagt damit 
insbesondere aus, daß der Ersteller keine Prioritäten setzen kann. 
Niemand wühlt sich durch bildschirmfüllende Menüs durch, sondern sowas 
klickt man einfach weg.

2) Die Navigation an den unteren Rand befördern. Das kann man mit 
Javascript machen, indem man im Mobilfalle die Elemente nach unten 
schiebt. Aber auch hier, wenn das "riesig" ist, dann ist das ein 
grundsätzliches Designproblem.

3) Das Hamburgermenü, was die schlechteste Lösung ist, weil sie in der 
Realität nicht funktioniert. Und zwar deswegen nicht, weil die drei 
Balken keinen Anreiz bieten, überhaupt draufzuklicken.

(Und: Niemals eine Navigation nur über Icons machen.)

von Weinbauer (Gast)


Lesenswert?

Nop schrieb:
> 3) Das Hamburgermenü, was die schlechteste Lösung ist, weil sie in der
> Realität nicht funktioniert. Und zwar deswegen nicht, weil die drei
> Balken keinen Anreiz bieten, überhaupt draufzuklicken.

Was wäre z.B. für Smartphone Dein idealer Vorschlag für Menü?

von Cyblord -. (Gast)


Lesenswert?

Weinbauer schrieb:
> Was wäre z.B. für Smartphone Dein idealer Vorschlag für Menü?

http://jamesarcher.me/hamburger-menu

tl;dr Version: Tab Bars mit den wichtigsten Funktionen.

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.